Settings: set language list color, add google-green-700 for refresh

Bug: 855570
Cq-Include-Trybots: luci.chromium.try:closure_compilation
Change-Id: I1263ec15699c5169ac45b1cf19690031d5b26fa6
Reviewed-on: https://chromium-review.googlesource.com/1113909Reviewed-by: Scott Chen <scottchen@chromium.org>
Reviewed-by: Tomasz Mikolajewski <mtomasz@chromium.org>
Commit-Queue: Esmael El-Moslimany <aee@chromium.org>
Cr-Commit-Position: refs/heads/master@{#571365}

chrome/browser/resources/media_router/elements/media_router_container/media_router_container.css

@@ -119,6 +119,7 @@
 
 cr-checkbox {
   --cr-checkbox-checked-box-color: white;
+  --cr-checkbox-label-color: white;
   --cr-checkbox-mark-color: var(--paper-blue-700);
   --cr-checkbox-ripple-checked-color: white;
   --cr-checkbox-ripple-unchecked-color: white;

chrome/browser/resources/settings/languages_page/add_languages_dialog.html

@@ -3,6 +3,7 @@
 <link rel="import" href="chrome://resources/cr_elements/cr_checkbox/cr_checkbox.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_scrollable_behavior.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_dialog/cr_dialog.html">
+<link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-list/iron-list.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 <link rel="import" href="languages.html">
@@ -20,7 +21,7 @@
           flex-direction: column;
           height: 350px;
           overflow: auto;
-        }
+        };
       }
 
       settings-subpage-search {

chrome/browser/resources/settings/languages_page/languages_page.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 
 <link rel="import" href="chrome://resources/cr_elements/cr_checkbox/cr_checkbox.html">
+<link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
 <link rel="import" href="chrome://resources/html/action_link.html">
 <link rel="import" href="chrome://resources/html/action_link_css.html">
 <link rel="import" href="chrome://resources/html/assert.html">
@@ -42,7 +43,7 @@
       }
 
       .explain-selected {
-        color: var(--google-green-700);
+        color: var(--google-green-refresh-700);
         font-weight: initial;
         margin-top: 4px;
       }

ui/file_manager/gallery/gallery.html

@@ -31,9 +31,9 @@
   <style is="custom-style">
     cr-checkbox {
       --cr-checkbox-checked-box-color: white;
+      --cr-checkbox-label-color: white;
       --cr-checkbox-label-container: {
         -webkit-padding-start: 6px;
-        color: white;
       };
       --cr-checkbox-mark-color: black;
       --cr-checkbox-ripple-checked-color: white;

ui/webui/resources/cr_elements/cr_checkbox/cr_checkbox.html

@@ -9,6 +9,7 @@ List of customizable styles:
 
   --cr-checkbox-border-size
   --cr-checkbox-checked-box-color
+  --cr-checkbox-label-color
   --cr-checkbox-label-container (CSS mixin)
   --cr-checkbox-mark-color
   --cr-checkbox-ripple-checked-color
@@ -111,6 +112,7 @@ List of customizable styles:
 
       #label-container {
         -webkit-padding-start: 20px;
+        color: var(--cr-checkbox-label-color, var(--google-grey-900));
         white-space: normal;
 
         @apply --cr-checkbox-label-container;

ui/webui/resources/cr_elements/shared_vars_css.html

@@ -152,6 +152,8 @@
     }
     --google-blue-50: #E8F0FE;
     --google-blue-600: #1A73E8;
+    /* -refresh differentiates from google-green-700 in polymer's color.html. */
+    --google-green-refresh-700: #188038;
     /* -refresh differentiates from google-grey-100 in polymer's color.html. */
     --google-grey-refresh-100: #F1F3F4;
     --google-grey-200: #E8EAED;