jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-24 09:46:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Allow user to theme all cover states in tile card and more info. (#17898)

Browse Source
This commit is contained in:
Paul Bottein 2023-09-11 18:18:39 +02:00 committed by GitHub
parent 24d401061c
commit d0a60984ed
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/dialogs/more-info/components/cover/ha-more-info-cover-position.ts
View File

@ -35,9 +35,8 @@ export class HaMoreInfoCoverPosition extends LitElement {
}
protected render(): TemplateResult {
const forcedState = this.stateObj.state === "closed" ? "open" : undefined;
const color = stateColorCss(this.stateObj, forcedState);
const openColor = stateColorCss(this.stateObj, "open");
const color = stateColorCss(this.stateObj);
return html`
<ha-control-slider
@ -55,6 +54,8 @@ export class HaMoreInfoCoverPosition extends LitElement {
"current_position"
)}
style=${styleMap({
// Use open color for inactive state to avoid grey slider that looks disabled
"--state-cover-inactive-color": openColor,
"--control-slider-color": color,
"--control-slider-background": color,
})}

7
src/dialogs/more-info/components/cover/ha-more-info-cover-tilt-position.ts
View File

@ -72,9 +72,8 @@ export class HaMoreInfoCoverTiltPosition extends LitElement {
}
protected render(): TemplateResult {
const forcedState = this.stateObj.state === "closed" ? "open" : undefined;
const color = stateColorCss(this.stateObj, forcedState);
const openColor = stateColorCss(this.stateObj, "open");
const color = stateColorCss(this.stateObj);
return html`
<ha-control-slider
@ -91,6 +90,8 @@ export class HaMoreInfoCoverTiltPosition extends LitElement {
"current_tilt_position"
)}
style=${styleMap({
// Use open color for inactive state to avoid grey slider that looks disabled
"--state-cover-inactive-color": openColor,
"--control-slider-color": color,
"--control-slider-background": color,
})}

6
src/panels/lovelace/tile-features/hui-cover-position-tile-feature.ts
View File

@ -64,14 +64,16 @@ class HuiCoverPositionTileFeature
const value = Math.max(Math.round(percentage), 0);
const forcedState = this.stateObj.state === "closed" ? "open" : undefined;
const openColor = stateColorCss(this.stateObj, "open");
const color = this.color
? computeCssColor(this.color)
: stateColorCss(this.stateObj, forcedState);
: stateColorCss(this.stateObj);
const style = {
"--color": color,
// Use open color for inactive state to avoid grey slider that looks disabled
"--state-cover-inactive-color": openColor,
};
return html`

6
src/panels/lovelace/tile-features/hui-cover-tilt-position-tile-feature.ts
View File

@ -64,14 +64,16 @@ class HuiCoverTiltPositionTileFeature
const value = Math.max(Math.round(percentage), 0);
const forcedState = this.stateObj.state === "closed" ? "open" : undefined;
const openColor = stateColorCss(this.stateObj, "open");
const color = this.color
? computeCssColor(this.color)
: stateColorCss(this.stateObj, forcedState);
: stateColorCss(this.stateObj);
const style = {
"--color": color,
// Use open color for inactive state to avoid grey slider that looks disabled
"--state-cover-inactive-color": openColor,
};
return html`