mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-25 18:26:35 +00:00
Improve state and name display on state-card-display (#18207)
This commit is contained in:
parent
a10ec1f53c
commit
15c67fe299
@ -99,6 +99,10 @@ class StateInfo extends LitElement {
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
state-badge {
|
||||||
|
flex: none;
|
||||||
|
}
|
||||||
|
|
||||||
.info {
|
.info {
|
||||||
margin-left: 8px;
|
margin-left: 8px;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -70,19 +70,21 @@ export class StateCardDisplay extends LitElement {
|
|||||||
haStyle,
|
haStyle,
|
||||||
css`
|
css`
|
||||||
state-info {
|
state-info {
|
||||||
flex: 0 0 fit-content;
|
flex: 0 1 fit-content;
|
||||||
min-width: 0;
|
min-width: 120px;
|
||||||
}
|
}
|
||||||
.state {
|
.state {
|
||||||
color: var(--primary-text-color);
|
color: var(--primary-text-color);
|
||||||
margin-inline-start: 16px;
|
margin-inline-start: 16px;
|
||||||
margin-inline-end: initial;
|
margin-inline-end: initial;
|
||||||
text-align: var(--float-end, right);
|
text-align: var(--float-end, right);
|
||||||
|
min-width: 50px;
|
||||||
flex: 0 1 fit-content;
|
flex: 0 1 fit-content;
|
||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
direction: ltr;
|
direction: ltr;
|
||||||
|
justify-content: flex-end;
|
||||||
}
|
}
|
||||||
.state.has-unit_of_measurement {
|
.state.has-unit_of_measurement {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user