Add icon to trigger/condition/action editor rows (#13481)

This commit is contained in:
Franck Nijhof 2022-08-25 13:04:40 +02:00 committed by GitHub
parent 255cb23c7d
commit 700af72303
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 42 additions and 18 deletions

View File

@ -156,12 +156,15 @@ export default class HaAutomationActionRow extends LitElement {
)} )}
</div>` </div>`
: ""} : ""}
<ha-expansion-panel <ha-expansion-panel leftChevron>
leftChevron <div slot="header">
.header=${capitalizeFirstLetter( <ha-svg-icon
describeAction(this.hass, this.action) class="action-icon"
)} .path=${ACTION_TYPES[type!]}
> ></ha-svg-icon>
${capitalizeFirstLetter(describeAction(this.hass, this.action))}
</div>
${this.index !== 0 ${this.index !== 0
? html` ? html`
<ha-icon-button <ha-icon-button
@ -504,6 +507,10 @@ export default class HaAutomationActionRow extends LitElement {
--expansion-panel-summary-padding: 0 0 0 8px; --expansion-panel-summary-padding: 0 0 0 8px;
--expansion-panel-content-padding: 0; --expansion-panel-content-padding: 0;
} }
.action-icon {
color: var(--sidebar-icon-color);
padding-right: 8px;
}
.card-content { .card-content {
padding: 16px; padding: 16px;
} }

View File

@ -23,6 +23,7 @@ import "../../../../components/ha-expansion-panel";
import "../../../../components/ha-icon-button"; import "../../../../components/ha-icon-button";
import { Condition, testCondition } from "../../../../data/automation"; import { Condition, testCondition } from "../../../../data/automation";
import { describeCondition } from "../../../../data/automation_i18n"; import { describeCondition } from "../../../../data/automation_i18n";
import { CONDITION_TYPES } from "../../../../data/condition";
import { validateConfig } from "../../../../data/config"; import { validateConfig } from "../../../../data/config";
import { import {
showAlertDialog, showAlertDialog,
@ -88,12 +89,17 @@ export default class HaAutomationConditionRow extends LitElement {
</div>` </div>`
: ""} : ""}
<ha-expansion-panel <ha-expansion-panel leftChevron>
leftChevron <div slot="header">
.header=${capitalizeFirstLetter( <ha-svg-icon
describeCondition(this.condition, this.hass) class="condition-icon"
)} .path=${CONDITION_TYPES[this.condition.condition]}
> ></ha-svg-icon>
${capitalizeFirstLetter(
describeCondition(this.condition, this.hass)
)}
</div>
<ha-progress-button slot="icons" @click=${this._testCondition}> <ha-progress-button slot="icons" @click=${this._testCondition}>
${this.hass.localize( ${this.hass.localize(
"ui.panel.config.automation.editor.conditions.test" "ui.panel.config.automation.editor.conditions.test"
@ -398,6 +404,10 @@ export default class HaAutomationConditionRow extends LitElement {
--expansion-panel-summary-padding: 0 0 0 8px; --expansion-panel-summary-padding: 0 0 0 8px;
--expansion-panel-content-padding: 0; --expansion-panel-content-padding: 0;
} }
.condition-icon {
color: var(--sidebar-icon-color);
padding-right: 8px;
}
.card-content { .card-content {
padding: 16px; padding: 16px;
} }

View File

@ -29,6 +29,7 @@ import { HaYamlEditor } from "../../../../components/ha-yaml-editor";
import { subscribeTrigger, Trigger } from "../../../../data/automation"; import { subscribeTrigger, Trigger } from "../../../../data/automation";
import { describeTrigger } from "../../../../data/automation_i18n"; import { describeTrigger } from "../../../../data/automation_i18n";
import { validateConfig } from "../../../../data/config"; import { validateConfig } from "../../../../data/config";
import { TRIGGER_TYPES } from "../../../../data/trigger";
import { import {
showAlertDialog, showAlertDialog,
showConfirmationDialog, showConfirmationDialog,
@ -119,12 +120,14 @@ export default class HaAutomationTriggerRow extends LitElement {
` `
: ""} : ""}
<ha-expansion-panel <ha-expansion-panel leftChevron>
leftChevron <div slot="header">
.header=${capitalizeFirstLetter( <ha-svg-icon
describeTrigger(this.trigger, this.hass) class="trigger-icon"
)} .path=${TRIGGER_TYPES[this.trigger.platform]}
> ></ha-svg-icon>
${capitalizeFirstLetter(describeTrigger(this.trigger, this.hass))}
</div>
<ha-button-menu <ha-button-menu
slot="icons" slot="icons"
fixed fixed
@ -529,6 +532,10 @@ export default class HaAutomationTriggerRow extends LitElement {
--expansion-panel-summary-padding: 0 0 0 8px; --expansion-panel-summary-padding: 0 0 0 8px;
--expansion-panel-content-padding: 0; --expansion-panel-content-padding: 0;
} }
.trigger-icon {
color: var(--sidebar-icon-color);
padding-right: 8px;
}
.card-content { .card-content {
padding: 16px; padding: 16px;
} }