Improve scene editor UI (#22910)

This commit is contained in:
Wendelin 2024-11-20 15:53:49 +01:00 committed by GitHub
parent 7996f4e0b2
commit 995155696f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 18 additions and 16 deletions

View File

@ -74,7 +74,7 @@ export class HaConfigSection extends LitElement {
} }
.together { .together {
margin-top: 32px; margin-top: var(--config-section-content-together-margin-top, 32px);
} }
.intro { .intro {
@ -110,7 +110,10 @@ export class HaConfigSection extends LitElement {
max-width: 640px; max-width: 640px;
} }
.narrow .together { .narrow .together {
margin-top: 20px; margin-top: var(
--config-section-narrow-content-together-margin-top,
var(--config-section-content-together-margin-top, 20px)
);
} }
.narrow .intro { .narrow .intro {
padding-bottom: 20px; padding-bottom: 20px;

View File

@ -454,10 +454,10 @@ export class HaSceneEditor extends SubscribeMixin(
"ui.panel.config.scene.editor.devices.header" "ui.panel.config.scene.editor.devices.header"
)} )}
</div> </div>
${this._mode === "live" ${this._mode === "live" || devices.length === 0
? html`<div slot="introduction"> ? html`<div slot="introduction">
${this.hass.localize( ${this.hass.localize(
"ui.panel.config.scene.editor.devices.introduction" `ui.panel.config.scene.editor.devices.introduction${this._mode === "review" ? "_review" : ""}`
)} )}
</div>` </div>`
: nothing} : nothing}
@ -536,22 +536,16 @@ export class HaSceneEditor extends SubscribeMixin(
"ui.panel.config.scene.editor.entities.header" "ui.panel.config.scene.editor.entities.header"
)} )}
</div> </div>
${this._mode === "live" ${this._mode === "live" || entities.length === 0
? html`<div slot="introduction"> ? html`<div slot="introduction">
${this.hass.localize( ${this.hass.localize(
"ui.panel.config.scene.editor.entities.introduction" `ui.panel.config.scene.editor.entities.introduction${this._mode === "review" ? "_review" : ""}`
)} )}
</div>` </div>`
: nothing} : nothing}
${entities.length ${entities.length
? html` ? html`
<ha-card <ha-card outlined class="entities">
outlined
class="entities"
.header=${this.hass.localize(
"ui.panel.config.scene.editor.entities.without_device"
)}
>
<mwc-list> <mwc-list>
${entities.map((entityId) => { ${entities.map((entityId) => {
const entityStateObj = this.hass.states[entityId]; const entityStateObj = this.hass.states[entityId];
@ -1248,6 +1242,7 @@ export class HaSceneEditor extends SubscribeMixin(
css` css`
ha-card { ha-card {
overflow: hidden; overflow: hidden;
margin-top: 8px;
} }
.container { .container {
padding: 28px 20px 0; padding: 28px 20px 0;
@ -1262,6 +1257,9 @@ export class HaSceneEditor extends SubscribeMixin(
font-weight: bold; font-weight: bold;
color: var(--error-color); color: var(--error-color);
} }
ha-config-section {
--config-section-content-together-margin-top: 8px;
}
ha-config-section:last-child { ha-config-section:last-child {
padding-bottom: 20px; padding-bottom: 20px;
} }

View File

@ -3856,7 +3856,6 @@
"only_editable": "Only scenes defined in scenes.yaml are editable.", "only_editable": "Only scenes defined in scenes.yaml are editable.",
"edit_scene": "Edit scene", "edit_scene": "Edit scene",
"show_info": "[%key:ui::panel::config::automation::editor::show_info%]", "show_info": "[%key:ui::panel::config::automation::editor::show_info%]",
"activate": "Activate",
"apply": "Apply", "apply": "Apply",
"delete_scene": "Delete scene", "delete_scene": "Delete scene",
"delete": "[%key:ui::common::delete%]", "delete": "[%key:ui::common::delete%]",
@ -3900,12 +3899,14 @@
"devices": { "devices": {
"header": "Devices", "header": "Devices",
"introduction": "Add the devices that you want to be included in your scene. Set all entities in each device to the state you want for this scene.", "introduction": "Add the devices that you want to be included in your scene. Set all entities in each device to the state you want for this scene.",
"introduction_review": "To add the devices that you want to be included in your scene turn on the Live Preview mode.",
"add": "Add a device", "add": "Add a device",
"delete": "Delete device" "delete": "Delete device"
}, },
"entities": { "entities": {
"header": "Entities", "header": "Entities",
"introduction": "Individual entities can be added here.", "introduction": "Individual entities can be added here.",
"introduction_review": "To add individual entities to your scene turn on the Live Preview mode.",
"without_device": "Entities", "without_device": "Entities",
"add": "Add an entity", "add": "Add an entity",
"delete": "Delete entity" "delete": "Delete entity"