summaryrefslogtreecommitdiffstats
path: root/chromium/chrome/browser/resources/welcome/shared/navi_colors_css.html
diff options
context:
space:
mode:
Diffstat (limited to 'chromium/chrome/browser/resources/welcome/shared/navi_colors_css.html')
-rw-r--r--chromium/chrome/browser/resources/welcome/shared/navi_colors_css.html89
1 files changed, 41 insertions, 48 deletions
diff --git a/chromium/chrome/browser/resources/welcome/shared/navi_colors_css.html b/chromium/chrome/browser/resources/welcome/shared/navi_colors_css.html
index 99846f3120f..403ee035ba4 100644
--- a/chromium/chrome/browser/resources/welcome/shared/navi_colors_css.html
+++ b/chromium/chrome/browser/resources/welcome/shared/navi_colors_css.html
@@ -1,51 +1,44 @@
-<link rel="import" href="chrome://resources/html/polymer.html">
+<template>
+ <style>
+ :host {
+ --navi-border-color: var(--google-grey-refresh-300);
+ --navi-check-icon-color: lightgrey;
+ --navi-keyboard-focus-color: rgba(var(--google-blue-600-rgb), .4);
+ --navi-option-box-shadow:
+ 0 1px 2px 0 rgba(var(--google-grey-800-rgb), .3),
+ 0 3px 6px 2px rgba(var(--google-grey-800-rgb), .15);
+ --navi-option-icon-shadow-color: var(--google-grey-refresh-100);
+ --navi-shape-blue-color: rgb(26, 115, 232); /* #1A73E8 */
+ --navi-shape-green-color: rgb(49, 167, 83); /* #31A753 */
+ --navi-shape-grey-color: rgb(241, 243, 244); /* #F1F3F4 */
+ --navi-shape-red-color: rgb(233, 66, 53); /* #E94235 */
+ --navi-shape-yellow-dots-color: rgb(253, 214, 99); /* #FDD663 */
+ --navi-shape-yellow-semicircle-color: rgb(250, 207, 76); /* #FACF4C */
+ --navi-step-indicator-active-color:
+ rgba(var(--google-blue-600-rgb), .5);
+ --navi-step-indicator-color: var(--google-grey-200);
+ --navi-wallpaper-text-color: var(--google-grey-refresh-700);
+ }
-<link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
-<link rel="import" href="chrome://resources/cr_elements/md_select_css.html">
-
-<dom-module id="navi-colors-css">
- <template>
- <style>
+ @media (prefers-color-scheme: dark) {
:host {
- --navi-border-color: var(--google-grey-refresh-300);
- --navi-check-icon-color: lightgrey;
- --navi-keyboard-focus-color: rgba(var(--google-blue-600-rgb), .4);
- --navi-option-box-shadow:
- 0 1px 2px 0 rgba(var(--google-grey-800-rgb), .3),
- 0 3px 6px 2px rgba(var(--google-grey-800-rgb), .15);
- --navi-option-icon-shadow-color: var(--google-grey-refresh-100);
- --navi-shape-blue-color: rgb(26, 115, 232); /* #1A73E8 */
- --navi-shape-green-color: rgb(49, 167, 83); /* #31A753 */
- --navi-shape-grey-color: rgb(241, 243, 244); /* #F1F3F4 */
- --navi-shape-red-color: rgb(233, 66, 53); /* #E94235 */
- --navi-shape-yellow-dots-color: rgb(253, 214, 99); /* #FDD663 */
- --navi-shape-yellow-semicircle-color: rgb(250, 207, 76); /* #FACF4C */
- --navi-step-indicator-active-color:
- rgba(var(--google-blue-600-rgb), .5);
- --navi-step-indicator-color: var(--google-grey-200);
- --navi-wallpaper-text-color: var(--google-grey-refresh-700);
- }
-
- @media (prefers-color-scheme: dark) {
- :host {
- --navi-border-color: var(--google-grey-refresh-700);
- --navi-check-icon-color: var(--google-grey-refresh-700);
- --navi-keyboard-focus-color:
- rgba(var(--google-blue-refresh-300-rgb), .5);
- --navi-option-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3),
- 0 3px 6px 2px rgba(0, 0, 0, .15);
- --navi-option-icon-shadow-color: var(--google-grey-refresh-700);
- --navi-shape-blue-color: rgb(138, 180, 248); /* #8AB4F8 */
- --navi-shape-green-color: rgb(129, 201, 149); /* #81C995 */
- --navi-shape-grey-color: rgb(154, 160, 166); /* #9AA0A6 */
- --navi-shape-red-color: rgb(238, 103, 92); /* #EE675C */
- /* --navi-shape-yellow-dots-color is same color in dark mode */
- --navi-shape-yellow-semicircle-color: rgb(253, 214, 99); /* #FDD663 */
- --navi-step-indicator-active-color: var(--google-blue-refresh-300);
- --navi-step-indicator-color: var(--google-grey-refresh-500);
- --navi-wallpaper-text-color: var(--google-grey-200);
- }
+ --navi-border-color: var(--google-grey-refresh-700);
+ --navi-check-icon-color: var(--google-grey-refresh-700);
+ --navi-keyboard-focus-color:
+ rgba(var(--google-blue-refresh-300-rgb), .5);
+ --navi-option-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3),
+ 0 3px 6px 2px rgba(0, 0, 0, .15);
+ --navi-option-icon-shadow-color: var(--google-grey-refresh-700);
+ --navi-shape-blue-color: rgb(138, 180, 248); /* #8AB4F8 */
+ --navi-shape-green-color: rgb(129, 201, 149); /* #81C995 */
+ --navi-shape-grey-color: rgb(154, 160, 166); /* #9AA0A6 */
+ --navi-shape-red-color: rgb(238, 103, 92); /* #EE675C */
+ /* --navi-shape-yellow-dots-color is same color in dark mode */
+ --navi-shape-yellow-semicircle-color: rgb(253, 214, 99); /* #FDD663 */
+ --navi-step-indicator-active-color: var(--google-blue-refresh-300);
+ --navi-step-indicator-color: var(--google-grey-refresh-500);
+ --navi-wallpaper-text-color: var(--google-grey-200);
}
- </style>
- </template>
-</dom-module>
+ }
+ </style>
+</template>