Chromium Code Reviews| OLD | NEW |
|---|---|
| 1 <link rel="import" href="chrome://resources/cr_elements/shared_style_css.html"> | 1 <link rel="import" href="chrome://resources/cr_elements/shared_style_css.html"> |
| 2 <link rel="import" href="/settings_vars_css.html"> | 2 <link rel="import" href="/settings_vars_css.html"> |
| 3 | 3 |
| 4 <!-- Common styles for Material Design settings. --> | 4 <!-- Common styles for Material Design settings. --> |
| 5 <dom-module id="settings-shared"> | 5 <dom-module id="settings-shared"> |
| 6 <template> | 6 <template> |
| 7 <style include="cr-shared-style"> | 7 <style include="cr-shared-style"> |
| 8 button[is='paper-icon-button-light'] { | 8 button[is='paper-icon-button-light'] { |
| 9 -webkit-margin-end: -8px; /* Allow ripple to overlap the end. */ | 9 -webkit-margin-end: -8px; /* Allow ripple to overlap the end. */ |
| 10 -webkit-margin-start: 16px; | 10 -webkit-margin-start: 16px; |
| (...skipping 263 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 274 color: var(--google-blue-500); | 274 color: var(--google-blue-500); |
| 275 font-weight: 500; | 275 font-weight: 500; |
| 276 } | 276 } |
| 277 | 277 |
| 278 /* A settings-box is a horizontal row of text or controls within a | 278 /* A settings-box is a horizontal row of text or controls within a |
| 279 * setting section (page or subpage). */ | 279 * setting section (page or subpage). */ |
| 280 .settings-box { | 280 .settings-box { |
| 281 align-items: center; | 281 align-items: center; |
| 282 border-top: var(--settings-separator-line); | 282 border-top: var(--settings-separator-line); |
| 283 display: flex; | 283 display: flex; |
| 284 min-height: var(--settings-row-min-height); | 284 min-height: var(--settings-box-min-height); |
| 285 padding: 0 var(--settings-box-row-padding); | 285 padding: 0 var(--settings-box-row-padding); |
| 286 } | 286 } |
| 287 | 287 |
| 288 /* We use an explicit tag to remove the top border, rather than a | 288 /* We use an explicit tag to remove the top border, rather than a |
| 289 * :first-of-type modifier. This is a conscious choice, please consult | 289 * :first-of-type modifier. This is a conscious choice, please consult |
| 290 * with dbeam@ or dschuyler@ prior to changing it. */ | 290 * with dbeam@ or dschuyler@ prior to changing it. */ |
| 291 .settings-box.first, | 291 .settings-box.first, |
| 292 .settings-box.continuation { | 292 .settings-box.continuation { |
| 293 border-top: none; | 293 border-top: none; |
| 294 } | 294 } |
| 295 | 295 |
| 296 .settings-box.block { | 296 .settings-box.block { |
| 297 display: block; | 297 display: block; |
| 298 } | 298 } |
| 299 | 299 |
| 300 /* A row with two lines of text. Often the lower line will be .secondary. | 300 /* A row with two lines of text. Often the lower line will be .secondary. |
| 301 */ | 301 */ |
| 302 .two-line { | 302 .two-line { |
|
Dan Beam
2016/11/03 18:55:40
should this be .settings-box.two-line?
scottchen
2016/11/03 19:26:22
You're right, I missed the fact that there are oth
scottchen
2016/11/03 22:15:48
Done.
| |
| 303 min-height: var(--settings-row-two-line-min-height); | 303 min-height: var(--settings-box-two-line-min-height); |
| 304 } | 304 } |
| 305 | 305 |
| 306 /* A start-aligned column. */ | 306 /* A start-aligned column. */ |
| 307 .single-column { | 307 .single-column { |
| 308 align-items: flex-start; | 308 align-items: flex-start; |
| 309 flex-direction: column; | 309 flex-direction: column; |
| 310 justify-content: center; | 310 justify-content: center; |
| 311 } | 311 } |
| 312 | 312 |
| 313 /* A settings-box with no height other than the separator line. */ | 313 /* A settings-box with no height other than the separator line. */ |
| (...skipping 112 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 426 /* Turns the arrow direction downwards, when the bubble is placed above | 426 /* Turns the arrow direction downwards, when the bubble is placed above |
| 427 * the anchor element */ | 427 * the anchor element */ |
| 428 .search-bubble-innards.above::after { | 428 .search-bubble-innards.above::after { |
| 429 -webkit-transform: rotate(-135deg); | 429 -webkit-transform: rotate(-135deg); |
| 430 bottom: -5px; | 430 bottom: -5px; |
| 431 top: auto; | 431 top: auto; |
| 432 } | 432 } |
| 433 </style> | 433 </style> |
| 434 </template> | 434 </template> |
| 435 </dom-module> | 435 </dom-module> |
| OLD | NEW |