jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-13 12:26:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix time input with helper text width (#23134)

Browse Source 
* Fix time input with helper text width

* Make time input help text always newline

* Put helper text out of base-time-input
This commit is contained in:
Wendelin 2024-12-04 14:25:31 +01:00 committed by GitHub
parent 64e8b636b9
commit a78ddb50fd
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 15 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/ha-base-time-input.ts
View File

@ -134,7 +134,7 @@ export class HaBaseTimeInput extends LitElement {
return html`
${this.label
? html`<label>${this.label}${this.required ? " *" : ""}</label>`
: ""}
: nothing}
<div class="time-input-wrap-wrap">
<div class="time-input-wrap">
${this.enableDay
@ -158,7 +158,7 @@ export class HaBaseTimeInput extends LitElement {
>
</ha-textfield>
`
: ""}
: nothing}
<ha-textfield
id="hour"
@ -221,7 +221,7 @@ export class HaBaseTimeInput extends LitElement {
class=${this.enableMillisecond ? "has-suffix" : ""}
>
</ha-textfield>`
: ""}
: nothing}
${this.enableMillisecond
? html`<ha-textfield
id="millisec"
@ -240,7 +240,7 @@ export class HaBaseTimeInput extends LitElement {
.disabled=${this.disabled}
>
</ha-textfield>`
: ""}
: nothing}
${this.clearable && !this.required && !this.disabled
? html`<ha-icon-button
label="clear"
@ -251,7 +251,7 @@ export class HaBaseTimeInput extends LitElement {
</div>
${this.format === 24
? ""
? nothing
: html`<ha-select
.required=${this.required}
.value=${this.amPm}
@ -265,10 +265,10 @@ export class HaBaseTimeInput extends LitElement {
<mwc-list-item value="AM">AM</mwc-list-item>
<mwc-list-item value="PM">PM</mwc-list-item>
</ha-select>`}
${this.helper
? html`<ha-input-helper-text>${this.helper}</ha-input-helper-text>`
: ""}
</div>
${this.helper
? html`<ha-input-helper-text>${this.helper}</ha-input-helper-text>`
: nothing}
`;
}
@ -363,17 +363,17 @@ export class HaBaseTimeInput extends LitElement {
width: 85px;
}
:host([clearable]) .mdc-select__anchor {
padding-inline-end: var(--select-selected-text-padding-end, 12px);
padding-inline-end: var(--select-selected-text-padding-end, 12px);
}
ha-icon-button {
position: relative
position: relative;
--mdc-icon-button-size: 36px;
--mdc-icon-size: 20px;
color: var(--secondary-text-color);
direction: var(--direction);
display: flex;
align-items: center;
background-color:var(--mdc-text-field-fill-color, whitesmoke);
background-color: var(--mdc-text-field-fill-color, whitesmoke);
border-bottom-style: solid;
border-bottom-width: 1px;
}
@ -398,6 +398,10 @@ export class HaBaseTimeInput extends LitElement {
padding-inline-start: 4px;
padding-inline-end: initial;
}
ha-input-helper-text {
padding-top: 8px;
line-height: normal;
}
`;
}