mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-23 01:06:35 +00:00
Tweak entity card layout
This commit is contained in:
parent
cdfec7dc90
commit
fb6b2fc5d6
@ -11,13 +11,16 @@
|
||||
padding-bottom: 16px;
|
||||
}
|
||||
.state {
|
||||
padding: 8px 16px;
|
||||
padding: 4px 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.header {
|
||||
@apply(--paper-font-headline);
|
||||
/* overwriting line-height +8 because entity-toggle can be 40px height,
|
||||
compensating this with reduced padding */
|
||||
line-height: 40px;
|
||||
color: var(--primary-text-color);
|
||||
padding: 24px 16px 16px;
|
||||
padding: 20px 16px 12px;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.header .name {
|
||||
|
@ -22,6 +22,10 @@
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.main-text[take-height] {
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.secondary-text {
|
||||
@apply(--paper-font-common-nowrap);
|
||||
color: var(--secondary-text-color);
|
||||
@ -31,8 +35,8 @@
|
||||
<div class='horizontal justified layout'>
|
||||
<state-info state-obj="[[stateObj]]" in-dialog='[[inDialog]]'></state-info>
|
||||
<div class='state'>
|
||||
<div class='main-text'>[[computePrimaryText(stateObj, isPlaying)]]</div>
|
||||
<div class='secondary-text'>[[computeSecondaryText(stateObj)]]</div>
|
||||
<div class='main-text' take-height$='[[!secondaryText]]'>[[computePrimaryText(stateObj, isPlaying)]]</div>
|
||||
<div class='secondary-text'>[[secondaryText]]</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -21,6 +21,11 @@ export default new Polymer({
|
||||
type: Boolean,
|
||||
computed: 'computeIsPlaying(stateObj)',
|
||||
},
|
||||
|
||||
secondaryText: {
|
||||
type: String,
|
||||
computed: 'computeSecondaryText(stateObj)',
|
||||
},
|
||||
},
|
||||
|
||||
computeIsPlaying(stateObj) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user