Fix long entity names overflowing energy panel settings (#15786)

This commit is contained in:
karwosts 2023-03-13 03:06:30 -07:00 committed by GitHub
parent cc011a4d47
commit 3abc5c42d0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 2 deletions

View File

@ -100,14 +100,14 @@ export class EnergyBatterySettings extends LitElement {
></ha-icon>` ></ha-icon>`
: html`<ha-svg-icon .path=${mdiBatteryHigh}></ha-svg-icon>`} : html`<ha-svg-icon .path=${mdiBatteryHigh}></ha-svg-icon>`}
<div class="content"> <div class="content">
<span <span class="label"
>${getStatisticLabel( >${getStatisticLabel(
this.hass, this.hass,
source.stat_energy_from, source.stat_energy_from,
this.statsMetadata?.[source.stat_energy_from] this.statsMetadata?.[source.stat_energy_from]
)}</span )}</span
> >
<span <span class="label"
>${getStatisticLabel( >${getStatisticLabel(
this.hass, this.hass,
source.stat_energy_to, source.stat_energy_to,
@ -213,6 +213,10 @@ export class EnergyBatterySettings extends LitElement {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.label {
overflow: hidden;
text-overflow: ellipsis;
}
`, `,
]; ];
} }

View File

@ -36,6 +36,8 @@ export const energyCardStyles = css`
} }
.row .content { .row .content {
flex-grow: 1; flex-grow: 1;
overflow: hidden;
text-overflow: ellipsis;
} }
ha-icon-button { ha-icon-button {
color: var(--secondary-text-color); color: var(--secondary-text-color);