mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-26 18:56:39 +00:00
Dev tools events layout (#18389)
Co-authored-by: Bram Kragten <mail@bramkragten.nl>
This commit is contained in:
parent
4a53de4466
commit
eda0d12867
@ -25,7 +25,11 @@ class HaPanelDevEvent extends LitElement {
|
|||||||
|
|
||||||
protected render(): TemplateResult {
|
protected render(): TemplateResult {
|
||||||
return html`
|
return html`
|
||||||
<div class=${this.narrow ? "content" : "content layout horizontal"}>
|
<div
|
||||||
|
class=${this.narrow
|
||||||
|
? "content layout vertical"
|
||||||
|
: "content layout horizontal"}
|
||||||
|
>
|
||||||
<div class="flex">
|
<div class="flex">
|
||||||
<p>
|
<p>
|
||||||
${this.hass.localize(
|
${this.hass.localize(
|
||||||
@ -128,6 +132,7 @@ class HaPanelDevEvent extends LitElement {
|
|||||||
haStyle,
|
haStyle,
|
||||||
css`
|
css`
|
||||||
.content {
|
.content {
|
||||||
|
gap: 16px;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
padding: max(16px, env(safe-area-inset-top))
|
padding: max(16px, env(safe-area-inset-top))
|
||||||
max(16px, env(safe-area-inset-right))
|
max(16px, env(safe-area-inset-right))
|
||||||
@ -145,6 +150,10 @@ class HaPanelDevEvent extends LitElement {
|
|||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.flex {
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.inputs {
|
.inputs {
|
||||||
max-width: 400px;
|
max-width: 400px;
|
||||||
}
|
}
|
||||||
@ -163,9 +172,7 @@ class HaPanelDevEvent extends LitElement {
|
|||||||
|
|
||||||
event-subscribe-card {
|
event-subscribe-card {
|
||||||
display: block;
|
display: block;
|
||||||
margin: 16px 16px 0 0;
|
margin-top: 16px;
|
||||||
margin-inline-start: initial;
|
|
||||||
margin-inline-end: 16px;
|
|
||||||
direction: var(--direction);
|
direction: var(--direction);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -39,6 +39,7 @@ class EventSubscribeCard extends LitElement {
|
|||||||
"ui.panel.developer-tools.tabs.events.listen_to_events"
|
"ui.panel.developer-tools.tabs.events.listen_to_events"
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
<div class="card-content">
|
||||||
<form>
|
<form>
|
||||||
<ha-textfield
|
<ha-textfield
|
||||||
.label=${this._subscribed
|
.label=${this._subscribed
|
||||||
@ -89,6 +90,7 @@ class EventSubscribeCard extends LitElement {
|
|||||||
`
|
`
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</ha-card>
|
</ha-card>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
@ -121,19 +123,9 @@ class EventSubscribeCard extends LitElement {
|
|||||||
|
|
||||||
static get styles(): CSSResultGroup {
|
static get styles(): CSSResultGroup {
|
||||||
return css`
|
return css`
|
||||||
form {
|
|
||||||
display: block;
|
|
||||||
padding: 0 0 16px 16px;
|
|
||||||
}
|
|
||||||
ha-textfield {
|
ha-textfield {
|
||||||
width: 300px;
|
display: block;
|
||||||
}
|
margin-bottom: 16px;
|
||||||
mwc-button {
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
.events {
|
|
||||||
margin: -16px 0;
|
|
||||||
padding: 0 16px;
|
|
||||||
}
|
}
|
||||||
.event {
|
.event {
|
||||||
border-top: 1px solid var(--divider-color);
|
border-top: 1px solid var(--divider-color);
|
||||||
@ -143,6 +135,7 @@ class EventSubscribeCard extends LitElement {
|
|||||||
}
|
}
|
||||||
.event:last-child {
|
.event:last-child {
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
pre {
|
pre {
|
||||||
font-family: var(--code-font-family, monospace);
|
font-family: var(--code-font-family, monospace);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user