[MD settings] change icon-delete to a -gray and -white version

This CL splits the icon-delete svg into icon-delete-gray and
icon-delete-white so that we have two colors to use.

[email protected], [email protected]

(cherry picked from commit 94d1984)

Bug: 745289
Change-Id: I4d28034520eded8f787ee605bbb0da22f252d698
Reviewed-on: https://chromium-review.googlesource.com/576969
Commit-Queue: Dave Schuyler <[email protected]>
Reviewed-by: Hector Carmona <[email protected]>
Cr-Original-Commit-Position: refs/heads/master@{#488540}
Reviewed-on: https://chromium-review.googlesource.com/587421
Reviewed-by: Dave Schuyler <[email protected]>
Cr-Commit-Position: refs/branch-heads/3163@{#66}
Cr-Branched-From: ff259ba-refs/heads/master@{#488528}

chrome/browser/resources/settings/device_page/storage.html

@@ -216,7 +216,7 @@
           </div>
         </div>
         <button id="deleteButton" is="paper-icon-button-light"
-            class="icon-delete" aria-label="$i18n{storageItemDriveCache}"
+            class="icon-delete-gray" aria-label="$i18n{storageItemDriveCache}"
             aria-describedby="driveSizeCache">
         </button>
       </div>

chrome/browser/resources/settings/people_page/fingerprint_list.html

@@ -54,7 +54,7 @@ <h2 class="settings-box">$i18n{lockScreenRegisteredFingerprints}</h2>
             <paper-input value="{{item}}"
                 on-change="onFingerprintLabelChanged_">
             </paper-input>
-            <button is="paper-icon-button-light" class="icon-delete"
+            <button is="paper-icon-button-light" class="icon-delete-gray"
                 on-tap="onFingerprintDeleteTapped_">
             </button>
           </div>

chrome/browser/resources/settings/site_settings/site_data.html

@@ -57,7 +57,7 @@ <h2>$i18n{siteSettingsCookieHeader}</h2>
               aria-label$="[[item.site]]"
               aria-describedby="siteSecondary"></button>
           <div class="separator" id="removeSecondary"></div>
-          <button is="paper-icon-button-light" class="icon-delete"
+          <button is="paper-icon-button-light" class="icon-delete-gray"
               title$="[[i18n('siteSettingsCookieRemoveSite', item.site)]]"
               on-tap="onRemoveSiteTap_">
           </button>

chrome/browser/resources/settings/site_settings/site_details.html

@@ -54,7 +54,7 @@ <h2>$i18n{siteSettingsUsage}</h2>
         <div class="list-frame">
           <div class="list-item" id="storage">
             <div class="start">[[storedData_]]</div>
-            <button is="paper-icon-button-light" class="icon-delete"
+            <button is="paper-icon-button-light" class="icon-delete-gray"
                 on-tap="onConfirmClearStorage_"
                 alt="$i18n{siteSettingsDelete}"></button>
           </div>

chrome/browser/resources/settings/site_settings/site_list.html

@@ -88,7 +88,7 @@ <h2 class="start">[[categoryHeader]]</h2>
               </cr-policy-pref-indicator>
             </template>
             <button is="paper-icon-button-light" id="resetSite"
-                class="icon-delete" on-tap="onResetButtonTap_"
+                class="icon-delete-gray" on-tap="onResetButtonTap_"
                 hidden="[[shouldHideResetButton_(item, readOnlyList)]]"
                 alt="$i18n{siteSettingsActionReset}">
             </button>

chrome/test/data/webui/settings/site_data_test.js

@@ -20,7 +20,7 @@ suite('<site-data>', function() {
     siteData.sites = [{site: 'Google', id: GOOGLE_ID, localData: 'Cookiez!'}];
     Polymer.dom.flush();
 
-    MockInteractions.tap(siteData.$$('.icon-delete'));
+    MockInteractions.tap(siteData.$$('.icon-delete-gray'));
 
     return testBrowserProxy.whenCalled('removeCookie').then(function(path) {
       assertEquals(GOOGLE_ID, path);

ui/webui/resources/cr_elements/chromeos/cr_picture/cr_picture_pane.html

@@ -43,7 +43,7 @@
           srcset="[[getImgSrc2x_(imageSrc)]]"">
       <div id="discard" hidden="[[!showDiscard_(imageType)]]">
         <button is="paper-icon-button-light" id="discardImage"
-            class="icon-delete" title="[[discardImageLabel]]"
+            class="icon-delete-white" title="[[discardImageLabel]]"
             on-tap="onTapDiscardImage_">
         </button>
       </div>

ui/webui/resources/cr_elements/cr_icons_css.html

@@ -30,8 +30,12 @@
         background-image: url(../images/icon_clear.svg);
       }
 
-      button[is='paper-icon-button-light'].icon-delete {
-        background-image: url(../images/icon_delete.svg);
+      button[is='paper-icon-button-light'].icon-delete-gray {
+        background-image: url(../images/icon_delete_gray.svg);
+      }
+
+      button[is='paper-icon-button-light'].icon-delete-white {
+        background-image: url(../images/icon_delete_white.svg);
       }
 
       button[is='paper-icon-button-light'].icon-expand-less {

ui/webui/resources/cr_elements_images.grdp

@@ -15,8 +15,10 @@
            file="images/icon_cancel_toolbar.svg" type="BINDATA" />
   <include name="IDR_WEBUI_IMAGES_ICON_CLEAR"
            file="images/icon_clear.svg" type="BINDATA" />
-  <include name="IDR_WEBUI_IMAGES_ICON_DELETE"
-           file="images/icon_delete.svg" type="BINDATA" />
+  <include name="IDR_WEBUI_IMAGES_ICON_DELETE_GRAY"
+           file="images/icon_delete_gray.svg" type="BINDATA" />
+  <include name="IDR_WEBUI_IMAGES_ICON_DELETE_WHITE"
+           file="images/icon_delete_white.svg" type="BINDATA" />
   <include name="IDR_WEBUI_IMAGES_ICON_EXPAND_LESS"
            file="images/icon_expand_less.svg" type="BINDATA" />
   <include name="IDR_WEBUI_IMAGES_ICON_EXPAND_MORE"