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

Improve sensor card graph inside section grid (#21289)

Browse Source
This commit is contained in:
Paul Bottein 2024-07-05 12:17:31 +02:00 committed by GitHub
parent f995f19f06
commit f7072c247e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 22 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/panels/lovelace/cards/hui-entity-card.ts
View File

@ -8,6 +8,7 @@ import {
PropertyValues, PropertyValues,
} from "lit"; } from "lit";
import { customElement, property, state } from "lit/decorators"; import { customElement, property, state } from "lit/decorators";
import { classMap } from "lit/directives/class-map";
import { ifDefined } from "lit/directives/if-defined"; import { ifDefined } from "lit/directives/if-defined";
import { styleMap } from "lit/directives/style-map"; import { styleMap } from "lit/directives/style-map";
import { applyThemesOnElement } from "../../../common/dom/apply_themes_on_element"; import { applyThemesOnElement } from "../../../common/dom/apply_themes_on_element";
@ -73,6 +74,8 @@ export class HuiEntityCard extends LitElement implements LovelaceCard {
@property({ attribute: false }) public hass?: HomeAssistant; @property({ attribute: false }) public hass?: HomeAssistant;
@property() public layout?: string;
@state() private _config?: EntityCardConfig; @state() private _config?: EntityCardConfig;
private _footerElement?: HuiErrorCard | LovelaceHeaderFooter; private _footerElement?: HuiErrorCard | LovelaceHeaderFooter;
@ -132,8 +135,15 @@ export class HuiEntityCard extends LitElement implements LovelaceCard {
const colored = stateObj && this.getStateColor(stateObj, this._config); const colored = stateObj && this.getStateColor(stateObj, this._config);
const fixedFooter =
this.layout === "grid" || this._footerElement !== undefined;
return html` return html`
<ha-card @click=${this._handleClick} tabindex="0"> <ha-card
@click=${this._handleClick}
tabindex="0"
class=${classMap({ "with-fixed-footer": fixedFooter })}
>
<div class="header"> <div class="header">
<div class="name" .title=${name}>${name}</div> <div class="name" .title=${name}>${name}</div>
<div class="icon"> <div class="icon">
@ -188,7 +198,7 @@ export class HuiEntityCard extends LitElement implements LovelaceCard {
` `
: ""} : ""}
</div> </div>
${this._footerElement} <div class="footer">${this._footerElement}</div>
</ha-card> </ha-card>
`; `;
} }
@ -309,6 +319,16 @@ export class HuiEntityCard extends LitElement implements LovelaceCard {
font-size: 18px; font-size: 18px;
color: var(--secondary-text-color); color: var(--secondary-text-color);
} }
.with-fixed-footer {
justify-content: flex-start;
}
.with-fixed-footer .footer {
position: absolute;
right: 0;
left: 0;
bottom: 0;
}
`, `,
]; ];
} }