Update print management iron icon fill colors

- Includes cancel print job and clear all button.
- Update delete icon in the clear all button to reflect the enabled
  or disabled state.
- Also fixes a bug where the color of the clear all button text did
  not represent the button's disabled state.

Bug: 1055841
Change-Id: Ibdecc4057824e41946ad355eda71b9e267250dad
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2265419
Commit-Queue: Jimmy Gong <jimmyxgong@chromium.org>
Reviewed-by: Kyle Horimoto <khorimoto@chromium.org>
Cr-Commit-Position: refs/heads/master@{#782876}

chromeos/components/print_management/resources/icons.html

@@ -35,10 +35,10 @@
         <path fill="#4986E7" d="M5 3h10c1.05 0 1.918.82 1.994 1.851L17 5v10c0 1.05-.82 1.918-1.851 1.994L15 17H5c-1.05 0-1.918-.82-1.994-1.851L3 15V5c0-1.05.82-1.918 1.851-1.994L5 3h10zm10 2H5v10h10V5zM7.75 7l.75 3 .75-3h1.5l.75 3 .75-3h1.5l-1.5 6h-1.5L10 10l-.75 3h-1.5l-1.5-6h1.5z"/>
       </g>
       <g id="cancel" width="16" height="16" viewBox="0 0 16 16">
-        <path fill="#5f6368" d="M9.65759 5.44L7.99999 7.0976L6.34239 5.44L5.43999 6.3424L7.09759 8L5.43999 9.6576L6.34239 10.56L7.99999 8.9024L9.65759 10.56L10.56 9.6576L8.90239 8L10.56 6.3424L9.65759 5.44ZM8 1.60001C4.4608 1.60001 1.6 4.46081 1.6 8.00001C1.6 11.5392 4.4608 14.4 8 14.4C11.5392 14.4 14.4 11.5392 14.4 8.00001C14.4 4.46081 11.5392 1.60001 8 1.60001ZM8 12.8C5.354 12.8 3.2 10.646 3.2 8.00001C3.2 5.35401 5.354 3.20001 8 3.20001C10.646 3.20001 12.8 5.35401 12.8 8.00001C12.8 10.646 10.646 12.8 8 12.8Z"/>
+        <path d="M9.65759 5.44L7.99999 7.0976L6.34239 5.44L5.43999 6.3424L7.09759 8L5.43999 9.6576L6.34239 10.56L7.99999 8.9024L9.65759 10.56L10.56 9.6576L8.90239 8L10.56 6.3424L9.65759 5.44ZM8 1.60001C4.4608 1.60001 1.6 4.46081 1.6 8.00001C1.6 11.5392 4.4608 14.4 8 14.4C11.5392 14.4 14.4 11.5392 14.4 8.00001C14.4 4.46081 11.5392 1.60001 8 1.60001ZM8 12.8C5.354 12.8 3.2 10.646 3.2 8.00001C3.2 5.35401 5.354 3.20001 8 3.20001C10.646 3.20001 12.8 5.35401 12.8 8.00001C12.8 10.646 10.646 12.8 8 12.8Z"/>
       </g>
       <g id="delete" width="20" height="20" viewBox="0 0 20 20">
-        <path fill="#1A73E8" d="M13 3V2H7V3H3V5H4V16C4 17.1 4.9 18 6 18H14C15.1 18 16 17.1 16 16V5H17V3H13ZM14 16H6V5H14V16Z"/>
+        <path d="M13 3V2H7V3H3V5H4V16C4 17.1 4.9 18 6 18H14C15.1 18 16 17.1 16 16V5H17V3H13ZM14 16H6V5H14V16Z"/>
       </g>
     </defs>
   </svg>

chromeos/components/print_management/resources/print_job_entry.html

@@ -17,6 +17,7 @@
   }
 
   #cancelPrintJobButton {
+    --iron-icon-fill-color: rgb(95,99,104);
     margin-inline-start: 4px;
     padding-bottom: 2px;
   }

chromeos/components/print_management/resources/print_management.html

@@ -10,13 +10,20 @@
     min-height: var(--cr-section-min-height);
   }
 
+  .delete-enabled {
+    --iron-icon-fill-color: rgb(26,115,232);
+  }
+
+  .delete-disabled {
+    --iron-icon-fill-color: var(--google-grey-500);
+  }
+
   .main-container {
     --cr-centered-card-max-width: 960px;
   }
 
   #clearAllButton {
     @apply --print-management-button-font;
-    color: var(--print-management-button-text-color);
   }
 
   #clearAllContainer {
@@ -83,8 +90,7 @@
         </cr-policy-indicator>
       </template>
       <cr-button id="clearAllButton" on-click="onClearHistoryClicked_"
-          disabled="[[shouldDisableClearAllButton_(printJobs_,
-                      deletePrintJobHistoryAllowedByPolicy_)]]"
+          disabled="[[shouldDisableClearAllButton_]]"
           hidden="[[!showClearAllButton_]]">
         <iron-icon id="deleteIcon" icon="print-management:delete"></iron-icon>
         [[i18n('clearAllHistoryLabel')]]

chromeos/components/print_management/resources/print_management.js

@@ -123,6 +123,13 @@ Polymer({
       type: Boolean,
       value: true,
     },
+
+    /** @private */
+    shouldDisableClearAllButton_: {
+      type: Boolean,
+      computed: 'computeShouldDisableClearAllButton_(printJobs_,' +
+          'deletePrintJobHistoryAllowedByPolicy_)',
+    }
   },
 
   listeners: {
@@ -130,6 +137,8 @@ Polymer({
     'remove-print-job' : 'removePrintJob_',
   },
 
+  observers: ['onClearAllButtonUpdated_(shouldDisableClearAllButton_)'],
+
   /** @override */
   created() {
     this.mojoInterfaceProvider_ = getMetadataProvider();
@@ -298,8 +307,16 @@ Polymer({
    * @return {boolean}
    * @private
    */
-  shouldDisableClearAllButton_() {
+  computeShouldDisableClearAllButton_() {
     return !this.deletePrintJobHistoryAllowedByPolicy_ ||
         !this.printJobs_.length;
   },
+
+  /** @private */
+  onClearAllButtonUpdated_() {
+    this.$.deleteIcon.classList.toggle(
+        'delete-enabled', !this.shouldDisableClearAllButton_);
+    this.$.deleteIcon.classList.toggle(
+        'delete-disabled', this.shouldDisableClearAllButton_);
+  }
 });