OLD | NEW |
---|---|
1 <link rel="import" href="chrome://resources/html/polymer.html"> | 1 <link rel="import" href="chrome://resources/html/polymer.html"> |
2 <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html"> | 2 <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html"> |
3 <link rel="import" href="hidden_style_css.html"> | 3 <link rel="import" href="hidden_style_css.html"> |
4 | 4 |
5 <!-- Common styles for Material Design WebUI. Included directly in | 5 <!-- Common styles for Material Design WebUI. Included directly in |
6 settings_shared_css.html. --> | 6 settings_shared_css.html. --> |
7 <dom-module id="cr-shared-style"> | 7 <dom-module id="cr-shared-style"> |
8 <template> | 8 <template> |
9 <style include="cr-hidden-style"> | 9 <style include="cr-hidden-style"> |
10 :host-context([dir=rtl]) button[is='paper-icon-button-light'] { | 10 :host-context([dir=rtl]) button[is='paper-icon-button-light'] { |
(...skipping 31 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
42 font-weight: 500; | 42 font-weight: 500; |
43 padding-left: 16px; | 43 padding-left: 16px; |
44 padding-right: 16px; | 44 padding-right: 16px; |
45 } | 45 } |
46 | 46 |
47 [actionable] { | 47 [actionable] { |
48 @apply(--cr-actionable); | 48 @apply(--cr-actionable); |
49 } | 49 } |
50 | 50 |
51 button[is='paper-icon-button-light'] { | 51 button[is='paper-icon-button-light'] { |
52 @apply(--cr-paper-icon-button-margin); | 52 -webkit-margin-end: calc(var(--cr-icon-ripple-padding) * -1); |
hcarmona
2017/05/25 23:42:58
This is used in 4 places, can we make a variable f
dschuyler
2017/05/26 00:07:03
Done.
| |
53 -webkit-margin-start: 16px; | |
53 background-position: center; | 54 background-position: center; |
54 background-repeat: no-repeat; | 55 background-repeat: no-repeat; |
55 background-size: var(--cr-icon-size); | 56 background-size: var(--cr-icon-size); |
56 flex-shrink: 0; | 57 flex-shrink: 0; |
57 height: var(--cr-icon-ripple-size); | 58 height: var(--cr-icon-ripple-size); |
58 width: var(--cr-icon-ripple-size); | 59 width: var(--cr-icon-ripple-size); |
59 } | 60 } |
60 | 61 |
62 .separator + button[is='paper-icon-button-light'] { | |
63 -webkit-margin-start: calc(var(--cr-icon-ripple-padding) * -1); | |
64 } | |
65 | |
61 button[is='paper-icon-button-light'].subpage-arrow { | 66 button[is='paper-icon-button-light'].subpage-arrow { |
62 background-image: url(chrome://resources/images/arrow_right.svg); | 67 background-image: url(chrome://resources/images/arrow_right.svg); |
63 } | 68 } |
64 | 69 |
65 button[is='paper-icon-button-light'].icon-cancel { | 70 button[is='paper-icon-button-light'].icon-cancel { |
66 background-image: url(chrome://resources/images/icon_cancel.svg); | 71 background-image: url(chrome://resources/images/icon_cancel.svg); |
67 } | 72 } |
68 | 73 |
69 button[is='paper-icon-button-light'].icon-cancel-toolbar { | 74 button[is='paper-icon-button-light'].icon-cancel-toolbar { |
70 background-image: | 75 background-image: |
71 url(chrome://resources/images/icon_cancel_toolbar.svg); | 76 url(chrome://resources/images/icon_cancel_toolbar.svg); |
72 } | 77 } |
73 | 78 |
74 button[is='paper-icon-button-light'].icon-external { | 79 button[is='paper-icon-button-light'].icon-external { |
75 background-image: url(chrome://resources/images/open_in_new.svg); | 80 background-image: url(chrome://resources/images/open_in_new.svg); |
76 } | 81 } |
77 | 82 |
78 .subpage-arrow, | 83 .subpage-arrow, |
79 .icon-external { | 84 .icon-external { |
80 display: none; | 85 display: none; |
81 } | 86 } |
82 | 87 |
88 paper-icon-button { | |
hcarmona
2017/05/25 23:42:58
Can this
dschuyler
2017/05/26 00:07:03
Done.
| |
89 color: var(--paper-grey-600); | |
90 flex-shrink: 0; | |
91 } | |
92 | |
93 paper-icon-button { | |
hcarmona
2017/05/25 23:42:58
and this can be combined b/c they use the same sel
dschuyler
2017/05/26 00:07:03
Done.
| |
94 -webkit-margin-end: calc(var(--cr-icon-ripple-padding) * -1); | |
95 -webkit-margin-start: 16px; | |
96 } | |
97 | |
98 .separator + paper-icon-button { | |
99 -webkit-margin-start: calc(var(--cr-icon-ripple-padding) * -1); | |
100 } | |
101 | |
83 paper-icon-button.subpage-arrow { | 102 paper-icon-button.subpage-arrow { |
84 background-image: url(../images/arrow_right.svg); | 103 background-image: url(../images/arrow_right.svg); |
85 } | 104 } |
86 | 105 |
87 [actionable] :-webkit-any(.subpage-arrow, .icon-external), | 106 [actionable] :-webkit-any(.subpage-arrow, .icon-external), |
88 [actionable]:-webkit-any(.subpage-arrow, .icon-external) { | 107 [actionable]:-webkit-any(.subpage-arrow, .icon-external) { |
89 display: block; | 108 display: block; |
90 } | 109 } |
91 | 110 |
92 [scrollable] { | 111 [scrollable] { |
(...skipping 25 matching lines...) Expand all Loading... | |
118 [selectable]:focus, | 137 [selectable]:focus, |
119 [selectable] > :focus { | 138 [selectable] > :focus { |
120 @apply(--cr-selectable-focus); | 139 @apply(--cr-selectable-focus); |
121 } | 140 } |
122 [selectable] > * { | 141 [selectable] > * { |
123 @apply(--cr-actionable); | 142 @apply(--cr-actionable); |
124 } | 143 } |
125 </style> | 144 </style> |
126 </template> | 145 </template> |
127 </dom-module> | 146 </dom-module> |
OLD | NEW |