diff --git a/homeassistant/components/frontend/www_static/polymer/components/state-cards.html b/homeassistant/components/frontend/www_static/polymer/components/state-cards.html
index db1630d1c7dc52eff2808c97d61a38f2fa3bdb0e..7a710a4142f2a5ffd02e644888ac6257cc9adcb4 100755
--- a/homeassistant/components/frontend/www_static/polymer/components/state-cards.html
+++ b/homeassistant/components/frontend/www_static/polymer/components/state-cards.html
@@ -6,8 +6,6 @@
<style>
:host {
display: block;
- width: 100%;
- background-color: #E5E5E5;
}
@media all and (min-width: 1020px) {
diff --git a/homeassistant/components/frontend/www_static/polymer/layouts/home-assistant-main.html b/homeassistant/components/frontend/www_static/polymer/layouts/home-assistant-main.html
index dfb47acf6728923d12cbbb8fe081a237b98e0ce4..b5343052e1d1be4b4bc0bc3e9b5b8c948d72e675 100644
--- a/homeassistant/components/frontend/www_static/polymer/layouts/home-assistant-main.html
+++ b/homeassistant/components/frontend/www_static/polymer/layouts/home-assistant-main.html
@@ -7,6 +7,7 @@
<link rel='import' href='../bower_components/paper-menu/paper-menu.html'>
<link rel='import' href='../bower_components/iron-icon/iron-icon.html'>
<link rel='import' href='../bower_components/paper-item/paper-item.html'>
+<link rel='import' href='../bower_components/paper-item/paper-icon-item.html'>
<link rel='import' href='../bower_components/paper-icon-button/paper-icon-button.html'>
<link rel='import' href='../layouts/partial-states.html'>
@@ -29,22 +30,15 @@
overflow: hidden;
}
- .sidenav paper-toolbar {
- padding-left: 16px;
- }
-
.sidenav paper-menu {
- --paper-menu-color: #757575;
+ --paper-menu-color: var(--secondary-text-color);
+ --paper-menu-background-color: #fafafa;
}
- .sidenav paper-item[data-panel] {
+ paper-icon-item {
cursor: pointer;
}
- .sidenav iron-icon {
- margin-right: 24px;
- }
-
.divider {
border-top: 1px solid #e0e0e0;
}
@@ -66,43 +60,45 @@
<paper-drawer-panel id='drawer' narrow='{{narrow}}'>
<paper-header-panel mode='scroll' drawer class='sidenav fit'>
<paper-toolbar>
- Home Assistant
+ <!-- forces paper toolbar to style title appropriate -->
+ <paper-icon-button hidden></paper-icon-button>
+ <div title>Home Assistant</div>
</paper-toolbar>
<paper-menu id='menu' class='layout vertical fit'
selectable='[data-panel]' attr-for-selected='data-panel'
on-iron-select='menuSelect' selected='[[selected]]'>
- <paper-item data-panel='states'>
- <iron-icon icon='apps'></iron-icon> States
- </paper-item>
+ <paper-icon-item data-panel='states'>
+ <iron-icon item-icon icon='apps'></iron-icon> States
+ </paper-icon-item>
<template is='dom-repeat' items='{{activeFilters}}'>
- <paper-item data-panel$='[[filterType(item)]]'>
- <iron-icon icon='[[filterIcon(item)]]'></iron-icon>
+ <paper-icon-item data-panel$='[[filterType(item)]]'>
+ <iron-icon item-icon icon='[[filterIcon(item)]]'></iron-icon>
<span>[[filterName(item)]]</span>
- </paper-item>
+ </paper-icon-item>
</template>
<template is='dom-if' if='[[hasHistoryComponent]]'>
- <paper-item data-panel='history'>
- <iron-icon icon='assessment'></iron-icon>
+ <paper-icon-item data-panel='history'>
+ <iron-icon item-icon icon='assessment'></iron-icon>
History
- </paper-item>
+ </paper-icon-item>
</template>
<template is='dom-if' if='[[hasLogbookComponent]]'>
- <paper-item data-panel='logbook'>
- <iron-icon icon='list'></iron-icon>
+ <paper-icon-item data-panel='logbook'>
+ <iron-icon item-icon icon='list'></iron-icon>
Logbook
- </paper-item>
+ </paper-icon-item>
</template>
<div class='flex'></div>
- <paper-item data-panel='logout'>
- <iron-icon icon='exit-to-app'></iron-icon>
+ <paper-icon-item data-panel='logout'>
+ <iron-icon item-icon icon='exit-to-app'></iron-icon>
Log Out
- </paper-item>
+ </paper-icon-item>
<paper-item class='divider horizontal layout justified'>
<div>Streaming updates</div>
@@ -178,7 +174,6 @@
narrow: {
type: Boolean,
- value: false,
},
activeFilters: {
diff --git a/homeassistant/components/frontend/www_static/polymer/layouts/partial-base.html b/homeassistant/components/frontend/www_static/polymer/layouts/partial-base.html
index 7b25c31eecb9aa921ccde6e84c24f5fa235fb24c..0229af9318a489302003b629c78754a0b5dabdfe 100644
--- a/homeassistant/components/frontend/www_static/polymer/layouts/partial-base.html
+++ b/homeassistant/components/frontend/www_static/polymer/layouts/partial-base.html
@@ -10,13 +10,13 @@
<paper-scroll-header-panel class='fit'>
<paper-toolbar>
<paper-icon-button icon='menu' hidden$='[[!narrow]]' on-click='toggleMenu'></paper-icon-button>
- <div class='flex'>
+ <div title>
<content select='[header-title]'></content>
</div>
<content select='[header-buttons]'></content>
</paper-toolbar>
- <div class='fit'><content></content></div>
+ <content></content>
</paper-scroll-header-panel>
</template>
</dom-module>
diff --git a/homeassistant/components/frontend/www_static/polymer/layouts/partial-states.html b/homeassistant/components/frontend/www_static/polymer/layouts/partial-states.html
index d5343d30a19e0846d088e2b4763692007f7cd697..47311abde89b9bfee35342210d4c1ce2d9c66100 100644
--- a/homeassistant/components/frontend/www_static/polymer/layouts/partial-states.html
+++ b/homeassistant/components/frontend/www_static/polymer/layouts/partial-states.html
@@ -31,6 +31,11 @@
.listening paper-spinner {
float: right;
}
+
+ state-cards {
+ height: 100%;
+ background-color: #E5E5E5;
+ }
</style>
<template>
@@ -51,7 +56,7 @@
<paper-spinner active$="[[isTransmitting]]" alt="Sending voice command to Home Assistant"></paper-spinner>
</div>
- <state-cards states="[[states]]" class='fit'>
+ <state-cards states="[[states]]">
<h3>Hi there!</h3>
<p>
It looks like we have nothing to show you right now. It could be that we have not yet discovered all your devices but it is more likely that you have not configured Home Assistant yet.