| OLD | NEW |
| 1 <!-- Common styles for Material Design settings. --> | 1 <!-- Common styles for Material Design settings. --> |
| 2 <dom-module id="settings-shared"> | 2 <dom-module id="settings-shared"> |
| 3 <template> | 3 <template> |
| 4 <style> | 4 <style> |
| 5 :root { | 5 :root { |
| 6 --checkbox-margin-start: 2px; | 6 --checkbox-margin-start: 2px; |
| 7 --checkbox-size: 16px; | 7 --checkbox-size: 16px; |
| 8 --checkbox-spacing: 18px; | 8 --checkbox-spacing: 18px; |
| 9 --iron-icon-fill-color: var(--paper-grey-500); | 9 --iron-icon-fill-color: var(--paper-grey-500); |
| 10 --iron-icon-height: 20px; | 10 --iron-icon-height: 20px; |
| 11 --iron-icon-stroke-color: var(--paper-grey-500); | 11 --iron-icon-stroke-color: var(--paper-grey-500); |
| 12 --iron-icon-width: 20px; | 12 --iron-icon-width: 20px; |
| 13 --paper-icon-button: { | 13 --paper-icon-button: { |
| 14 width: 36px; | 14 width: 36px; |
| 15 height: 36px; | 15 height: 36px; |
| 16 } | 16 } |
| 17 --settings-background-color: var(--paper-blue-grey-50); | 17 --settings-background-color: var(--paper-blue-grey-50); |
| 18 --settings-secondary: { | 18 --settings-secondary: { |
| 19 color: var(--paper-grey-500); | 19 color: var(--paper-grey-500); |
| 20 font-weight: 400; | 20 font-weight: 400; |
| 21 } | 21 } |
| 22 --settings-side-nav-color: var(--google-grey-600); | |
| 23 | 22 |
| 24 /* The title-bar colors use non-MD colors. These custom colors are | 23 /* Some colors use non-MD colors. These custom colors are specified by |
| 25 * specified by UX design (bettes@). | 24 * UX design (bettes@). */ |
| 26 */ | 25 --settings-side-nav-color: rgb(90, 90, 90); |
| 27 --settings-title-bar-background-color: rgb(52, 73, 94); | 26 --settings-title-bar-background-color: rgb(52, 73, 94); |
| 28 --settings-title-bar-color: rgb(255, 255, 255); | 27 --settings-title-bar-color: rgb(255, 255, 255); |
| 29 } | 28 } |
| 30 | 29 |
| 31 h2 { | 30 h2 { |
| 32 @apply(--layout-center); | 31 @apply(--layout-center); |
| 33 color: var(--paper-grey-500); | 32 color: var(--paper-grey-500); |
| 34 display: flex; | 33 display: flex; |
| 35 font-size: 100%; | 34 font-size: 100%; |
| 36 font-weight: 500; | 35 font-weight: 500; |
| (...skipping 208 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 245 | 244 |
| 246 .settings-checkbox-spacer { | 245 .settings-checkbox-spacer { |
| 247 -webkit-margin-start: calc( | 246 -webkit-margin-start: calc( |
| 248 var(--checkbox-margin-start) + | 247 var(--checkbox-margin-start) + |
| 249 var(--checkbox-size) + | 248 var(--checkbox-size) + |
| 250 var(--checkbox-spacing)); | 249 var(--checkbox-spacing)); |
| 251 } | 250 } |
| 252 </style> | 251 </style> |
| 253 </template> | 252 </template> |
| 254 </dom-module> | 253 </dom-module> |
| OLD | NEW |