NUX Email: add email logos

Bug: 832933
Change-Id: I36e6ccf6b8d47a9386df5a34feb3d12d15fe7880
Reviewed-on: https://chromium-review.googlesource.com/1204971Reviewed-by: Scott Violet <sky@chromium.org>
Reviewed-by: Hector Carmona <hcarmona@chromium.org>
Commit-Queue: Scott Chen <scottchen@chromium.org>
Cr-Commit-Position: refs/heads/master@{#589011}

components/nux/email/email_handler.cc

@@ -154,6 +154,18 @@ void EmailHandler::AddSources(content::WebUIDataSource* html_source) {
                                IDR_NUX_EMAIL_CHOOSER_JS);
 
   // Add icons
+  html_source->AddResourcePath("email/aol_1x.png", IDR_NUX_EMAIL_AOL_1X);
+  html_source->AddResourcePath("email/aol_2x.png", IDR_NUX_EMAIL_AOL_2X);
+  html_source->AddResourcePath("email/gmail_1x.png", IDR_NUX_EMAIL_GMAIL_1X);
+  html_source->AddResourcePath("email/gmail_2x.png", IDR_NUX_EMAIL_GMAIL_2X);
+  html_source->AddResourcePath("email/icloud_1x.png", IDR_NUX_EMAIL_ICLOUD_1X);
+  html_source->AddResourcePath("email/icloud_2x.png", IDR_NUX_EMAIL_ICLOUD_2X);
+  html_source->AddResourcePath("email/outlook_1x.png",
+                               IDR_NUX_EMAIL_OUTLOOK_1X);
+  html_source->AddResourcePath("email/outlook_2x.png",
+                               IDR_NUX_EMAIL_OUTLOOK_2X);
+  html_source->AddResourcePath("email/yahoo_1x.png", IDR_NUX_EMAIL_YAHOO_1X);
+  html_source->AddResourcePath("email/yahoo_2x.png", IDR_NUX_EMAIL_YAHOO_2X);
 
   // Add constants to loadtime data
   for (size_t i = 0; i < (size_t)EmailProviders::kCount; ++i) {

components/nux/email/resources/email_chooser.html

@@ -51,11 +51,12 @@
       }
 
       .option .email-icon {
+        background-position: center;
+        background-repeat: no-repeat;
+        background-size: contain;
+        height: 40px;
         margin: 0;
         margin-bottom: 4px;
-         /* TODO(scottchen): Replace below with logo once available. */
-        background: red;
-        height: 40px;
         width: 40px;
       }
 
@@ -92,6 +93,36 @@
         margin-top: 64px;
         justify-content: space-between;
       }
+
+      .gmail {
+        background-image: -webkit-image-set(
+            url(chrome://welcome/email/gmail_1x.png) 1x,
+            url(chrome://welcome/email/gmail_2x.png) 2x);
+      }
+
+      .yahoo {
+        background-image: -webkit-image-set(
+            url(chrome://welcome/email/yahoo_1x.png) 1x,
+            url(chrome://welcome/email/yahoo_2x.png) 2x);
+      }
+
+      .aol {
+        background-image: -webkit-image-set(
+            url(chrome://welcome/email/aol_1x.png) 1x,
+            url(chrome://welcome/email/aol_2x.png) 2x);
+      }
+
+      .icloud {
+        background-image: -webkit-image-set(
+            url(chrome://welcome/email/icloud_1x.png) 1x,
+            url(chrome://welcome/email/icloud_2x.png) 2x);
+      }
+
+      .outlook {
+        background-image: -webkit-image-set(
+            url(chrome://welcome/email/outlook_1x.png) 1x,
+            url(chrome://welcome/email/outlook_2x.png) 2x);
+      }
     </style>
 
     <template is="dom-repeat" items="[[emailList]]">

components/resources/nux_email.grdp

 <?xml version="1.0" encoding="utf-8"?>
 <grit-part>
+  <include name="IDR_NUX_EMAIL_AOL_1X" file="../nux/email/resources/aol_1x.png" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_AOL_2X" file="../nux/email/resources/aol_2x.png" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_CHOOSER_HTML" file="../nux/email/resources/email_chooser.html" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_CHOOSER_JS" file="../nux/email/resources/email_chooser.js" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_GMAIL_1X" file="../nux/email/resources/gmail_1x.png" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_GMAIL_2X" file="../nux/email/resources/gmail_2x.png" type="BINDATA" />
   <include name="IDR_NUX_EMAIL_HTML" file="../nux/email/resources/nux_email.html" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_ICLOUD_1X" file="../nux/email/resources/icloud_1x.png" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_ICLOUD_2X" file="../nux/email/resources/icloud_2x.png" type="BINDATA" />
   <include name="IDR_NUX_EMAIL_JS" file="../nux/email/resources/nux_email.js" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_OUTLOOK_1X" file="../nux/email/resources/outlook_1x.png" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_OUTLOOK_2X" file="../nux/email/resources/outlook_2x.png" type="BINDATA" />
   <include name="IDR_NUX_EMAIL_PROXY_HTML" file="../nux/email/resources/nux_email_proxy.html" type="BINDATA" />
   <include name="IDR_NUX_EMAIL_PROXY_JS" file="../nux/email/resources/nux_email_proxy.js" type="BINDATA" />
-  <include name="IDR_NUX_EMAIL_CHOOSER_HTML" file="../nux/email/resources/email_chooser.html" type="BINDATA" />
-  <include name="IDR_NUX_EMAIL_CHOOSER_JS" file="../nux/email/resources/email_chooser.js" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_YAHOO_1X" file="../nux/email/resources/yahoo_1x.png" type="BINDATA" />
+  <include name="IDR_NUX_EMAIL_YAHOO_2X" file="../nux/email/resources/yahoo_2x.png" type="BINDATA" />
 </grit-part>