Move push notifications to config panel (#700)

panels/config/core/ha-config-core.html

@@ -9,6 +9,7 @@
 <link rel="import" href="./ha-config-section-core.html">
 <!-- <link rel="import" href="./ha-config-section-group.html"> -->
 <link rel="import" href="./ha-config-section-hassbian.html">
+<link rel="import" href="./ha-config-section-push-notifications.html">
 <link rel="import" href="./ha-config-section-translation.html">
 <link rel="import" href="./ha-config-section-themes.html">
 
@@ -56,6 +57,14 @@
           hass='[[hass]]'
         ></ha-config-section-core>
 
+        <template is='dom-if' if='[[pushSupported]]'>
+          <div class='border'></div>
+          <ha-config-section-push-notifications
+            is-wide='[[isWide]]'
+            hass='[[hass]]'
+            push-supported='{{pushSupported}}'
+          ></ha-config-section-push-notifications>
+        </template>
         <template is='dom-if' if='[[computeIsTranslationLoaded(hass)]]'>
           <div class='border'></div>
           <ha-config-section-translation
@@ -92,6 +101,10 @@ class HaConfigCore extends Polymer.Element {
     return {
       hass: Object,
       isWide: Boolean,
+      pushSupported: {
+        type: Boolean,
+        value: true,
+      },
     };
   }
 

panels/config/core/ha-config-section-push-notifications.html

@@ -0,0 +1,53 @@
+<link rel="import" href="../../../bower_components/polymer/polymer-element.html">
+<link rel="import" href="../../../bower_components/paper-card/paper-card.html">
+<link rel="import" href="../../../bower_components/iron-label/iron-label.html">
+<link rel="import" href="../../../bower_components/iron-flex-layout/iron-flex-layout-classes.html">
+
+<link rel='import' href='../../../src/util/hass-mixins.html'>
+<link rel="import" href="../ha-config-section.html">
+<link rel='import' href='../../../src/components/ha-push-notifications-toggle.html'>
+
+
+<dom-module id="ha-config-section-push-notifications">
+  <template>
+    <style include="iron-flex iron-flex-alignment iron-positioning">
+      ha-push-notifications-toggle {
+        margin-left: 16px;
+      }
+    </style>
+    <ha-config-section is-wide='[[isWide]]'>
+      <span slot='header'>Enable Push Notifications</span>
+      <span slot='introduction'>
+        Enable this setting to receive push notifications on this device
+      </span>
+
+      <paper-card>
+        <div class='card-content'>
+          <iron-label class='horizontal layout'>            
+            Push Notifications
+            <ha-push-notifications-toggle
+              hass='[[hass]]'
+              push-supported='{{pushSupported}}'
+            ></ha-push-notifications-toggle>
+          </iron-label>
+        </div>
+      </paper-card>
+    </ha-config-section>
+  </template>
+</dom-module>
+
+<script>
+class HaConfigSectionPushNotifications extends Polymer.Element {
+  static get is() { return 'ha-config-section-push-notifications'; }
+
+  static get properties() {
+    return {
+      hass: Object,
+      isWide: Boolean,
+      pushSupported: Boolean,
+    };
+  }
+}
+
+customElements.define(HaConfigSectionPushNotifications.is, HaConfigSectionPushNotifications);
+</script>

src/components/ha-sidebar.html

@@ -11,8 +11,6 @@
 <link rel='import' href='../util/hass-mixins.html'>
 <link rel='import' href='../util/hass-translation.html'>
 
-<link rel='import' href='./ha-push-notifications-toggle.html'>
-
 <dom-module id='ha-sidebar'>
   <template>
     <style include="iron-flex iron-flex-alignment iron-positioning">
@@ -123,18 +121,6 @@
     </paper-listbox>
 
     <div>
-      <template is='dom-if' if='[[pushSupported]]'>
-        <div class='divider'></div>
-
-        <paper-item class='horizontal layout justified'>
-          <div class='setting'>Push Notifications</div>
-          <ha-push-notifications-toggle
-            hass='[[hass]]'
-            push-supported='{{pushSupported}}'
-          ></ha-push-notifications-toggle>
-        </paper-item>
-      </template>
-
       <div class='divider'></div>
 
       <div class='subheader'>Developer Tools</div>
@@ -202,11 +188,6 @@ class HaSidebar extends
         type: Array,
         computed: 'computePanels(hass)',
       },
-
-      pushSupported: {
-        type: Boolean,
-        value: true,
-      },
     };
   }