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

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

Browse Source 
* 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
1 changed files with 38 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/panels/config/devices/device-detail/ha-device-entities-card.ts
View File

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