| OLD | NEW |
| 1 <link rel="import" href="chrome://resources/cr_elements/shared_style_css.html"> | |
| 2 <link rel="import" href="/settings_root_css.html"> | 1 <link rel="import" href="/settings_root_css.html"> |
| 3 | 2 |
| 4 <!-- Common styles for Material Design settings. --> | 3 <!-- Common styles for Material Design settings. --> |
| 5 <dom-module id="settings-shared"> | 4 <dom-module id="settings-shared"> |
| 6 <template> | 5 <template> |
| 7 <style include="cr-shared-style"> | 6 <style> |
| 8 h2 { | 7 h2 { |
| 9 align-items: center; | 8 align-items: center; |
| 10 display: flex; | 9 display: flex; |
| 11 font-size: 100%; | 10 font-size: 100%; |
| 12 font-weight: 500; | 11 font-weight: 500; |
| 13 margin: 0; | 12 margin: 0; |
| 14 min-height: var(--settings-row-min-height); | 13 min-height: var(--settings-row-min-height); |
| 15 } | 14 } |
| 16 | 15 |
| 17 iron-icon[icon='cr:check'], | 16 iron-icon[icon='cr:check'], |
| (...skipping 40 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 58 text-align: start; | 57 text-align: start; |
| 59 width: 100%; | 58 width: 100%; |
| 60 } | 59 } |
| 61 | 60 |
| 62 paper-dropdown-menu .dropdown-item.iron-selected { | 61 paper-dropdown-menu .dropdown-item.iron-selected { |
| 63 font-weight: bold; | 62 font-weight: bold; |
| 64 } | 63 } |
| 65 | 64 |
| 66 iron-dropdown .dropdown-item:focus, | 65 iron-dropdown .dropdown-item:focus, |
| 67 paper-dropdown-menu .dropdown-item:focus { | 66 paper-dropdown-menu .dropdown-item:focus { |
| 68 background-color: var(--paper-grey-300); | 67 background-color: var(--cr-focused-item-color); |
| 69 outline: none; | 68 outline: none; |
| 70 } | 69 } |
| 71 | 70 |
| 72 iron-dropdown .dropdown-content { | 71 iron-dropdown .dropdown-content { |
| 73 background-color: white; | 72 background-color: white; |
| 74 box-shadow: 0 2px 6px var(--paper-grey-500); | 73 box-shadow: 0 2px 6px var(--paper-grey-500); |
| 75 } | 74 } |
| 76 | 75 |
| 77 iron-dropdown .dropdown-content .dropdown-item, | 76 iron-dropdown .dropdown-content .dropdown-item, |
| 78 iron-dropdown .dropdown-content paper-item { | 77 iron-dropdown .dropdown-content paper-item { |
| 79 @apply(--settings-actionable); | 78 @apply(--settings-actionable); |
| 80 } | 79 } |
| 81 | 80 |
| 82 iron-dropdown .dropdown-content .dropdown-item:hover, | 81 iron-dropdown .dropdown-content .dropdown-item:hover, |
| 83 iron-dropdown .dropdown-content paper-item:hover { | 82 iron-dropdown .dropdown-content paper-item:hover { |
| 84 background-color: var(--settings-hover-color); | 83 background-color: var(--cr-focused-item-color); |
| 85 } | 84 } |
| 86 | 85 |
| 87 span ~ a { | 86 span ~ a { |
| 88 -webkit-margin-start: 4px; | 87 -webkit-margin-start: 4px; |
| 89 } | 88 } |
| 90 | 89 |
| 91 [is='action-link'], | 90 [is='action-link'], |
| 92 [is='action-link']:active, | 91 [is='action-link']:active, |
| 93 [is='action-link']:hover, | 92 [is='action-link']:hover, |
| 94 [is='action-link']:visited, | 93 [is='action-link']:visited, |
| (...skipping 185 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 280 display: block; | 279 display: block; |
| 281 } | 280 } |
| 282 | 281 |
| 283 /* | 282 /* |
| 284 * A row with two lines of text. Often the lower line will be .secondary. | 283 * A row with two lines of text. Often the lower line will be .secondary. |
| 285 */ | 284 */ |
| 286 .settings-box.two-line { | 285 .settings-box.two-line { |
| 287 min-height: 56px; | 286 min-height: 56px; |
| 288 } | 287 } |
| 289 | 288 |
| 290 [actionable] { | |
| 291 @apply(--settings-actionable); | |
| 292 } | |
| 293 | |
| 294 /* The lower line of text in a .settings-box.two-line. */ | 289 /* The lower line of text in a .settings-box.two-line. */ |
| 295 .settings-box .secondary { | 290 .settings-box .secondary { |
| 296 @apply(--settings-secondary); | 291 @apply(--settings-secondary); |
| 297 } | 292 } |
| 298 | 293 |
| 299 /* The middle part (horizontally) of a row. */ | 294 /* The middle part (horizontally) of a row. */ |
| 300 .settings-box .middle { | 295 .settings-box .middle { |
| 301 -webkit-margin-start: 16px; | 296 -webkit-margin-start: 16px; |
| 302 align-items: center; | 297 align-items: center; |
| 303 flex: auto; | 298 flex: auto; |
| (...skipping 46 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 350 | 345 |
| 351 .favicon-image { | 346 .favicon-image { |
| 352 background-repeat: no-repeat; | 347 background-repeat: no-repeat; |
| 353 background-size: contain; | 348 background-size: contain; |
| 354 height: 16px; | 349 height: 16px; |
| 355 width: 16px; | 350 width: 16px; |
| 356 } | 351 } |
| 357 </style> | 352 </style> |
| 358 </template> | 353 </template> |
| 359 </dom-module> | 354 </dom-module> |
| OLD | NEW |