From ab7536ffd704bfb3836eae147daeee604fc59189 Mon Sep 17 00:00:00 2001
From: Paulus Schoutsen <paulus@paulusschoutsen.nl>
Date: Wed, 27 May 2015 23:30:22 -0700
Subject: [PATCH] Polymer 1.0: style fixes
---
.../polymer/components/state-cards.html | 2 -
.../polymer/layouts/home-assistant-main.html | 49 +++++++++----------
.../polymer/layouts/partial-base.html | 4 +-
.../polymer/layouts/partial-states.html | 7 ++-
4 files changed, 30 insertions(+), 32 deletions(-)
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 db1630d1c7d..7a710a4142f 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 dfb47acf672..b5343052e1d 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 7b25c31eecb..0229af9318a 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 d5343d30a19..47311abde89 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.
--
GitLab