55 .components-animate__slide-in { |
94 .components-animate__slide-in { |
56 animation: components-animate__slide-in-animation 0.1s cubic-bezier(0, 0, 0.2, 1); |
95 animation: components-animate__slide-in-animation 0.1s cubic-bezier(0, 0, 0.2, 1); |
57 animation-fill-mode: forwards; } |
96 animation-fill-mode: forwards; } |
58 @media (prefers-reduced-motion: reduce) { |
97 @media (prefers-reduced-motion: reduce) { |
59 .components-animate__slide-in { |
98 .components-animate__slide-in { |
60 animation-duration: 1ms !important; } } |
99 animation-duration: 1ms; } } |
61 .components-animate__slide-in.is-from-left { |
100 .components-animate__slide-in.is-from-left { |
62 transform: translateX(-100%); } |
101 transform: translateX(-100%); } |
|
102 .components-animate__slide-in.is-from-right { |
|
103 transform: translateX(100%); } |
63 |
104 |
64 @keyframes components-animate__slide-in-animation { |
105 @keyframes components-animate__slide-in-animation { |
65 100% { |
106 100% { |
66 transform: translateX(0%); } } |
107 transform: translateX(0%); } } |
67 |
108 |
68 .components-autocomplete__popover .components-popover__content { |
109 .components-animate__loading { |
69 min-width: 200px; } |
110 animation: components-animate__loading 1.6s ease-in-out infinite; } |
70 |
111 |
71 .components-autocomplete__popover .components-autocomplete__results { |
112 @keyframes components-animate__loading { |
72 padding: 3px; |
113 0% { |
|
114 opacity: 0.5; } |
|
115 50% { |
|
116 opacity: 1; } |
|
117 100% { |
|
118 opacity: 0.5; } } |
|
119 |
|
120 .components-angle-picker-control { |
|
121 width: 50%; } |
|
122 .components-angle-picker-control.components-base-control .components-base-control__label { |
|
123 display: block; } |
|
124 |
|
125 .components-angle-picker-control__input-field[type="number"] { |
|
126 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
127 padding: 6px 8px; |
|
128 box-shadow: 0 0 0 transparent; |
|
129 transition: box-shadow 0.1s linear; |
|
130 border-radius: 2px; |
|
131 border: 1px solid #757575; |
|
132 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
|
133 font-size: 16px; |
|
134 /* Override core line-height. To be reviewed. */ |
|
135 line-height: normal; |
|
136 width: calc(100% - 36px); |
|
137 max-width: 100px; } |
|
138 @media (prefers-reduced-motion: reduce) { |
|
139 .components-angle-picker-control__input-field[type="number"] { |
|
140 transition-duration: 0s; } } |
|
141 @media (min-width: 600px) { |
|
142 .components-angle-picker-control__input-field[type="number"] { |
|
143 font-size: 13px; |
|
144 /* Override core line-height. To be reviewed. */ |
|
145 line-height: normal; } } |
|
146 .components-angle-picker-control__input-field[type="number"]:focus { |
|
147 border-color: #007cba; |
|
148 border-color: var(--wp-admin-theme-color); |
|
149 box-shadow: 0 0 0 0.5px #007cba; |
|
150 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
|
151 outline: 2px solid transparent; } |
|
152 .components-angle-picker-control__input-field[type="number"]::-webkit-input-placeholder { |
|
153 color: rgba(30, 30, 30, 0.62); } |
|
154 .components-angle-picker-control__input-field[type="number"]::-moz-placeholder { |
|
155 opacity: 1; |
|
156 color: rgba(30, 30, 30, 0.62); } |
|
157 .components-angle-picker-control__input-field[type="number"]:-ms-input-placeholder { |
|
158 color: rgba(30, 30, 30, 0.62); } |
|
159 .is-dark-theme .components-angle-picker-control__input-field[type="number"]::-webkit-input-placeholder { |
|
160 color: rgba(255, 255, 255, 0.65); } |
|
161 .is-dark-theme .components-angle-picker-control__input-field[type="number"]::-moz-placeholder { |
|
162 opacity: 1; |
|
163 color: rgba(255, 255, 255, 0.65); } |
|
164 .is-dark-theme .components-angle-picker-control__input-field[type="number"]:-ms-input-placeholder { |
|
165 color: rgba(255, 255, 255, 0.65); } |
|
166 |
|
167 .components-angle-picker-control__angle-circle { |
|
168 width: 28px; |
|
169 height: 28px; |
|
170 border: 2px solid #555d66; |
|
171 border-radius: 50%; |
|
172 float: right; |
|
173 margin-left: 4px; |
|
174 cursor: grab; } |
|
175 |
|
176 .components-angle-picker-control__angle-circle-indicator-wrapper { |
|
177 position: relative; |
|
178 width: 100%; |
|
179 height: 100%; } |
|
180 |
|
181 .components-angle-picker-control__angle-circle-indicator { |
|
182 width: 1px; |
|
183 height: 1px; |
|
184 border-radius: 50%; |
|
185 border: 3px solid #555d66; |
|
186 display: block; |
|
187 position: absolute; |
|
188 top: -14px; |
|
189 bottom: 0; |
|
190 right: 0; |
|
191 left: 0; |
|
192 margin: auto; |
|
193 background: #555d66; } |
|
194 |
|
195 .components-autocomplete__popover .components-popover__content > div { |
|
196 padding: 16px; } |
|
197 |
|
198 .components-autocomplete__result.components-button { |
73 display: flex; |
199 display: flex; |
74 flex-direction: column; |
200 height: auto; |
75 align-items: stretch; } |
201 min-height: 36px; |
76 .components-autocomplete__popover .components-autocomplete__results:empty { |
202 text-align: right; |
77 display: none; } |
203 width: 100%; } |
78 |
|
79 .components-autocomplete__result.components-button { |
|
80 margin-bottom: 0; |
|
81 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
82 font-size: 13px; |
|
83 color: #555d66; |
|
84 display: flex; |
|
85 flex-direction: row; |
|
86 flex-grow: 1; |
|
87 flex-shrink: 0; |
|
88 align-items: center; |
|
89 padding: 6px 8px; |
|
90 margin-right: -3px; |
|
91 margin-left: -3px; |
|
92 text-align: right; } |
|
93 .components-autocomplete__result.components-button.is-selected { |
204 .components-autocomplete__result.components-button.is-selected { |
94 color: #191e23; |
205 box-shadow: 0 0 0 2px #007cba; |
95 border: none; |
206 box-shadow: 0 0 0 2px var(--wp-admin-theme-color); } |
96 box-shadow: none; |
|
97 outline-offset: -2px; |
|
98 outline: 1px dotted #555d66; } |
|
99 .components-autocomplete__result.components-button:hover { |
|
100 color: #191e23; |
|
101 border: none; |
|
102 box-shadow: none; |
|
103 background: #f3f4f5; } |
|
104 |
207 |
105 .components-base-control { |
208 .components-base-control { |
106 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
209 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
107 font-size: 13px; } |
210 font-size: 13px; } |
108 .components-base-control .components-base-control__field { |
211 .components-base-control .components-base-control__field { |
109 margin-bottom: 8px; } |
212 margin-bottom: 8px; } |
110 .components-panel__row .components-base-control .components-base-control__field { |
213 .components-panel__row .components-base-control .components-base-control__field { |
111 margin-bottom: inherit; } |
214 margin-bottom: inherit; } |
112 .components-base-control .components-base-control__label { |
215 .components-base-control .components-base-control__label { |
113 display: block; |
216 display: inline-block; |
114 margin-bottom: 4px; } |
217 margin-bottom: 8px; } |
115 .components-base-control .components-base-control__help { |
218 .components-base-control .components-base-control__help { |
116 margin-top: -8px; |
219 margin-top: -8px; |
117 font-style: italic; } |
220 font-style: italic; } |
118 |
221 |
119 .components-base-control + .components-base-control { |
|
120 margin-bottom: 16px; } |
|
121 |
|
122 .components-button-group { |
222 .components-button-group { |
123 display: inline-block; } |
223 display: inline-block; } |
124 .components-button-group .components-button.is-button { |
224 .components-button-group .components-button { |
125 border-radius: 0; } |
225 border-radius: 0; |
126 .components-button-group .components-button.is-button + .components-button.is-button { |
226 display: inline-flex; |
|
227 color: #1e1e1e; |
|
228 box-shadow: inset 0 0 0 1px #1e1e1e; } |
|
229 .components-button-group .components-button + .components-button { |
127 margin-right: -1px; } |
230 margin-right: -1px; } |
128 .components-button-group .components-button.is-button:first-child { |
231 .components-button-group .components-button:first-child { |
129 border-radius: 0 3px 3px 0; } |
232 border-radius: 0 2px 2px 0; } |
130 .components-button-group .components-button.is-button:last-child { |
233 .components-button-group .components-button:last-child { |
131 border-radius: 3px 0 0 3px; } |
234 border-radius: 2px 0 0 2px; } |
132 .components-button-group .components-button.is-button:focus, .components-button-group .components-button.is-button.is-primary { |
235 .components-button-group .components-button:focus, .components-button-group .components-button.is-primary { |
133 position: relative; |
236 position: relative; |
134 z-index: 1; } |
237 z-index: 1; } |
135 .components-button-group .components-button.is-button.is-primary { |
238 .components-button-group .components-button.is-primary { |
136 box-shadow: none; } |
239 box-shadow: inset 0 0 0 1px #1e1e1e; } |
137 |
240 |
138 .components-button { |
241 .components-button { |
139 display: inline-flex; |
242 display: inline-flex; |
140 text-decoration: none; |
243 text-decoration: none; |
141 font-size: 13px; |
244 font-size: 13px; |
142 margin: 0; |
245 margin: 0; |
143 border: 0; |
246 border: 0; |
144 cursor: pointer; |
247 cursor: pointer; |
145 -webkit-appearance: none; |
248 -webkit-appearance: none; |
146 background: none; |
249 background: none; |
147 /* Buttons that look like links, for a cross of good semantics with the visual */ |
250 transition: box-shadow 0.1s linear; |
148 /* Link buttons that are red to indicate destructive behavior. */ } |
251 height: 36px; |
149 .components-button.is-button { |
252 align-items: center; |
150 padding: 0 10px 1px; |
253 box-sizing: border-box; |
151 line-height: 26px; |
254 padding: 6px 12px; |
152 height: 28px; |
255 border-radius: 2px; |
153 border-radius: 3px; |
256 color: #1e1e1e; |
|
257 /** |
|
258 * Primary button style. |
|
259 */ |
|
260 /** |
|
261 * Secondary and tertiary buttons. |
|
262 */ |
|
263 /** |
|
264 * Secondary button style. |
|
265 */ |
|
266 /** |
|
267 * Tertiary buttons. |
|
268 */ |
|
269 /** |
|
270 * Link buttons. |
|
271 */ |
|
272 /** |
|
273 * Buttons that indicate destructive actions. |
|
274 */ } |
|
275 @media (prefers-reduced-motion: reduce) { |
|
276 .components-button { |
|
277 transition-duration: 0s; } } |
|
278 .components-button[aria-expanded="true"], .components-button:hover { |
|
279 color: #007cba; |
|
280 color: var(--wp-admin-theme-color); } |
|
281 .components-button[aria-disabled="true"]:hover { |
|
282 color: initial; } |
|
283 .components-button:focus:not(:disabled) { |
|
284 box-shadow: 0 0 0 1.5px #007cba; |
|
285 box-shadow: 0 0 0 1.5px var(--wp-admin-theme-color); |
|
286 outline: 1px solid transparent; } |
|
287 .components-button.is-primary { |
154 white-space: nowrap; |
288 white-space: nowrap; |
155 border-width: 1px; |
289 background: #007cba; |
156 border-style: solid; } |
290 background: var(--wp-admin-theme-color); |
157 .components-button.is-default { |
|
158 color: #555; |
|
159 border-color: #ccc; |
|
160 background: #f7f7f7; |
|
161 box-shadow: inset 0 -1px 0 #ccc; |
|
162 vertical-align: top; } |
|
163 .components-button.is-default:hover { |
|
164 background: #fafafa; |
|
165 border-color: #999; |
|
166 box-shadow: inset 0 -1px 0 #999; |
|
167 color: #23282d; |
|
168 text-decoration: none; } |
|
169 .components-button.is-default:focus:enabled { |
|
170 background: #fafafa; |
|
171 color: #23282d; |
|
172 border-color: #999; |
|
173 box-shadow: inset 0 -1px 0 #999, 0 0 0 2px #bfe7f3; |
|
174 text-decoration: none; } |
|
175 .components-button.is-default:active:enabled { |
|
176 background: #eee; |
|
177 border-color: #999; |
|
178 box-shadow: inset 0 1px 0 #999; } |
|
179 .components-button.is-default:disabled, .components-button.is-default[aria-disabled="true"] { |
|
180 color: #a0a5aa; |
|
181 border-color: #ddd; |
|
182 background: #f7f7f7; |
|
183 box-shadow: none; |
|
184 text-shadow: 0 1px 0 #fff; |
|
185 transform: none; } |
|
186 .components-button.is-primary { |
|
187 background: rgb(0, 133, 186); |
|
188 border-color: rgb(0, 106, 149) rgb(0, 100, 140) rgb(0, 100, 140); |
|
189 box-shadow: inset 0 -1px 0 rgb(0, 100, 140); |
|
190 color: #fff; |
291 color: #fff; |
191 text-decoration: none; |
292 text-decoration: none; |
192 text-shadow: 0 -1px 1px rgb(0, 93, 130), -1px 0 1px rgb(0, 93, 130), 0 1px 1px rgb(0, 93, 130), 1px 0 1px rgb(0, 93, 130); } |
293 text-shadow: none; } |
193 body.admin-color-sunrise .components-button.is-primary { |
294 .components-button.is-primary:hover:not(:disabled) { |
194 background: rgb(209, 134, 74); |
295 background: #006ba1; |
195 border-color: rgb(167, 107, 59) rgb(157, 101, 56) rgb(157, 101, 56); |
296 background: var(--wp-admin-theme-color-darker-10); |
196 box-shadow: inset 0 -1px 0 rgb(157, 101, 56); |
|
197 text-shadow: 0 -1px 1px rgb(146, 94, 52), -1px 0 1px rgb(146, 94, 52), 0 1px 1px rgb(146, 94, 52), 1px 0 1px rgb(146, 94, 52); } |
|
198 body.admin-color-ocean .components-button.is-primary { |
|
199 background: rgb(163, 185, 162); |
|
200 border-color: rgb(130, 148, 130) rgb(122, 139, 122) rgb(122, 139, 122); |
|
201 box-shadow: inset 0 -1px 0 rgb(122, 139, 122); |
|
202 text-shadow: 0 -1px 1px rgb(114, 130, 113), -1px 0 1px rgb(114, 130, 113), 0 1px 1px rgb(114, 130, 113), 1px 0 1px rgb(114, 130, 113); } |
|
203 body.admin-color-midnight .components-button.is-primary { |
|
204 background: rgb(225, 77, 67); |
|
205 border-color: rgb(180, 62, 54) rgb(169, 58, 50) rgb(169, 58, 50); |
|
206 box-shadow: inset 0 -1px 0 rgb(169, 58, 50); |
|
207 text-shadow: 0 -1px 1px rgb(158, 54, 47), -1px 0 1px rgb(158, 54, 47), 0 1px 1px rgb(158, 54, 47), 1px 0 1px rgb(158, 54, 47); } |
|
208 body.admin-color-ectoplasm .components-button.is-primary { |
|
209 background: rgb(167, 182, 86); |
|
210 border-color: rgb(134, 146, 69) rgb(125, 137, 65) rgb(125, 137, 65); |
|
211 box-shadow: inset 0 -1px 0 rgb(125, 137, 65); |
|
212 text-shadow: 0 -1px 1px rgb(117, 127, 60), -1px 0 1px rgb(117, 127, 60), 0 1px 1px rgb(117, 127, 60), 1px 0 1px rgb(117, 127, 60); } |
|
213 body.admin-color-coffee .components-button.is-primary { |
|
214 background: rgb(194, 166, 140); |
|
215 border-color: rgb(155, 133, 112) rgb(146, 125, 105) rgb(146, 125, 105); |
|
216 box-shadow: inset 0 -1px 0 rgb(146, 125, 105); |
|
217 text-shadow: 0 -1px 1px rgb(136, 116, 98), -1px 0 1px rgb(136, 116, 98), 0 1px 1px rgb(136, 116, 98), 1px 0 1px rgb(136, 116, 98); } |
|
218 body.admin-color-blue .components-button.is-primary { |
|
219 background: rgb(217, 171, 89); |
|
220 border-color: rgb(174, 137, 71) rgb(163, 128, 67) rgb(163, 128, 67); |
|
221 box-shadow: inset 0 -1px 0 rgb(163, 128, 67); |
|
222 text-shadow: 0 -1px 1px rgb(152, 120, 62), -1px 0 1px rgb(152, 120, 62), 0 1px 1px rgb(152, 120, 62), 1px 0 1px rgb(152, 120, 62); } |
|
223 body.admin-color-light .components-button.is-primary { |
|
224 background: rgb(0, 133, 186); |
|
225 border-color: rgb(0, 106, 149) rgb(0, 100, 140) rgb(0, 100, 140); |
|
226 box-shadow: inset 0 -1px 0 rgb(0, 100, 140); |
|
227 text-shadow: 0 -1px 1px rgb(0, 93, 130), -1px 0 1px rgb(0, 93, 130), 0 1px 1px rgb(0, 93, 130), 1px 0 1px rgb(0, 93, 130); } |
|
228 .components-button.is-primary:hover, .components-button.is-primary:focus:enabled { |
|
229 background: rgb(0, 126, 177); |
|
230 border-color: rgb(0, 67, 93); |
|
231 color: #fff; } |
297 color: #fff; } |
232 body.admin-color-sunrise .components-button.is-primary:hover, body.admin-color-sunrise .components-button.is-primary:focus:enabled { |
298 .components-button.is-primary:active:not(:disabled) { |
233 background: rgb(199, 127, 70); |
299 background: #005a87; |
234 border-color: rgb(105, 67, 37); } |
300 background: var(--wp-admin-theme-color-darker-20); |
235 body.admin-color-ocean .components-button.is-primary:hover, body.admin-color-ocean .components-button.is-primary:focus:enabled { |
301 border-color: #005a87; |
236 background: rgb(155, 176, 154); |
302 border-color: var(--wp-admin-theme-color-darker-20); |
237 border-color: rgb(82, 93, 81); } |
303 color: #fff; } |
238 body.admin-color-midnight .components-button.is-primary:hover, body.admin-color-midnight .components-button.is-primary:focus:enabled { |
304 .components-button.is-primary:focus:not(:disabled) { |
239 background: rgb(214, 73, 64); |
305 box-shadow: inset 0 0 0 1px #fff, 0 0 0 1.5px #007cba; |
240 border-color: rgb(113, 39, 34); } |
306 box-shadow: inset 0 0 0 1px #fff, 0 0 0 1.5px var(--wp-admin-theme-color); |
241 body.admin-color-ectoplasm .components-button.is-primary:hover, body.admin-color-ectoplasm .components-button.is-primary:focus:enabled { |
307 outline: 1px solid transparent; } |
242 background: rgb(159, 173, 82); |
308 .components-button.is-primary:disabled, .components-button.is-primary:disabled:active:enabled, .components-button.is-primary[aria-disabled="true"], .components-button.is-primary[aria-disabled="true"]:enabled, .components-button.is-primary[aria-disabled="true"]:active:enabled { |
243 border-color: rgb(84, 91, 43); } |
309 color: rgba(255, 255, 255, 0.4); |
244 body.admin-color-coffee .components-button.is-primary:hover, body.admin-color-coffee .components-button.is-primary:focus:enabled { |
310 background: #007cba; |
245 background: rgb(184, 158, 133); |
311 background: var(--wp-admin-theme-color); |
246 border-color: rgb(97, 83, 70); } |
312 border-color: #007cba; |
247 body.admin-color-blue .components-button.is-primary:hover, body.admin-color-blue .components-button.is-primary:focus:enabled { |
313 border-color: var(--wp-admin-theme-color); |
248 background: rgb(206, 162, 85); |
314 opacity: 1; } |
249 border-color: rgb(109, 86, 45); } |
315 .components-button.is-primary:disabled:focus:enabled, .components-button.is-primary:disabled:active:enabled:focus:enabled, .components-button.is-primary[aria-disabled="true"]:focus:enabled, .components-button.is-primary[aria-disabled="true"]:enabled:focus:enabled, .components-button.is-primary[aria-disabled="true"]:active:enabled:focus:enabled { |
250 body.admin-color-light .components-button.is-primary:hover, body.admin-color-light .components-button.is-primary:focus:enabled { |
316 box-shadow: 0 0 0 1px #fff, 0 0 0 3px #007cba; |
251 background: rgb(0, 126, 177); |
317 box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--wp-admin-theme-color); } |
252 border-color: rgb(0, 67, 93); } |
|
253 .components-button.is-primary:hover { |
|
254 box-shadow: inset 0 -1px 0 rgb(0, 67, 93); } |
|
255 body.admin-color-sunrise .components-button.is-primary:hover { |
|
256 box-shadow: inset 0 -1px 0 rgb(105, 67, 37); } |
|
257 body.admin-color-ocean .components-button.is-primary:hover { |
|
258 box-shadow: inset 0 -1px 0 rgb(82, 93, 81); } |
|
259 body.admin-color-midnight .components-button.is-primary:hover { |
|
260 box-shadow: inset 0 -1px 0 rgb(113, 39, 34); } |
|
261 body.admin-color-ectoplasm .components-button.is-primary:hover { |
|
262 box-shadow: inset 0 -1px 0 rgb(84, 91, 43); } |
|
263 body.admin-color-coffee .components-button.is-primary:hover { |
|
264 box-shadow: inset 0 -1px 0 rgb(97, 83, 70); } |
|
265 body.admin-color-blue .components-button.is-primary:hover { |
|
266 box-shadow: inset 0 -1px 0 rgb(109, 86, 45); } |
|
267 body.admin-color-light .components-button.is-primary:hover { |
|
268 box-shadow: inset 0 -1px 0 rgb(0, 67, 93); } |
|
269 .components-button.is-primary:focus:enabled { |
|
270 box-shadow: inset 0 -1px 0 rgb(0, 67, 93), 0 0 0 2px #bfe7f3; } |
|
271 body.admin-color-sunrise .components-button.is-primary:focus:enabled { |
|
272 box-shadow: inset 0 -1px 0 rgb(105, 67, 37), 0 0 0 2px #bfe7f3; } |
|
273 body.admin-color-ocean .components-button.is-primary:focus:enabled { |
|
274 box-shadow: inset 0 -1px 0 rgb(82, 93, 81), 0 0 0 2px #bfe7f3; } |
|
275 body.admin-color-midnight .components-button.is-primary:focus:enabled { |
|
276 box-shadow: inset 0 -1px 0 rgb(113, 39, 34), 0 0 0 2px #bfe7f3; } |
|
277 body.admin-color-ectoplasm .components-button.is-primary:focus:enabled { |
|
278 box-shadow: inset 0 -1px 0 rgb(84, 91, 43), 0 0 0 2px #bfe7f3; } |
|
279 body.admin-color-coffee .components-button.is-primary:focus:enabled { |
|
280 box-shadow: inset 0 -1px 0 rgb(97, 83, 70), 0 0 0 2px #bfe7f3; } |
|
281 body.admin-color-blue .components-button.is-primary:focus:enabled { |
|
282 box-shadow: inset 0 -1px 0 rgb(109, 86, 45), 0 0 0 2px #bfe7f3; } |
|
283 body.admin-color-light .components-button.is-primary:focus:enabled { |
|
284 box-shadow: inset 0 -1px 0 rgb(0, 67, 93), 0 0 0 2px #bfe7f3; } |
|
285 .components-button.is-primary:active:enabled { |
|
286 background: rgb(0, 106, 149); |
|
287 border-color: rgb(0, 67, 93); |
|
288 box-shadow: inset 0 1px 0 rgb(0, 67, 93); |
|
289 vertical-align: top; } |
|
290 body.admin-color-sunrise .components-button.is-primary:active:enabled { |
|
291 background: rgb(167, 107, 59); |
|
292 border-color: rgb(105, 67, 37); |
|
293 box-shadow: inset 0 1px 0 rgb(105, 67, 37); } |
|
294 body.admin-color-ocean .components-button.is-primary:active:enabled { |
|
295 background: rgb(130, 148, 130); |
|
296 border-color: rgb(82, 93, 81); |
|
297 box-shadow: inset 0 1px 0 rgb(82, 93, 81); } |
|
298 body.admin-color-midnight .components-button.is-primary:active:enabled { |
|
299 background: rgb(180, 62, 54); |
|
300 border-color: rgb(113, 39, 34); |
|
301 box-shadow: inset 0 1px 0 rgb(113, 39, 34); } |
|
302 body.admin-color-ectoplasm .components-button.is-primary:active:enabled { |
|
303 background: rgb(134, 146, 69); |
|
304 border-color: rgb(84, 91, 43); |
|
305 box-shadow: inset 0 1px 0 rgb(84, 91, 43); } |
|
306 body.admin-color-coffee .components-button.is-primary:active:enabled { |
|
307 background: rgb(155, 133, 112); |
|
308 border-color: rgb(97, 83, 70); |
|
309 box-shadow: inset 0 1px 0 rgb(97, 83, 70); } |
|
310 body.admin-color-blue .components-button.is-primary:active:enabled { |
|
311 background: rgb(174, 137, 71); |
|
312 border-color: rgb(109, 86, 45); |
|
313 box-shadow: inset 0 1px 0 rgb(109, 86, 45); } |
|
314 body.admin-color-light .components-button.is-primary:active:enabled { |
|
315 background: rgb(0, 106, 149); |
|
316 border-color: rgb(0, 67, 93); |
|
317 box-shadow: inset 0 1px 0 rgb(0, 67, 93); } |
|
318 .components-button.is-primary:disabled, .components-button.is-primary[aria-disabled="true"] { |
|
319 color: rgb(77, 170, 207); |
|
320 background: rgb(0, 93, 130); |
|
321 border-color: rgb(0, 106, 149); |
|
322 box-shadow: none; |
|
323 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1); } |
|
324 body.admin-color-sunrise .components-button.is-primary:disabled, body.admin-color-sunrise .components-button.is-primary[aria-disabled="true"] { |
|
325 color: rgb(223, 170, 128); |
|
326 background: rgb(146, 94, 52); |
|
327 border-color: rgb(167, 107, 59); } |
|
328 body.admin-color-ocean .components-button.is-primary:disabled, body.admin-color-ocean .components-button.is-primary[aria-disabled="true"] { |
|
329 color: rgb(191, 206, 190); |
|
330 background: rgb(114, 130, 113); |
|
331 border-color: rgb(130, 148, 130); } |
|
332 body.admin-color-midnight .components-button.is-primary:disabled, body.admin-color-midnight .components-button.is-primary[aria-disabled="true"] { |
|
333 color: rgb(234, 130, 123); |
|
334 background: rgb(158, 54, 47); |
|
335 border-color: rgb(180, 62, 54); } |
|
336 body.admin-color-ectoplasm .components-button.is-primary:disabled, body.admin-color-ectoplasm .components-button.is-primary[aria-disabled="true"] { |
|
337 color: rgb(193, 204, 137); |
|
338 background: rgb(117, 127, 60); |
|
339 border-color: rgb(134, 146, 69); } |
|
340 body.admin-color-coffee .components-button.is-primary:disabled, body.admin-color-coffee .components-button.is-primary[aria-disabled="true"] { |
|
341 color: rgb(212, 193, 175); |
|
342 background: rgb(136, 116, 98); |
|
343 border-color: rgb(155, 133, 112); } |
|
344 body.admin-color-blue .components-button.is-primary:disabled, body.admin-color-blue .components-button.is-primary[aria-disabled="true"] { |
|
345 color: rgb(228, 196, 139); |
|
346 background: rgb(152, 120, 62); |
|
347 border-color: rgb(174, 137, 71); } |
|
348 body.admin-color-light .components-button.is-primary:disabled, body.admin-color-light .components-button.is-primary[aria-disabled="true"] { |
|
349 color: rgb(77, 170, 207); |
|
350 background: rgb(0, 93, 130); |
|
351 border-color: rgb(0, 106, 149); } |
|
352 .components-button.is-primary.is-busy, .components-button.is-primary.is-busy:disabled, .components-button.is-primary.is-busy[aria-disabled="true"] { |
318 .components-button.is-primary.is-busy, .components-button.is-primary.is-busy:disabled, .components-button.is-primary.is-busy[aria-disabled="true"] { |
353 color: #fff; |
319 color: #fff; |
354 background-size: 100px 100%; |
320 background-size: 100px 100%; |
355 /* stylelint-disable */ |
321 /* stylelint-disable */ |
356 background-image: linear-gradient(45deg, #0085ba 28%, rgb(0, 93, 130) 28%, rgb(0, 93, 130) 72%, #0085ba 72%); |
322 background-image: linear-gradient(45deg, #007cba 28%, #005a87 28%, #005a87 72%, #007cba 72%); |
|
323 background-image: linear-gradient(45deg, var(--wp-admin-theme-color) 28%, var(--wp-admin-theme-color-darker-20) 28%, var(--wp-admin-theme-color-darker-20) 72%, var(--wp-admin-theme-color) 72%); |
357 /* stylelint-enable */ |
324 /* stylelint-enable */ |
358 border-color: rgb(0, 67, 93); } |
325 border-color: #007cba; |
359 body.admin-color-sunrise .components-button.is-primary.is-busy, body.admin-color-sunrise .components-button.is-primary.is-busy:disabled, body.admin-color-sunrise .components-button.is-primary.is-busy[aria-disabled="true"] { |
326 border-color: var(--wp-admin-theme-color); } |
360 background-image: linear-gradient(45deg, #d1864a 28%, rgb(146, 94, 52) 28%, rgb(146, 94, 52) 72%, #d1864a 72%); |
327 .components-button.is-secondary:active:not(:disabled), .components-button.is-tertiary:active:not(:disabled) { |
361 border-color: rgb(105, 67, 37); } |
328 background: #ddd; |
362 body.admin-color-ocean .components-button.is-primary.is-busy, body.admin-color-ocean .components-button.is-primary.is-busy:disabled, body.admin-color-ocean .components-button.is-primary.is-busy[aria-disabled="true"] { |
329 color: #006ba1; |
363 background-image: linear-gradient(45deg, #a3b9a2 28%, rgb(114, 130, 113) 28%, rgb(114, 130, 113) 72%, #a3b9a2 72%); |
330 color: var(--wp-admin-theme-color-darker-10); |
364 border-color: rgb(82, 93, 81); } |
331 box-shadow: none; } |
365 body.admin-color-midnight .components-button.is-primary.is-busy, body.admin-color-midnight .components-button.is-primary.is-busy:disabled, body.admin-color-midnight .components-button.is-primary.is-busy[aria-disabled="true"] { |
332 .components-button.is-secondary:hover:not(:disabled), .components-button.is-tertiary:hover:not(:disabled) { |
366 background-image: linear-gradient(45deg, #e14d43 28%, rgb(158, 54, 47) 28%, rgb(158, 54, 47) 72%, #e14d43 72%); |
333 color: #006ba1; |
367 border-color: rgb(113, 39, 34); } |
334 color: var(--wp-admin-theme-color-darker-10); |
368 body.admin-color-ectoplasm .components-button.is-primary.is-busy, body.admin-color-ectoplasm .components-button.is-primary.is-busy:disabled, body.admin-color-ectoplasm .components-button.is-primary.is-busy[aria-disabled="true"] { |
335 box-shadow: inset 0 0 0 1px #006ba1; |
369 background-image: linear-gradient(45deg, #a7b656 28%, rgb(117, 127, 60) 28%, rgb(117, 127, 60) 72%, #a7b656 72%); |
336 box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color-darker-10); } |
370 border-color: rgb(84, 91, 43); } |
337 .components-button.is-secondary:disabled, .components-button.is-secondary[aria-disabled="true"], .components-button.is-secondary[aria-disabled="true"]:hover, .components-button.is-tertiary:disabled, .components-button.is-tertiary[aria-disabled="true"], .components-button.is-tertiary[aria-disabled="true"]:hover { |
371 body.admin-color-coffee .components-button.is-primary.is-busy, body.admin-color-coffee .components-button.is-primary.is-busy:disabled, body.admin-color-coffee .components-button.is-primary.is-busy[aria-disabled="true"] { |
338 color: #828282; |
372 background-image: linear-gradient(45deg, #c2a68c 28%, rgb(136, 116, 98) 28%, rgb(136, 116, 98) 72%, #c2a68c 72%); |
339 background: #eaeaea; |
373 border-color: rgb(97, 83, 70); } |
340 transform: none; |
374 body.admin-color-blue .components-button.is-primary.is-busy, body.admin-color-blue .components-button.is-primary.is-busy:disabled, body.admin-color-blue .components-button.is-primary.is-busy[aria-disabled="true"] { |
341 opacity: 1; |
375 background-image: linear-gradient(45deg, #82b4cb 28%, rgb(91, 126, 142) 28%, rgb(91, 126, 142) 72%, #82b4cb 72%); |
342 box-shadow: none; } |
376 border-color: rgb(65, 90, 102); } |
343 .components-button.is-secondary { |
377 body.admin-color-light .components-button.is-primary.is-busy, body.admin-color-light .components-button.is-primary.is-busy:disabled, body.admin-color-light .components-button.is-primary.is-busy[aria-disabled="true"] { |
344 box-shadow: inset 0 0 0 1px #007cba; |
378 background-image: linear-gradient(45deg, #0085ba 28%, rgb(0, 93, 130) 28%, rgb(0, 93, 130) 72%, #0085ba 72%); |
345 box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color); |
379 border-color: rgb(0, 67, 93); } |
346 outline: 1px solid transparent; |
|
347 white-space: nowrap; |
|
348 color: #007cba; |
|
349 color: var(--wp-admin-theme-color); |
|
350 background: transparent; } |
|
351 .components-button.is-tertiary { |
|
352 white-space: nowrap; |
|
353 color: #007cba; |
|
354 color: var(--wp-admin-theme-color); |
|
355 background: transparent; |
|
356 padding: 6px; |
|
357 outline: 1px dotted transparent; } |
|
358 .components-button.is-tertiary .dashicon { |
|
359 display: inline-block; |
|
360 flex: 0 0 auto; } |
380 .components-button.is-link { |
361 .components-button.is-link { |
381 margin: 0; |
362 margin: 0; |
382 padding: 0; |
363 padding: 0; |
383 box-shadow: none; |
364 box-shadow: none; |
384 border: 0; |
365 border: 0; |
389 /* Mimics the default link style in common.css */ |
370 /* Mimics the default link style in common.css */ |
390 color: #0073aa; |
371 color: #0073aa; |
391 text-decoration: underline; |
372 text-decoration: underline; |
392 transition-property: border, background, color; |
373 transition-property: border, background, color; |
393 transition-duration: 0.05s; |
374 transition-duration: 0.05s; |
394 transition-timing-function: ease-in-out; } |
375 transition-timing-function: ease-in-out; |
395 .components-button.is-link:hover, .components-button.is-link:active { |
376 height: auto; } |
|
377 @media (prefers-reduced-motion: reduce) { |
|
378 .components-button.is-link { |
|
379 transition-duration: 0s; } } |
|
380 .components-button.is-link:hover:not(:disabled), .components-button.is-link:active:not(:disabled) { |
396 color: #00a0d2; } |
381 color: #00a0d2; } |
397 .components-button.is-link:focus { |
382 .components-button.is-link:focus { |
398 color: #124964; |
383 color: #124964; |
399 box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, 0.8); } |
384 box-shadow: 0 0 0 1px #5b9dd9, 0 0 1.5px 1px rgba(30, 140, 190, 0.8); } |
400 .components-button.is-link.is-destructive { |
385 .components-button.is-destructive { |
401 color: #d94f4f; } |
386 color: #b52727; } |
402 .components-button:active { |
387 .components-button.is-destructive.is-secondary { |
403 color: currentColor; } |
388 box-shadow: inset 0 0 0 1px #b52727; } |
|
389 .components-button.is-destructive:hover:not(:disabled), .components-button.is-destructive:active:not(:disabled) { |
|
390 color: #a02222; |
|
391 box-shadow: inset 0 0 0 1px #a02222; } |
|
392 .components-button.is-destructive:focus:not(:disabled) { |
|
393 box-shadow: inset 0 0 0 1px #fff, 0 0 0 1.5px #a02222; } |
|
394 .components-button:not([aria-disabled="true"]):active { |
|
395 color: inherit; } |
404 .components-button:disabled, .components-button[aria-disabled="true"] { |
396 .components-button:disabled, .components-button[aria-disabled="true"] { |
405 cursor: default; |
397 cursor: default; |
406 opacity: 0.3; } |
398 opacity: 0.3; } |
407 .components-button:focus:enabled { |
399 .components-button.is-busy, .components-button.is-secondary.is-busy, .components-button.is-secondary.is-busy:disabled, .components-button.is-secondary.is-busy[aria-disabled="true"] { |
408 background-color: #fff; |
|
409 color: #191e23; |
|
410 box-shadow: inset 0 0 0 1px #6c7781, inset 0 0 0 2px #fff; |
|
411 outline: 2px solid transparent; |
|
412 outline-offset: -2px; } |
|
413 .components-button.is-busy, .components-button.is-default.is-busy, .components-button.is-default.is-busy:disabled, .components-button.is-default.is-busy[aria-disabled="true"] { |
|
414 animation: components-button__busy-animation 2500ms infinite linear; |
400 animation: components-button__busy-animation 2500ms infinite linear; |
|
401 opacity: 1; |
415 background-size: 100px 100%; |
402 background-size: 100px 100%; |
416 background-image: repeating-linear-gradient(45deg, #e2e4e7, #fff 11px, #fff 10px, #e2e4e7 20px); |
403 /* stylelint-disable */ |
417 opacity: 1; } |
404 background-image: linear-gradient(45deg, #fafafa 28%, #e0e0e0 28%, #e0e0e0 72%, #fafafa 72%); |
418 .components-button.is-large { |
405 /* stylelint-enable */ } |
419 height: 30px; |
|
420 line-height: 28px; |
|
421 padding: 0 12px 2px; } |
|
422 .components-button.is-small { |
406 .components-button.is-small { |
423 height: 24px; |
407 height: 24px; |
424 line-height: 22px; |
408 line-height: 22px; |
425 padding: 0 8px 1px; |
409 padding: 0 8px; |
426 font-size: 11px; } |
410 font-size: 11px; } |
427 .components-button.is-tertiary { |
411 .components-button.is-small.has-icon:not(.has-text) { |
428 color: #007cba; |
412 padding: 0 8px; |
429 padding: 0 10px; |
413 width: 24px; } |
430 line-height: 26px; |
414 .components-button.has-icon { |
431 height: 28px; } |
415 padding: 6px; |
432 body.admin-color-sunrise .components-button.is-tertiary { |
416 min-width: 36px; |
433 color: #837425; } |
417 justify-content: center; } |
434 body.admin-color-ocean .components-button.is-tertiary { |
418 .components-button.has-icon .dashicon { |
435 color: #5e7d5e; } |
|
436 body.admin-color-midnight .components-button.is-tertiary { |
|
437 color: #497b8d; } |
|
438 body.admin-color-ectoplasm .components-button.is-tertiary { |
|
439 color: #523f6d; } |
|
440 body.admin-color-coffee .components-button.is-tertiary { |
|
441 color: #59524c; } |
|
442 body.admin-color-blue .components-button.is-tertiary { |
|
443 color: #417e9B; } |
|
444 body.admin-color-light .components-button.is-tertiary { |
|
445 color: #007cba; } |
|
446 .components-button.is-tertiary .dashicon { |
|
447 display: inline-block; |
419 display: inline-block; |
448 flex: 0 0 auto; } |
420 flex: 0 0 auto; } |
449 .components-button.is-tertiary svg { |
421 .components-button.has-icon.has-text { |
450 fill: currentColor; |
422 justify-content: left; } |
451 outline: none; } |
423 .components-button.has-icon.has-text svg { |
452 .components-button.is-tertiary:active:focus:enabled { |
424 margin-left: 8px; } |
453 box-shadow: none; } |
425 .components-button.is-pressed { |
454 .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover { |
426 color: #fff; |
455 color: rgb(0, 93, 140); } |
427 background: #1e1e1e; } |
456 body.admin-color-sunrise .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover { |
428 .components-button.is-pressed:focus:not(:disabled) { |
457 color: rgb(98, 87, 28); } |
429 box-shadow: inset 0 0 0 1px #fff, 0 0 0 1.5px #007cba; |
458 body.admin-color-ocean .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover { |
430 box-shadow: inset 0 0 0 1px #fff, 0 0 0 1.5px var(--wp-admin-theme-color); |
459 color: rgb(71, 94, 71); } |
431 outline: 2px solid transparent; } |
460 body.admin-color-midnight .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover { |
432 .components-button.is-pressed:hover:not(:disabled) { |
461 color: rgb(55, 92, 106); } |
433 background: #1e1e1e; } |
462 body.admin-color-ectoplasm .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover { |
434 .components-button svg { |
463 color: rgb(62, 47, 82); } |
435 fill: currentColor; |
464 body.admin-color-coffee .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover { |
436 outline: none; } |
465 color: rgb(67, 62, 57); } |
437 .components-button .components-visually-hidden { |
466 body.admin-color-blue .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover { |
|
467 color: rgb(49, 95, 116); } |
|
468 body.admin-color-light .components-button.is-tertiary:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover { |
|
469 color: rgb(0, 93, 140); } |
|
470 .components-button .screen-reader-text { |
|
471 height: auto; } |
438 height: auto; } |
472 |
439 |
473 @keyframes components-button__busy-animation { |
440 @keyframes components-button__busy-animation { |
474 0% { |
441 0% { |
475 background-position: 200px 0; } } |
442 background-position: 200px 0; } } |
476 |
443 |
477 .components-checkbox-control__input[type="checkbox"] { |
444 .components-checkbox-control__input[type="checkbox"] { |
478 margin-top: 0; } |
445 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
479 |
446 padding: 6px 8px; |
480 .component-color-indicator { |
447 box-shadow: 0 0 0 transparent; |
481 width: 25px; |
448 transition: box-shadow 0.1s linear; |
482 height: 16px; |
449 border-radius: 2px; |
483 margin-right: 0.8rem; |
450 border: 1px solid #757575; |
484 border: 1px solid #dadada; |
451 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
485 display: inline-block; } |
452 font-size: 16px; |
486 .component-color-indicator + .component-color-indicator { |
453 /* Override core line-height. To be reviewed. */ |
487 margin-right: 0.5rem; } |
454 line-height: normal; |
488 |
455 border: 1px solid #1e1e1e; |
489 .components-color-palette { |
456 margin-left: 12px; |
490 margin-left: -14px; |
457 transition: none; |
491 width: calc(100% + 14px); } |
458 border-radius: 2px; |
492 .components-color-palette .components-color-palette__custom-clear-wrapper { |
459 background: #fff; |
493 width: calc(100% - 14px); |
460 color: #1e1e1e; |
|
461 clear: none; |
|
462 cursor: pointer; |
|
463 display: inline-block; |
|
464 line-height: 0; |
|
465 margin: 0 0 0 4px; |
|
466 outline: 0; |
|
467 padding: 0 !important; |
|
468 text-align: center; |
|
469 vertical-align: top; |
|
470 width: 24px; |
|
471 height: 24px; |
|
472 -webkit-appearance: none; |
|
473 appearance: none; |
|
474 transition: 0.1s border-color ease-in-out; } |
|
475 @media (prefers-reduced-motion: reduce) { |
|
476 .components-checkbox-control__input[type="checkbox"] { |
|
477 transition-duration: 0s; } } |
|
478 @media (min-width: 600px) { |
|
479 .components-checkbox-control__input[type="checkbox"] { |
|
480 font-size: 13px; |
|
481 /* Override core line-height. To be reviewed. */ |
|
482 line-height: normal; } } |
|
483 .components-checkbox-control__input[type="checkbox"]:focus { |
|
484 border-color: #007cba; |
|
485 border-color: var(--wp-admin-theme-color); |
|
486 box-shadow: 0 0 0 0.5px #007cba; |
|
487 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
|
488 outline: 2px solid transparent; } |
|
489 .components-checkbox-control__input[type="checkbox"]::-webkit-input-placeholder { |
|
490 color: rgba(30, 30, 30, 0.62); } |
|
491 .components-checkbox-control__input[type="checkbox"]::-moz-placeholder { |
|
492 opacity: 1; |
|
493 color: rgba(30, 30, 30, 0.62); } |
|
494 .components-checkbox-control__input[type="checkbox"]:-ms-input-placeholder { |
|
495 color: rgba(30, 30, 30, 0.62); } |
|
496 .is-dark-theme .components-checkbox-control__input[type="checkbox"]::-webkit-input-placeholder { |
|
497 color: rgba(255, 255, 255, 0.65); } |
|
498 .is-dark-theme .components-checkbox-control__input[type="checkbox"]::-moz-placeholder { |
|
499 opacity: 1; |
|
500 color: rgba(255, 255, 255, 0.65); } |
|
501 .is-dark-theme .components-checkbox-control__input[type="checkbox"]:-ms-input-placeholder { |
|
502 color: rgba(255, 255, 255, 0.65); } |
|
503 .components-checkbox-control__input[type="checkbox"]:focus { |
|
504 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #007cba; |
|
505 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--wp-admin-theme-color); |
|
506 outline: 2px solid transparent; } |
|
507 .components-checkbox-control__input[type="checkbox"]:checked { |
|
508 background: #007cba; |
|
509 background: var(--wp-admin-theme-color); |
|
510 border-color: #007cba; |
|
511 border-color: var(--wp-admin-theme-color); } |
|
512 .components-checkbox-control__input[type="checkbox"]:checked::-ms-check { |
|
513 opacity: 0; } |
|
514 .components-checkbox-control__input[type="checkbox"]:checked::before, .components-checkbox-control__input[type="checkbox"][aria-checked="mixed"]::before { |
|
515 margin: -3px -5px; |
|
516 color: #fff; } |
|
517 @media (min-width: 782px) { |
|
518 .components-checkbox-control__input[type="checkbox"]:checked::before, .components-checkbox-control__input[type="checkbox"][aria-checked="mixed"]::before { |
|
519 margin: -4px -5px 0 0; } } |
|
520 .components-checkbox-control__input[type="checkbox"][aria-checked="mixed"] { |
|
521 background: #007cba; |
|
522 background: var(--wp-admin-theme-color); |
|
523 border-color: #007cba; |
|
524 border-color: var(--wp-admin-theme-color); } |
|
525 .components-checkbox-control__input[type="checkbox"][aria-checked="mixed"]::before { |
|
526 content: "\f460"; |
|
527 float: right; |
|
528 display: inline-block; |
|
529 vertical-align: middle; |
|
530 width: 16px; |
|
531 /* stylelint-disable */ |
|
532 font: normal 30px/1 dashicons; |
|
533 /* stylelint-enable */ |
|
534 speak: none; |
|
535 -webkit-font-smoothing: antialiased; |
|
536 -moz-osx-font-smoothing: grayscale; } |
|
537 @media (min-width: 782px) { |
|
538 .components-checkbox-control__input[type="checkbox"][aria-checked="mixed"]::before { |
|
539 float: none; |
|
540 font-size: 21px; } } |
|
541 @media (min-width: 600px) { |
|
542 .components-checkbox-control__input[type="checkbox"] { |
|
543 height: 20px; |
|
544 width: 20px; } } |
|
545 @media (prefers-reduced-motion: reduce) { |
|
546 .components-checkbox-control__input[type="checkbox"] { |
|
547 transition-duration: 0s; } } |
|
548 .components-checkbox-control__input[type="checkbox"]:focus { |
|
549 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #007cba; |
|
550 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--wp-admin-theme-color); |
|
551 outline: 2px solid transparent; } |
|
552 .components-checkbox-control__input[type="checkbox"]:checked { |
|
553 background: #007cba; |
|
554 background: var(--wp-admin-theme-color); |
|
555 border-color: #007cba; |
|
556 border-color: var(--wp-admin-theme-color); } |
|
557 .components-checkbox-control__input[type="checkbox"]:checked::-ms-check { |
|
558 opacity: 0; } |
|
559 .components-checkbox-control__input[type="checkbox"]:checked::before { |
|
560 content: none; } |
|
561 |
|
562 .components-checkbox-control__input-container { |
|
563 position: relative; |
|
564 display: inline-block; |
|
565 margin-left: 12px; |
|
566 vertical-align: middle; |
|
567 width: 24px; |
|
568 height: 24px; } |
|
569 @media (min-width: 600px) { |
|
570 .components-checkbox-control__input-container { |
|
571 width: 20px; |
|
572 height: 20px; } } |
|
573 |
|
574 svg.components-checkbox-control__checked { |
|
575 fill: #fff; |
|
576 cursor: pointer; |
|
577 position: absolute; |
|
578 right: 0; |
|
579 top: 0; |
|
580 width: 24px; |
|
581 height: 24px; |
|
582 -webkit-user-select: none; |
|
583 -ms-user-select: none; |
|
584 user-select: none; |
|
585 pointer-events: none; } |
|
586 @media (min-width: 600px) { |
|
587 svg.components-checkbox-control__checked { |
|
588 right: -2px; |
|
589 top: -2px; } } |
|
590 |
|
591 .components-circular-option-picker { |
|
592 display: inline-block; |
|
593 margin-top: 0.6rem; |
|
594 width: 100%; } |
|
595 .components-circular-option-picker .components-circular-option-picker__custom-clear-wrapper { |
494 display: flex; |
596 display: flex; |
495 justify-content: flex-end; } |
597 justify-content: flex-end; } |
496 |
598 |
497 .components-color-palette__item-wrapper { |
599 .components-circular-option-picker__option-wrapper { |
498 display: inline-block; |
600 display: inline-block; |
499 height: 28px; |
601 height: 28px; |
500 width: 28px; |
602 width: 28px; |
501 margin-left: 14px; |
603 margin-left: 12px; |
502 margin-bottom: 14px; |
604 margin-bottom: 12px; |
503 vertical-align: top; |
605 vertical-align: top; |
504 transform: scale(1); |
606 transform: scale(1); |
505 transition: 100ms transform ease; } |
607 transition: 100ms transform ease; } |
506 .components-color-palette__item-wrapper:hover { |
608 @media (prefers-reduced-motion: reduce) { |
|
609 .components-circular-option-picker__option-wrapper { |
|
610 transition-duration: 0s; } } |
|
611 .components-circular-option-picker__option-wrapper:hover { |
507 transform: scale(1.2); } |
612 transform: scale(1.2); } |
508 .components-color-palette__item-wrapper > div { |
613 .components-circular-option-picker__option-wrapper > div { |
509 height: 100%; |
614 height: 100%; |
510 width: 100%; } |
615 width: 100%; } |
511 |
616 |
512 .components-color-palette__item { |
617 .components-circular-option-picker__option-wrapper::before { |
|
618 content: ""; |
|
619 position: absolute; |
|
620 top: 1px; |
|
621 right: 1px; |
|
622 bottom: 1px; |
|
623 left: 1px; |
|
624 border-radius: 50%; |
|
625 z-index: -1; |
|
626 /* stylelint-disable-next-line function-url-quotes */ |
|
627 background: url('data:image/svg+xml,%3Csvg width="28" height="28" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M6 8V6H4v2h2zM8 8V6h2v2H8zM10 16H8v-2h2v2zM12 16v-2h2v2h-2zM12 18v-2h-2v2H8v2h2v-2h2zM14 18v2h-2v-2h2zM16 18h-2v-2h2v2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M18 18h2v-2h-2v-2h2v-2h-2v-2h2V8h-2v2h-2V8h-2v2h2v2h-2v2h2v2h2v2zm-2-4v-2h2v2h-2z" fill="%23555D65"/%3E%3Cpath d="M18 18v2h-2v-2h2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M8 10V8H6v2H4v2h2v2H4v2h2v2H4v2h2v2H4v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2v2h-2V4h-2v2h-2V4h-2v2h-2V4h-2v2h2v2h-2v2H8zm0 2v-2H6v2h2zm2 0v-2h2v2h-2zm0 2v-2H8v2H6v2h2v2H6v2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h-2v2h-2V6h-2v2h-2v2h2v2h-2v2h-2z" fill="%23555D65"/%3E%3Cpath fill-rule="evenodd" clip-rule="evenodd" d="M4 0H2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v2H0v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2V2h2V0h-2v2h-2V0h-2v2h-2V0h-2v2h-2V0h-2v2h-2V0h-2v2H8V0H6v2H4V0zm0 4V2H2v2h2zm2 0V2h2v2H6zm0 2V4H4v2H2v2h2v2H2v2h2v2H2v2h2v2H2v2h2v2H2v2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h2v2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2v-2h-2v-2h2V8h-2V6h2V4h-2V2h-2v2h-2V2h-2v2h-2V2h-2v2h-2V2h-2v2H8v2H6z" fill="%23555D65"/%3E%3C/svg%3E'); } |
|
628 |
|
629 .components-circular-option-picker__option { |
513 display: inline-block; |
630 display: inline-block; |
514 vertical-align: top; |
631 vertical-align: top; |
515 height: 100%; |
632 height: 100%; |
516 width: 100%; |
633 width: 100%; |
517 border: none; |
634 border: none; |
518 border-radius: 50%; |
635 border-radius: 50%; |
519 background: transparent; |
636 background: transparent; |
520 box-shadow: inset 0 0 0 14px; |
637 box-shadow: inset 0 0 0 14px; |
521 transition: 100ms box-shadow ease; |
638 transition: 100ms box-shadow ease; |
522 cursor: pointer; } |
639 cursor: pointer; } |
523 .components-color-palette__item.is-active { |
640 @media (prefers-reduced-motion: reduce) { |
|
641 .components-circular-option-picker__option { |
|
642 transition-duration: 0s; } } |
|
643 .components-circular-option-picker__option:hover { |
|
644 box-shadow: inset 0 0 0 14px !important; } |
|
645 .components-circular-option-picker__option.is-pressed { |
524 box-shadow: inset 0 0 0 4px; |
646 box-shadow: inset 0 0 0 4px; |
525 position: relative; |
647 position: relative; |
526 z-index: 1; } |
648 z-index: 1; |
527 .components-color-palette__item.is-active + .dashicons-saved { |
649 overflow: visible; } |
|
650 .components-circular-option-picker__option.is-pressed + svg { |
528 position: absolute; |
651 position: absolute; |
529 right: 4px; |
652 right: 2px; |
530 top: 4px; } |
653 top: 2px; |
531 .components-color-palette__item::after { |
654 border-radius: 50%; |
|
655 z-index: 2; |
|
656 pointer-events: none; } |
|
657 .components-circular-option-picker__option::after { |
532 content: ""; |
658 content: ""; |
533 position: absolute; |
659 position: absolute; |
534 top: 0; |
660 top: -1px; |
535 right: 0; |
661 right: -1px; |
536 bottom: 0; |
662 bottom: -1px; |
537 left: 0; |
663 left: -1px; |
538 border-radius: 50%; |
664 border-radius: 50%; |
539 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2); } |
665 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2); |
540 .components-color-palette__item:focus { |
666 border: 1px solid transparent; } |
|
667 .components-circular-option-picker__option:focus::after { |
|
668 content: ""; |
|
669 border: 2px solid #606a73; |
|
670 width: 32px; |
|
671 height: 32px; |
|
672 position: absolute; |
|
673 top: -2px; |
|
674 right: -2px; |
|
675 border-radius: 50%; |
|
676 box-shadow: inset 0 0 0 2px #fff; } |
|
677 .components-circular-option-picker__option.components-button:focus { |
|
678 background-color: transparent; |
|
679 box-shadow: inset 0 0 0 14px; |
541 outline: none; } |
680 outline: none; } |
542 .components-color-palette__item:focus::after { |
681 |
543 content: ""; |
682 .components-circular-option-picker__button-action .components-circular-option-picker__option { |
544 position: absolute; |
|
545 border: 2px solid #606a73; |
|
546 width: 32px; |
|
547 height: 32px; |
|
548 position: absolute; |
|
549 top: -2px; |
|
550 right: -2px; |
|
551 border-radius: 50%; |
|
552 box-shadow: inset 0 0 0 2px #fff; } |
|
553 |
|
554 .components-color-palette__clear-color .components-color-palette__item { |
|
555 color: #fff; |
683 color: #fff; |
556 background: #fff; } |
684 background: #fff; } |
557 |
685 |
558 .components-color-palette__clear-color-line { |
686 .components-circular-option-picker__dropdown-link-action { |
559 display: block; |
|
560 position: absolute; |
|
561 border: 2px solid #d94f4f; |
|
562 border-radius: 50%; |
|
563 top: 0; |
|
564 right: 0; |
|
565 bottom: 0; |
|
566 left: 0; } |
|
567 .components-color-palette__clear-color-line::before { |
|
568 position: absolute; |
|
569 top: 0; |
|
570 right: 0; |
|
571 content: ""; |
|
572 width: 100%; |
|
573 height: 100%; |
|
574 border-bottom: 2px solid #d94f4f; |
|
575 transform: rotate(-45deg) translateY(-13px) translateX(1px); } |
|
576 |
|
577 .components-color-palette__custom-color { |
|
578 margin-left: 16px; } |
687 margin-left: 16px; } |
579 .components-color-palette__custom-color .components-button { |
688 .components-circular-option-picker__dropdown-link-action .components-button { |
580 line-height: 22px; } |
689 line-height: 22px; } |
581 |
690 |
582 .block-editor__container .components-popover.components-color-palette__picker.is-bottom { |
691 .component-color-indicator { |
583 z-index: 100001; } |
692 width: 25px; |
|
693 height: 16px; |
|
694 margin-right: 0.8rem; |
|
695 border: 1px solid #dadada; |
|
696 display: inline-block; } |
|
697 .component-color-indicator + .component-color-indicator { |
|
698 margin-right: 0.5rem; } |
584 |
699 |
585 /** |
700 /** |
586 * Parts of this source were derived and modified from react-color, |
701 * Parts of this source were derived and modified from react-color, |
587 * released under the MIT license. |
702 * released under the MIT license. |
588 * |
703 * |
716 margin: 0 3px; |
835 margin: 0 3px; |
717 height: 100%; |
836 height: 100%; |
718 padding: 0 2px; } |
837 padding: 0 2px; } |
719 |
838 |
720 .components-color-picker__hue-gradient { |
839 .components-color-picker__hue-gradient { |
721 background: linear-gradient(to left, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%); } |
840 background: linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%); } |
722 |
841 |
723 .components-color-picker__hue-pointer, |
842 .components-color-picker__hue-pointer, |
724 .components-color-picker__alpha-pointer { |
843 .components-color-picker__alpha-pointer { |
725 right: 0; |
844 left: 0; |
726 width: 14px; |
845 width: 14px; |
727 height: 14px; |
846 height: 14px; |
728 border-radius: 50%; |
847 border-radius: 50%; |
729 box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37); |
848 box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37); |
730 background: #fff; |
849 background: #fff; |
731 transform: translate(7px, -1px); } |
850 transform: translate(7px, -1px); } |
732 |
851 |
733 .components-color-picker__hue-pointer, |
852 .components-color-picker__hue-pointer, |
734 .components-color-picker__saturation-pointer { |
853 .components-color-picker__saturation-pointer { |
735 transition: box-shadow 0.1s linear; } |
854 transition: box-shadow 0.1s linear; } |
|
855 @media (prefers-reduced-motion: reduce) { |
|
856 .components-color-picker__hue-pointer, |
|
857 .components-color-picker__saturation-pointer { |
|
858 transition-duration: 0s; } } |
736 |
859 |
737 .components-color-picker__saturation-pointer:focus { |
860 .components-color-picker__saturation-pointer:focus { |
738 box-shadow: 0 0 0 2px #fff, 0 0 0 4px #00a0d2, 0 0 5px 0 #00a0d2, inset 0 0 1px 1px rgba(0, 0, 0, 0.3), 0 0 1px 2px rgba(0, 0, 0, 0.4); } |
861 box-shadow: 0 0 0 2px #fff, 0 0 0 4px #007cba, 0 0 5px 0 #007cba, inset 0 0 1px 1px rgba(0, 0, 0, 0.3), 0 0 1px 2px rgba(0, 0, 0, 0.4); |
|
862 box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color), 0 0 5px 0 var(--wp-admin-theme-color), inset 0 0 1px 1px rgba(0, 0, 0, 0.3), 0 0 1px 2px rgba(0, 0, 0, 0.4); } |
739 |
863 |
740 .components-color-picker__hue-pointer:focus, |
864 .components-color-picker__hue-pointer:focus, |
741 .components-color-picker__alpha-pointer:focus { |
865 .components-color-picker__alpha-pointer:focus { |
742 border-color: #00a0d2; |
866 border-color: #007cba; |
743 box-shadow: 0 0 0 2px #00a0d2, 0 0 3px 0 #00a0d2; |
867 border-color: var(--wp-admin-theme-color); |
|
868 box-shadow: 0 0 0 2px #007cba, 0 0 3px 0 #007cba; |
|
869 box-shadow: 0 0 0 2px var(--wp-admin-theme-color), 0 0 3px 0 var(--wp-admin-theme-color); |
744 outline: 2px solid transparent; |
870 outline: 2px solid transparent; |
745 outline-offset: -2px; } |
871 outline-offset: -2px; } |
746 |
872 |
747 /* INPUTS COMPONENT */ |
873 /* INPUTS COMPONENT */ |
748 .components-color-picker__inputs-wrapper { |
874 .components-color-picker__inputs-wrapper { |
749 margin: 0 -4px; |
875 margin: 0 -4px; |
750 padding-top: 16px; |
876 padding-top: 16px; |
751 display: flex; |
877 display: flex; |
752 align-items: flex-end; } |
878 align-items: flex-end; |
|
879 min-width: 255px; } |
753 .components-color-picker__inputs-wrapper fieldset { |
880 .components-color-picker__inputs-wrapper fieldset { |
754 flex: 1; } |
881 flex: 1; |
|
882 border: none; |
|
883 margin: 0; |
|
884 padding: 0; } |
755 .components-color-picker__inputs-wrapper .components-color-picker__inputs-fields .components-text-control__input[type="number"] { |
885 .components-color-picker__inputs-wrapper .components-color-picker__inputs-fields .components-text-control__input[type="number"] { |
756 padding: 2px; } |
886 padding: 6px 3px; |
|
887 margin: 0; } |
|
888 |
|
889 .components-color-picker__inputs-field { |
|
890 width: 100%; } |
757 |
891 |
758 .components-color-picker__inputs-fields { |
892 .components-color-picker__inputs-fields { |
759 display: flex; } |
893 display: flex; |
|
894 direction: ltr; |
|
895 flex-grow: 1; |
|
896 margin-left: 4px; } |
|
897 .components-color-picker__inputs-fields .components-base-control + .components-base-control { |
|
898 margin-top: 0; } |
760 .components-color-picker__inputs-fields .components-base-control__field { |
899 .components-color-picker__inputs-fields .components-base-control__field { |
761 margin: 0 4px; } |
900 margin: 0 2px; } |
|
901 |
|
902 .components-color-picker__inputs-toggle { |
|
903 height: 30px; |
|
904 padding: 0 5px; } |
|
905 |
|
906 .components-combobox-control { |
|
907 color: #555d66; |
|
908 position: relative; } |
|
909 |
|
910 .components-combobox-control__label { |
|
911 display: block; |
|
912 margin-bottom: 5px; } |
|
913 |
|
914 .components-combobox-control__button { |
|
915 border: 1px solid #7e8993; |
|
916 border-radius: 4px; |
|
917 color: #555d66; |
|
918 display: inline-block; |
|
919 min-height: 30px; |
|
920 min-width: 130px; |
|
921 position: relative; |
|
922 text-align: right; } |
|
923 .components-combobox-control__button:focus { |
|
924 border-color: #007cba; |
|
925 border-color: var(--wp-admin-theme-color); } |
|
926 .components-combobox-control__button-input { |
|
927 border: none; |
|
928 height: calc(100% - 2px); |
|
929 right: 1px; |
|
930 padding: 0 4px; |
|
931 position: absolute; |
|
932 top: 1px; |
|
933 width: calc(100% - 2px); } |
|
934 .components-combobox-control__button-button:hover { |
|
935 box-shadow: none !important; } |
|
936 .components-combobox-control__button-icon { |
|
937 height: 100%; |
|
938 padding: 0 4px; |
|
939 position: absolute; |
|
940 left: 0; |
|
941 top: 0; } |
|
942 |
|
943 .components-combobox-control__menu { |
|
944 background: #fff; |
|
945 min-width: 100%; |
|
946 padding: 0; |
|
947 position: absolute; |
|
948 z-index: 1000000; } |
|
949 |
|
950 .components-combobox-control__item { |
|
951 align-items: center; |
|
952 display: flex; |
|
953 list-style-type: none; |
|
954 padding: 10px 25px 10px 5px; } |
|
955 .components-combobox-control__item.is-highlighted { |
|
956 background: #ddd; } |
|
957 .components-combobox-control__item-icon { |
|
958 margin-right: -20px; |
|
959 margin-left: 0; } |
|
960 |
|
961 .components-custom-gradient-picker { |
|
962 margin-top: 8px; } |
|
963 |
|
964 .components-custom-gradient-picker__gradient-bar:not(.has-gradient) { |
|
965 opacity: 0.4; } |
|
966 |
|
967 .components-custom-gradient-picker__gradient-bar { |
|
968 width: 100%; |
|
969 height: 24px; |
|
970 border-radius: 24px; |
|
971 margin-bottom: 8px; |
|
972 padding-right: 3px; |
|
973 padding-left: 21px; } |
|
974 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__markers-container { |
|
975 position: relative; } |
|
976 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__insert-point { |
|
977 border-radius: 50%; |
|
978 background: #fff; |
|
979 padding: 2px; |
|
980 min-width: 24px; |
|
981 width: 24px; |
|
982 height: 24px; |
|
983 position: relative; } |
|
984 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__insert-point svg { |
|
985 height: 100%; |
|
986 width: 100%; } |
|
987 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button { |
|
988 border: 2px solid #fff; |
|
989 border-radius: 50%; |
|
990 height: 18px; |
|
991 padding: 0; |
|
992 position: absolute; |
|
993 width: 18px; |
|
994 top: 3px; } |
|
995 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button.is-active { |
|
996 background: #fafafa; |
|
997 color: #23282d; |
|
998 border-color: #999; |
|
999 box-shadow: 0 0 0 1px #fff, 0 0 0 3px #007cba; |
|
1000 box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--wp-admin-theme-color); } |
|
1001 |
|
1002 .components-custom-gradient-picker__color-picker-popover .components-custom-gradient-picker__remove-control-point { |
|
1003 margin-right: auto; |
|
1004 margin-left: auto; |
|
1005 display: block; |
|
1006 margin-bottom: 8px; } |
|
1007 |
|
1008 .components-custom-gradient-picker__inserter { |
|
1009 width: 100%; } |
|
1010 |
|
1011 .components-custom-gradient-picker__liner-gradient-indicator { |
|
1012 display: inline-block; |
|
1013 flex: 0 auto; |
|
1014 width: 20px; |
|
1015 height: 20px; } |
|
1016 |
|
1017 .components-custom-gradient-picker__ui-line { |
|
1018 display: flex; |
|
1019 justify-content: space-between; } |
|
1020 |
|
1021 .components-custom-gradient-picker .components-custom-gradient-picker__ui-line .components-base-control.components-angle-picker, |
|
1022 .components-custom-gradient-picker .components-custom-gradient-picker__ui-line .components-base-control.components-custom-gradient-picker__type-picker { |
|
1023 margin-bottom: 0; } |
|
1024 |
|
1025 .components-custom-gradient-picker .components-custom-gradient-picker__toolbar { |
|
1026 border: none; } |
|
1027 .components-custom-gradient-picker .components-custom-gradient-picker__toolbar > div + div { |
|
1028 margin-right: 1px; } |
|
1029 .components-custom-gradient-picker .components-custom-gradient-picker__toolbar button.is-pressed > svg { |
|
1030 background: #fff; |
|
1031 border: 1px solid #7e8993; |
|
1032 border-radius: 2px; } |
|
1033 |
|
1034 .components-custom-select-control { |
|
1035 position: relative; } |
|
1036 |
|
1037 .components-custom-select-control__label { |
|
1038 display: block; |
|
1039 margin-bottom: 8px; } |
|
1040 |
|
1041 .components-custom-select-control__button { |
|
1042 border: 1px solid #757575; |
|
1043 border-radius: 2px; |
|
1044 min-height: 30px; |
|
1045 min-width: 130px; |
|
1046 position: relative; |
|
1047 text-align: right; } |
|
1048 .components-custom-select-control__button.components-custom-select-control__button { |
|
1049 padding-left: 24px; } |
|
1050 .components-custom-select-control__button:focus:not(:disabled) { |
|
1051 border-color: #007cba; |
|
1052 border-color: var(--wp-admin-theme-color); |
|
1053 box-shadow: 0 0 0 0.5px #007cba; |
|
1054 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); } |
|
1055 .components-custom-select-control__button .components-custom-select-control__button-icon { |
|
1056 height: 100%; |
|
1057 padding: 0; |
|
1058 position: absolute; |
|
1059 left: 0; |
|
1060 top: 0; } |
|
1061 |
|
1062 .components-custom-select-control__menu { |
|
1063 background-color: #fff; |
|
1064 max-height: 400px; |
|
1065 min-width: 100%; |
|
1066 overflow: auto; |
|
1067 padding: 0; |
|
1068 position: absolute; |
|
1069 z-index: 1000000; } |
|
1070 .components-custom-select-control__menu:focus { |
|
1071 border: 1px solid #1e1e1e; |
|
1072 border-radius: 2px; |
|
1073 outline: none; |
|
1074 transition: none; } |
|
1075 |
|
1076 .components-custom-select-control__item { |
|
1077 align-items: center; |
|
1078 display: flex; |
|
1079 list-style-type: none; |
|
1080 padding: 10px 25px 10px 5px; |
|
1081 cursor: default; } |
|
1082 .components-custom-select-control__item.is-highlighted { |
|
1083 background: #ddd; } |
|
1084 .components-custom-select-control__item-icon { |
|
1085 margin-right: -20px; |
|
1086 margin-left: 0; } |
762 |
1087 |
763 svg.dashicon { |
1088 svg.dashicon { |
764 fill: currentColor; |
1089 fill: currentColor; |
765 outline: none; } |
1090 outline: none; } |
766 .PresetDateRangePicker_panel { |
1091 .PresetDateRangePicker_panel { |
1581 |
1903 |
1582 .DateRangePicker_closeButton_svg { |
1904 .DateRangePicker_closeButton_svg { |
1583 height: 15px; |
1905 height: 15px; |
1584 width: 15px; |
1906 width: 15px; |
1585 fill: #cacccd; } |
1907 fill: #cacccd; } |
1586 .components-datetime .components-datetime__calendar-help { |
1908 .components-datetime { |
1587 padding: 8px; } |
1909 padding: 0; } |
1588 .components-datetime .components-datetime__calendar-help h4 { |
1910 .components-datetime .components-datetime__calendar-help { |
|
1911 padding: 16px; } |
|
1912 .components-datetime .components-datetime__calendar-help h4 { |
|
1913 margin: 0; } |
|
1914 .components-datetime .components-datetime__buttons { |
|
1915 display: flex; |
|
1916 justify-content: space-between; } |
|
1917 .components-datetime .components-datetime__date-help-toggle { |
|
1918 display: block; |
|
1919 margin-right: auto; } |
|
1920 .components-datetime fieldset { |
|
1921 border: 0; |
|
1922 padding: 0; |
1589 margin: 0; } |
1923 margin: 0; } |
1590 |
1924 .components-datetime select, |
1591 .components-datetime .components-datetime__date-help-button { |
1925 .components-datetime input { |
1592 display: block; |
1926 box-shadow: 0 0 0 transparent; |
1593 margin-right: auto; |
1927 transition: box-shadow 0.1s linear; |
1594 margin-left: 8px; |
1928 border-radius: 2px; |
1595 margin-top: 0.5em; } |
1929 border: 1px solid #757575; } |
|
1930 @media (prefers-reduced-motion: reduce) { |
|
1931 .components-datetime select, |
|
1932 .components-datetime input { |
|
1933 transition-duration: 0s; } } |
|
1934 .components-datetime select, |
|
1935 .components-datetime input[type="number"], |
|
1936 .components-datetime .components-button { |
|
1937 height: 30px; |
|
1938 margin-top: 0; |
|
1939 margin-bottom: 0; } |
1596 |
1940 |
1597 .components-datetime__date { |
1941 .components-datetime__date { |
1598 min-height: 236px; |
1942 min-height: 236px; |
1599 border-top: 1px solid #e2e4e7; |
1943 border-top: 1px solid #ddd; } |
1600 margin-right: -8px; |
1944 .components-datetime__date .DayPickerNavigation_leftButton__horizontalDefault { |
1601 margin-left: -8px; } |
1945 right: 0; } |
1602 .components-datetime__date .CalendarMonth_caption { |
1946 .components-datetime__date .CalendarMonth_caption { |
1603 font-size: 13px; } |
1947 font-size: 13px; } |
|
1948 .components-datetime__date .CalendarMonth_table { |
|
1949 border-collapse: separate; |
|
1950 border-spacing: 2px; } |
1604 .components-datetime__date .CalendarDay { |
1951 .components-datetime__date .CalendarDay { |
1605 font-size: 13px; |
1952 font-size: 13px; |
1606 border: 1px solid transparent; |
1953 border: none; |
1607 border-radius: 50%; |
1954 border-radius: 50%; |
1608 text-align: center; } |
1955 text-align: center; } |
|
1956 .components-datetime__date .CalendarDay:focus { |
|
1957 box-shadow: inset 0 0 0 1.5px #007cba, inset 0 0 0 2.5px #fff; |
|
1958 box-shadow: inset 0 0 0 1.5px var(--wp-admin-theme-color), inset 0 0 0 2.5px #fff; |
|
1959 outline: 2px solid transparent; } |
1609 .components-datetime__date .CalendarDay__selected { |
1960 .components-datetime__date .CalendarDay__selected { |
1610 background: #0085ba; } |
1961 background: #007cba; |
1611 body.admin-color-sunrise .components-datetime__date .CalendarDay__selected { |
1962 background: var(--wp-admin-theme-color); |
1612 background: #d1864a; } |
1963 border: 2px solid transparent; } |
1613 body.admin-color-ocean .components-datetime__date .CalendarDay__selected { |
|
1614 background: #a3b9a2; } |
|
1615 body.admin-color-midnight .components-datetime__date .CalendarDay__selected { |
|
1616 background: #e14d43; } |
|
1617 body.admin-color-ectoplasm .components-datetime__date .CalendarDay__selected { |
|
1618 background: #a7b656; } |
|
1619 body.admin-color-coffee .components-datetime__date .CalendarDay__selected { |
|
1620 background: #c2a68c; } |
|
1621 body.admin-color-blue .components-datetime__date .CalendarDay__selected { |
|
1622 background: #82b4cb; } |
|
1623 body.admin-color-light .components-datetime__date .CalendarDay__selected { |
|
1624 background: #0085ba; } |
|
1625 .components-datetime__date .CalendarDay__selected:hover { |
1964 .components-datetime__date .CalendarDay__selected:hover { |
1626 background: rgb(0, 113, 158); } |
1965 background: #005a87; |
1627 body.admin-color-sunrise .components-datetime__date .CalendarDay__selected:hover { |
1966 background: var(--wp-admin-theme-color-darker-20); } |
1628 background: rgb(178, 114, 63); } |
1967 .components-datetime__date .CalendarDay__selected:focus { |
1629 body.admin-color-ocean .components-datetime__date .CalendarDay__selected:hover { |
1968 box-shadow: inset 0 0 0 1px #fff; } |
1630 background: rgb(139, 157, 138); } |
|
1631 body.admin-color-midnight .components-datetime__date .CalendarDay__selected:hover { |
|
1632 background: rgb(191, 65, 57); } |
|
1633 body.admin-color-ectoplasm .components-datetime__date .CalendarDay__selected:hover { |
|
1634 background: rgb(142, 155, 73); } |
|
1635 body.admin-color-coffee .components-datetime__date .CalendarDay__selected:hover { |
|
1636 background: rgb(165, 141, 119); } |
|
1637 body.admin-color-blue .components-datetime__date .CalendarDay__selected:hover { |
|
1638 background: rgb(111, 153, 173); } |
|
1639 body.admin-color-light .components-datetime__date .CalendarDay__selected:hover { |
|
1640 background: rgb(0, 113, 158); } |
|
1641 .components-datetime__date .DayPickerNavigation_button__horizontalDefault { |
1969 .components-datetime__date .DayPickerNavigation_button__horizontalDefault { |
1642 padding: 2px 8px; |
1970 padding: 2px 8px; |
1643 top: 20px; } |
1971 top: 20px; } |
|
1972 .components-datetime__date .DayPickerNavigation_button__horizontalDefault:focus { |
|
1973 border-color: #007cba; |
|
1974 border-color: var(--wp-admin-theme-color); |
|
1975 box-shadow: 0 0 0 0.5px #007cba; |
|
1976 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
|
1977 outline: 2px solid transparent; } |
1644 .components-datetime__date .DayPicker_weekHeader { |
1978 .components-datetime__date .DayPicker_weekHeader { |
1645 top: 50px; } |
1979 top: 50px; } |
1646 .components-datetime__date.is-description-visible .DayPicker, |
1980 .components-datetime__date .DayPicker_weekHeader .DayPicker_weekHeader_ul { |
1647 .components-datetime__date.is-description-visible .components-datetime__date-help-button { |
1981 margin: 1px 0; |
|
1982 padding-right: 0; |
|
1983 padding-left: 0; } |
|
1984 .components-datetime__date.is-description-visible .DayPicker { |
1648 visibility: hidden; } |
1985 visibility: hidden; } |
1649 |
1986 |
1650 .components-datetime__time { |
1987 .components-datetime__time { |
1651 margin-bottom: 1em; } |
1988 padding-bottom: 16px; } |
1652 .components-datetime__time fieldset { |
1989 .components-datetime__time fieldset { |
1653 margin-top: 0.5em; |
1990 position: relative; |
1654 position: relative; } |
1991 margin-bottom: 0.5em; } |
|
1992 .components-datetime__time fieldset + fieldset { |
|
1993 margin-bottom: 0; } |
1655 .components-datetime__time .components-datetime__time-field-am-pm fieldset { |
1994 .components-datetime__time .components-datetime__time-field-am-pm fieldset { |
1656 margin-top: 0; } |
1995 margin-top: 0; } |
1657 .components-datetime__time .components-datetime__time-wrapper { |
1996 .components-datetime__time .components-datetime__time-wrapper { |
1658 display: flex; } |
1997 display: flex; } |
1659 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-separator { |
1998 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-separator { |
1660 display: inline-block; |
1999 display: inline-block; |
1661 padding: 0 0 0 3px; |
2000 padding: 0 0 0 3px; |
1662 color: #555d66; } |
2001 color: #555d66; } |
1663 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-am-button { |
2002 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field-time { |
1664 margin-right: 8px; |
2003 direction: ltr; } |
1665 margin-left: -1px; |
2004 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select { |
1666 border-radius: 0 3px 3px 0; } |
2005 margin-left: 4px; } |
1667 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-pm-button { |
2006 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select:focus { |
1668 margin-right: -1px; |
2007 position: relative; |
1669 border-radius: 3px 0 0 3px; } |
2008 z-index: 1; } |
1670 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-am-button.is-toggled, |
2009 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"] { |
1671 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-pm-button.is-toggled { |
2010 padding: 2px; |
1672 background: #edeff0; |
2011 margin-left: 4px; |
1673 border-color: #8f98a1; |
2012 text-align: center; |
1674 box-shadow: inset 0 2px 5px -3px #555d66; } |
2013 -moz-appearance: textfield; } |
1675 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field { |
2014 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"]:focus { |
1676 align-self: center; |
2015 position: relative; |
1677 flex: 0 1 auto; |
2016 z-index: 1; } |
1678 order: 1; } |
2017 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"]::-webkit-inner-spin-button { |
1679 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field.am-pm button { |
2018 -webkit-appearance: none; |
1680 font-size: 11px; |
2019 margin: 0; } |
1681 font-weight: 600; } |
|
1682 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select { |
|
1683 padding: 2px; |
|
1684 margin-left: 4px; } |
|
1685 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select:focus { |
|
1686 position: relative; |
|
1687 z-index: 1; } |
|
1688 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"] { |
|
1689 padding: 2px; |
|
1690 margin-left: 4px; |
|
1691 width: 40px; |
|
1692 text-align: center; |
|
1693 -moz-appearance: textfield; } |
|
1694 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"]:focus { |
|
1695 position: relative; |
|
1696 z-index: 1; } |
|
1697 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"]::-webkit-inner-spin-button { |
|
1698 -webkit-appearance: none; |
|
1699 margin: 0; } |
|
1700 .components-datetime__time.is-12-hour .components-datetime__time-field-day input { |
2020 .components-datetime__time.is-12-hour .components-datetime__time-field-day input { |
1701 margin: 0 0 0 -4px !important; |
2021 margin: -4px 0 0 !important; |
1702 border-radius: 0 4px 4px 0 !important; } |
2022 border-radius: 0 2px 2px 0 !important; } |
1703 .components-datetime__time.is-12-hour .components-datetime__time-field-year input { |
2023 .components-datetime__time.is-12-hour .components-datetime__time-field-year input { |
1704 border-radius: 4px 0 0 4px !important; } |
2024 border-radius: 2px 0 0 2px !important; } |
1705 |
2025 |
1706 .components-datetime__time-legend { |
2026 .components-datetime__time-legend { |
1707 font-weight: 600; |
2027 font-weight: 600; |
1708 margin-top: 0.5em; } |
2028 margin-top: 0.5em; } |
1709 .components-datetime__time-legend.invisible { |
2029 .components-datetime__time-legend.invisible { |
1742 pointer-events: none; } |
2074 pointer-events: none; } |
1743 |
2075 |
1744 body.is-dragging-components-draggable { |
2076 body.is-dragging-components-draggable { |
1745 cursor: move; |
2077 cursor: move; |
1746 /* Fallback for IE/Edge < 14 */ |
2078 /* Fallback for IE/Edge < 14 */ |
1747 cursor: -webkit-grabbing !important; |
|
1748 cursor: grabbing !important; } |
2079 cursor: grabbing !important; } |
1749 |
2080 |
1750 .components-draggable__invisible-drag-image { |
2081 .components-draggable__invisible-drag-image { |
1751 position: fixed; |
2082 position: fixed; |
1752 right: -1000px; |
2083 right: -1000px; |
1753 height: 50px; |
2084 height: 50px; |
1754 width: 50px; } |
2085 width: 50px; } |
1755 |
2086 |
1756 .components-draggable__clone { |
2087 .components-draggable__clone { |
1757 position: fixed; |
2088 position: fixed; |
1758 padding: 20px; |
2089 padding: 0; |
1759 background: transparent; |
2090 background: transparent; |
1760 pointer-events: none; |
2091 pointer-events: none; |
1761 z-index: 1000000000; |
2092 z-index: 1000000000; } |
1762 opacity: 0.8; } |
|
1763 |
2093 |
1764 .components-drop-zone { |
2094 .components-drop-zone { |
1765 position: absolute; |
2095 position: absolute; |
1766 top: 0; |
2096 top: 0; |
1767 left: 0; |
2097 left: 0; |
1768 bottom: 0; |
2098 bottom: 0; |
1769 right: 0; |
2099 right: 0; |
1770 z-index: 100; |
2100 z-index: 40; |
1771 visibility: hidden; |
2101 visibility: hidden; |
1772 opacity: 0; |
2102 opacity: 0; |
1773 transition: 0.3s opacity, 0.3s background-color, 0s visibility 0.3s; |
2103 transition: 0.3s opacity, 0.3s background-color, 0s visibility 0.3s; |
1774 border: 2px solid #0071a1; |
2104 border: 2px solid #007cba; |
|
2105 border: 2px solid var(--wp-admin-theme-color); |
1775 border-radius: 2px; } |
2106 border-radius: 2px; } |
|
2107 @media (prefers-reduced-motion: reduce) { |
|
2108 .components-drop-zone { |
|
2109 transition-duration: 0s; } } |
1776 .components-drop-zone.is-active { |
2110 .components-drop-zone.is-active { |
1777 opacity: 1; |
2111 opacity: 1; |
1778 visibility: visible; |
2112 visibility: visible; |
1779 transition: 0.3s opacity, 0.3s background-color; } |
2113 transition: 0.3s opacity, 0.3s background-color; } |
|
2114 @media (prefers-reduced-motion: reduce) { |
|
2115 .components-drop-zone.is-active { |
|
2116 transition-duration: 0s; } } |
1780 .components-drop-zone.is-dragging-over-element { |
2117 .components-drop-zone.is-dragging-over-element { |
1781 background-color: rgba(0, 113, 161, 0.8); } |
2118 background-color: #007cba; |
|
2119 background-color: var(--wp-admin-theme-color); } |
1782 |
2120 |
1783 .components-drop-zone__content { |
2121 .components-drop-zone__content { |
1784 position: absolute; |
2122 position: absolute; |
1785 top: 50%; |
2123 top: 50%; |
1786 right: 0; |
2124 right: 0; |
1787 left: 0; |
2125 left: 0; |
1788 z-index: 110; |
2126 z-index: 50; |
1789 transform: translateY(-50%); |
2127 transform: translateY(-50%); |
1790 width: 100%; |
2128 width: 100%; |
1791 text-align: center; |
2129 text-align: center; |
1792 color: #fff; |
2130 color: #fff; |
1793 transition: transform 0.2s ease-in-out; } |
2131 transition: transform 0.2s ease-in-out; } |
|
2132 @media (prefers-reduced-motion: reduce) { |
|
2133 .components-drop-zone__content { |
|
2134 transition-duration: 0s; } } |
1794 |
2135 |
1795 .components-drop-zone.is-dragging-over-element .components-drop-zone__content { |
2136 .components-drop-zone.is-dragging-over-element .components-drop-zone__content { |
1796 transform: translateY(-50%) scale(1.05); } |
2137 transform: translateY(-50%) scale(1.05); } |
1797 |
2138 |
1798 .components-drop-zone__content-icon, |
2139 .components-drop-zone__content-icon, |
1799 .components-drop-zone__content-text { |
2140 .components-drop-zone__content-text { |
1800 display: block; } |
2141 display: block; } |
1801 |
2142 |
1802 .components-drop-zone__content-icon { |
2143 .components-drop-zone__content-icon { |
1803 margin: 0 auto; |
2144 margin: 0 auto; |
1804 line-height: 0; } |
2145 line-height: 0; |
|
2146 fill: currentColor; } |
1805 |
2147 |
1806 .components-drop-zone__content-text { |
2148 .components-drop-zone__content-text { |
1807 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } |
2149 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } |
1808 |
2150 |
1809 .components-drop-zone__provider { |
2151 .components-drop-zone__provider { |
1810 height: 100%; } |
2152 height: 100%; } |
1811 |
2153 |
1812 .components-dropdown-menu { |
2154 .components-dropdown { |
1813 padding: 3px; |
2155 display: inline-block; } |
1814 display: flex; } |
2156 |
1815 .components-dropdown-menu .components-dropdown-menu__toggle { |
2157 .components-dropdown__content .components-popover__content > div { |
1816 width: auto; |
2158 padding: 12px; } |
1817 margin: 0; |
|
1818 padding: 4px; |
|
1819 border: 1px solid transparent; |
|
1820 display: flex; |
|
1821 flex-direction: row; } |
|
1822 .components-dropdown-menu .components-dropdown-menu__toggle.is-active, .components-dropdown-menu .components-dropdown-menu__toggle.is-active:hover { |
|
1823 box-shadow: none; |
|
1824 background-color: #555d66; |
|
1825 color: #fff; } |
|
1826 .components-dropdown-menu .components-dropdown-menu__toggle:focus::before { |
|
1827 top: -3px; |
|
1828 left: -3px; |
|
1829 bottom: -3px; |
|
1830 right: -3px; } |
|
1831 .components-dropdown-menu .components-dropdown-menu__toggle:hover, .components-dropdown-menu .components-dropdown-menu__toggle:focus, .components-dropdown-menu .components-dropdown-menu__toggle:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover { |
|
1832 color: #555d66; |
|
1833 box-shadow: inset 0 0 0 1px #555d66, inset 0 0 0 2px #fff; } |
|
1834 .components-dropdown-menu .components-dropdown-menu__toggle .components-dropdown-menu__indicator::after { |
|
1835 content: ""; |
|
1836 pointer-events: none; |
|
1837 display: block; |
|
1838 width: 0; |
|
1839 height: 0; |
|
1840 border-right: 3px solid transparent; |
|
1841 border-left: 3px solid transparent; |
|
1842 border-top: 5px solid currentColor; |
|
1843 margin-right: 4px; |
|
1844 margin-left: 2px; } |
|
1845 |
2159 |
1846 .components-dropdown-menu__popover .components-popover__content { |
2160 .components-dropdown-menu__popover .components-popover__content { |
1847 width: 200px; } |
2161 width: 200px; } |
1848 |
2162 |
1849 .components-dropdown-menu__menu { |
2163 .components-dropdown-menu__menu { |
1850 width: 100%; |
2164 width: 100%; |
1851 padding: 9px; |
|
1852 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
2165 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
1853 font-size: 13px; |
2166 font-size: 13px; |
1854 line-height: 1.4; } |
2167 line-height: 1.4; } |
1855 .components-dropdown-menu__menu .components-dropdown-menu__menu-item { |
2168 .components-dropdown-menu__menu .components-dropdown-menu__menu-item, |
|
2169 .components-dropdown-menu__menu .components-menu-item { |
1856 width: 100%; |
2170 width: 100%; |
1857 padding: 6px; |
2171 padding: 6px; |
1858 outline: none; |
2172 outline: none; |
1859 cursor: pointer; |
2173 cursor: pointer; |
1860 margin-bottom: 4px; } |
2174 margin-bottom: 4px; } |
1861 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator { |
2175 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator, |
|
2176 .components-dropdown-menu__menu .components-menu-item.has-separator { |
1862 margin-top: 6px; |
2177 margin-top: 6px; |
1863 position: relative; |
2178 position: relative; |
1864 overflow: visible; } |
2179 overflow: visible; } |
1865 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator::before { |
2180 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator::before, |
|
2181 .components-dropdown-menu__menu .components-menu-item.has-separator::before { |
1866 display: block; |
2182 display: block; |
1867 content: ""; |
2183 content: ""; |
1868 box-sizing: content-box; |
2184 box-sizing: content-box; |
1869 background-color: #e2e4e7; |
2185 background-color: #ddd; |
1870 position: absolute; |
2186 position: absolute; |
1871 top: -3px; |
2187 top: -3px; |
1872 right: 0; |
2188 right: 0; |
1873 left: 0; |
2189 left: 0; |
1874 height: 1px; } |
2190 height: 1px; } |
1875 .components-dropdown-menu__menu .components-dropdown-menu__menu-item:focus:not(:disabled):not([aria-disabled="true"]):not(.is-default) { |
2191 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.is-active svg, |
1876 color: #191e23; |
2192 .components-dropdown-menu__menu .components-menu-item.is-active svg { |
1877 border: none; |
2193 color: #fff; |
1878 box-shadow: none; |
2194 background: #1e1e1e; |
1879 outline-offset: -2px; |
2195 box-shadow: 0 0 0 1px #1e1e1e; |
1880 outline: 1px dotted #555d66; } |
2196 border-radius: 1px; } |
1881 .components-dropdown-menu__menu .components-dropdown-menu__menu-item > svg { |
2197 .components-dropdown-menu__menu .components-dropdown-menu__menu-item > svg, |
1882 border-radius: 4px; |
2198 .components-dropdown-menu__menu .components-menu-item > svg { |
1883 padding: 2px; |
2199 border-radius: 2px; |
1884 width: 24px; |
2200 width: 24px; |
1885 height: 24px; |
2201 height: 24px; } |
1886 margin: -1px 0 -1px 8px; } |
2202 .components-dropdown-menu__menu .components-menu-item__button, |
1887 .components-dropdown-menu__menu .components-dropdown-menu__menu-item:not(:disabled):not([aria-disabled="true"]):not(.is-default).is-active > svg { |
2203 .components-dropdown-menu__menu .components-menu-item__button.components-button { |
1888 outline: none; |
2204 min-height: 36px; |
1889 color: #fff; |
2205 height: auto; |
1890 box-shadow: none; |
2206 padding-right: 40px; |
1891 background: #555d66; } |
2207 text-align: right; } |
|
2208 .components-dropdown-menu__menu .components-menu-item__button.has-icon, |
|
2209 .components-dropdown-menu__menu .components-menu-item__button.components-button.has-icon { |
|
2210 padding-right: 8px; } |
|
2211 .components-dropdown-menu__menu .components-menu-group { |
|
2212 padding: 12px; |
|
2213 margin-top: 0; |
|
2214 margin-bottom: 0; |
|
2215 margin-right: -12px; |
|
2216 margin-left: -12px; } |
|
2217 .components-dropdown-menu__menu .components-menu-group:first-child { |
|
2218 margin-top: -12px; } |
|
2219 .components-dropdown-menu__menu .components-menu-group:last-child { |
|
2220 margin-bottom: -12px; } |
|
2221 .components-dropdown-menu__menu .components-menu-group + .components-menu-group { |
|
2222 margin-top: 0; |
|
2223 border-top: 1px solid #ccc; |
|
2224 padding: 12px; } |
|
2225 .is-alternate .components-dropdown-menu__menu .components-menu-group + .components-menu-group { |
|
2226 border-color: #1e1e1e; } |
|
2227 |
|
2228 .components-dropdown-menu__menu.no-icons .components-menu-item__button.components-button { |
|
2229 padding: 0 12px; } |
1892 |
2230 |
1893 .components-external-link__icon { |
2231 .components-external-link__icon { |
1894 width: 1.4em; |
2232 width: 1.4em; |
1895 height: 1.4em; |
2233 height: 1.4em; |
1896 margin: -0.2em 0.1em 0; |
2234 margin: -0.2em 0.1em 0; |
1897 vertical-align: middle; } |
2235 vertical-align: middle; |
|
2236 fill: currentColor; } |
1898 |
2237 |
1899 .components-focal-point-picker-wrapper { |
2238 .components-focal-point-picker-wrapper { |
1900 background-color: transparent; |
2239 background-color: transparent; |
1901 border: 1px solid #e2e4e7; |
2240 border: 1px solid #ddd; |
1902 height: 200px; |
2241 height: 200px; |
1903 width: 100%; |
2242 width: 100%; |
1904 padding: 14px; } |
2243 padding: 14px; } |
1905 |
2244 |
1906 .components-focal-point-picker { |
2245 .components-focal-point-picker { |
1970 max-width: 4em; |
2293 max-width: 4em; |
1971 padding: 6px 4px; } |
2294 padding: 6px 4px; } |
1972 .components-focal-point-picker_position-display-container span { |
2295 .components-focal-point-picker_position-display-container span { |
1973 margin: 0 0.2em 0 0; } |
2296 margin: 0 0.2em 0 0; } |
1974 |
2297 |
1975 .components-font-size-picker__buttons { |
2298 .components-font-size-picker__controls { |
1976 max-width: 248px; |
2299 max-width: 248px; |
1977 display: flex; |
2300 display: flex; |
1978 justify-content: space-between; |
2301 flex-wrap: wrap; |
1979 align-items: center; } |
2302 align-items: center; |
1980 .components-font-size-picker__buttons .components-range-control__number { |
2303 margin-bottom: 24px; } |
|
2304 .components-font-size-picker__controls .components-font-size-picker__number { |
|
2305 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
2306 padding: 6px 8px; |
|
2307 box-shadow: 0 0 0 transparent; |
|
2308 transition: box-shadow 0.1s linear; |
|
2309 border-radius: 2px; |
|
2310 border: 1px solid #757575; |
|
2311 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
|
2312 font-size: 16px; |
|
2313 /* Override core line-height. To be reviewed. */ |
|
2314 line-height: normal; |
|
2315 display: inline-block; |
|
2316 font-weight: 500; |
1981 height: 30px; |
2317 height: 30px; |
1982 margin-right: 0; } |
2318 margin-bottom: 0; |
1983 .components-font-size-picker__buttons .components-range-control__number[value=""] + .components-button { |
2319 margin-right: 0; |
|
2320 margin-left: 8px; |
|
2321 margin-top: 8px; |
|
2322 width: 54px; } |
|
2323 @media (prefers-reduced-motion: reduce) { |
|
2324 .components-font-size-picker__controls .components-font-size-picker__number { |
|
2325 transition-duration: 0s; } } |
|
2326 @media (min-width: 600px) { |
|
2327 .components-font-size-picker__controls .components-font-size-picker__number { |
|
2328 font-size: 13px; |
|
2329 /* Override core line-height. To be reviewed. */ |
|
2330 line-height: normal; } } |
|
2331 .components-font-size-picker__controls .components-font-size-picker__number:focus { |
|
2332 border-color: #007cba; |
|
2333 border-color: var(--wp-admin-theme-color); |
|
2334 box-shadow: 0 0 0 0.5px #007cba; |
|
2335 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
|
2336 outline: 2px solid transparent; } |
|
2337 .components-font-size-picker__controls .components-font-size-picker__number::-webkit-input-placeholder { |
|
2338 color: rgba(30, 30, 30, 0.62); } |
|
2339 .components-font-size-picker__controls .components-font-size-picker__number::-moz-placeholder { |
|
2340 opacity: 1; |
|
2341 color: rgba(30, 30, 30, 0.62); } |
|
2342 .components-font-size-picker__controls .components-font-size-picker__number:-ms-input-placeholder { |
|
2343 color: rgba(30, 30, 30, 0.62); } |
|
2344 .is-dark-theme .components-font-size-picker__controls .components-font-size-picker__number::-webkit-input-placeholder { |
|
2345 color: rgba(255, 255, 255, 0.65); } |
|
2346 .is-dark-theme .components-font-size-picker__controls .components-font-size-picker__number::-moz-placeholder { |
|
2347 opacity: 1; |
|
2348 color: rgba(255, 255, 255, 0.65); } |
|
2349 .is-dark-theme .components-font-size-picker__controls .components-font-size-picker__number:-ms-input-placeholder { |
|
2350 color: rgba(255, 255, 255, 0.65); } |
|
2351 .components-font-size-picker__controls .components-font-size-picker__number[value=""] + .components-button { |
1984 cursor: default; |
2352 cursor: default; |
1985 opacity: 0.3; |
2353 opacity: 0.3; |
1986 pointer-events: none; } |
2354 pointer-events: none; } |
|
2355 .components-font-size-picker__controls .components-font-size-picker__number-container { |
|
2356 display: flex; |
|
2357 flex-direction: column; } |
|
2358 .components-font-size-picker__controls .components-font-size-picker__select { |
|
2359 margin-left: 8px; } |
|
2360 .components-font-size-picker__controls .components-color-palette__clear { |
|
2361 height: 30px; |
|
2362 margin-top: 26px; } |
1987 |
2363 |
1988 .components-font-size-picker__custom-input .components-range-control__slider + .dashicon { |
2364 .components-font-size-picker__custom-input .components-range-control__slider + .dashicon { |
1989 width: 30px; |
2365 width: 30px; |
1990 height: 30px; } |
2366 height: 30px; } |
1991 |
2367 |
1992 .components-font-size-picker__dropdown-content .components-button { |
2368 .components-font-size-picker { |
1993 display: block; |
2369 border: 0; |
1994 position: relative; |
2370 padding: 0; |
1995 padding: 10px 40px 10px 20px; |
2371 margin: 0; } |
1996 width: 100%; |
|
1997 text-align: right; } |
|
1998 .components-font-size-picker__dropdown-content .components-button .dashicon { |
|
1999 position: absolute; |
|
2000 top: calc(50% - 10px); |
|
2001 right: 10px; } |
|
2002 .components-font-size-picker__dropdown-content .components-button:hover { |
|
2003 color: #191e23; |
|
2004 border: none; |
|
2005 box-shadow: none; |
|
2006 background: #f3f4f5; } |
|
2007 .components-font-size-picker__dropdown-content .components-button:focus { |
|
2008 color: #191e23; |
|
2009 border: none; |
|
2010 box-shadow: none; |
|
2011 outline-offset: -2px; |
|
2012 outline: 1px dotted #555d66; } |
|
2013 |
|
2014 .components-font-size-picker__buttons .components-font-size-picker__selector { |
|
2015 border: 1px solid; |
|
2016 background: none; |
|
2017 position: relative; |
|
2018 width: 110px; |
|
2019 box-shadow: 0 0 0 transparent; |
|
2020 transition: box-shadow 0.1s linear; |
|
2021 border-radius: 4px; |
|
2022 border: 1px solid #8d96a0; } |
|
2023 .components-font-size-picker__buttons .components-font-size-picker__selector:focus { |
|
2024 color: #191e23; |
|
2025 border-color: #00a0d2; |
|
2026 box-shadow: 0 0 0 1px #00a0d2; |
|
2027 outline: 2px solid transparent; |
|
2028 outline-offset: -2px; } |
|
2029 .components-font-size-picker__buttons .components-font-size-picker__selector::after { |
|
2030 content: ""; |
|
2031 pointer-events: none; |
|
2032 display: block; |
|
2033 width: 0; |
|
2034 height: 0; |
|
2035 border-right: 3px solid transparent; |
|
2036 border-left: 3px solid transparent; |
|
2037 border-top: 5px solid currentColor; |
|
2038 margin-right: 4px; |
|
2039 margin-left: 2px; |
|
2040 left: 8px; |
|
2041 top: 12px; |
|
2042 position: absolute; } |
|
2043 |
|
2044 .components-form-file-upload .components-button.is-large { |
|
2045 padding-right: 6px; } |
|
2046 |
2372 |
2047 .components-form-toggle { |
2373 .components-form-toggle { |
2048 position: relative; |
2374 position: relative; |
2049 display: inline-block; } |
2375 display: inline-block; } |
2050 .components-form-toggle .components-form-toggle__on, |
|
2051 .components-form-toggle .components-form-toggle__off { |
|
2052 position: absolute; |
|
2053 top: 6px; |
|
2054 box-sizing: border-box; } |
|
2055 .components-form-toggle .components-form-toggle__off { |
|
2056 color: #6c7781; |
|
2057 fill: currentColor; |
|
2058 left: 6px; } |
|
2059 .components-form-toggle .components-form-toggle__on { |
|
2060 right: 8px; } |
|
2061 .components-form-toggle .components-form-toggle__track { |
2376 .components-form-toggle .components-form-toggle__track { |
2062 content: ""; |
2377 content: ""; |
2063 display: inline-block; |
2378 display: inline-block; |
2064 box-sizing: border-box; |
2379 box-sizing: border-box; |
2065 vertical-align: top; |
2380 vertical-align: top; |
2066 background-color: #fff; |
2381 background-color: #fff; |
2067 border: 2px solid #6c7781; |
2382 border: 1px solid #1e1e1e; |
2068 width: 36px; |
2383 width: 36px; |
2069 height: 18px; |
2384 height: 18px; |
2070 border-radius: 9px; |
2385 border-radius: 9px; |
2071 transition: 0.2s background ease; } |
2386 transition: 0.2s background ease; } |
|
2387 @media (prefers-reduced-motion: reduce) { |
|
2388 .components-form-toggle .components-form-toggle__track { |
|
2389 transition-duration: 0s; } } |
2072 .components-form-toggle .components-form-toggle__thumb { |
2390 .components-form-toggle .components-form-toggle__thumb { |
2073 display: block; |
2391 display: block; |
2074 position: absolute; |
2392 position: absolute; |
2075 box-sizing: border-box; |
2393 box-sizing: border-box; |
2076 top: 4px; |
2394 top: 3px; |
2077 right: 4px; |
2395 right: 3px; |
2078 width: 10px; |
2396 width: 12px; |
2079 height: 10px; |
2397 height: 12px; |
2080 border-radius: 50%; |
2398 border-radius: 50%; |
2081 transition: 0.1s transform ease; |
2399 transition: 0.1s transform ease; |
2082 background-color: #6c7781; |
2400 background-color: #1e1e1e; |
2083 border: 5px solid #6c7781; } |
2401 border: 5px solid #1e1e1e; } |
2084 .components-form-toggle:hover .components-form-toggle__track { |
2402 @media (prefers-reduced-motion: reduce) { |
2085 border: 2px solid #555d66; } |
2403 .components-form-toggle .components-form-toggle__thumb { |
2086 .components-form-toggle:hover .components-form-toggle__thumb { |
2404 transition-duration: 0s; } } |
2087 background-color: #555d66; |
|
2088 border: 5px solid #6c7781; } |
|
2089 .components-form-toggle:hover .components-form-toggle__off { |
|
2090 color: #555d66; } |
|
2091 .components-form-toggle.is-checked .components-form-toggle__track { |
2405 .components-form-toggle.is-checked .components-form-toggle__track { |
2092 background-color: #11a0d2; |
2406 background-color: #007cba; |
2093 border: 2px solid #11a0d2; |
2407 background-color: var(--wp-admin-theme-color); |
|
2408 border: 1px solid #007cba; |
|
2409 border: 1px solid var(--wp-admin-theme-color); |
2094 border: 9px solid transparent; } |
2410 border: 9px solid transparent; } |
2095 body.admin-color-sunrise .components-form-toggle.is-checked .components-form-toggle__track { |
2411 .components-form-toggle .components-form-toggle__input:focus + .components-form-toggle__track { |
2096 background-color: #c8b03c; |
2412 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #007cba; |
2097 border: 2px solid #c8b03c; } |
2413 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--wp-admin-theme-color); |
2098 body.admin-color-ocean .components-form-toggle.is-checked .components-form-toggle__track { |
|
2099 background-color: #a3b9a2; |
|
2100 border: 2px solid #a3b9a2; } |
|
2101 body.admin-color-midnight .components-form-toggle.is-checked .components-form-toggle__track { |
|
2102 background-color: #77a6b9; |
|
2103 border: 2px solid #77a6b9; } |
|
2104 body.admin-color-ectoplasm .components-form-toggle.is-checked .components-form-toggle__track { |
|
2105 background-color: #a7b656; |
|
2106 border: 2px solid #a7b656; } |
|
2107 body.admin-color-coffee .components-form-toggle.is-checked .components-form-toggle__track { |
|
2108 background-color: #c2a68c; |
|
2109 border: 2px solid #c2a68c; } |
|
2110 body.admin-color-blue .components-form-toggle.is-checked .components-form-toggle__track { |
|
2111 background-color: #82b4cb; |
|
2112 border: 2px solid #82b4cb; } |
|
2113 body.admin-color-light .components-form-toggle.is-checked .components-form-toggle__track { |
|
2114 background-color: #11a0d2; |
|
2115 border: 2px solid #11a0d2; } |
|
2116 .components-form-toggle__input:focus + .components-form-toggle__track { |
|
2117 box-shadow: 0 0 0 2px #fff, 0 0 0 3px #6c7781; |
|
2118 outline: 2px solid transparent; |
2414 outline: 2px solid transparent; |
2119 outline-offset: 2px; } |
2415 outline-offset: 2px; } |
2120 .components-form-toggle.is-checked .components-form-toggle__thumb { |
2416 .components-form-toggle.is-checked .components-form-toggle__thumb { |
2121 background-color: #fff; |
2417 background-color: #fff; |
2122 border-width: 0; |
2418 border-width: 0; |
2123 transform: translateX(-18px); } |
2419 transform: translateX(-18px); } |
2124 .components-form-toggle.is-checked::before { |
|
2125 background-color: #11a0d2; |
|
2126 border: 2px solid #11a0d2; } |
|
2127 body.admin-color-sunrise .components-form-toggle.is-checked::before { |
|
2128 background-color: #c8b03c; |
|
2129 border: 2px solid #c8b03c; } |
|
2130 body.admin-color-ocean .components-form-toggle.is-checked::before { |
|
2131 background-color: #a3b9a2; |
|
2132 border: 2px solid #a3b9a2; } |
|
2133 body.admin-color-midnight .components-form-toggle.is-checked::before { |
|
2134 background-color: #77a6b9; |
|
2135 border: 2px solid #77a6b9; } |
|
2136 body.admin-color-ectoplasm .components-form-toggle.is-checked::before { |
|
2137 background-color: #a7b656; |
|
2138 border: 2px solid #a7b656; } |
|
2139 body.admin-color-coffee .components-form-toggle.is-checked::before { |
|
2140 background-color: #c2a68c; |
|
2141 border: 2px solid #c2a68c; } |
|
2142 body.admin-color-blue .components-form-toggle.is-checked::before { |
|
2143 background-color: #82b4cb; |
|
2144 border: 2px solid #82b4cb; } |
|
2145 body.admin-color-light .components-form-toggle.is-checked::before { |
|
2146 background-color: #11a0d2; |
|
2147 border: 2px solid #11a0d2; } |
|
2148 .components-disabled .components-form-toggle { |
2420 .components-disabled .components-form-toggle { |
2149 opacity: 0.3; } |
2421 opacity: 0.3; } |
2150 |
2422 |
2151 .components-form-toggle input.components-form-toggle__input[type="checkbox"] { |
2423 .components-form-toggle input.components-form-toggle__input[type="checkbox"] { |
2152 position: absolute; |
2424 position: absolute; |
2305 transition: all 0.15s ease-in-out; |
2587 transition: all 0.15s ease-in-out; |
2306 list-style: none; |
2588 list-style: none; |
2307 border-top: 1px solid #6c7781; |
2589 border-top: 1px solid #6c7781; |
2308 margin: 4px -4px -4px; |
2590 margin: 4px -4px -4px; |
2309 padding-top: 3px; } |
2591 padding-top: 3px; } |
|
2592 @media (prefers-reduced-motion: reduce) { |
|
2593 .components-form-token-field__suggestions-list { |
|
2594 transition-duration: 0s; } } |
2310 |
2595 |
2311 .components-form-token-field__suggestion { |
2596 .components-form-token-field__suggestion { |
2312 color: #555d66; |
2597 color: #555d66; |
2313 display: block; |
2598 display: block; |
2314 font-size: 13px; |
2599 font-size: 13px; |
2315 padding: 4px 8px; |
2600 padding: 4px 8px; |
2316 cursor: pointer; } |
2601 cursor: pointer; } |
2317 .components-form-token-field__suggestion.is-selected { |
2602 .components-form-token-field__suggestion.is-selected { |
2318 background: #0071a1; |
2603 background: #007cba; |
|
2604 background: var(--wp-admin-theme-color); |
2319 color: #fff; } |
2605 color: #fff; } |
2320 |
2606 |
2321 .components-form-token-field__suggestion-match { |
2607 .components-form-token-field__suggestion-match { |
2322 text-decoration: underline; } |
2608 text-decoration: underline; } |
2323 |
2609 |
2324 .components-navigate-regions.is-focusing-regions [role="region"]:focus::after { |
2610 @media (min-width: 600px) { |
2325 content: ""; |
2611 .components-guide { |
2326 position: absolute; |
2612 width: 600px; } } |
2327 top: 0; |
2613 |
2328 bottom: 0; |
2614 .components-guide .components-modal__header { |
2329 right: 0; |
2615 background: none; |
2330 left: 0; |
2616 border-bottom: none; |
2331 pointer-events: none; |
2617 width: 100%; |
2332 outline: 4px solid transparent; |
2618 padding: 0; |
2333 box-shadow: inset 0 0 0 4px #33b3db; } |
2619 margin: 0; } |
2334 |
2620 .components-guide .components-modal__header .components-button { |
2335 @supports (outline-offset: 1px) { |
2621 align-self: flex-start; |
|
2622 margin: 8px 0 0 8px; |
|
2623 position: static; } |
|
2624 .components-guide .components-modal__header .components-button:hover svg { |
|
2625 fill: #fff; } |
|
2626 |
|
2627 .components-guide__container { |
|
2628 display: flex; |
|
2629 flex-direction: column; |
|
2630 justify-content: space-between; |
|
2631 margin-top: -60px; |
|
2632 min-height: 100%; } |
|
2633 |
|
2634 .components-guide__page { |
|
2635 display: flex; |
|
2636 flex-direction: column; |
|
2637 justify-content: center; |
|
2638 position: relative; } |
|
2639 @media (min-width: 600px) { |
|
2640 .components-guide__page { |
|
2641 min-height: 300px; } } |
|
2642 |
|
2643 .components-guide__footer { |
|
2644 align-content: center; |
|
2645 display: flex; |
|
2646 height: 30px; |
|
2647 justify-content: center; |
|
2648 margin: 0 0 24px 0; |
|
2649 padding: 0 32px; |
|
2650 position: relative; |
|
2651 width: 100%; } |
|
2652 @media (max-width: 600px) { |
|
2653 .components-guide__footer { |
|
2654 position: absolute; |
|
2655 bottom: 0; } } |
|
2656 |
|
2657 .components-guide__page-control { |
|
2658 margin: 8px 0 8px 0; |
|
2659 text-align: center; } |
|
2660 .components-guide__page-control li { |
|
2661 display: inline-block; } |
|
2662 .components-guide__page-control .components-button { |
|
2663 height: 30px; |
|
2664 min-width: 20px; } |
|
2665 |
|
2666 .components-guide .components-modal__content { |
|
2667 padding: 0; } |
|
2668 |
|
2669 .components-modal__frame.components-guide { |
|
2670 border: none; |
|
2671 min-width: 312px; |
|
2672 height: 80vh; |
|
2673 max-height: 575px; } |
|
2674 @media (max-width: 600px) { |
|
2675 .components-modal__frame.components-guide { |
|
2676 bottom: 5%; |
|
2677 right: 16px; |
|
2678 left: 16px; |
|
2679 top: 5%; |
|
2680 margin: 0 auto; } } |
|
2681 |
|
2682 .components-button.components-guide__back-button, .components-button.components-guide__forward-button, .components-button.components-guide__finish-button { |
|
2683 height: 30px; |
|
2684 position: absolute; } |
|
2685 |
|
2686 .components-button.components-guide__back-button, .components-button.components-guide__forward-button { |
|
2687 font-size: 13px; |
|
2688 padding: 4px 2px; } |
|
2689 .components-button.components-guide__back-button.has-text svg, .components-button.components-guide__forward-button.has-text svg { |
|
2690 margin: 0; } |
|
2691 .components-button.components-guide__back-button:hover, .components-button.components-guide__forward-button:hover { |
|
2692 text-decoration: underline; } |
|
2693 |
|
2694 .components-button.components-guide__back-button { |
|
2695 right: 32px; } |
|
2696 |
|
2697 .components-button.components-guide__forward-button { |
|
2698 left: 32px; |
|
2699 color: #1386bf; |
|
2700 font-weight: bold; } |
|
2701 |
|
2702 .components-button.components-guide__finish-button { |
|
2703 left: 32px; } |
|
2704 |
|
2705 .components-button.components-guide__inline-finish-button { |
|
2706 display: none; } |
|
2707 |
|
2708 .components-navigate-regions.is-focusing-regions [role="region"] { |
|
2709 position: relative; } |
2336 .components-navigate-regions.is-focusing-regions [role="region"]:focus::after { |
2710 .components-navigate-regions.is-focusing-regions [role="region"]:focus::after { |
2337 content: none; } |
2711 content: ""; |
2338 .components-navigate-regions.is-focusing-regions [role="region"]:focus { |
2712 position: absolute; |
2339 outline-style: solid; |
2713 top: 0; |
2340 outline-color: #33b3db; |
2714 bottom: 0; |
2341 outline-width: 4px; |
2715 right: 0; |
2342 outline-offset: -4px; } } |
2716 left: 0; |
2343 |
2717 pointer-events: none; |
2344 .components-icon-button { |
2718 outline: 4px solid transparent; |
2345 display: flex; |
2719 box-shadow: inset 0 0 0 4px #007cba; |
2346 align-items: center; |
2720 box-shadow: inset 0 0 0 4px var(--wp-admin-theme-color); } |
2347 padding: 8px; |
2721 @supports (outline-offset: 1px) { |
2348 margin: 0; |
2722 .components-navigate-regions.is-focusing-regions [role="region"]:focus::after { |
2349 border: none; |
2723 content: none; } |
2350 background: none; |
2724 .components-navigate-regions.is-focusing-regions [role="region"]:focus { |
2351 color: #555d66; |
2725 outline-style: solid; |
2352 position: relative; |
2726 outline-color: #007cba; |
2353 overflow: hidden; |
2727 outline-color: var(--wp-admin-theme-color); |
2354 border-radius: 4px; } |
2728 outline-width: 4px; |
2355 .components-icon-button .dashicon { |
2729 outline-offset: -4px; } } |
|
2730 |
|
2731 .components-menu-group + .components-menu-group { |
|
2732 margin-top: 8px; |
|
2733 padding-top: 8px; |
|
2734 border-top: 1px solid #1e1e1e; } |
|
2735 |
|
2736 .components-menu-group__label { |
|
2737 padding: 0; |
|
2738 margin-bottom: 12px; |
|
2739 color: #757575; |
|
2740 text-transform: uppercase; |
|
2741 font-size: 11px; |
|
2742 font-weight: 500; } |
|
2743 |
|
2744 .components-menu-item__button, |
|
2745 .components-menu-item__button.components-button { |
|
2746 width: 100%; } |
|
2747 .components-menu-item__button .dashicon, |
|
2748 .components-menu-item__button .components-menu-items__item-icon, |
|
2749 .components-menu-item__button svg.components-menu-items__item-icon, |
|
2750 .components-menu-item__button > span > svg, |
|
2751 .components-menu-item__button.components-button .dashicon, |
|
2752 .components-menu-item__button.components-button .components-menu-items__item-icon, |
|
2753 .components-menu-item__button.components-button svg.components-menu-items__item-icon, |
|
2754 .components-menu-item__button.components-button > span > svg { |
|
2755 margin-left: 8px; } |
|
2756 .components-menu-item__button .components-menu-items__item-icon, |
|
2757 .components-menu-item__button.components-button .components-menu-items__item-icon { |
2356 display: inline-block; |
2758 display: inline-block; |
2357 flex: 0 0 auto; } |
2759 flex: 0 0 auto; } |
2358 .components-icon-button svg { |
|
2359 fill: currentColor; |
|
2360 outline: none; } |
|
2361 .components-icon-button.has-text svg { |
|
2362 margin-left: 4px; } |
|
2363 .components-icon-button:not(:disabled):not([aria-disabled="true"]):not(.is-default):hover { |
|
2364 background-color: #fff; |
|
2365 color: #191e23; |
|
2366 box-shadow: inset 0 0 0 1px #e2e4e7, inset 0 0 0 2px #fff, 0 1px 1px rgba(25, 30, 35, 0.2); } |
|
2367 .components-icon-button:not(:disabled):not([aria-disabled="true"]):not(.is-default):active { |
|
2368 outline: none; |
|
2369 background-color: #fff; |
|
2370 color: #191e23; |
|
2371 box-shadow: inset 0 0 0 1px #ccd0d4, inset 0 0 0 2px #fff; } |
|
2372 .components-icon-button[aria-disabled="true"]:focus, .components-icon-button:disabled:focus { |
|
2373 box-shadow: none; } |
|
2374 |
|
2375 .components-menu-group { |
|
2376 width: 100%; |
|
2377 padding: 7px 0; } |
|
2378 |
|
2379 .components-menu-group__label { |
|
2380 margin-bottom: 8px; |
|
2381 color: #6c7781; |
|
2382 padding: 0 7px; } |
|
2383 |
|
2384 .components-menu-item__button, |
|
2385 .components-menu-item__button.components-icon-button { |
|
2386 width: 100%; |
|
2387 padding: 8px 15px; |
|
2388 text-align: right; |
|
2389 color: #40464d; } |
|
2390 .components-menu-item__button .dashicon, |
|
2391 .components-menu-item__button .components-menu-items__item-icon, |
|
2392 .components-menu-item__button > span > svg, |
|
2393 .components-menu-item__button.components-icon-button .dashicon, |
|
2394 .components-menu-item__button.components-icon-button .components-menu-items__item-icon, |
|
2395 .components-menu-item__button.components-icon-button > span > svg { |
|
2396 margin-left: 4px; } |
|
2397 .components-menu-item__button .components-menu-items__item-icon, |
|
2398 .components-menu-item__button.components-icon-button .components-menu-items__item-icon { |
|
2399 display: inline-block; |
|
2400 flex: 0 0 auto; } |
|
2401 .components-menu-item__button:hover:not(:disabled):not([aria-disabled="true"]), |
|
2402 .components-menu-item__button.components-icon-button:hover:not(:disabled):not([aria-disabled="true"]) { |
|
2403 color: #555d66; } |
|
2404 @media (min-width: 782px) { |
|
2405 .components-menu-item__button:hover:not(:disabled):not([aria-disabled="true"]), |
|
2406 .components-menu-item__button.components-icon-button:hover:not(:disabled):not([aria-disabled="true"]) { |
|
2407 color: #191e23; |
|
2408 border: none; |
|
2409 box-shadow: none; |
|
2410 background: #f3f4f5; } } |
|
2411 .components-menu-item__button:hover:not(:disabled):not([aria-disabled="true"]) .components-menu-item__shortcut, |
|
2412 .components-menu-item__button.components-icon-button:hover:not(:disabled):not([aria-disabled="true"]) .components-menu-item__shortcut { |
|
2413 opacity: 1; } |
|
2414 .components-menu-item__button:focus:not(:disabled):not([aria-disabled="true"]), |
|
2415 .components-menu-item__button.components-icon-button:focus:not(:disabled):not([aria-disabled="true"]) { |
|
2416 color: #191e23; |
|
2417 border: none; |
|
2418 box-shadow: none; |
|
2419 outline-offset: -2px; |
|
2420 outline: 1px dotted #555d66; } |
|
2421 |
2760 |
2422 .components-menu-item__info-wrapper { |
2761 .components-menu-item__info-wrapper { |
2423 display: flex; |
2762 display: flex; |
2424 flex-direction: column; } |
2763 flex-direction: column; } |
2425 |
2764 |
2426 .components-menu-item__info { |
2765 .components-menu-item__info { |
2427 margin-top: 4px; |
2766 margin-top: 4px; |
2428 font-size: 12px; |
2767 font-size: 12px; |
2429 opacity: 0.84; } |
2768 color: #757575; } |
2430 |
2769 |
2431 .components-menu-item__shortcut { |
2770 .components-menu-item__shortcut { |
2432 align-self: center; |
2771 -ms-grid-row-align: center; |
2433 opacity: 0.84; |
2772 align-self: center; |
2434 margin-left: 0; |
2773 margin-left: 0; |
2435 margin-right: auto; |
2774 margin-right: auto; |
2436 padding-right: 8px; |
2775 padding-right: 12px; |
|
2776 color: currentColor; |
2437 display: none; } |
2777 display: none; } |
2438 @media (min-width: 480px) { |
2778 @media (min-width: 480px) { |
2439 .components-menu-item__shortcut { |
2779 .components-menu-item__shortcut { |
2440 display: inline; } } |
2780 display: inline; } } |
|
2781 |
|
2782 .components-menu-items-choice, |
|
2783 .components-menu-items-choice.components-button { |
|
2784 padding-right: 40px; } |
|
2785 .components-menu-items-choice svg, |
|
2786 .components-menu-items-choice.components-button svg { |
|
2787 margin-left: 8px; } |
|
2788 .components-menu-items-choice.has-icon, |
|
2789 .components-menu-items-choice.components-button.has-icon { |
|
2790 padding-right: 8px; } |
2441 |
2791 |
2442 .components-modal__screen-overlay { |
2792 .components-modal__screen-overlay { |
2443 position: fixed; |
2793 position: fixed; |
2444 top: 0; |
2794 top: 0; |
2445 left: 0; |
2795 left: 0; |
2446 bottom: 0; |
2796 bottom: 0; |
2447 right: 0; |
2797 right: 0; |
2448 background-color: rgba(255, 255, 255, 0.4); |
2798 background-color: rgba(0, 0, 0, 0.7); |
2449 z-index: 100000; |
2799 z-index: 100000; |
2450 animation: edit-post__fade-in-animation 0.2s ease-out 0s; |
2800 animation: edit-post__fade-in-animation 0.2s ease-out 0s; |
2451 animation-fill-mode: forwards; } |
2801 animation-fill-mode: forwards; } |
2452 @media (prefers-reduced-motion: reduce) { |
2802 @media (prefers-reduced-motion: reduce) { |
2453 .components-modal__screen-overlay { |
2803 .components-modal__screen-overlay { |
2454 animation-duration: 1ms !important; } } |
2804 animation-duration: 1ms; } } |
2455 |
2805 |
2456 .components-modal__frame { |
2806 .components-modal__frame { |
2457 position: absolute; |
2807 position: absolute; |
2458 top: 0; |
2808 top: 0; |
2459 left: 0; |
2809 left: 0; |
2460 bottom: 0; |
2810 bottom: 0; |
2461 right: 0; |
2811 right: 0; |
2462 box-sizing: border-box; |
2812 box-sizing: border-box; |
2463 margin: 0; |
2813 margin: 0; |
2464 border: 1px solid #e2e4e7; |
2814 border: 1px solid #ddd; |
2465 background: #fff; |
2815 background: #fff; |
2466 box-shadow: 0 3px 30px rgba(25, 30, 35, 0.2); |
2816 box-shadow: 0 3px 30px rgba(0, 0, 0, 0.2); |
2467 overflow: auto; } |
2817 overflow: auto; } |
2468 @media (min-width: 600px) { |
2818 @media (min-width: 600px) { |
2469 .components-modal__frame { |
2819 .components-modal__frame { |
2470 top: 50%; |
2820 top: 50%; |
2471 left: auto; |
2821 left: auto; |
2472 bottom: auto; |
2822 bottom: auto; |
2473 right: 50%; |
2823 right: 50%; |
2474 min-width: 360px; |
2824 min-width: 360px; |
2475 max-width: calc(100% - 16px - 16px); |
2825 max-width: calc(100% - 16px - 16px); |
2476 max-height: calc(100% - 56px - 56px); |
2826 max-height: calc(100% - 60px - 60px); |
2477 transform: translate(50%, -50%); |
2827 transform: translate(50%, -50%); |
2478 animation: components-modal__appear-animation 0.1s ease-out; |
2828 animation: components-modal__appear-animation 0.1s ease-out; |
2479 animation-fill-mode: forwards; } } |
2829 animation-fill-mode: forwards; } } |
2480 @media (min-width: 600px) and (prefers-reduced-motion: reduce) { |
2830 @media (min-width: 600px) and (prefers-reduced-motion: reduce) { |
2481 .components-modal__frame { |
2831 .components-modal__frame { |
2482 animation-duration: 1ms !important; } } |
2832 animation-duration: 1ms; } } |
2483 |
2833 |
2484 @keyframes components-modal__appear-animation { |
2834 @keyframes components-modal__appear-animation { |
2485 from { |
2835 from { |
2486 margin-top: 32px; } |
2836 margin-top: 32px; } |
2487 to { |
2837 to { |
2488 margin-top: 0; } } |
2838 margin-top: 0; } } |
2489 |
2839 |
2490 .components-modal__header { |
2840 .components-modal__header { |
2491 box-sizing: border-box; |
2841 box-sizing: border-box; |
2492 border-bottom: 1px solid #e2e4e7; |
2842 border-bottom: 1px solid #ddd; |
2493 padding: 0 16px; |
2843 padding: 0 24px; |
2494 display: flex; |
2844 display: flex; |
2495 flex-direction: row; |
2845 flex-direction: row; |
2496 justify-content: space-between; |
2846 justify-content: space-between; |
2497 background: #fff; |
2847 background: #fff; |
2498 align-items: center; |
2848 align-items: center; |
2499 height: 56px; |
2849 height: 60px; |
|
2850 z-index: 10; |
|
2851 position: relative; |
2500 position: -webkit-sticky; |
2852 position: -webkit-sticky; |
2501 position: sticky; |
2853 position: sticky; |
2502 top: 0; |
2854 top: 0; |
2503 z-index: 10; |
2855 margin: 0 -24px 24px; } |
2504 margin: 0 -16px 16px; } |
|
2505 @supports (-ms-ime-align: auto) { |
2856 @supports (-ms-ime-align: auto) { |
2506 .components-modal__header { |
2857 .components-modal__header { |
2507 position: fixed; |
2858 position: fixed; |
2508 width: 100%; } } |
2859 width: 100%; } } |
2509 .components-modal__header .components-modal__header-heading { |
2860 .components-modal__header .components-modal__header-heading { |
2510 font-size: 1rem; |
2861 font-size: 1rem; |
2511 font-weight: 600; } |
2862 font-weight: 600; } |
2512 .components-modal__header h1 { |
2863 .components-modal__header h1 { |
2513 line-height: 1; |
2864 line-height: 1; |
2514 margin: 0; } |
2865 margin: 0; } |
|
2866 .components-modal__header .components-button { |
|
2867 position: relative; |
|
2868 right: 8px; } |
2515 |
2869 |
2516 .components-modal__header-heading-container { |
2870 .components-modal__header-heading-container { |
2517 align-items: center; |
2871 align-items: center; |
2518 flex-grow: 1; |
2872 flex-grow: 1; |
2519 display: flex; |
2873 display: flex; |
2681 |
3053 |
2682 .components-panel__row { |
3054 .components-panel__row { |
2683 display: flex; |
3055 display: flex; |
2684 justify-content: space-between; |
3056 justify-content: space-between; |
2685 align-items: center; |
3057 align-items: center; |
2686 margin-top: 20px; } |
3058 margin-top: 8px; |
|
3059 min-height: 36px; } |
2687 .components-panel__row select { |
3060 .components-panel__row select { |
2688 min-width: 0; } |
3061 min-width: 0; } |
2689 .components-panel__row label { |
3062 .components-panel__row label { |
2690 margin-left: 10px; |
3063 margin-left: 12px; |
2691 flex-shrink: 0; |
3064 flex-shrink: 0; |
2692 max-width: 75%; } |
3065 max-width: 75%; } |
2693 .components-panel__row:empty, .components-panel__row:first-of-type { |
3066 .components-panel__row:empty, .components-panel__row:first-of-type { |
2694 margin-top: 0; } |
3067 margin-top: 0; } |
2695 |
3068 |
2696 .components-panel .circle-picker { |
3069 .components-panel .circle-picker { |
2697 padding-bottom: 20px; } |
3070 padding-bottom: 20px; } |
2698 |
3071 |
2699 .components-placeholder { |
3072 .components-placeholder.components-placeholder { |
2700 margin: 0; |
3073 position: relative; |
2701 display: flex; |
|
2702 flex-direction: column; |
|
2703 align-items: center; |
|
2704 justify-content: center; |
|
2705 padding: 1em; |
3074 padding: 1em; |
2706 min-height: 200px; |
3075 min-height: 200px; |
2707 width: 100%; |
3076 width: 100%; |
2708 text-align: center; |
3077 text-align: right; |
|
3078 margin: 0; |
|
3079 color: #1e1e1e; |
|
3080 -moz-font-smoothing: subpixel-antialiased; |
|
3081 -webkit-font-smoothing: subpixel-antialiased; |
|
3082 border-radius: 2px; |
|
3083 background-color: #fff; |
|
3084 box-shadow: inset 0 0 0 1px #1e1e1e; |
|
3085 outline: 1px solid transparent; } |
|
3086 @supports ((position: -webkit-sticky) or (position: sticky)) { |
|
3087 .components-placeholder.components-placeholder { |
|
3088 display: flex; |
|
3089 flex-direction: column; |
|
3090 justify-content: center; |
|
3091 align-items: flex-start; } } |
|
3092 .components-placeholder.components-placeholder .components-base-control__label { |
|
3093 font-size: 13px; } |
|
3094 |
|
3095 .components-placeholder__error, |
|
3096 .components-placeholder__instructions, |
|
3097 .components-placeholder__label, |
|
3098 .components-placeholder__fieldset { |
2709 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
3099 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
2710 font-size: 13px; |
3100 font-size: 13px; } |
2711 background: rgba(139, 139, 150, 0.1); } |
|
2712 .is-dark-theme .components-placeholder { |
|
2713 background: rgba(255, 255, 255, 0.15); } |
|
2714 |
3101 |
2715 .components-placeholder__label { |
3102 .components-placeholder__label { |
2716 display: flex; |
3103 display: flex; |
2717 align-items: center; |
|
2718 justify-content: center; |
|
2719 font-weight: 600; |
3104 font-weight: 600; |
2720 margin-bottom: 1em; } |
3105 margin-bottom: 16px; |
|
3106 align-items: center; } |
|
3107 .components-placeholder__label > svg, |
2721 .components-placeholder__label .dashicon, |
3108 .components-placeholder__label .dashicon, |
2722 .components-placeholder__label .block-editor-block-icon { |
3109 .components-placeholder__label .block-editor-block-icon { |
2723 fill: currentColor; |
3110 fill: currentColor; |
2724 margin-left: 1ch; } |
3111 margin-left: 1ch; } |
2725 |
3112 |
2726 .components-placeholder__fieldset, |
3113 .components-placeholder__fieldset, |
2727 .components-placeholder__fieldset form { |
3114 .components-placeholder__fieldset form { |
2728 display: flex; |
3115 display: flex; |
2729 flex-direction: row; |
3116 flex-direction: row; |
2730 justify-content: center; |
|
2731 width: 100%; |
3117 width: 100%; |
2732 max-width: 400px; |
3118 flex-wrap: wrap; } |
2733 flex-wrap: wrap; |
|
2734 z-index: 1; } |
|
2735 .components-placeholder__fieldset p, |
3119 .components-placeholder__fieldset p, |
2736 .components-placeholder__fieldset form p { |
3120 .components-placeholder__fieldset form p { |
2737 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
3121 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
2738 font-size: 13px; } |
3122 font-size: 13px; } |
2739 |
3123 |
2740 .components-placeholder__input { |
3124 .components-placeholder__fieldset.is-column-layout, |
2741 margin-left: 8px; |
3125 .components-placeholder__fieldset.is-column-layout form { |
|
3126 flex-direction: column; } |
|
3127 |
|
3128 .components-placeholder__input[type="url"] { |
|
3129 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
3130 padding: 6px 8px; |
|
3131 box-shadow: 0 0 0 transparent; |
|
3132 transition: box-shadow 0.1s linear; |
|
3133 border-radius: 2px; |
|
3134 border: 1px solid #757575; |
|
3135 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
|
3136 font-size: 16px; |
|
3137 /* Override core line-height. To be reviewed. */ |
|
3138 line-height: normal; |
|
3139 margin: 0 0 0 8px; |
2742 flex: 1 1 auto; } |
3140 flex: 1 1 auto; } |
|
3141 @media (prefers-reduced-motion: reduce) { |
|
3142 .components-placeholder__input[type="url"] { |
|
3143 transition-duration: 0s; } } |
|
3144 @media (min-width: 600px) { |
|
3145 .components-placeholder__input[type="url"] { |
|
3146 font-size: 13px; |
|
3147 /* Override core line-height. To be reviewed. */ |
|
3148 line-height: normal; } } |
|
3149 .components-placeholder__input[type="url"]:focus { |
|
3150 border-color: #007cba; |
|
3151 border-color: var(--wp-admin-theme-color); |
|
3152 box-shadow: 0 0 0 0.5px #007cba; |
|
3153 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
|
3154 outline: 2px solid transparent; } |
|
3155 .components-placeholder__input[type="url"]::-webkit-input-placeholder { |
|
3156 color: rgba(30, 30, 30, 0.62); } |
|
3157 .components-placeholder__input[type="url"]::-moz-placeholder { |
|
3158 opacity: 1; |
|
3159 color: rgba(30, 30, 30, 0.62); } |
|
3160 .components-placeholder__input[type="url"]:-ms-input-placeholder { |
|
3161 color: rgba(30, 30, 30, 0.62); } |
|
3162 .is-dark-theme .components-placeholder__input[type="url"]::-webkit-input-placeholder { |
|
3163 color: rgba(255, 255, 255, 0.65); } |
|
3164 .is-dark-theme .components-placeholder__input[type="url"]::-moz-placeholder { |
|
3165 opacity: 1; |
|
3166 color: rgba(255, 255, 255, 0.65); } |
|
3167 .is-dark-theme .components-placeholder__input[type="url"]:-ms-input-placeholder { |
|
3168 color: rgba(255, 255, 255, 0.65); } |
2743 |
3169 |
2744 .components-placeholder__instructions { |
3170 .components-placeholder__instructions { |
2745 margin-bottom: 1em; } |
3171 margin-bottom: 1em; } |
|
3172 |
|
3173 .components-placeholder__error { |
|
3174 margin-top: 1em; |
|
3175 width: 100%; } |
|
3176 |
|
3177 .components-placeholder__preview img { |
|
3178 margin: 3%; |
|
3179 width: 50%; } |
|
3180 |
|
3181 .components-placeholder__fieldset .components-button { |
|
3182 margin-left: 12px; |
|
3183 margin-bottom: 12px; } |
|
3184 .components-placeholder__fieldset .components-button:last-child { |
|
3185 margin-bottom: 0; |
|
3186 margin-left: 0; } |
|
3187 |
|
3188 .components-placeholder__fieldset .components-button:not(.is-link) ~ .components-button.is-link { |
|
3189 margin-right: 10px; |
|
3190 margin-left: 10px; } |
|
3191 .components-placeholder__fieldset .components-button:not(.is-link) ~ .components-button.is-link:last-child { |
|
3192 margin-left: 0; } |
|
3193 |
|
3194 .components-placeholder.is-large .components-placeholder__label { |
|
3195 font-size: 18pt; |
|
3196 font-weight: normal; } |
|
3197 |
|
3198 .components-placeholder.is-medium .components-placeholder__instructions, .components-placeholder.is-small .components-placeholder__instructions { |
|
3199 display: none; } |
|
3200 |
|
3201 .components-placeholder.is-medium .components-placeholder__fieldset, |
|
3202 .components-placeholder.is-medium .components-placeholder__fieldset form, .components-placeholder.is-small .components-placeholder__fieldset, |
|
3203 .components-placeholder.is-small .components-placeholder__fieldset form { |
|
3204 flex-direction: column; } |
|
3205 |
|
3206 .components-placeholder.is-medium .components-placeholder__fieldset .components-button, .components-placeholder.is-small .components-placeholder__fieldset .components-button { |
|
3207 margin-left: auto; } |
|
3208 |
|
3209 .components-placeholder.is-small .components-button { |
|
3210 padding: 0 8px 2px; } |
2746 .components-popover { |
3211 .components-popover { |
2747 position: fixed; |
3212 position: fixed; |
2748 z-index: 1000000; |
3213 z-index: 1000000; |
2749 left: 50%; } |
3214 top: 0; |
2750 .components-popover.is-mobile { |
3215 left: 0; |
|
3216 opacity: 0; } |
|
3217 .components-popover.is-expanded, .components-popover[data-x-axis][data-y-axis] { |
|
3218 opacity: 1; } |
|
3219 .components-popover.is-expanded { |
2751 top: 0; |
3220 top: 0; |
2752 left: 0; |
3221 left: 0; |
2753 right: 0; |
3222 right: 0; |
2754 bottom: 0; } |
3223 bottom: 0; |
2755 .components-popover:not(.is-without-arrow):not(.is-mobile) { |
3224 z-index: 1000000 !important; } |
|
3225 .components-popover:not(.is-without-arrow) { |
2756 margin-left: 2px; } |
3226 margin-left: 2px; } |
2757 .components-popover:not(.is-without-arrow):not(.is-mobile)::before { |
3227 .components-popover:not(.is-without-arrow)::before { |
2758 border: 8px solid #e2e4e7; } |
3228 border: 8px solid #ccc; } |
2759 .components-popover:not(.is-without-arrow):not(.is-mobile)::after { |
3229 .components-popover:not(.is-without-arrow).is-alternate::before { |
|
3230 border-color: #1e1e1e; } |
|
3231 .components-popover:not(.is-without-arrow)::after { |
2760 border: 8px solid #fff; } |
3232 border: 8px solid #fff; } |
2761 .components-popover:not(.is-without-arrow):not(.is-mobile)::before, .components-popover:not(.is-without-arrow):not(.is-mobile)::after { |
3233 .components-popover:not(.is-without-arrow)::before, .components-popover:not(.is-without-arrow)::after { |
2762 content: ""; |
3234 content: ""; |
2763 position: absolute; |
3235 position: absolute; |
2764 height: 0; |
3236 height: 0; |
2765 width: 0; |
3237 width: 0; |
2766 line-height: 0; } |
3238 line-height: 0; } |
2767 .components-popover:not(.is-without-arrow):not(.is-mobile).is-top { |
3239 .components-popover:not(.is-without-arrow)[data-y-axis="top"] { |
2768 margin-top: -8px; } |
3240 margin-top: -8px; } |
2769 .components-popover:not(.is-without-arrow):not(.is-mobile).is-top::before { |
3241 .components-popover:not(.is-without-arrow)[data-y-axis="top"]::before { |
2770 bottom: -8px; } |
3242 bottom: -8px; } |
2771 .components-popover:not(.is-without-arrow):not(.is-mobile).is-top::after { |
3243 .components-popover:not(.is-without-arrow)[data-y-axis="top"]::after { |
2772 bottom: -6px; } |
3244 bottom: -6px; } |
2773 .components-popover:not(.is-without-arrow):not(.is-mobile).is-top::before, .components-popover:not(.is-without-arrow):not(.is-mobile).is-top::after { |
3245 .components-popover:not(.is-without-arrow)[data-y-axis="top"]::before, .components-popover:not(.is-without-arrow)[data-y-axis="top"]::after { |
2774 border-bottom: none; |
3246 border-bottom: none; |
2775 border-left-color: transparent; |
3247 border-left-color: transparent; |
2776 border-right-color: transparent; |
3248 border-right-color: transparent; |
2777 border-top-style: solid; |
3249 border-top-style: solid; |
2778 margin-left: -10px; } |
3250 margin-left: -10px; } |
2779 .components-popover:not(.is-without-arrow):not(.is-mobile).is-bottom { |
3251 .components-popover:not(.is-without-arrow)[data-y-axis="bottom"] { |
2780 margin-top: 8px; } |
3252 margin-top: 8px; } |
2781 .components-popover:not(.is-without-arrow):not(.is-mobile).is-bottom::before { |
3253 .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::before { |
2782 top: -8px; } |
3254 top: -8px; } |
2783 .components-popover:not(.is-without-arrow):not(.is-mobile).is-bottom::after { |
3255 .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::after { |
2784 top: -6px; } |
3256 top: -6px; } |
2785 .components-popover:not(.is-without-arrow):not(.is-mobile).is-bottom::before, .components-popover:not(.is-without-arrow):not(.is-mobile).is-bottom::after { |
3257 .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::before, .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::after { |
2786 border-bottom-style: solid; |
3258 border-bottom-style: solid; |
2787 border-left-color: transparent; |
3259 border-left-color: transparent; |
2788 border-right-color: transparent; |
3260 border-right-color: transparent; |
2789 border-top: none; |
3261 border-top: none; |
2790 margin-left: -10px; } |
3262 margin-left: -10px; } |
2791 .components-popover:not(.is-without-arrow):not(.is-mobile).is-middle.is-left { |
3263 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"] { |
2792 margin-left: -8px; } |
3264 margin-left: -8px; } |
2793 .components-popover:not(.is-without-arrow):not(.is-mobile).is-middle.is-left::before { |
3265 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"]::before { |
2794 right: -8px; } |
3266 right: -8px; } |
2795 .components-popover:not(.is-without-arrow):not(.is-mobile).is-middle.is-left::after { |
3267 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"]::after { |
2796 right: -6px; } |
3268 right: -6px; } |
2797 .components-popover:not(.is-without-arrow):not(.is-mobile).is-middle.is-left::before, .components-popover:not(.is-without-arrow):not(.is-mobile).is-middle.is-left::after { |
3269 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"]::before, .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"]::after { |
2798 border-bottom-color: transparent; |
3270 border-bottom-color: transparent; |
2799 border-left-style: solid; |
3271 border-left-style: solid; |
2800 border-right: none; |
3272 border-right: none; |
2801 border-top-color: transparent; } |
3273 border-top-color: transparent; } |
2802 .components-popover:not(.is-without-arrow):not(.is-mobile).is-middle.is-right { |
3274 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"] { |
2803 margin-left: 8px; } |
3275 margin-left: 8px; } |
2804 .components-popover:not(.is-without-arrow):not(.is-mobile).is-middle.is-right::before { |
3276 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"]::before { |
2805 left: -8px; } |
3277 left: -8px; } |
2806 .components-popover:not(.is-without-arrow):not(.is-mobile).is-middle.is-right::after { |
3278 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"]::after { |
2807 left: -6px; } |
3279 left: -6px; } |
2808 .components-popover:not(.is-without-arrow):not(.is-mobile).is-middle.is-right::before, .components-popover:not(.is-without-arrow):not(.is-mobile).is-middle.is-right::after { |
3280 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"]::before, .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"]::after { |
2809 border-bottom-color: transparent; |
3281 border-bottom-color: transparent; |
2810 border-left: none; |
3282 border-left: none; |
2811 border-right-style: solid; |
3283 border-right-style: solid; |
2812 border-top-color: transparent; } |
3284 border-top-color: transparent; } |
2813 .components-popover:not(.is-mobile).is-top { |
3285 .components-popover[data-y-axis="top"] { |
2814 bottom: 100%; } |
3286 bottom: 100%; } |
2815 .components-popover:not(.is-mobile).is-bottom { |
3287 .components-popover[data-y-axis="bottom"] { |
2816 top: 100%; |
3288 top: 100%; } |
2817 z-index: 99990; } |
3289 .components-popover[data-y-axis="middle"] { |
2818 .components-popover:not(.is-mobile).is-middle { |
|
2819 align-items: center; |
3290 align-items: center; |
2820 display: flex; } |
3291 display: flex; } |
|
3292 .components-popover.is-from-top { |
|
3293 margin-top: 12px; } |
|
3294 .components-popover.is-from-bottom { |
|
3295 margin-top: -12px; } |
|
3296 .components-popover.is-from-left:not(.is-from-top):not(.is-from-bottom) { |
|
3297 margin-left: 12px; } |
|
3298 .components-popover.is-from-right:not(.is-from-top):not(.is-from-bottom) { |
|
3299 margin-right: 12px; } |
2821 |
3300 |
2822 .components-popover__content { |
3301 .components-popover__content { |
2823 box-shadow: 0 3px 30px rgba(25, 30, 35, 0.1); |
3302 height: 100%; |
2824 border: 1px solid #e2e4e7; |
|
2825 background: #fff; |
3303 background: #fff; |
2826 height: 100%; } |
3304 border: 1px solid #ccc; |
2827 .components-popover.is-mobile .components-popover__content { |
3305 box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05); |
2828 height: calc(100% - 50px); |
3306 border-radius: 2px; } |
2829 border-top: 0; } |
3307 .is-alternate .components-popover__content { |
2830 .components-popover:not(.is-mobile) .components-popover__content { |
3308 border: 1px solid #1e1e1e; |
|
3309 box-shadow: none; } |
|
3310 .components-popover .components-popover__content { |
2831 position: absolute; |
3311 position: absolute; |
2832 height: auto; |
3312 height: auto; |
2833 overflow-y: auto; |
3313 overflow-y: auto; |
2834 min-width: 260px; } |
3314 min-width: 260px; } |
2835 .components-popover:not(.is-mobile).is-top .components-popover__content { |
3315 .components-popover.is-expanded .components-popover__content { |
|
3316 position: static; |
|
3317 height: calc(100% - 48px); |
|
3318 overflow-y: visible; |
|
3319 min-width: auto; |
|
3320 border: none; |
|
3321 border-top: 1px solid #1e1e1e; } |
|
3322 .components-popover[data-y-axis="top"] .components-popover__content { |
2836 bottom: 100%; } |
3323 bottom: 100%; } |
2837 .components-popover:not(.is-mobile).is-center .components-popover__content { |
3324 .components-popover[data-x-axis="center"] .components-popover__content { |
2838 left: 50%; |
3325 left: 50%; |
2839 transform: translateX(-50%); } |
3326 transform: translateX(-50%); } |
2840 .components-popover:not(.is-mobile).is-right .components-popover__content { |
3327 .components-popover[data-x-axis="right"] .components-popover__content { |
2841 position: absolute; |
3328 position: absolute; |
2842 left: 100%; } |
3329 left: 100%; } |
2843 .components-popover:not(.is-mobile):not(.is-middle).is-right .components-popover__content { |
3330 .components-popover:not([data-y-axis="middle"])[data-x-axis="right"] .components-popover__content { |
2844 margin-left: -24px; } |
3331 margin-left: -25px; } |
2845 .components-popover:not(.is-mobile).is-left .components-popover__content { |
3332 .components-popover[data-x-axis="left"] .components-popover__content { |
2846 position: absolute; |
3333 position: absolute; |
2847 right: 100%; } |
3334 right: 100%; } |
2848 .components-popover:not(.is-mobile):not(.is-middle).is-left .components-popover__content { |
3335 .components-popover:not([data-y-axis="middle"])[data-x-axis="left"] .components-popover__content { |
2849 margin-right: -24px; } |
3336 margin-right: -25px; } |
2850 |
|
2851 .components-popover__content > div { |
|
2852 height: 100%; } |
|
2853 |
3337 |
2854 .components-popover__header { |
3338 .components-popover__header { |
2855 align-items: center; |
3339 align-items: center; |
2856 background: #fff; |
3340 background: #fff; |
2857 border: 1px solid #e2e4e7; |
|
2858 display: flex; |
3341 display: flex; |
2859 height: 50px; |
3342 height: 48px; |
2860 justify-content: space-between; |
3343 justify-content: space-between; |
2861 padding: 0 8px 0 16px; } |
3344 padding: 0 8px 0 16px; } |
2862 |
3345 |
2863 .components-popover__header-title { |
3346 .components-popover__header-title { |
2864 overflow: hidden; |
3347 overflow: hidden; |
2865 text-overflow: ellipsis; |
3348 text-overflow: ellipsis; |
2866 white-space: nowrap; |
3349 white-space: nowrap; |
2867 width: 100%; } |
3350 width: 100%; } |
2868 |
3351 |
2869 .components-popover__close.components-icon-button { |
3352 .components-popover__close.components-button { |
2870 z-index: 5; } |
3353 z-index: 5; } |
2871 .components-radio-control { |
3354 .components-radio-control { |
2872 display: flex; |
3355 display: flex; |
2873 flex-direction: column; } |
3356 flex-direction: column; } |
|
3357 .components-radio-control .components-base-control__help { |
|
3358 margin-top: 0; } |
|
3359 .components-radio-control .components-base-control__field { |
|
3360 margin-bottom: 0; } |
2874 |
3361 |
2875 .components-radio-control__option:not(:last-child) { |
3362 .components-radio-control__option:not(:last-child) { |
2876 margin-bottom: 4px; } |
3363 margin-bottom: 4px; } |
2877 |
3364 |
2878 .components-radio-control__input[type="radio"] { |
3365 .components-radio-control__input[type="radio"] { |
|
3366 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
3367 padding: 6px 8px; |
|
3368 box-shadow: 0 0 0 transparent; |
|
3369 transition: box-shadow 0.1s linear; |
|
3370 border-radius: 2px; |
|
3371 border: 1px solid #757575; |
|
3372 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
|
3373 font-size: 16px; |
|
3374 /* Override core line-height. To be reviewed. */ |
|
3375 line-height: normal; |
|
3376 border: 1px solid #1e1e1e; |
|
3377 margin-left: 12px; |
|
3378 transition: none; |
|
3379 border-radius: 50%; |
2879 margin-top: 0; |
3380 margin-top: 0; |
2880 margin-left: 6px; } |
3381 margin-left: 6px; } |
2881 |
3382 @media (prefers-reduced-motion: reduce) { |
2882 .components-range-control .components-base-control__field { |
3383 .components-radio-control__input[type="radio"] { |
2883 display: flex; |
3384 transition-duration: 0s; } } |
2884 justify-content: center; |
3385 @media (min-width: 600px) { |
2885 flex-wrap: wrap; |
3386 .components-radio-control__input[type="radio"] { |
2886 align-items: center; } |
3387 font-size: 13px; |
2887 |
3388 /* Override core line-height. To be reviewed. */ |
2888 .components-range-control .dashicon { |
3389 line-height: normal; } } |
2889 flex-shrink: 0; |
3390 .components-radio-control__input[type="radio"]:focus { |
2890 margin-left: 10px; } |
3391 border-color: #007cba; |
2891 |
3392 border-color: var(--wp-admin-theme-color); |
2892 .components-range-control .components-base-control__label { |
3393 box-shadow: 0 0 0 0.5px #007cba; |
2893 width: 100%; } |
3394 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
2894 |
3395 outline: 2px solid transparent; } |
2895 .components-range-control .components-range-control__slider { |
3396 .components-radio-control__input[type="radio"]::-webkit-input-placeholder { |
2896 margin-right: 0; |
3397 color: rgba(30, 30, 30, 0.62); } |
2897 flex: 1; } |
3398 .components-radio-control__input[type="radio"]::-moz-placeholder { |
2898 |
3399 opacity: 1; |
2899 .components-range-control__slider { |
3400 color: rgba(30, 30, 30, 0.62); } |
2900 width: 100%; |
3401 .components-radio-control__input[type="radio"]:-ms-input-placeholder { |
2901 margin-right: 8px; |
3402 color: rgba(30, 30, 30, 0.62); } |
2902 padding: 0; |
3403 .is-dark-theme .components-radio-control__input[type="radio"]::-webkit-input-placeholder { |
2903 -webkit-appearance: none; |
3404 color: rgba(255, 255, 255, 0.65); } |
2904 background: transparent; |
3405 .is-dark-theme .components-radio-control__input[type="radio"]::-moz-placeholder { |
2905 /** |
3406 opacity: 1; |
2906 * Thumb |
3407 color: rgba(255, 255, 255, 0.65); } |
2907 */ |
3408 .is-dark-theme .components-radio-control__input[type="radio"]:-ms-input-placeholder { |
2908 /** |
3409 color: rgba(255, 255, 255, 0.65); } |
2909 * Track |
3410 .components-radio-control__input[type="radio"]:checked::before { |
2910 */ } |
3411 width: 7px; |
2911 .components-range-control__slider::-webkit-slider-thumb { |
3412 height: 7px; |
2912 -webkit-appearance: none; |
3413 margin: 8px 8px 0 0; |
2913 height: 18px; |
|
2914 width: 18px; |
|
2915 border-radius: 50%; |
|
2916 cursor: pointer; |
|
2917 background: #555d66; |
|
2918 border: 4px solid transparent; |
|
2919 background-clip: padding-box; |
|
2920 box-sizing: border-box; |
|
2921 margin-top: -7px; } |
|
2922 .components-range-control__slider::-moz-range-thumb { |
|
2923 height: 18px; |
|
2924 width: 18px; |
|
2925 border-radius: 50%; |
|
2926 cursor: pointer; |
|
2927 background: #555d66; |
|
2928 border: 4px solid transparent; |
|
2929 background-clip: padding-box; |
|
2930 box-sizing: border-box; } |
|
2931 .components-range-control__slider::-ms-thumb { |
|
2932 height: 18px; |
|
2933 width: 18px; |
|
2934 border-radius: 50%; |
|
2935 cursor: pointer; |
|
2936 background: #555d66; |
|
2937 border: 4px solid transparent; |
|
2938 background-clip: padding-box; |
|
2939 box-sizing: border-box; |
|
2940 margin-top: 0; |
|
2941 height: 14px; |
|
2942 width: 14px; |
|
2943 border: 2px solid transparent; } |
|
2944 .components-range-control__slider:focus { |
|
2945 outline: none; } |
|
2946 .components-range-control__slider:focus::-webkit-slider-thumb { |
|
2947 background-color: #fff; |
3414 background-color: #fff; |
2948 color: #191e23; |
3415 border: 3px solid #fff; } |
2949 box-shadow: inset 0 0 0 1px #6c7781, inset 0 0 0 2px #fff; |
3416 @media (min-width: 782px) { |
2950 outline: 2px solid transparent; |
3417 .components-radio-control__input[type="radio"]:checked::before { |
2951 outline-offset: -2px; } |
3418 width: 6px; |
2952 .components-range-control__slider:focus::-moz-range-thumb { |
3419 height: 6px; |
2953 background-color: #fff; |
3420 margin: 4px 4px 0 0; } } |
2954 color: #191e23; |
3421 .components-radio-control__input[type="radio"]:focus { |
2955 box-shadow: inset 0 0 0 1px #6c7781, inset 0 0 0 2px #fff; |
3422 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #007cba; |
2956 outline: 2px solid transparent; |
3423 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--wp-admin-theme-color); |
2957 outline-offset: -2px; } |
3424 outline: 2px solid transparent; } |
2958 .components-range-control__slider:focus::-ms-thumb { |
3425 .components-radio-control__input[type="radio"]:checked { |
2959 background-color: #fff; |
3426 background: #007cba; |
2960 color: #191e23; |
3427 background: var(--wp-admin-theme-color); |
2961 box-shadow: inset 0 0 0 1px #6c7781, inset 0 0 0 2px #fff; |
3428 border-color: #007cba; |
2962 outline: 2px solid transparent; |
3429 border-color: var(--wp-admin-theme-color); } |
2963 outline-offset: -2px; } |
|
2964 .components-range-control__slider::-webkit-slider-runnable-track { |
|
2965 height: 3px; |
|
2966 cursor: pointer; |
|
2967 background: #e2e4e7; |
|
2968 border-radius: 1.5px; |
|
2969 margin-top: -4px; } |
|
2970 .components-range-control__slider::-moz-range-track { |
|
2971 height: 3px; |
|
2972 cursor: pointer; |
|
2973 background: #e2e4e7; |
|
2974 border-radius: 1.5px; } |
|
2975 .components-range-control__slider::-ms-track { |
|
2976 margin-top: -4px; |
|
2977 background: transparent; |
|
2978 border-color: transparent; |
|
2979 color: transparent; |
|
2980 height: 3px; |
|
2981 cursor: pointer; |
|
2982 background: #e2e4e7; |
|
2983 border-radius: 1.5px; } |
|
2984 |
|
2985 .components-range-control__number { |
|
2986 display: inline-block; |
|
2987 margin-right: 8px; |
|
2988 font-weight: 500; |
|
2989 width: 54px; } |
|
2990 |
3430 |
2991 .components-resizable-box__handle { |
3431 .components-resizable-box__handle { |
2992 display: none; |
3432 display: none; |
2993 width: 24px; |
3433 width: 23px; |
2994 height: 24px; |
3434 height: 23px; } |
2995 padding: 4px; } |
3435 .components-resizable-box__container.has-show-handle .components-resizable-box__handle { |
2996 .components-resizable-box__container.is-selected .components-resizable-box__handle { |
|
2997 display: block; } |
3436 display: block; } |
2998 |
3437 |
2999 .components-resizable-box__handle::before { |
3438 .components-resizable-box__handle::after { |
3000 display: block; |
3439 display: block; |
3001 content: ""; |
3440 content: ""; |
3002 width: 16px; |
3441 width: 15px; |
3003 height: 16px; |
3442 height: 15px; |
3004 border: 2px solid #fff; |
3443 border: 2px solid #fff; |
3005 border-radius: 50%; |
3444 border-radius: 50%; |
3006 background: #0085ba; |
3445 background: #007cba; |
3007 cursor: inherit; } |
3446 background: var(--wp-admin-theme-color); |
3008 |
3447 cursor: inherit; |
3009 body.admin-color-sunrise .components-resizable-box__handle::before { |
3448 position: absolute; |
3010 background: #d1864a; } |
3449 top: calc(50% - 8px); |
3011 |
3450 left: calc(50% - 8px); } |
3012 body.admin-color-ocean .components-resizable-box__handle::before { |
3451 |
3013 background: #a3b9a2; } |
3452 .components-resizable-box__side-handle::before { |
3014 |
3453 display: block; |
3015 body.admin-color-midnight .components-resizable-box__handle::before { |
3454 content: ""; |
3016 background: #e14d43; } |
3455 width: 7px; |
3017 |
3456 height: 7px; |
3018 body.admin-color-ectoplasm .components-resizable-box__handle::before { |
3457 border: 2px solid #fff; |
3019 background: #a7b656; } |
3458 background: #007cba; |
3020 |
3459 background: var(--wp-admin-theme-color); |
3021 body.admin-color-coffee .components-resizable-box__handle::before { |
3460 cursor: inherit; |
3022 background: #c2a68c; } |
3461 position: absolute; |
3023 |
3462 top: calc(50% - 4px); |
3024 body.admin-color-blue .components-resizable-box__handle::before { |
3463 left: calc(50% - 4px); |
3025 background: #82b4cb; } |
3464 transition: transform 0.1s ease-in; |
3026 |
3465 opacity: 0; } |
3027 body.admin-color-light .components-resizable-box__handle::before { |
3466 @media (prefers-reduced-motion: reduce) { |
3028 background: #0085ba; } |
3467 .components-resizable-box__side-handle::before { |
|
3468 transition-duration: 0s; } } |
|
3469 |
|
3470 .is-dark-theme .components-resizable-box__side-handle::before, |
|
3471 .is-dark-theme .components-resizable-box__handle::after { |
|
3472 border-color: #d7dade; } |
|
3473 |
|
3474 .components-resizable-box__handle { |
|
3475 z-index: 2; } |
|
3476 |
|
3477 .components-resizable-box__side-handle { |
|
3478 z-index: 2; } |
|
3479 |
|
3480 .components-resizable-box__corner-handle { |
|
3481 z-index: 2; } |
|
3482 |
|
3483 .components-resizable-box__side-handle.components-resizable-box__handle-top, |
|
3484 .components-resizable-box__side-handle.components-resizable-box__handle-bottom, |
|
3485 .components-resizable-box__side-handle.components-resizable-box__handle-top::before, |
|
3486 .components-resizable-box__side-handle.components-resizable-box__handle-bottom::before { |
|
3487 width: 100%; |
|
3488 right: 0; |
|
3489 border-right: 0; |
|
3490 border-left: 0; } |
|
3491 |
|
3492 .components-resizable-box__side-handle.components-resizable-box__handle-left, |
|
3493 .components-resizable-box__side-handle.components-resizable-box__handle-right, |
|
3494 .components-resizable-box__side-handle.components-resizable-box__handle-left::before, |
|
3495 .components-resizable-box__side-handle.components-resizable-box__handle-right::before { |
|
3496 height: 100%; |
|
3497 top: 0; |
|
3498 border-top: 0; |
|
3499 border-bottom: 0; } |
|
3500 |
|
3501 .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before, |
|
3502 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before, |
|
3503 .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before, |
|
3504 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before { |
|
3505 animation: components-resizable-box__top-bottom-animation 0.1s ease-out 0s; |
|
3506 animation-fill-mode: forwards; } |
|
3507 @media (prefers-reduced-motion: reduce) { |
|
3508 .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before, |
|
3509 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before, |
|
3510 .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before, |
|
3511 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before { |
|
3512 animation-duration: 1ms; } } |
|
3513 |
|
3514 .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before, |
|
3515 .components-resizable-box__side-handle.components-resizable-box__handle-right:hover::before, |
|
3516 .components-resizable-box__side-handle.components-resizable-box__handle-left:active::before, |
|
3517 .components-resizable-box__side-handle.components-resizable-box__handle-right:active::before { |
|
3518 animation: components-resizable-box__left-right-animation 0.1s ease-out 0s; |
|
3519 animation-fill-mode: forwards; } |
|
3520 @media (prefers-reduced-motion: reduce) { |
|
3521 .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before, |
|
3522 .components-resizable-box__side-handle.components-resizable-box__handle-right:hover::before, |
|
3523 .components-resizable-box__side-handle.components-resizable-box__handle-left:active::before, |
|
3524 .components-resizable-box__side-handle.components-resizable-box__handle-right:active::before { |
|
3525 animation-duration: 1ms; } } |
|
3526 |
|
3527 @keyframes components-resizable-box__top-bottom-animation { |
|
3528 from { |
|
3529 transform: scaleX(0); |
|
3530 opacity: 0; } |
|
3531 to { |
|
3532 transform: scaleX(1); |
|
3533 opacity: 1; } } |
|
3534 |
|
3535 @keyframes components-resizable-box__left-right-animation { |
|
3536 from { |
|
3537 transform: scaleY(0); |
|
3538 opacity: 0; } |
|
3539 to { |
|
3540 transform: scaleY(1); |
|
3541 opacity: 1; } } |
3029 .components-resizable-box__handle-right { |
3542 .components-resizable-box__handle-right { |
3030 top: calc(50% - 12px); |
3543 right: calc(11.5px * -1); } |
3031 right: calc(12px * -1); } |
3544 |
|
3545 .components-resizable-box__handle-left { |
|
3546 left: calc(11.5px * -1); } |
|
3547 |
|
3548 .components-resizable-box__handle-top { |
|
3549 top: calc(11.5px * -1); } |
3032 |
3550 |
3033 .components-resizable-box__handle-bottom { |
3551 .components-resizable-box__handle-bottom { |
3034 bottom: calc(12px * -1); |
3552 bottom: calc(11.5px * -1); } |
3035 left: calc(50% - 12px); } |
|
3036 |
|
3037 .components-resizable-box__handle-left { |
|
3038 top: calc(50% - 12px); |
|
3039 left: calc(12px * -1); } |
|
3040 .components-responsive-wrapper { |
3553 .components-responsive-wrapper { |
3041 position: relative; |
3554 position: relative; |
3042 max-width: 100%; } |
3555 max-width: 100%; } |
|
3556 .components-responsive-wrapper, |
|
3557 .components-responsive-wrapper > span { |
|
3558 display: block; } |
3043 |
3559 |
3044 .components-responsive-wrapper__content { |
3560 .components-responsive-wrapper__content { |
3045 position: absolute; |
3561 position: absolute; |
3046 top: 0; |
3562 top: 0; |
3047 left: 0; |
3563 left: 0; |
3048 bottom: 0; |
3564 bottom: 0; |
3049 right: 0; |
3565 right: 0; |
3050 width: 100%; |
3566 width: 100%; |
3051 height: 100%; } |
3567 height: 100%; |
|
3568 margin: auto; } |
3052 |
3569 |
3053 .components-sandbox { |
3570 .components-sandbox { |
3054 overflow: hidden; } |
3571 overflow: hidden; } |
|
3572 |
|
3573 iframe.components-sandbox { |
|
3574 width: 100%; } |
3055 |
3575 |
3056 html.lockscroll, |
3576 html.lockscroll, |
3057 body.lockscroll { |
3577 body.lockscroll { |
3058 overflow: hidden; } |
3578 overflow: hidden; } |
3059 |
3579 |
3100 from { |
3672 from { |
3101 transform: rotate(0deg); } |
3673 transform: rotate(0deg); } |
3102 to { |
3674 to { |
3103 transform: rotate(-360deg); } } |
3675 transform: rotate(-360deg); } } |
3104 |
3676 |
3105 .components-text-control__input { |
3677 .components-tab-panel__tabs { |
|
3678 display: flex; |
|
3679 align-items: stretch; } |
|
3680 |
|
3681 .components-tab-panel__tabs-item { |
|
3682 background: transparent; |
|
3683 border: none; |
|
3684 box-shadow: none; |
|
3685 border-radius: 0; |
|
3686 cursor: pointer; |
|
3687 height: 48px; |
|
3688 padding: 3px 16px; |
|
3689 margin-right: 0; |
|
3690 font-weight: 500; |
|
3691 transition: box-shadow 0.1s linear; |
|
3692 box-sizing: border-box; } |
|
3693 .components-tab-panel__tabs-item::after { |
|
3694 content: attr(data-label); |
|
3695 display: block; |
|
3696 height: 0; |
|
3697 overflow: hidden; |
|
3698 speak: none; |
|
3699 visibility: hidden; } |
|
3700 .components-tab-panel__tabs-item:focus:not(:disabled) { |
|
3701 box-shadow: inset 0 1.5px #007cba; |
|
3702 box-shadow: inset 0 1.5px var(--wp-admin-theme-color); } |
|
3703 .components-tab-panel__tabs-item.is-active { |
|
3704 box-shadow: inset 0 0 0 1.5px transparent, inset 0 -4px 0 0 #007cba; |
|
3705 box-shadow: inset 0 0 0 1.5px transparent, inset 0 -4px 0 0 var(--wp-admin-theme-color); |
|
3706 position: relative; } |
|
3707 .components-tab-panel__tabs-item.is-active::before { |
|
3708 content: ""; |
|
3709 position: absolute; |
|
3710 top: 0; |
|
3711 bottom: 1px; |
|
3712 left: 0; |
|
3713 right: 0; |
|
3714 border-bottom: 4px solid transparent; } |
|
3715 .components-tab-panel__tabs-item:focus { |
|
3716 box-shadow: inset 0 0 0 1.5px #007cba; |
|
3717 box-shadow: inset 0 0 0 1.5px var(--wp-admin-theme-color); } |
|
3718 .components-tab-panel__tabs-item.is-active:focus { |
|
3719 box-shadow: inset 0 0 0 1.5px #007cba, inset 0 -4px 0 0 #007cba; |
|
3720 box-shadow: inset 0 0 0 1.5px var(--wp-admin-theme-color), inset 0 -4px 0 0 var(--wp-admin-theme-color); } |
|
3721 |
|
3722 .components-text-control__input, |
|
3723 .components-text-control__input[type="text"], |
|
3724 .components-text-control__input[type="tel"], |
|
3725 .components-text-control__input[type="time"], |
|
3726 .components-text-control__input[type="url"], |
|
3727 .components-text-control__input[type="week"], |
|
3728 .components-text-control__input[type="password"], |
|
3729 .components-text-control__input[type="color"], |
|
3730 .components-text-control__input[type="date"], |
|
3731 .components-text-control__input[type="datetime"], |
|
3732 .components-text-control__input[type="datetime-local"], |
|
3733 .components-text-control__input[type="email"], |
|
3734 .components-text-control__input[type="month"], |
|
3735 .components-text-control__input[type="number"] { |
3106 width: 100%; |
3736 width: 100%; |
3107 padding: 6px 8px; } |
3737 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
3738 padding: 6px 8px; |
|
3739 box-shadow: 0 0 0 transparent; |
|
3740 transition: box-shadow 0.1s linear; |
|
3741 border-radius: 2px; |
|
3742 border: 1px solid #757575; |
|
3743 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
|
3744 font-size: 16px; |
|
3745 /* Override core line-height. To be reviewed. */ |
|
3746 line-height: normal; } |
|
3747 @media (prefers-reduced-motion: reduce) { |
|
3748 .components-text-control__input, |
|
3749 .components-text-control__input[type="text"], |
|
3750 .components-text-control__input[type="tel"], |
|
3751 .components-text-control__input[type="time"], |
|
3752 .components-text-control__input[type="url"], |
|
3753 .components-text-control__input[type="week"], |
|
3754 .components-text-control__input[type="password"], |
|
3755 .components-text-control__input[type="color"], |
|
3756 .components-text-control__input[type="date"], |
|
3757 .components-text-control__input[type="datetime"], |
|
3758 .components-text-control__input[type="datetime-local"], |
|
3759 .components-text-control__input[type="email"], |
|
3760 .components-text-control__input[type="month"], |
|
3761 .components-text-control__input[type="number"] { |
|
3762 transition-duration: 0s; } } |
|
3763 @media (min-width: 600px) { |
|
3764 .components-text-control__input, |
|
3765 .components-text-control__input[type="text"], |
|
3766 .components-text-control__input[type="tel"], |
|
3767 .components-text-control__input[type="time"], |
|
3768 .components-text-control__input[type="url"], |
|
3769 .components-text-control__input[type="week"], |
|
3770 .components-text-control__input[type="password"], |
|
3771 .components-text-control__input[type="color"], |
|
3772 .components-text-control__input[type="date"], |
|
3773 .components-text-control__input[type="datetime"], |
|
3774 .components-text-control__input[type="datetime-local"], |
|
3775 .components-text-control__input[type="email"], |
|
3776 .components-text-control__input[type="month"], |
|
3777 .components-text-control__input[type="number"] { |
|
3778 font-size: 13px; |
|
3779 /* Override core line-height. To be reviewed. */ |
|
3780 line-height: normal; } } |
|
3781 .components-text-control__input:focus, |
|
3782 .components-text-control__input[type="text"]:focus, |
|
3783 .components-text-control__input[type="tel"]:focus, |
|
3784 .components-text-control__input[type="time"]:focus, |
|
3785 .components-text-control__input[type="url"]:focus, |
|
3786 .components-text-control__input[type="week"]:focus, |
|
3787 .components-text-control__input[type="password"]:focus, |
|
3788 .components-text-control__input[type="color"]:focus, |
|
3789 .components-text-control__input[type="date"]:focus, |
|
3790 .components-text-control__input[type="datetime"]:focus, |
|
3791 .components-text-control__input[type="datetime-local"]:focus, |
|
3792 .components-text-control__input[type="email"]:focus, |
|
3793 .components-text-control__input[type="month"]:focus, |
|
3794 .components-text-control__input[type="number"]:focus { |
|
3795 border-color: #007cba; |
|
3796 border-color: var(--wp-admin-theme-color); |
|
3797 box-shadow: 0 0 0 0.5px #007cba; |
|
3798 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
|
3799 outline: 2px solid transparent; } |
|
3800 .components-text-control__input::-webkit-input-placeholder, |
|
3801 .components-text-control__input[type="text"]::-webkit-input-placeholder, |
|
3802 .components-text-control__input[type="tel"]::-webkit-input-placeholder, |
|
3803 .components-text-control__input[type="time"]::-webkit-input-placeholder, |
|
3804 .components-text-control__input[type="url"]::-webkit-input-placeholder, |
|
3805 .components-text-control__input[type="week"]::-webkit-input-placeholder, |
|
3806 .components-text-control__input[type="password"]::-webkit-input-placeholder, |
|
3807 .components-text-control__input[type="color"]::-webkit-input-placeholder, |
|
3808 .components-text-control__input[type="date"]::-webkit-input-placeholder, |
|
3809 .components-text-control__input[type="datetime"]::-webkit-input-placeholder, |
|
3810 .components-text-control__input[type="datetime-local"]::-webkit-input-placeholder, |
|
3811 .components-text-control__input[type="email"]::-webkit-input-placeholder, |
|
3812 .components-text-control__input[type="month"]::-webkit-input-placeholder, |
|
3813 .components-text-control__input[type="number"]::-webkit-input-placeholder { |
|
3814 color: rgba(30, 30, 30, 0.62); } |
|
3815 .components-text-control__input::-moz-placeholder, |
|
3816 .components-text-control__input[type="text"]::-moz-placeholder, |
|
3817 .components-text-control__input[type="tel"]::-moz-placeholder, |
|
3818 .components-text-control__input[type="time"]::-moz-placeholder, |
|
3819 .components-text-control__input[type="url"]::-moz-placeholder, |
|
3820 .components-text-control__input[type="week"]::-moz-placeholder, |
|
3821 .components-text-control__input[type="password"]::-moz-placeholder, |
|
3822 .components-text-control__input[type="color"]::-moz-placeholder, |
|
3823 .components-text-control__input[type="date"]::-moz-placeholder, |
|
3824 .components-text-control__input[type="datetime"]::-moz-placeholder, |
|
3825 .components-text-control__input[type="datetime-local"]::-moz-placeholder, |
|
3826 .components-text-control__input[type="email"]::-moz-placeholder, |
|
3827 .components-text-control__input[type="month"]::-moz-placeholder, |
|
3828 .components-text-control__input[type="number"]::-moz-placeholder { |
|
3829 opacity: 1; |
|
3830 color: rgba(30, 30, 30, 0.62); } |
|
3831 .components-text-control__input:-ms-input-placeholder, |
|
3832 .components-text-control__input[type="text"]:-ms-input-placeholder, |
|
3833 .components-text-control__input[type="tel"]:-ms-input-placeholder, |
|
3834 .components-text-control__input[type="time"]:-ms-input-placeholder, |
|
3835 .components-text-control__input[type="url"]:-ms-input-placeholder, |
|
3836 .components-text-control__input[type="week"]:-ms-input-placeholder, |
|
3837 .components-text-control__input[type="password"]:-ms-input-placeholder, |
|
3838 .components-text-control__input[type="color"]:-ms-input-placeholder, |
|
3839 .components-text-control__input[type="date"]:-ms-input-placeholder, |
|
3840 .components-text-control__input[type="datetime"]:-ms-input-placeholder, |
|
3841 .components-text-control__input[type="datetime-local"]:-ms-input-placeholder, |
|
3842 .components-text-control__input[type="email"]:-ms-input-placeholder, |
|
3843 .components-text-control__input[type="month"]:-ms-input-placeholder, |
|
3844 .components-text-control__input[type="number"]:-ms-input-placeholder { |
|
3845 color: rgba(30, 30, 30, 0.62); } |
|
3846 .is-dark-theme .components-text-control__input::-webkit-input-placeholder, .is-dark-theme |
|
3847 .components-text-control__input[type="text"]::-webkit-input-placeholder, .is-dark-theme |
|
3848 .components-text-control__input[type="tel"]::-webkit-input-placeholder, .is-dark-theme |
|
3849 .components-text-control__input[type="time"]::-webkit-input-placeholder, .is-dark-theme |
|
3850 .components-text-control__input[type="url"]::-webkit-input-placeholder, .is-dark-theme |
|
3851 .components-text-control__input[type="week"]::-webkit-input-placeholder, .is-dark-theme |
|
3852 .components-text-control__input[type="password"]::-webkit-input-placeholder, .is-dark-theme |
|
3853 .components-text-control__input[type="color"]::-webkit-input-placeholder, .is-dark-theme |
|
3854 .components-text-control__input[type="date"]::-webkit-input-placeholder, .is-dark-theme |
|
3855 .components-text-control__input[type="datetime"]::-webkit-input-placeholder, .is-dark-theme |
|
3856 .components-text-control__input[type="datetime-local"]::-webkit-input-placeholder, .is-dark-theme |
|
3857 .components-text-control__input[type="email"]::-webkit-input-placeholder, .is-dark-theme |
|
3858 .components-text-control__input[type="month"]::-webkit-input-placeholder, .is-dark-theme |
|
3859 .components-text-control__input[type="number"]::-webkit-input-placeholder { |
|
3860 color: rgba(255, 255, 255, 0.65); } |
|
3861 .is-dark-theme .components-text-control__input::-moz-placeholder, .is-dark-theme |
|
3862 .components-text-control__input[type="text"]::-moz-placeholder, .is-dark-theme |
|
3863 .components-text-control__input[type="tel"]::-moz-placeholder, .is-dark-theme |
|
3864 .components-text-control__input[type="time"]::-moz-placeholder, .is-dark-theme |
|
3865 .components-text-control__input[type="url"]::-moz-placeholder, .is-dark-theme |
|
3866 .components-text-control__input[type="week"]::-moz-placeholder, .is-dark-theme |
|
3867 .components-text-control__input[type="password"]::-moz-placeholder, .is-dark-theme |
|
3868 .components-text-control__input[type="color"]::-moz-placeholder, .is-dark-theme |
|
3869 .components-text-control__input[type="date"]::-moz-placeholder, .is-dark-theme |
|
3870 .components-text-control__input[type="datetime"]::-moz-placeholder, .is-dark-theme |
|
3871 .components-text-control__input[type="datetime-local"]::-moz-placeholder, .is-dark-theme |
|
3872 .components-text-control__input[type="email"]::-moz-placeholder, .is-dark-theme |
|
3873 .components-text-control__input[type="month"]::-moz-placeholder, .is-dark-theme |
|
3874 .components-text-control__input[type="number"]::-moz-placeholder { |
|
3875 opacity: 1; |
|
3876 color: rgba(255, 255, 255, 0.65); } |
|
3877 .is-dark-theme .components-text-control__input:-ms-input-placeholder, .is-dark-theme |
|
3878 .components-text-control__input[type="text"]:-ms-input-placeholder, .is-dark-theme |
|
3879 .components-text-control__input[type="tel"]:-ms-input-placeholder, .is-dark-theme |
|
3880 .components-text-control__input[type="time"]:-ms-input-placeholder, .is-dark-theme |
|
3881 .components-text-control__input[type="url"]:-ms-input-placeholder, .is-dark-theme |
|
3882 .components-text-control__input[type="week"]:-ms-input-placeholder, .is-dark-theme |
|
3883 .components-text-control__input[type="password"]:-ms-input-placeholder, .is-dark-theme |
|
3884 .components-text-control__input[type="color"]:-ms-input-placeholder, .is-dark-theme |
|
3885 .components-text-control__input[type="date"]:-ms-input-placeholder, .is-dark-theme |
|
3886 .components-text-control__input[type="datetime"]:-ms-input-placeholder, .is-dark-theme |
|
3887 .components-text-control__input[type="datetime-local"]:-ms-input-placeholder, .is-dark-theme |
|
3888 .components-text-control__input[type="email"]:-ms-input-placeholder, .is-dark-theme |
|
3889 .components-text-control__input[type="month"]:-ms-input-placeholder, .is-dark-theme |
|
3890 .components-text-control__input[type="number"]:-ms-input-placeholder { |
|
3891 color: rgba(255, 255, 255, 0.65); } |
3108 |
3892 |
3109 .components-textarea-control__input { |
3893 .components-textarea-control__input { |
3110 width: 100%; |
3894 width: 100%; |
3111 padding: 6px 8px; } |
3895 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
3896 padding: 6px 8px; |
|
3897 box-shadow: 0 0 0 transparent; |
|
3898 transition: box-shadow 0.1s linear; |
|
3899 border-radius: 2px; |
|
3900 border: 1px solid #757575; |
|
3901 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
|
3902 font-size: 16px; |
|
3903 /* Override core line-height. To be reviewed. */ |
|
3904 line-height: normal; } |
|
3905 @media (prefers-reduced-motion: reduce) { |
|
3906 .components-textarea-control__input { |
|
3907 transition-duration: 0s; } } |
|
3908 @media (min-width: 600px) { |
|
3909 .components-textarea-control__input { |
|
3910 font-size: 13px; |
|
3911 /* Override core line-height. To be reviewed. */ |
|
3912 line-height: normal; } } |
|
3913 .components-textarea-control__input:focus { |
|
3914 border-color: #007cba; |
|
3915 border-color: var(--wp-admin-theme-color); |
|
3916 box-shadow: 0 0 0 0.5px #007cba; |
|
3917 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
|
3918 outline: 2px solid transparent; } |
|
3919 .components-textarea-control__input::-webkit-input-placeholder { |
|
3920 color: rgba(30, 30, 30, 0.62); } |
|
3921 .components-textarea-control__input::-moz-placeholder { |
|
3922 opacity: 1; |
|
3923 color: rgba(30, 30, 30, 0.62); } |
|
3924 .components-textarea-control__input:-ms-input-placeholder { |
|
3925 color: rgba(30, 30, 30, 0.62); } |
|
3926 .is-dark-theme .components-textarea-control__input::-webkit-input-placeholder { |
|
3927 color: rgba(255, 255, 255, 0.65); } |
|
3928 .is-dark-theme .components-textarea-control__input::-moz-placeholder { |
|
3929 opacity: 1; |
|
3930 color: rgba(255, 255, 255, 0.65); } |
|
3931 .is-dark-theme .components-textarea-control__input:-ms-input-placeholder { |
|
3932 color: rgba(255, 255, 255, 0.65); } |
|
3933 |
|
3934 .components-tip { |
|
3935 display: flex; |
|
3936 color: #555d66; } |
|
3937 .components-tip svg { |
|
3938 -ms-grid-row-align: center; |
|
3939 align-self: center; |
|
3940 fill: #f0b849; |
|
3941 flex-shrink: 0; |
|
3942 margin-left: 16px; } |
|
3943 .components-tip p { |
|
3944 margin: 0; } |
3112 |
3945 |
3113 .components-toggle-control .components-base-control__field { |
3946 .components-toggle-control .components-base-control__field { |
3114 display: flex; |
3947 display: flex; |
3115 margin-bottom: 12px; } |
3948 margin-bottom: 12px; |
|
3949 line-height: initial; |
|
3950 align-items: center; } |
3116 .components-toggle-control .components-base-control__field .components-form-toggle { |
3951 .components-toggle-control .components-base-control__field .components-form-toggle { |
3117 margin-left: 16px; } |
3952 margin-left: 12px; } |
3118 .components-toggle-control .components-base-control__field .components-toggle-control__label { |
3953 .components-toggle-control .components-base-control__field .components-toggle-control__label { |
|
3954 display: block; } |
|
3955 |
|
3956 .components-accessible-toolbar { |
|
3957 display: inline-flex; |
|
3958 border: 1px solid #1e1e1e; |
|
3959 border-radius: 2px; |
|
3960 flex-shrink: 0; } |
|
3961 .components-accessible-toolbar > .components-toolbar-group:last-child { |
|
3962 border-left: none; } |
|
3963 |
|
3964 .components-accessible-toolbar .components-button, |
|
3965 .components-toolbar .components-button { |
|
3966 position: relative; |
|
3967 height: 48px; |
|
3968 z-index: 1; |
|
3969 padding-right: 16px; |
|
3970 padding-left: 16px; } |
|
3971 .components-accessible-toolbar .components-button:focus:enabled, |
|
3972 .components-toolbar .components-button:focus:enabled { |
|
3973 box-shadow: none; |
|
3974 outline: none; } |
|
3975 .components-accessible-toolbar .components-button::before, |
|
3976 .components-toolbar .components-button::before { |
|
3977 content: ""; |
|
3978 position: absolute; |
3119 display: block; |
3979 display: block; |
3120 margin-bottom: 4px; } |
3980 border-radius: 2px; |
3121 |
3981 height: 32px; |
3122 .components-toolbar { |
3982 right: 8px; |
3123 margin: 0; |
3983 left: 8px; |
3124 border: 1px solid #e2e4e7; |
3984 z-index: -1; |
3125 background-color: #fff; |
3985 animation: components-button__appear-animation 0.1s ease; |
3126 display: flex; |
3986 animation-fill-mode: forwards; } |
3127 flex-shrink: 0; } |
3987 @media (prefers-reduced-motion: reduce) { |
3128 |
3988 .components-accessible-toolbar .components-button::before, |
3129 div.components-toolbar > div { |
3989 .components-toolbar .components-button::before { |
3130 display: block; |
3990 animation-duration: 1ms; } } |
3131 margin: 0; } |
3991 .components-accessible-toolbar .components-button svg, |
3132 @supports ((position: -webkit-sticky) or (position: sticky)) { |
3992 .components-toolbar .components-button svg { |
3133 div.components-toolbar > div { |
|
3134 display: flex; } } |
|
3135 |
|
3136 div.components-toolbar > div + div { |
|
3137 margin-right: -3px; } |
|
3138 div.components-toolbar > div + div.has-left-divider { |
|
3139 margin-right: 6px; |
|
3140 position: relative; |
3993 position: relative; |
3141 overflow: visible; } |
3994 margin-right: auto; |
3142 div.components-toolbar > div + div.has-left-divider::before { |
3995 margin-left: auto; } |
3143 display: inline-block; |
3996 .components-accessible-toolbar .components-button.is-pressed, |
3144 content: ""; |
3997 .components-toolbar .components-button.is-pressed { |
3145 box-sizing: content-box; |
3998 background: transparent; } |
3146 background-color: #e2e4e7; |
3999 .components-accessible-toolbar .components-button.is-pressed:hover, |
3147 position: absolute; |
4000 .components-toolbar .components-button.is-pressed:hover { |
3148 top: 8px; |
4001 background: transparent; } |
3149 right: -3px; |
4002 .components-accessible-toolbar .components-button.is-pressed::before, |
3150 width: 1px; |
4003 .components-toolbar .components-button.is-pressed::before { |
3151 height: 20px; } |
4004 background: #1e1e1e; } |
|
4005 .components-accessible-toolbar .components-button:focus::before, |
|
4006 .components-toolbar .components-button:focus::before { |
|
4007 box-shadow: inset 0 0 0 1.5px #007cba, inset 0 0 0 4px #fff; |
|
4008 box-shadow: inset 0 0 0 1.5px var(--wp-admin-theme-color), inset 0 0 0 4px #fff; |
|
4009 outline: 2px solid transparent; } |
|
4010 .components-accessible-toolbar .components-button.has-icon, |
|
4011 .components-toolbar .components-button.has-icon { |
|
4012 padding-right: 8px; |
|
4013 padding-left: 8px; |
|
4014 min-width: 48px; |
|
4015 justify-content: center; } |
|
4016 .components-accessible-toolbar .components-button.components-tab-button, |
|
4017 .components-toolbar .components-button.components-tab-button { |
|
4018 font-weight: 500; } |
|
4019 .components-accessible-toolbar .components-button.components-tab-button span, |
|
4020 .components-toolbar .components-button.components-tab-button span { |
|
4021 display: inline-block; |
|
4022 padding-right: 0; |
|
4023 padding-left: 0; |
|
4024 position: relative; } |
|
4025 |
|
4026 @keyframes components-button__appear-animation { |
|
4027 from { |
|
4028 transform: scaleY(0); } |
|
4029 to { |
|
4030 transform: scaleY(1); } } |
3152 |
4031 |
3153 .components-toolbar__control.components-button { |
4032 .components-toolbar__control.components-button { |
3154 display: inline-flex; |
4033 position: relative; } |
3155 align-items: flex-end; |
|
3156 margin: 0; |
|
3157 padding: 3px; |
|
3158 outline: none; |
|
3159 cursor: pointer; |
|
3160 position: relative; |
|
3161 width: 36px; |
|
3162 height: 36px; } |
|
3163 .components-toolbar__control.components-button:active, .components-toolbar__control.components-button:not([aria-disabled="true"]):hover, .components-toolbar__control.components-button:not([aria-disabled="true"]):focus { |
|
3164 outline: none; |
|
3165 box-shadow: none; |
|
3166 background: none; |
|
3167 border: none; } |
|
3168 .components-toolbar__control.components-button:disabled { |
|
3169 cursor: default; } |
|
3170 .components-toolbar__control.components-button > svg { |
|
3171 padding: 5px; |
|
3172 border-radius: 4px; |
|
3173 height: 30px; |
|
3174 width: 30px; } |
|
3175 .components-toolbar__control.components-button[data-subscript] svg { |
4034 .components-toolbar__control.components-button[data-subscript] svg { |
3176 padding: 5px 0 5px 10px; } |
4035 padding: 5px 0 5px 10px; } |
3177 .components-toolbar__control.components-button[data-subscript]::after { |
4036 .components-toolbar__control.components-button[data-subscript]::after { |
3178 content: attr(data-subscript); |
4037 content: attr(data-subscript); |
3179 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
4038 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |