From 10009eea2e7750ab0df60fc855884ace7b76991f Mon Sep 17 00:00:00 2001
From: c727 <crusader727@gmx.de>
Date: Fri, 6 Jul 2018 21:12:43 +0200
Subject: [PATCH] Lovelace: Style view backgroud (#1408)

* Lovelace: Style view backgroud

based on: #1403

fix: https://github.com/home-assistant/ui-schema/issues/30

```yaml
background: center / cover no-repeat url("https://images.pexels.com/photos/977736/pexels-photo-977736.jpeg?auto=compress&cs=tinysrgb&h=750&w=1260")

background: radial-gradient(crimson, skyblue)

background: orange
```

* Reset background if not defined

* Simplify

* Lint

* Add global backround

* Fix backround in unused entities

* Lint
---
 src/panels/lovelace/hui-root.js            | 4 ++++
 src/panels/lovelace/hui-unused-entities.js | 3 ++-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/panels/lovelace/hui-root.js b/src/panels/lovelace/hui-root.js
index d0a048c761..dae350078d 100644
--- a/src/panels/lovelace/hui-root.js
+++ b/src/panels/lovelace/hui-root.js
@@ -198,6 +198,7 @@ class HUIRoot extends NavigateMixin(EventsMixin(PolymerElement)) {
     }
 
     let view;
+    let background = this.config.background || '';
 
     if (viewIndex === 'unused') {
       view = document.createElement('hui-unused-entities');
@@ -211,8 +212,11 @@ class HUIRoot extends NavigateMixin(EventsMixin(PolymerElement)) {
         view.config = viewConfig;
         view.columns = this.columns;
       }
+      if (viewConfig.background) background = viewConfig.background;
     }
 
+    this.$.view.style.background = background;
+
     view.hass = this.hass;
     root.appendChild(view);
   }
diff --git a/src/panels/lovelace/hui-unused-entities.js b/src/panels/lovelace/hui-unused-entities.js
index 27abdb7320..28a88264e5 100644
--- a/src/panels/lovelace/hui-unused-entities.js
+++ b/src/panels/lovelace/hui-unused-entities.js
@@ -12,7 +12,8 @@ class HuiUnusedEntities extends PolymerElement {
       <style>
         #root {
           max-width: 600px;
-          margin: 8px auto;
+          margin: 0 auto;
+          padding: 8px 0;
         }
       </style>
       <div id="root"></div>