Layout Bugfixes

This commit is contained in:
Paulus Schoutsen 2015-08-29 21:57:37 -07:00
parent 3cb2e6a5db
commit a97750b5dd
3 changed files with 26 additions and 47 deletions

View File

@ -22,7 +22,7 @@
} }
</style> </style>
<template> <template>
<ha-card header="Welcome to Home Assistant!"> <ha-card header="Welcome Home!">
<div class='content'> <div class='content'>
Here are some resources to get started. Here are some resources to get started.
<ul> <ul>

View File

@ -31,7 +31,7 @@
<template> <template>
<div class='main'> <div class='main'>
<template is='dom-if' if='[[cards._badges]]'> <template is='dom-if' if='[[cards._badges.length]]'>
<div class='badges'> <div class='badges'>
<template is='dom-if' if='[[cards._demo]]'> <template is='dom-if' if='[[cards._demo]]'>
<ha-demo-badge></ha-demo-badge> <ha-demo-badge></ha-demo-badge>
@ -40,54 +40,29 @@
<ha-badges-card states='[[cards._badges]]'></ha-badges-card> <ha-badges-card states='[[cards._badges]]'></ha-badges-card>
</div> </div>
</template> </template>
<template is='dom-if' if='[[!cards._badges]]'> <template is='dom-if' if='[[!cards._badges.length]]'>
<div class='no-badges'> </div> <div class='no-badges'> </div>
</template> </template>
<div class='horizontal layout'> <div class='horizontal layout'>
<div class='column flex-1'> <template is='dom-repeat' items='[[cards._columns]]' as='column'>
<template is='dom-if' if='[[computeShowIntroduction(showIntroduction, cards)]]'> <template is='dom-if'
<div class='zone-card'> if='[[computeShouldRenderColumn(index, column)]]'>
<ha-introduction-card show-hide-instruction='[[computeShowHideInstruction(states, cards)]]'></ha-introduction-card> <div class='column flex-1'>
<template is='dom-if' if='[[computeShowIntroduction(index, showIntroduction, cards)]]'>
<div class='zone-card'>
<ha-introduction-card show-hide-instruction='[[computeShowHideInstruction(states, cards)]]'></ha-introduction-card>
</div>
</template>
<template is='dom-repeat' items='[[column]]' as='domain'>
<div class='zone-card'>
<ha-domain-card domain='[[domain]]'
states='[[computeStatesOfCard(cards, domain)]]'
></ha-domain-card>
</div>
</template>
</div> </div>
</template> </template>
<template is='dom-repeat' items='[[cards._columns.0]]'>
<div class='zone-card'>
<ha-domain-card domain='[[item]]'
states='[[computeStatesOfCard(cards, item)]]'></ha-domain-card>
</div>
</template>
</div>
<template is='dom-if' if='[[cards._columns.1]]'>
<div class='column flex-1'>
<template is='dom-repeat' items='[[cards._columns.1]]'>
<div class='zone-card'>
<ha-domain-card domain='[[item]]'
states='[[computeStatesOfCard(cards, item)]]'></ha-domain-card>
</div>
</template>
</div>
</template> </template>
<template is='dom-if' if='[[cards._columns.2]]'>
<div class='column flex-1'>
<template is='dom-repeat' items='[[cards._columns.2]]'>
<div class='zone-card'>
<ha-domain-card domain='[[item]]'
states='[[computeStatesOfCard(cards, item)]]'></ha-domain-card>
</div>
</template>
</div>
</template>
<template is='dom-if' if='[[cards._columns.3]]'>
<div class='column flex-1'>
<template is='dom-repeat' items='[[cards._columns.3]]'>
<div class='zone-card'>
<ha-domain-card domain='[[item]]'
states='[[computeStatesOfCard(cards, item)]]'></ha-domain-card>
</div>
</template>
</div>
</template>
</div>
</div> </div>
</template> </template>

View File

@ -59,7 +59,7 @@ export default new Polymer({
const cards = { const cards = {
_demo: false, _demo: false,
_badges: [], _badges: [],
_columns: {}, _columns: [],
}; };
for (let i = 0; i < columns; i++) { cards._columns[i] = []; } for (let i = 0; i < columns; i++) { cards._columns[i] = []; }
@ -114,8 +114,12 @@ export default new Polymer({
return cards; return cards;
}, },
computeShowIntroduction(showIntroduction, cards) { computeShouldRenderColumn(index, items) {
return showIntroduction || cards._demo; return index === 0 || items.length;
},
computeShowIntroduction(index, showIntroduction, cards) {
return index === 0 && (showIntroduction || cards._demo);
}, },
computeShowHideInstruction(states, cards) { computeShowHideInstruction(states, cards) {