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

Tweak entity card layout

Browse Source
This commit is contained in:
Paulus Schoutsen 2016-04-08 09:08:25 -07:00
parent cdfec7dc90
commit fb6b2fc5d6
3 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/cards/ha-entities-card.html
View File

@ -11,13 +11,16 @@
padding-bottom: 16px; padding-bottom: 16px;
} }
.state { .state {
padding: 8px 16px; padding: 4px 16px;
cursor: pointer; cursor: pointer;
} }
.header { .header {
@apply(--paper-font-headline); @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); color: var(--primary-text-color);
padding: 24px 16px 16px; padding: 20px 16px 12px;
text-transform: capitalize; text-transform: capitalize;
} }
.header .name { .header .name {

8
src/state-summary/state-card-media_player.html
View File

@ -22,6 +22,10 @@
text-transform: capitalize; text-transform: capitalize;
} }
.main-text[take-height] {
line-height: 40px;
}
.secondary-text { .secondary-text {
@apply(--paper-font-common-nowrap); @apply(--paper-font-common-nowrap);
color: var(--secondary-text-color); color: var(--secondary-text-color);
@ -31,8 +35,8 @@
<div class='horizontal justified layout'> <div class='horizontal justified layout'>
<state-info state-obj="[[stateObj]]" in-dialog='[[inDialog]]'></state-info> <state-info state-obj="[[stateObj]]" in-dialog='[[inDialog]]'></state-info>
<div class='state'> <div class='state'>
<div class='main-text'>[[computePrimaryText(stateObj, isPlaying)]]</div> <div class='main-text' take-height$='[[!secondaryText]]'>[[computePrimaryText(stateObj, isPlaying)]]</div>
<div class='secondary-text'>[[computeSecondaryText(stateObj)]]</div> <div class='secondary-text'>[[secondaryText]]</div>
</div> </div>
</div> </div>
</template> </template>

5
src/state-summary/state-card-media_player.js
View File

@ -21,6 +21,11 @@ export default new Polymer({
type: Boolean, type: Boolean,
computed: 'computeIsPlaying(stateObj)', computed: 'computeIsPlaying(stateObj)',
}, },
secondaryText: {
type: String,
computed: 'computeSecondaryText(stateObj)',
},
}, },
computeIsPlaying(stateObj) { computeIsPlaying(stateObj) {