Update text

src/panels/config/cloud/ha-config-cloud-account.js

@@ -20,6 +20,12 @@ class HaConfigCloudAccount extends EventsMixin(PolymerElement) {
   static get template() {
     return html`
     <style include="iron-flex ha-style">
+      [slot=introduction] {
+        margin: -1em 0;
+      }
+      [slot=introduction] a {
+        color: var(--primary-color);
+      }
       .content {
         padding-bottom: 24px;
       }
@@ -56,15 +62,17 @@ class HaConfigCloudAccount extends EventsMixin(PolymerElement) {
         color: var(--primary-color);
       }
     </style>
-    <hass-subpage header="Cloud Account">
+    <hass-subpage header="Home Assistant Cloud">
       <div class="content">
         <ha-config-section is-wide="[[isWide]]">
           <span slot="header">Home Assistant Cloud</span>
-          <span slot="introduction">
+          <div slot="introduction">
-            Thank you for supporting Home Assistant. It's because of people like you that we are able to run this project and make a great home automation experience for everyone. Thank you!
+            <p>
-          </span>
+              Thank you for being part of Home Assistant Cloud. It's because of people like you that we are able to make a great home automation experience for everyone. Thank you!
+            </p>
+          </div>
 
-          <paper-card heading="Account">
+          <paper-card heading="Nabu Casa Account">
             <div class="account-row">
               <paper-item-body two-line="">
                 [[account.email]]
@@ -73,7 +81,6 @@ class HaConfigCloudAccount extends EventsMixin(PolymerElement) {
                   <span class="nowrap">[[_formatExpiration(account.sub_exp)]]</span>
                 </div>
               </paper-item-body>
-              <paper-button on-click="handleLogout">Sign out</paper-button>
             </div>
 
             <div class="account-row">
@@ -82,15 +89,24 @@ class HaConfigCloudAccount extends EventsMixin(PolymerElement) {
               </paper-item-body>
               <div class="status">[[account.cloud]]</div>
             </div>
+
+            <div class='card-actions'>
+              <a href='https://account.nabucasa.com' target='_blank'><paper-button>Manage Account</paper-button></a>
+              <paper-button style='float: right' on-click="handleLogout">Sign out</paper-button>
+            </div>
           </paper-card>
         </ha-config-section>
 
         <ha-config-section is-wide="[[isWide]]">
           <span slot="header">Integrations</span>
-          <span slot="introduction">
+          <div slot="introduction">
-            Integrations for Home Assistant Cloud allow you to connect with services in the cloud
+            <p>
-            without having to expose your Home Assistant instance publicly on the internet.
+              Integrations for Home Assistant Cloud allow you to connect with services in the cloud without having to expose your Home Assistant instance publicly on the internet.
-          </span>
+            </p>
+            <p>
+              Check the website for <a href='https://www.nabucasa.com/cloud/' target='_blank'>all available features</a>.
+            </p>
+          </div>
 
           <paper-card heading="Alexa">
             <div class="card-content">

src/panels/config/cloud/ha-config-cloud-login.js

@@ -28,6 +28,9 @@ class HaConfigCloudLogin extends
       .content {
         padding-bottom: 24px;
       }
+      [slot=introduction] {
+        margin: -1em 0;
+      }
       [slot=introduction] a {
         color: var(--primary-color);
       }
@@ -69,10 +72,18 @@ class HaConfigCloudLogin extends
       <div class="content">
         <ha-config-section is-wide="[[isWide]]">
           <span slot="header">Home Assistant Cloud</span>
-          <span slot="introduction">
+          <div slot="introduction">
-            The Home Assistant Cloud allows your local Home Assistant instance to connect with cloud-only services like Amazon Alexa.
+            <p>
-            <p><a href="https://www.home-assistant.io/components/cloud/" target="_blank">Learn more</a></p>
+              Home Assistant Cloud connects your local instance securely to cloud-only services Amazon Alexa and Google Assistant.
-          </span>
+            </p>
+            <p>
+              This service is run by our partner <a href='https://www.nabucasa.com' target='_blank'>Nabu&nbsp;Casa,&nbsp;Inc</a>, a company founded by the founders of Home Assistant and Hass.io.
+            </p>
+            <p>
+              Home Assistant Cloud is a subscription service with a free one month trial. No payment information necessary.
+            </p>
+            <p><a href="https://www.nabucasa.com/cloud/" target="_blank">Learn more about Home Assistant Cloud</a></p>
+          </div>
 
           <paper-card hidden$="[[!flashMessage]]">
             <div class="card-content flash-msg">
@@ -98,8 +109,8 @@ class HaConfigCloudLogin extends
           <paper-card>
             <paper-item on-click="_handleRegister">
               <paper-item-body two-line="">
-                Create Account
+                Start your free 1 month trial
-                <div secondary="">Get up and running quickly.</div>
+                <div secondary="">No payment information necessary</div>
               </paper-item-body>
               <iron-icon icon="hass:chevron-right"></iron-icon>
             </paper-item>

src/panels/config/cloud/ha-config-cloud-register.js

@@ -16,6 +16,12 @@ class HaConfigCloudRegister extends EventsMixin(PolymerElement) {
   static get template() {
     return html`
     <style include="iron-flex ha-style">
+      [slot=introduction] {
+        margin: -1em 0;
+      }
+      [slot=introduction] a {
+        color: var(--primary-color);
+      }
       a {
         color: var(--primary-color);
       }
@@ -47,9 +53,21 @@ class HaConfigCloudRegister extends EventsMixin(PolymerElement) {
     <hass-subpage header="Register Account">
       <div class="content">
         <ha-config-section is-wide="[[isWide]]">
-          <span slot="header">Register with the Home Assistant Cloud</span>
+          <span slot="header">Start your free trial</span>
-          <span slot="introduction">
+          <div slot="introduction">
-            Register today to easily connect with the Home Assistant Cloud. This will allow you to unlock great new services and functionality, like Amazon Alexa integration.
+            <p>
+              Create an account to start your free one month trial with Home Assistant Cloud. No payment information necessary.
+            </p>
+            <p>
+              The trial will give you access to all the benefits of Home Assistant Cloud, including:
+            </p>
+            <ul>
+              <li>Integration with Google Assistant</li>
+              <li>Integration with Amazon Alexa</li>
+            </ul>
+            <p>
+              This service is run by our partner <a href='https://www.nabucasa.com' target='_blank'>Nabu&nbsp;Casa,&nbsp;Inc</a>, a company founded by the founders of Home Assistant and Hass.io.
+            </p>
 
             <p>
               By registering an account you agree to the following terms and conditions.
@@ -57,20 +75,20 @@ class HaConfigCloudRegister extends EventsMixin(PolymerElement) {
                 <li><a href="https://home-assistant.io/tos/" target="_blank">Terms and Conditions</a></li>
                 <li><a href="https://home-assistant.io/privacy/" target="_blank">Privacy Policy</a></li>
               </ul>
-            <p></p>
+            </p>
-          </span>
+          </div>
 
           <paper-card>
             <div class="card-content">
               <div class="header">
-                <h1>Register</h1>
+                <h1>Create Account</h1>
                 <div class="error" hidden$="[[!_error]]">[[_error]]</div>
               </div>
               <paper-input autofocus="" id="email" label="Email address" type="email" value="{{email}}" on-keydown="_keyDown" error-message="Invalid email"></paper-input>
               <paper-input id="password" label="Password" value="{{_password}}" type="password" on-keydown="_keyDown" error-message="Your password needs to be at least 8 characters"></paper-input>
             </div>
             <div class="card-actions">
-              <ha-progress-button on-click="_handleRegister" progress="[[_requestInProgress]]">Create Account</ha-progress-button>
+              <ha-progress-button on-click="_handleRegister" progress="[[_requestInProgress]]">Start trial</ha-progress-button>
               <button class="link" hidden="[[_requestInProgress]]" on-click="_handleResendVerifyEmail">Resend confirmation email</button>
             </div>
           </paper-card>

src/panels/config/dashboard/ha-config-cloud-menu.js

@@ -29,7 +29,7 @@ class HaConfigCloudMenu extends NavigateMixin(PolymerElement) {
             <div secondary="">Logged in as [[account.email]]</div>
           </template>
           <template is="dom-if" if="[[!account]]">
-            <div secondary="">Not logged in</div>
+            <div secondary="">Connect with Google Home and Amazon Alexa</div>
           </template>
         </paper-item-body>
         <iron-icon icon="hass:chevron-right"></iron-icon>

src/panels/config/ha-panel-config.js

@@ -121,7 +121,10 @@ class HaPanelConfig extends NavigateMixin(PolymerElement) {
       hass: Object,
       narrow: Boolean,
       showMenu: Boolean,
-      account: Object,
+      account: {
+        type: Object,
+        value: null,
+      },
 
       route: {
         type: Object,
@@ -143,7 +146,8 @@ class HaPanelConfig extends NavigateMixin(PolymerElement) {
   ready() {
     super.ready();
     if (isComponentLoaded(this.hass, 'cloud')) {
-      this.hass.callApi('get', 'cloud/account').then((account) => { this.account = account; });
+      this.hass.callApi('get', 'cloud/account')
+        .then((account) => { this.account = account; }, () => {});
     }
     this.addEventListener('ha-account-refreshed', (ev) => {
       this.account = ev.detail.account;