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 /* Included here so we don't have to include "iron-positioning" in every | 8 /* Included here so we don't have to include "iron-positioning" in every |
9 * stylesheet. See crbug.com/498405. */ | 9 * stylesheet. See crbug.com/498405. */ |
10 [hidden] { | 10 [hidden] { |
11 display: none !important; | 11 display: none !important; |
12 } | 12 } |
13 | 13 |
14 button[is='paper-icon-button-light'] { | |
15 -webkit-margin-end: -8px; /* Allow ripple to overlap the end. */ | |
16 -webkit-margin-start: 16px; | |
17 background-position: center; | |
18 background-repeat: no-repeat; | |
19 background-size: var(--settings-icon-size); | |
20 flex-shrink: 0; | |
21 height: var(--settings-icon-ripple-size); | |
22 width: var(--settings-icon-ripple-size); | |
23 } | |
24 | |
25 :host-context([dir=rtl]) button[is='paper-icon-button-light'] { | 14 :host-context([dir=rtl]) button[is='paper-icon-button-light'] { |
26 transform: scaleX(-1); /* Flip on the X axis (aka mirror). */ | 15 transform: scaleX(-1); /* Flip on the X axis (aka mirror). */ |
27 } | 16 } |
28 | 17 |
29 :host-context([dir=rtl]) paper-icon-button[icon='settings:arrow-back'] { | 18 :host-context([dir=rtl]) paper-icon-button[icon='settings:arrow-back'] { |
30 transform: scaleX(-1); /* Flip on the X axis (aka mirror). */ | 19 transform: scaleX(-1); /* Flip on the X axis (aka mirror). */ |
31 } | 20 } |
32 | 21 |
33 /* Use <h2> as the "sub-header" mentioned in the UX design docs. */ | 22 /* Use <h2> as the "sub-header" mentioned in the UX design docs. */ |
34 h2 { | 23 h2 { |
(...skipping 375 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
410 /* Turns the arrow direction downwards, when the bubble is placed above | 399 /* Turns the arrow direction downwards, when the bubble is placed above |
411 * the anchor element */ | 400 * the anchor element */ |
412 .search-bubble-innards.above::after { | 401 .search-bubble-innards.above::after { |
413 -webkit-transform: rotate(-135deg); | 402 -webkit-transform: rotate(-135deg); |
414 bottom: -5px; | 403 bottom: -5px; |
415 top: auto; | 404 top: auto; |
416 } | 405 } |
417 </style> | 406 </style> |
418 </template> | 407 </template> |
419 </dom-module> | 408 </dom-module> |
OLD | NEW |