Fix visibility for shown entities on device card (#22579)

* Update ha-device-entities-card.ts

* Update ha-device-entities-card.ts

* Update src/panels/config/devices/device-detail/ha-device-entities-card.ts

Co-authored-by: Wendelin <12148533+wendevlin@users.noreply.github.com>

* Update ha-device-entities-card.ts

* Update src/panels/config/devices/device-detail/ha-device-entities-card.ts

Co-authored-by: Wendelin <12148533+wendevlin@users.noreply.github.com>

* Update ha-device-entities-card.ts

* Update src/panels/config/devices/device-detail/ha-device-entities-card.ts

Co-authored-by: Wendelin <12148533+wendevlin@users.noreply.github.com>

* Update ha-device-entities-card.ts

* Update ha-device-entities-card.ts

---------

Co-authored-by: Wendelin <12148533+wendevlin@users.noreply.github.com>
This commit is contained in:
ildar170975 2024-11-13 09:56:58 +03:00 committed by GitHub
parent 28703b39da
commit 3c6be8cf99
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -1,7 +1,8 @@
import "@material/mwc-list/mwc-list";
import type { CSSResultGroup, PropertyValues, TemplateResult } from "lit";
import { css, html, LitElement } from "lit";
import { css, html, LitElement, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import { classMap } from "lit/directives/class-map";
import { until } from "lit/directives/until";
import { computeStateName } from "../../../../common/entity/compute_state_name";
import { stripPrefixFromEntityName } from "../../../../common/entity/strip_prefix_from_entity_name";
@ -86,7 +87,9 @@ export class HaDeviceEntitiesCard extends LitElement {
return html`
<ha-card outlined .header=${this.header}>
<div id="entities">
${shownEntities.length
? html`
<div id="entities" class="move-up">
<mwc-list>
${shownEntities.map((entry) =>
this.hass.states[entry.entity_id]
@ -95,8 +98,11 @@ export class HaDeviceEntitiesCard extends LitElement {
)}
</mwc-list>
</div>
`
: nothing}
${hiddenEntities.length
? !this.showHidden
? html`<div class=${classMap({ "move-up": !shownEntities.length })}>
${!this.showHidden
? html`
<button class="show-more" @click=${this._toggleShowHidden}>
${this.hass.localize(
@ -114,8 +120,9 @@ export class HaDeviceEntitiesCard extends LitElement {
"ui.panel.config.devices.entities.show_less"
)}
</button>
`
: ""}
`}
</div>`
: nothing}
<div class="card-actions">
<mwc-button @click=${this._addToLovelaceView}>
${this.hass.localize(
@ -257,8 +264,8 @@ export class HaDeviceEntitiesCard extends LitElement {
.disabled-entry {
color: var(--secondary-text-color);
}
#entities {
margin-top: -24px; /* match the spacing between card title and content of the device info card above it */
.move-up {
margin-top: -24px;
}
#entities > * {
margin: 8px 16px 8px 8px;