fix ha-textfield (max-width, text-overflow, padding) (#25043)

* fix max-width, text-overflow, padding

* simmetrical padding
This commit is contained in:
ildar170975 2025-04-15 15:41:08 +03:00 committed by GitHub
parent 65dae09a49
commit 91a5497c60
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -136,13 +136,12 @@ export class HaTextField extends TextFieldBase {
} }
.mdc-floating-label:not(.mdc-floating-label--float-above) { .mdc-floating-label:not(.mdc-floating-label--float-above) {
text-overflow: ellipsis; max-width: calc(100% - 16px);
width: inherit; }
padding-right: 30px;
padding-inline-end: 30px; .mdc-floating-label--float-above {
padding-inline-start: initial; max-width: calc((100% - 16px) / 0.75);
box-sizing: border-box; transition: none;
direction: var(--direction);
} }
input { input {
@ -183,11 +182,15 @@ export class HaTextField extends TextFieldBase {
} }
.mdc-floating-label { .mdc-floating-label {
padding-inline-end: 16px;
padding-inline-start: initial;
inset-inline-start: 16px !important; inset-inline-start: 16px !important;
inset-inline-end: initial !important; inset-inline-end: initial !important;
transform-origin: var(--float-start); transform-origin: var(--float-start);
direction: var(--direction); direction: var(--direction);
text-align: var(--float-start); text-align: var(--float-start);
box-sizing: border-box;
text-overflow: ellipsis;
} }
.mdc-text-field--with-leading-icon.mdc-text-field--filled .mdc-text-field--with-leading-icon.mdc-text-field--filled