| 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 /* Use <h2> as the "sub-header" mentioned in the UX design docs. */ | 8 /* Use <h2> as the "sub-header" mentioned in the UX design docs. */ |
| 9 h2 { | 9 h2 { |
| 10 align-items: center; | 10 align-items: center; |
| (...skipping 37 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 48 /* Offsets the input's border-bottom. */ | 48 /* Offsets the input's border-bottom. */ |
| 49 top: 1px; | 49 top: 1px; |
| 50 } | 50 } |
| 51 | 51 |
| 52 iron-dropdown .dropdown-content, | 52 iron-dropdown .dropdown-content, |
| 53 paper-dropdown-menu-light paper-listbox { | 53 paper-dropdown-menu-light paper-listbox { |
| 54 min-width: 128px; | 54 min-width: 128px; |
| 55 padding: 8px 0; | 55 padding: 8px 0; |
| 56 } | 56 } |
| 57 | 57 |
| 58 iron-dropdown .dropdown-item, | 58 .dropdown-item { |
| 59 paper-dropdown-menu-light .dropdown-item, | |
| 60 cr-shared-menu .dropdown-item { | |
| 61 align-items: center; | 59 align-items: center; |
| 62 background: none; | 60 background: none; |
| 63 border: none; | 61 border: none; |
| 64 color: var(--paper-grey-800); | 62 color: var(--paper-grey-800); |
| 65 display: flex; | 63 display: flex; |
| 66 font: inherit; | 64 font: inherit; |
| 67 min-height: 32px; | 65 min-height: 32px; |
| 68 padding: 0 24px; | 66 padding: 0 24px; |
| 69 text-align: start; | 67 text-align: start; |
| 70 width: 100%; | 68 width: 100%; |
| 71 } | 69 } |
| 72 | 70 |
| 73 paper-dropdown-menu-light .dropdown-item.iron-selected { | 71 paper-dropdown-menu-light .dropdown-item.iron-selected { |
| 74 font-weight: bold; | 72 font-weight: bold; |
| 75 } | 73 } |
| 76 | 74 |
| 77 iron-dropdown .dropdown-item:focus, | 75 iron-dropdown .dropdown-item:focus, |
| 78 paper-dropdown-menu-light .dropdown-item:focus { | 76 paper-dropdown-menu-light .dropdown-item:focus { |
| 79 @apply(--cr-selectable-focus); | 77 @apply(--cr-selectable-focus); |
| 80 } | 78 } |
| 81 | 79 |
| 82 iron-dropdown .dropdown-content { | 80 iron-dropdown .dropdown-content { |
| 83 background-color: white; | 81 background-color: white; |
| 84 box-shadow: 0 2px 6px var(--paper-grey-500); | 82 box-shadow: 0 2px 6px var(--paper-grey-500); |
| 85 } | 83 } |
| 86 | 84 |
| 87 iron-dropdown .dropdown-content .dropdown-item:not([disabled]), | 85 .dropdown-item:not([disabled]), |
| 88 cr-shared-menu .dropdown-item:not([disabled]), | |
| 89 iron-dropdown .dropdown-content paper-item { | 86 iron-dropdown .dropdown-content paper-item { |
| 90 @apply(--settings-actionable); | 87 @apply(--settings-actionable); |
| 91 } | 88 } |
| 92 | 89 |
| 93 iron-dropdown .dropdown-content .dropdown-item[disabled], | 90 iron-dropdown .dropdown-content .dropdown-item[disabled], |
| 94 cr-shared-menu .dropdown-item[disabled] { | 91 cr-shared-menu .dropdown-item[disabled] { |
| 95 opacity: var(--settings-disabled-opacity); | 92 opacity: var(--settings-disabled-opacity); |
| 96 } | 93 } |
| 97 | 94 |
| 98 span ~ a { | 95 span ~ a { |
| (...skipping 287 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 386 /* Turns the arrow direction downwards, when the bubble is placed above | 383 /* Turns the arrow direction downwards, when the bubble is placed above |
| 387 * the anchor element */ | 384 * the anchor element */ |
| 388 .search-bubble-innards.above::after { | 385 .search-bubble-innards.above::after { |
| 389 -webkit-transform: rotate(-135deg); | 386 -webkit-transform: rotate(-135deg); |
| 390 bottom: -5px; | 387 bottom: -5px; |
| 391 top: auto; | 388 top: auto; |
| 392 } | 389 } |
| 393 </style> | 390 </style> |
| 394 </template> | 391 </template> |
| 395 </dom-module> | 392 </dom-module> |
| OLD | NEW |