Skip to content

Commit

Permalink
Allow user to theme all cover states in tile card and more info. (#17898
Browse files Browse the repository at this point in the history
)
piitaya authored Sep 11, 2023
1 parent 24d4010 commit d0a6098
Showing 4 changed files with 16 additions and 10 deletions.
Original file line number Diff line number Diff line change
@@ -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,
})}
Original file line number Diff line number Diff line change
@@ -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,
})}
Original file line number Diff line number Diff line change
@@ -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`
Original file line number Diff line number Diff line change
@@ -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`

0 comments on commit d0a6098

Please sign in to comment.