From 4728c122255b62ca74b649848fa3f3f91d1b139b Mon Sep 17 00:00:00 2001
From: Bram Kragten <mail@bramkragten.nl>
Date: Fri, 11 Oct 2019 17:48:56 +0200
Subject: [PATCH] Update google cloud card (#3978)

* Update google cloud card

* Oops
---
 .../config/cloud/account/cloud-google-pref.ts | 50 +++++++++++++++----
 src/translations/en.json                      |  7 ++-
 2 files changed, 46 insertions(+), 11 deletions(-)

diff --git a/src/panels/config/cloud/account/cloud-google-pref.ts b/src/panels/config/cloud/account/cloud-google-pref.ts
index 16cb09761a..a0a3190428 100644
--- a/src/panels/config/cloud/account/cloud-google-pref.ts
+++ b/src/panels/config/cloud/account/cloud-google-pref.ts
@@ -81,18 +81,31 @@ export class CloudGooglePref extends LitElement {
           </ul>
           ${google_enabled
             ? html`
-                <h3>Enable State Reporting</h3>
+                <div class="state-reporting">
+                  <h3>
+                    ${this.hass!.localize(
+                      "ui.panel.config.cloud.account.google.enable_state_reporting"
+                    )}
+                  </h3>
+                  <div class="state-reporting-switch">
+                    <ha-switch
+                      .checked=${google_report_state}
+                      @change=${this._reportToggleChanged}
+                    ></ha-switch>
+                  </div>
+                </div>
                 <p>
-                  If you enable state reporting, Home Assistant will send
-                  <b>all</b> state changes of exposed entities to Google. This
-                  allows you to always see the latest states in the Google app.
+                  ${this.hass!.localize(
+                    "ui.panel.config.cloud.account.google.info_state_reporting"
+                  )}
                 </p>
-                <ha-switch
-                  .checked=${google_report_state}
-                  @change=${this._reportToggleChanged}
-                ></ha-switch>
 
                 <div class="secure_devices">
+                  <h3>
+                    ${this.hass!.localize(
+                      "ui.panel.config.cloud.account.google.security_devices"
+                    )}
+                  </h3>
                   ${this.hass!.localize(
                     "ui.panel.config.cloud.account.google.enter_pin_info"
                   )}
@@ -194,7 +207,7 @@ export class CloudGooglePref extends LitElement {
         font-weight: 500;
       }
       .secure_devices {
-        padding-top: 16px;
+        padding-top: 8px;
       }
       paper-input {
         width: 250px;
@@ -208,6 +221,25 @@ export class CloudGooglePref extends LitElement {
       .spacer {
         flex-grow: 1;
       }
+      .state-reporting {
+        display: flex;
+        margin-top: 1.5em;
+      }
+      .state-reporting + p {
+        margin-top: 0.5em;
+      }
+      h3 {
+        margin: 0 0 8px 0;
+      }
+      .state-reporting h3 {
+        flex-grow: 1;
+        margin: 0;
+      }
+      .state-reporting-switch {
+        margin-top: 0.25em;
+        margin-right: 7px;
+        margin-left: 0.5em;
+      }
     `;
   }
 }
diff --git a/src/translations/en.json b/src/translations/en.json
index e0cc3bf6d1..bcd426090d 100755
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -1032,9 +1032,12 @@
               "info": "With the Google Assistant integration for Home Assistant Cloud you'll be able to control all your Home Assistant devices via any Google Assistant-enabled device.",
               "enable_ha_skill": "Activate the Home Assistant skill for Google Assistant",
               "config_documentation": "Config documentation",
+              "enable_state_reporting": "Enable State Reporting",
+              "info_state_reporting": "If you enable state reporting, Home Assistant will send all state changes of exposed entities to Google. This allows you to always see the latest states in the Google app.",
+              "security_devices": "Security Devices",
               "enter_pin_info": "Please enter a pin to interact with security devices. Security devices are doors, garage doors and locks. You will be asked to say/enter this pin when interacting with such devices via Google Assistant.",
-              "devices_pin": "Secure Devices Pin",
-              "enter_pin_hint": "Enter a PIN to use secure devices",
+              "devices_pin": "Security Devices Pin",
+              "enter_pin_hint": "Enter a PIN to use security devices",
               "sync_entities": "Sync Entities to Google",
               "manage_entities": "Manage Entities",
               "enter_pin_error": "Unable to store pin:"