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

Add colors

Browse Source
This commit is contained in:
Paul Bottein 2022-12-01 14:19:53 +01:00
parent aab4ed8cc3
commit 3f579e5e95
No known key found for this signature in database
1 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/dialogs/more-info/more-info-related-info.ts
View File

@ -1,9 +1,11 @@
import { HassEntity } from "home-assistant-js-websocket";
import { css, html, LitElement, TemplateResult } from "lit";
import { customElement, property } from "lit/decorators";
import { styleMap } from "lit/directives/style-map";
import memoizeOne from "memoize-one";
import { fireEvent } from "../../common/dom/fire_event";
import { computeStateDisplay } from "../../common/entity/compute_state_display";
import { stateColor } from "../../common/entity/state_color";
import { stateIconPath } from "../../common/entity/state_icon_path";
import "../../components/ha-chip";
import "../../components/ha-chip-set";
@ -60,6 +62,7 @@ class MoreInfoContent extends LitElement {
entity,
this.hass!.locale
);
const color = stateColor(entity);
return html`
<button
@ -67,6 +70,11 @@ class MoreInfoContent extends LitElement {
class="chip"
@click=${this._handleChipClick}
.entityId=${entry.entity_id}
style=${styleMap({
"--icon-color": color
? `rgb(var(--rgb-state-${color}-color))`
: undefined,
})}
>
${icon
? html`<ha-icon slot="icon" icon=${icon}></ha-icon>`
@ -104,12 +112,14 @@ class MoreInfoContent extends LitElement {
font-weight: 500;
font-size: 14px;
line-height: 20px;
--icon-color: rgb(var(--rgb-state-default-color));
}
.chip ha-icon,
.chip ha-svg-icon {
color: var(--icon-color);
pointer-events: none;
--mdc-icon-size: 18px;
color: rgb(var(--rgb-primary-color));
color: var(--icon-color);
}
`;
}