Use state color for on and off in more info (#15677)

This commit is contained in:
Paul Bottein 2023-03-02 14:37:26 +01:00 committed by GitHub
parent afe1b7ef59
commit d113d44d5a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -64,7 +64,9 @@ export class HaMoreInfoToggle extends LitElement {
} }
protected render(): TemplateResult { protected render(): TemplateResult {
const color = stateColorCss(this.stateObj); const onColor = stateColorCss(this.stateObj, "on");
const offColor = stateColorCss(this.stateObj, "off");
const isOn = this.stateObj.state === "on"; const isOn = this.stateObj.state === "on";
const isOff = this.stateObj.state === "off"; const isOff = this.stateObj.state === "off";
@ -82,7 +84,7 @@ export class HaMoreInfoToggle extends LitElement {
active: isOn, active: isOn,
})} })}
style=${styleMap({ style=${styleMap({
"--color": color, "--color": onColor,
})} })}
> >
<ha-svg-icon .path=${this.iconPathOn || mdiFlash}></ha-svg-icon> <ha-svg-icon .path=${this.iconPathOn || mdiFlash}></ha-svg-icon>
@ -97,7 +99,7 @@ export class HaMoreInfoToggle extends LitElement {
active: isOff, active: isOff,
})} })}
style=${styleMap({ style=${styleMap({
"--color": color, "--color": offColor,
})} })}
> >
<ha-svg-icon .path=${this.iconPathOff || mdiFlashOff}></ha-svg-icon> <ha-svg-icon .path=${this.iconPathOff || mdiFlashOff}></ha-svg-icon>
@ -117,7 +119,8 @@ export class HaMoreInfoToggle extends LitElement {
@change=${this._valueChanged} @change=${this._valueChanged}
.ariaLabel=${this.hass.localize("ui.dialogs.more_info_control.toggle")} .ariaLabel=${this.hass.localize("ui.dialogs.more_info_control.toggle")}
style=${styleMap({ style=${styleMap({
"--control-switch-on-color": color, "--control-switch-on-color": onColor,
"--control-switch-off-color": offColor,
})} })}
.disabled=${this.stateObj.state === UNAVAILABLE} .disabled=${this.stateObj.state === UNAVAILABLE}
> >