| OLD | NEW |
| 1 <link rel="import" href="chrome://resources/html/polymer.html"> | 1 <link rel="import" href="chrome://resources/html/polymer.html"> |
| 2 <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html"> | 2 <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html"> |
| 3 | 3 |
| 4 <!-- Common styles for Material Design WebUI. Included directly in | 4 <!-- Common styles for Material Design WebUI. Included directly in |
| 5 settings_shared_css.html. --> | 5 settings_shared_css.html. --> |
| 6 <dom-module id="cr-shared-style"> | 6 <dom-module id="cr-shared-style"> |
| 7 <template> | 7 <template> |
| 8 <style> | 8 <style> |
| 9 /* Chrome spinners should be blue. */ |
| 10 paper-spinner { |
| 11 --paper-spinner-layer-1-color: var(--google-blue-500); |
| 12 --paper-spinner-layer-2-color: var(--google-blue-500); |
| 13 --paper-spinner-layer-3-color: var(--google-blue-500); |
| 14 --paper-spinner-layer-4-color: var(--google-blue-500); |
| 15 } |
| 16 |
| 9 .action-button { | 17 .action-button { |
| 10 background: var(--google-blue-500); | 18 background: var(--google-blue-500); |
| 11 color: white; | 19 color: white; |
| 12 --paper-button-flat-keyboard-focus: { | 20 --paper-button-flat-keyboard-focus: { |
| 13 background-color: rgb(58, 117, 215); /* 88% of --google-blue-500 */ | 21 background-color: rgb(58, 117, 215); /* 88% of --google-blue-500 */ |
| 14 }; | 22 }; |
| 15 } | 23 } |
| 16 | 24 |
| 17 .action-button[disabled] { | 25 .action-button[disabled] { |
| 18 opacity: .25; /* TODO(dbeam): check this value with bettes. */ | 26 opacity: .25; /* TODO(dbeam): check this value with bettes. */ |
| 19 } | 27 } |
| 20 | 28 |
| 21 .cancel-button { | 29 .cancel-button { |
| 22 --paper-button-flat-keyboard-focus: { | 30 --paper-button-flat-keyboard-focus: { |
| 23 background-color: rgba(0, 0, 0, .12); | 31 background-color: rgba(0, 0, 0, .12); |
| 24 }; | 32 }; |
| 25 } | 33 } |
| 26 | 34 |
| 27 .action-button, | 35 .action-button, |
| 28 .cancel-button { | 36 .cancel-button { |
| 29 font-weight: 500; | 37 font-weight: 500; |
| 30 } | 38 } |
| 31 | 39 |
| 32 [actionable] { | 40 [actionable] { |
| 33 @apply(--cr-actionable); | 41 @apply(--cr-actionable); |
| 34 } | 42 } |
| 35 </style> | 43 </style> |
| 36 </template> | 44 </template> |
| 37 </dom-module> | 45 </dom-module> |
| OLD | NEW |