jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-27 03:06:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix alignment of ha-labeled-slider (#25279)

Browse Source
This commit is contained in:
Bram Kragten 2025-05-02 17:47:20 +03:00
parent 358e450e60
commit 678a8a85cb
1 changed files with 6 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/ha-labeled-slider.ts
View File

@ -30,8 +30,9 @@ class HaLabeledSlider extends LitElement {
@property({ type: Number }) public value?: number; @property({ type: Number }) public value?: number;
protected render() { protected render() {
const title = this._getTitle();
return html` return html`
<div class="title">${this._getTitle()}</div> ${title ? html`<div class="title">${title}</div>` : nothing}
<div class="extra-container"><slot name="extra"></slot></div> <div class="extra-container"><slot name="extra"></slot></div>
<div class="slider-container"> <div class="slider-container">
${this.icon ? html`<ha-icon icon=${this.icon}></ha-icon>` : nothing} ${this.icon ? html`<ha-icon icon=${this.icon}></ha-icon>` : nothing}
@ -73,17 +74,20 @@ class HaLabeledSlider extends LitElement {
.slider-container { .slider-container {
display: flex; display: flex;
align-items: center;
} }
ha-icon { ha-icon {
margin-top: 8px;
color: var(--secondary-text-color); color: var(--secondary-text-color);
} }
ha-slider { ha-slider {
display: flex;
flex-grow: 1; flex-grow: 1;
align-items: center;
background-image: var(--ha-slider-background); background-image: var(--ha-slider-background);
border-radius: 4px; border-radius: 4px;
height: 32px;
} }
`; `;
} }