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 |