253 box-sizing: border-box; |
207 box-sizing: border-box; |
254 padding: 6px 12px; |
208 padding: 6px 12px; |
255 border-radius: 2px; |
209 border-radius: 2px; |
256 color: #1e1e1e; |
210 color: #1e1e1e; |
257 /** |
211 /** |
258 * Primary button style. |
212 * Primary button style. |
259 */ |
213 */ |
260 /** |
214 /** |
261 * Secondary and tertiary buttons. |
215 * Secondary and tertiary buttons. |
262 */ |
216 */ |
263 /** |
217 /** |
264 * Secondary button style. |
218 * Secondary button style. |
265 */ |
219 */ |
266 /** |
220 /** |
267 * Tertiary buttons. |
221 * Tertiary buttons. |
268 */ |
222 */ |
269 /** |
223 /** |
270 * Link buttons. |
224 * Destructive buttons. |
271 */ |
225 */ |
272 /** |
226 /** |
273 * Buttons that indicate destructive actions. |
227 * Link buttons. |
274 */ } |
228 */ |
275 @media (prefers-reduced-motion: reduce) { |
229 } |
276 .components-button { |
230 @media (prefers-reduced-motion: reduce) { |
277 transition-duration: 0s; } } |
231 .components-button { |
278 .components-button[aria-expanded="true"], .components-button:hover { |
232 transition-duration: 0s; |
279 color: #007cba; |
233 transition-delay: 0s; |
280 color: var(--wp-admin-theme-color); } |
234 } |
281 .components-button[aria-disabled="true"]:hover { |
235 } |
282 color: initial; } |
236 .components-button[aria-expanded=true], .components-button:hover { |
283 .components-button:focus:not(:disabled) { |
237 color: var(--wp-admin-theme-color); |
284 box-shadow: 0 0 0 1.5px #007cba; |
238 } |
285 box-shadow: 0 0 0 1.5px var(--wp-admin-theme-color); |
239 .components-button[aria-disabled=true]:hover { |
286 outline: 1px solid transparent; } |
240 color: initial; |
287 .components-button.is-primary { |
241 } |
288 white-space: nowrap; |
242 .components-button:focus:not(:disabled) { |
289 background: #007cba; |
243 box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); |
290 background: var(--wp-admin-theme-color); |
244 outline: 3px solid transparent; |
291 color: #fff; |
245 } |
292 text-decoration: none; |
246 .components-button.is-primary { |
293 text-shadow: none; } |
247 white-space: nowrap; |
294 .components-button.is-primary:hover:not(:disabled) { |
248 background: var(--wp-admin-theme-color); |
295 background: #006ba1; |
249 color: #fff; |
296 background: var(--wp-admin-theme-color-darker-10); |
250 text-decoration: none; |
297 color: #fff; } |
251 text-shadow: none; |
298 .components-button.is-primary:active:not(:disabled) { |
252 outline: 1px solid transparent; |
299 background: #005a87; |
253 } |
300 background: var(--wp-admin-theme-color-darker-20); |
254 .components-button.is-primary:hover:not(:disabled) { |
301 border-color: #005a87; |
255 background: var(--wp-admin-theme-color-darker-10); |
302 border-color: var(--wp-admin-theme-color-darker-20); |
256 color: #fff; |
303 color: #fff; } |
257 } |
304 .components-button.is-primary:focus:not(:disabled) { |
258 .components-button.is-primary:active:not(:disabled) { |
305 box-shadow: inset 0 0 0 1px #fff, 0 0 0 1.5px #007cba; |
259 background: var(--wp-admin-theme-color-darker-20); |
306 box-shadow: inset 0 0 0 1px #fff, 0 0 0 1.5px var(--wp-admin-theme-color); |
260 border-color: var(--wp-admin-theme-color-darker-20); |
307 outline: 1px solid transparent; } |
261 color: #fff; |
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 { |
262 } |
309 color: rgba(255, 255, 255, 0.4); |
263 .components-button.is-primary:focus:not(:disabled) { |
310 background: #007cba; |
264 box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); |
311 background: var(--wp-admin-theme-color); |
265 } |
312 border-color: #007cba; |
266 .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 { |
313 border-color: var(--wp-admin-theme-color); |
267 color: rgba(255, 255, 255, 0.4); |
314 opacity: 1; } |
268 background: var(--wp-admin-theme-color); |
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 { |
269 border-color: var(--wp-admin-theme-color); |
316 box-shadow: 0 0 0 1px #fff, 0 0 0 3px #007cba; |
270 opacity: 1; |
317 box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--wp-admin-theme-color); } |
271 outline: none; |
318 .components-button.is-primary.is-busy, .components-button.is-primary.is-busy:disabled, .components-button.is-primary.is-busy[aria-disabled="true"] { |
272 } |
319 color: #fff; |
273 .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 { |
320 background-size: 100px 100%; |
274 box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--wp-admin-theme-color); |
321 /* stylelint-disable */ |
275 } |
322 background-image: linear-gradient(45deg, #007cba 28%, #005a87 28%, #005a87 72%, #007cba 72%); |
276 .components-button.is-primary.is-busy, .components-button.is-primary.is-busy:disabled, .components-button.is-primary.is-busy[aria-disabled=true] { |
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%); |
277 color: #fff; |
324 /* stylelint-enable */ |
278 background-size: 100px 100%; |
325 border-color: #007cba; |
279 /* stylelint-disable */ |
326 border-color: var(--wp-admin-theme-color); } |
280 background-image: linear-gradient(45deg, var(--wp-admin-theme-color) 33%, var(--wp-admin-theme-color-darker-20) 33%, var(--wp-admin-theme-color-darker-20) 70%, var(--wp-admin-theme-color) 70%); |
327 .components-button.is-secondary:active:not(:disabled), .components-button.is-tertiary:active:not(:disabled) { |
281 /* stylelint-enable */ |
328 background: #ddd; |
282 border-color: var(--wp-admin-theme-color); |
329 color: #006ba1; |
283 } |
330 color: var(--wp-admin-theme-color-darker-10); |
284 .components-button.is-secondary, .components-button.is-tertiary { |
331 box-shadow: none; } |
285 outline: 1px solid transparent; |
332 .components-button.is-secondary:hover:not(:disabled), .components-button.is-tertiary:hover:not(:disabled) { |
286 } |
333 color: #006ba1; |
287 .components-button.is-secondary:active:not(:disabled), .components-button.is-tertiary:active:not(:disabled) { |
334 color: var(--wp-admin-theme-color-darker-10); |
288 background: #ddd; |
335 box-shadow: inset 0 0 0 1px #006ba1; |
289 color: var(--wp-admin-theme-color-darker-10); |
336 box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color-darker-10); } |
290 box-shadow: none; |
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 { |
291 } |
338 color: #828282; |
292 .components-button.is-secondary:hover:not(:disabled), .components-button.is-tertiary:hover:not(:disabled) { |
339 background: #eaeaea; |
293 color: var(--wp-admin-theme-color-darker-10); |
340 transform: none; |
294 box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color-darker-10); |
341 opacity: 1; |
295 } |
342 box-shadow: none; } |
296 .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 { |
343 .components-button.is-secondary { |
297 color: #828282; |
344 box-shadow: inset 0 0 0 1px #007cba; |
298 background: #eaeaea; |
345 box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color); |
299 transform: none; |
346 outline: 1px solid transparent; |
300 opacity: 1; |
347 white-space: nowrap; |
301 box-shadow: none; |
348 color: #007cba; |
302 outline: none; |
349 color: var(--wp-admin-theme-color); |
303 } |
350 background: transparent; } |
304 .components-button.is-secondary { |
351 .components-button.is-tertiary { |
305 box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color); |
352 white-space: nowrap; |
306 outline: 1px solid transparent; |
353 color: #007cba; |
307 white-space: nowrap; |
354 color: var(--wp-admin-theme-color); |
308 color: var(--wp-admin-theme-color); |
355 background: transparent; |
309 background: transparent; |
356 padding: 6px; |
310 } |
357 outline: 1px dotted transparent; } |
311 .components-button.is-tertiary { |
358 .components-button.is-tertiary .dashicon { |
312 white-space: nowrap; |
359 display: inline-block; |
313 color: var(--wp-admin-theme-color); |
360 flex: 0 0 auto; } |
314 background: transparent; |
|
315 padding: 6px; |
|
316 } |
|
317 .components-button.is-tertiary .dashicon { |
|
318 display: inline-block; |
|
319 flex: 0 0 auto; |
|
320 } |
|
321 .components-button.is-destructive { |
|
322 color: #cc1818; |
|
323 box-shadow: inset 0 0 0 1px #cc1818; |
|
324 } |
|
325 .components-button.is-destructive:hover:not(:disabled) { |
|
326 color: #710d0d; |
|
327 box-shadow: inset 0 0 0 1px #710d0d; |
|
328 } |
|
329 .components-button.is-destructive:focus:not(:disabled) { |
|
330 color: var(--wp-admin-theme-color); |
|
331 } |
|
332 .components-button.is-destructive:active:not(:disabled) { |
|
333 background: #ccc; |
|
334 } |
|
335 .components-button.is-destructive.is-primary { |
|
336 color: #fff; |
|
337 background: #cc1818; |
|
338 box-shadow: inset 0 0 0 1px #cc1818; |
|
339 } |
|
340 .components-button.is-destructive.is-primary:hover:not(:disabled) { |
|
341 color: #fff; |
|
342 background: #710d0d; |
|
343 box-shadow: inset 0 0 0 1px #710d0d; |
|
344 } |
|
345 .components-button.is-link { |
|
346 margin: 0; |
|
347 padding: 0; |
|
348 box-shadow: none; |
|
349 border: 0; |
|
350 border-radius: 0; |
|
351 background: none; |
|
352 outline: none; |
|
353 text-align: right; |
|
354 color: var(--wp-admin-theme-color); |
|
355 text-decoration: underline; |
|
356 transition-property: border, background, color; |
|
357 transition-duration: 0.05s; |
|
358 transition-timing-function: ease-in-out; |
|
359 height: auto; |
|
360 } |
|
361 @media (prefers-reduced-motion: reduce) { |
361 .components-button.is-link { |
362 .components-button.is-link { |
362 margin: 0; |
363 transition-duration: 0s; |
363 padding: 0; |
364 transition-delay: 0s; |
364 box-shadow: none; |
365 } |
365 border: 0; |
366 } |
366 border-radius: 0; |
367 .components-button.is-link:focus { |
367 background: none; |
368 border-radius: 2px; |
368 outline: none; |
369 } |
369 text-align: right; |
370 .components-button.is-link.is-destructive { |
370 /* Mimics the default link style in common.css */ |
371 color: #cc1818; |
371 color: #0073aa; |
372 } |
372 text-decoration: underline; |
373 .components-button.is-link.is-destructive:active:not(:disabled), .components-button.is-link.is-destructive:hover:not(:disabled) { |
373 transition-property: border, background, color; |
374 color: #710d0d; |
374 transition-duration: 0.05s; |
375 background: none; |
375 transition-timing-function: ease-in-out; |
376 } |
376 height: auto; } |
377 .components-button.is-link.is-destructive:focus:not(:disabled) { |
377 @media (prefers-reduced-motion: reduce) { |
378 color: var(--wp-admin-theme-color); |
378 .components-button.is-link { |
379 } |
379 transition-duration: 0s; } } |
380 .components-button:not([aria-disabled=true]):active { |
380 .components-button.is-link:hover:not(:disabled), .components-button.is-link:active:not(:disabled) { |
381 color: inherit; |
381 color: #00a0d2; } |
382 } |
382 .components-button.is-link:focus { |
383 .components-button:disabled, .components-button[aria-disabled=true] { |
383 color: #124964; |
384 cursor: default; |
384 box-shadow: 0 0 0 1px #5b9dd9, 0 0 1.5px 1px rgba(30, 140, 190, 0.8); } |
385 opacity: 0.3; |
385 .components-button.is-destructive { |
386 } |
386 color: #b52727; } |
387 .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] { |
387 .components-button.is-destructive.is-secondary { |
388 animation: components-button__busy-animation 2500ms infinite linear; |
388 box-shadow: inset 0 0 0 1px #b52727; } |
389 opacity: 1; |
389 .components-button.is-destructive:hover:not(:disabled), .components-button.is-destructive:active:not(:disabled) { |
390 background-size: 100px 100%; |
390 color: #a02222; |
391 /* stylelint-disable */ |
391 box-shadow: inset 0 0 0 1px #a02222; } |
392 background-image: linear-gradient(45deg, #fafafa 33%, #e0e0e0 33%, #e0e0e0 70%, #fafafa 70%); |
392 .components-button.is-destructive:focus:not(:disabled) { |
393 /* stylelint-enable */ |
393 box-shadow: inset 0 0 0 1px #fff, 0 0 0 1.5px #a02222; } |
394 } |
394 .components-button:not([aria-disabled="true"]):active { |
395 .components-button.is-small { |
395 color: inherit; } |
396 height: 24px; |
396 .components-button:disabled, .components-button[aria-disabled="true"] { |
397 line-height: 22px; |
397 cursor: default; |
398 padding: 0 8px; |
398 opacity: 0.3; } |
399 font-size: 11px; |
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"] { |
400 } |
400 animation: components-button__busy-animation 2500ms infinite linear; |
401 .components-button.is-small.has-icon:not(.has-text) { |
401 opacity: 1; |
402 padding: 0 8px; |
402 background-size: 100px 100%; |
403 width: 24px; |
403 /* stylelint-disable */ |
404 } |
404 background-image: linear-gradient(45deg, #fafafa 28%, #e0e0e0 28%, #e0e0e0 72%, #fafafa 72%); |
405 .components-button.has-icon { |
405 /* stylelint-enable */ } |
406 padding: 6px; |
406 .components-button.is-small { |
407 min-width: 36px; |
407 height: 24px; |
408 justify-content: center; |
408 line-height: 22px; |
409 } |
409 padding: 0 8px; |
410 .components-button.has-icon .dashicon { |
410 font-size: 11px; } |
411 display: inline-block; |
411 .components-button.is-small.has-icon:not(.has-text) { |
412 flex: 0 0 auto; |
412 padding: 0 8px; |
413 margin-right: 2px; |
413 width: 24px; } |
414 margin-left: 2px; |
414 .components-button.has-icon { |
415 } |
415 padding: 6px; |
416 .components-button.has-icon.has-text { |
416 min-width: 36px; |
417 justify-content: left; |
417 justify-content: center; } |
418 } |
418 .components-button.has-icon .dashicon { |
419 .components-button.has-icon.has-text svg { |
419 display: inline-block; |
420 margin-left: 8px; |
420 flex: 0 0 auto; } |
421 } |
421 .components-button.has-icon.has-text { |
422 .components-button.has-icon.has-text .dashicon { |
422 justify-content: left; } |
423 margin-left: 10px; |
423 .components-button.has-icon.has-text svg { |
424 } |
424 margin-left: 8px; } |
425 .components-button.is-pressed { |
425 .components-button.is-pressed { |
426 color: #fff; |
426 color: #fff; |
427 background: #1e1e1e; |
427 background: #1e1e1e; } |
428 } |
428 .components-button.is-pressed:focus:not(:disabled) { |
429 .components-button.is-pressed:focus:not(:disabled) { |
429 box-shadow: inset 0 0 0 1px #fff, 0 0 0 1.5px #007cba; |
430 box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); |
430 box-shadow: inset 0 0 0 1px #fff, 0 0 0 1.5px var(--wp-admin-theme-color); |
431 outline: 2px solid transparent; |
431 outline: 2px solid transparent; } |
432 } |
432 .components-button.is-pressed:hover:not(:disabled) { |
433 .components-button.is-pressed:hover:not(:disabled) { |
433 background: #1e1e1e; } |
434 color: #fff; |
434 .components-button svg { |
435 background: #1e1e1e; |
435 fill: currentColor; |
436 } |
436 outline: none; } |
437 .components-button svg { |
437 .components-button .components-visually-hidden { |
438 fill: currentColor; |
438 height: auto; } |
439 outline: none; |
|
440 } |
|
441 .components-button .components-visually-hidden { |
|
442 height: auto; |
|
443 } |
439 |
444 |
440 @keyframes components-button__busy-animation { |
445 @keyframes components-button__busy-animation { |
441 0% { |
446 0% { |
442 background-position: 200px 0; } } |
447 background-position: 200px 0; |
443 |
448 } |
444 .components-checkbox-control__input[type="checkbox"] { |
449 } |
|
450 .components-checkbox-control__input[type=checkbox] { |
445 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
451 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
446 padding: 6px 8px; |
452 padding: 6px 8px; |
447 box-shadow: 0 0 0 transparent; |
453 box-shadow: 0 0 0 transparent; |
448 transition: box-shadow 0.1s linear; |
454 transition: box-shadow 0.1s linear; |
449 border-radius: 2px; |
455 border-radius: 2px; |
756 border-radius: 50%; |
861 border-radius: 50%; |
757 position: relative; |
862 position: relative; |
758 overflow: hidden; |
863 overflow: hidden; |
759 background-image: linear-gradient(-45deg, #ddd 25%, transparent 25%), linear-gradient(45deg, #ddd 25%, transparent 25%), linear-gradient(-45deg, transparent 75%, #ddd 75%), linear-gradient(45deg, transparent 75%, #ddd 75%); |
864 background-image: linear-gradient(-45deg, #ddd 25%, transparent 25%), linear-gradient(45deg, #ddd 25%, transparent 25%), linear-gradient(-45deg, transparent 75%, #ddd 75%), linear-gradient(45deg, transparent 75%, #ddd 75%); |
760 background-size: 10px 10px; |
865 background-size: 10px 10px; |
761 background-position: 100% 0, 100% 5px, 5px -5px, -5px 0; } |
866 background-position: 100% 0, 100% 5px, 5px -5px, -5px 0; |
762 .is-alpha-disabled .components-color-picker__swatch { |
867 } |
763 width: 12px; |
868 .is-alpha-disabled .components-color-picker__swatch { |
764 height: 12px; |
869 width: 12px; |
765 margin-top: 0; } |
870 height: 12px; |
|
871 margin-top: 0; |
|
872 } |
766 |
873 |
767 .components-color-picker__active { |
874 .components-color-picker__active { |
768 position: absolute; |
875 position: absolute; |
769 top: 0; |
876 top: 0; |
770 right: 0; |
877 right: 0; |
771 left: 0; |
878 left: 0; |
772 bottom: 0; |
879 bottom: 0; |
773 border-radius: 50%; |
880 border-radius: 50%; |
774 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1); |
881 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1); |
775 z-index: 2; } |
882 z-index: 2; |
|
883 } |
776 |
884 |
777 /* SATURATION COMPONENT */ |
885 /* SATURATION COMPONENT */ |
778 .components-color-picker__saturation-color, |
886 .components-color-picker__saturation-color, |
779 .components-color-picker__saturation-white, |
887 .components-color-picker__saturation-white, |
780 .components-color-picker__saturation-black { |
888 .components-color-picker__saturation-black { |
781 position: absolute; |
889 position: absolute; |
782 top: 0; |
890 top: 0; |
783 right: 0; |
891 right: 0; |
784 left: 0; |
892 left: 0; |
785 bottom: 0; } |
893 bottom: 0; |
|
894 } |
786 |
895 |
787 .components-color-picker__saturation-color { |
896 .components-color-picker__saturation-color { |
788 overflow: visible; } |
897 overflow: visible; |
|
898 } |
789 |
899 |
790 .components-color-picker__saturation-white { |
900 .components-color-picker__saturation-white { |
791 background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0)); } |
901 background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0)); |
|
902 } |
792 |
903 |
793 .components-color-picker__saturation-black { |
904 .components-color-picker__saturation-black { |
794 background: linear-gradient(to top, #000, rgba(0, 0, 0, 0)); } |
905 background: linear-gradient(to top, #000, rgba(0, 0, 0, 0)); |
|
906 } |
795 |
907 |
796 .components-button.components-color-picker__saturation-pointer { |
908 .components-button.components-color-picker__saturation-pointer { |
797 width: 14px; |
909 width: 14px; |
798 height: 14px; |
910 height: 14px; |
799 padding: 0; |
911 padding: 0; |
800 border-radius: 50%; |
912 border-radius: 50%; |
801 background-color: transparent; |
913 background-color: transparent; |
802 transform: translate(50%, -50%); |
914 transform: translate(50%, -50%); |
803 box-shadow: 0 0 0 1px #fff, inset 0 0 0 1px #000, 0 0 0 2px #000; } |
915 box-shadow: 0 0 0 1px #fff, inset 0 0 0 1px #000, 0 0 0 2px #000; |
804 .components-button.components-color-picker__saturation-pointer:focus:not(:disabled) { |
916 } |
805 box-shadow: 0 0 0 2px #fff, inset 0 0 0 1px #000, 0 0 0 3px #000; } |
917 .components-button.components-color-picker__saturation-pointer:focus:not(:disabled) { |
|
918 box-shadow: 0 0 0 2px #fff, inset 0 0 0 1px #000, 0 0 0 3px #000; |
|
919 } |
806 |
920 |
807 /* HUE & ALPHA BARS */ |
921 /* HUE & ALPHA BARS */ |
808 .components-color-picker__toggles { |
922 .components-color-picker__toggles { |
809 flex: 1; } |
923 flex: 1; |
|
924 } |
810 |
925 |
811 .components-color-picker__alpha { |
926 .components-color-picker__alpha { |
812 background-image: linear-gradient(-45deg, #ddd 25%, transparent 25%), linear-gradient(45deg, #ddd 25%, transparent 25%), linear-gradient(-45deg, transparent 75%, #ddd 75%), linear-gradient(45deg, transparent 75%, #ddd 75%); |
927 background-image: linear-gradient(-45deg, #ddd 25%, transparent 25%), linear-gradient(45deg, #ddd 25%, transparent 25%), linear-gradient(-45deg, transparent 75%, #ddd 75%), linear-gradient(45deg, transparent 75%, #ddd 75%); |
813 background-size: 10px 10px; |
928 background-size: 10px 10px; |
814 background-position: 100% 0, 100% 5px, 5px -5px, -5px 0; } |
929 background-position: 100% 0, 100% 5px, 5px -5px, -5px 0; |
|
930 } |
815 |
931 |
816 .components-color-picker__hue-gradient, |
932 .components-color-picker__hue-gradient, |
817 .components-color-picker__alpha-gradient { |
933 .components-color-picker__alpha-gradient { |
818 position: absolute; |
934 position: absolute; |
819 top: 0; |
935 top: 0; |
820 right: 0; |
936 right: 0; |
821 left: 0; |
937 left: 0; |
822 bottom: 0; } |
938 bottom: 0; |
|
939 } |
823 |
940 |
824 .components-color-picker__hue, |
941 .components-color-picker__hue, |
825 .components-color-picker__alpha { |
942 .components-color-picker__alpha { |
826 height: 12px; |
943 height: 12px; |
827 position: relative; } |
944 position: relative; |
|
945 } |
828 |
946 |
829 .is-alpha-enabled .components-color-picker__hue { |
947 .is-alpha-enabled .components-color-picker__hue { |
830 margin-bottom: 8px; } |
948 margin-bottom: 8px; |
|
949 } |
831 |
950 |
832 .components-color-picker__hue-bar, |
951 .components-color-picker__hue-bar, |
833 .components-color-picker__alpha-bar { |
952 .components-color-picker__alpha-bar { |
834 position: relative; |
953 position: relative; |
835 margin: 0 3px; |
954 margin: 0 3px; |
836 height: 100%; |
955 height: 100%; |
837 padding: 0 2px; } |
956 padding: 0 2px; |
|
957 } |
838 |
958 |
839 .components-color-picker__hue-gradient { |
959 .components-color-picker__hue-gradient { |
840 background: linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%); } |
960 background: linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%); |
|
961 } |
841 |
962 |
842 .components-color-picker__hue-pointer, |
963 .components-color-picker__hue-pointer, |
843 .components-color-picker__alpha-pointer { |
964 .components-color-picker__alpha-pointer { |
844 left: 0; |
965 left: 0; |
845 width: 14px; |
966 width: 14px; |
846 height: 14px; |
967 height: 14px; |
847 border-radius: 50%; |
968 border-radius: 50%; |
848 box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37); |
969 box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37); |
849 background: #fff; |
970 background: #fff; |
850 transform: translate(7px, -1px); } |
971 transform: translate(7px, -1px); |
|
972 } |
851 |
973 |
852 .components-color-picker__hue-pointer, |
974 .components-color-picker__hue-pointer, |
853 .components-color-picker__saturation-pointer { |
975 .components-color-picker__saturation-pointer { |
854 transition: box-shadow 0.1s linear; } |
976 transition: box-shadow 0.1s linear; |
855 @media (prefers-reduced-motion: reduce) { |
977 } |
856 .components-color-picker__hue-pointer, |
978 @media (prefers-reduced-motion: reduce) { |
857 .components-color-picker__saturation-pointer { |
979 .components-color-picker__hue-pointer, |
858 transition-duration: 0s; } } |
980 .components-color-picker__saturation-pointer { |
|
981 transition-duration: 0s; |
|
982 transition-delay: 0s; |
|
983 } |
|
984 } |
859 |
985 |
860 .components-color-picker__saturation-pointer:focus { |
986 .components-color-picker__saturation-pointer:focus { |
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); |
987 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); |
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); } |
988 } |
863 |
989 |
864 .components-color-picker__hue-pointer:focus, |
990 .components-color-picker__hue-pointer:focus, |
865 .components-color-picker__alpha-pointer:focus { |
991 .components-color-picker__alpha-pointer:focus { |
866 border-color: #007cba; |
|
867 border-color: var(--wp-admin-theme-color); |
992 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); |
993 box-shadow: 0 0 0 2px var(--wp-admin-theme-color), 0 0 3px 0 var(--wp-admin-theme-color); |
870 outline: 2px solid transparent; |
994 outline: 2px solid transparent; |
871 outline-offset: -2px; } |
995 outline-offset: -2px; |
|
996 } |
872 |
997 |
873 /* INPUTS COMPONENT */ |
998 /* INPUTS COMPONENT */ |
874 .components-color-picker__inputs-wrapper { |
999 .components-color-picker__inputs-wrapper { |
875 margin: 0 -4px; |
1000 margin: 0 -4px; |
876 padding-top: 16px; |
1001 padding-top: 16px; |
877 display: flex; |
1002 display: flex; |
878 align-items: flex-end; |
1003 align-items: flex-end; |
879 min-width: 255px; } |
1004 min-width: 255px; |
880 .components-color-picker__inputs-wrapper fieldset { |
1005 } |
881 flex: 1; |
1006 .components-color-picker__inputs-wrapper fieldset { |
882 border: none; |
1007 flex: 1; |
883 margin: 0; |
1008 border: none; |
884 padding: 0; } |
1009 margin: 0; |
885 .components-color-picker__inputs-wrapper .components-color-picker__inputs-fields .components-text-control__input[type="number"] { |
1010 padding: 0; |
886 padding: 6px 3px; |
1011 } |
887 margin: 0; } |
1012 .components-color-picker__inputs-wrapper .components-color-picker__inputs-fields .components-text-control__input[type=number] { |
|
1013 padding: 6px 3px; |
|
1014 margin: 0; |
|
1015 } |
888 |
1016 |
889 .components-color-picker__inputs-field { |
1017 .components-color-picker__inputs-field { |
890 width: 100%; } |
1018 width: 100%; |
|
1019 } |
891 |
1020 |
892 .components-color-picker__inputs-fields { |
1021 .components-color-picker__inputs-fields { |
893 display: flex; |
1022 display: flex; |
894 direction: ltr; |
1023 direction: ltr; |
895 flex-grow: 1; |
1024 flex-grow: 1; |
896 margin-left: 4px; } |
1025 margin-left: 4px; |
897 .components-color-picker__inputs-fields .components-base-control + .components-base-control { |
1026 } |
898 margin-top: 0; } |
1027 .components-color-picker__inputs-fields .components-base-control + .components-base-control { |
899 .components-color-picker__inputs-fields .components-base-control__field { |
1028 margin-top: 0; |
900 margin: 0 2px; } |
1029 } |
|
1030 .components-color-picker__inputs-fields .components-base-control__field { |
|
1031 margin: 0 2px; |
|
1032 } |
901 |
1033 |
902 .components-color-picker__inputs-toggle { |
1034 .components-color-picker__inputs-toggle { |
903 height: 30px; |
1035 height: 30px; |
904 padding: 0 5px; } |
1036 padding: 0 5px; |
|
1037 } |
905 |
1038 |
906 .components-combobox-control { |
1039 .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%; |
1040 width: 100%; |
969 height: 24px; |
1041 } |
970 border-radius: 24px; |
1042 |
971 margin-bottom: 8px; |
1043 input.components-combobox-control__input[type=text] { |
972 padding-right: 3px; |
1044 width: 100%; |
973 padding-left: 21px; } |
1045 border: none; |
974 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__markers-container { |
1046 box-shadow: none; |
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; } |
|
1087 |
|
1088 svg.dashicon { |
|
1089 fill: currentColor; |
|
1090 outline: none; } |
|
1091 .PresetDateRangePicker_panel { |
|
1092 padding: 0 22px 11px; } |
|
1093 |
|
1094 .PresetDateRangePicker_button { |
|
1095 position: relative; |
|
1096 height: 100%; |
|
1097 text-align: center; |
|
1098 background: 0 0; |
|
1099 border: 2px solid #00a699; |
|
1100 color: #00a699; |
|
1101 padding: 4px 12px; |
|
1102 margin-right: 8px; |
|
1103 font: inherit; |
|
1104 font-weight: 700; |
|
1105 line-height: normal; |
|
1106 overflow: visible; |
|
1107 box-sizing: border-box; |
|
1108 cursor: pointer; } |
|
1109 |
|
1110 .PresetDateRangePicker_button:active { |
|
1111 outline: 0; } |
|
1112 |
|
1113 .PresetDateRangePicker_button__selected { |
|
1114 color: #fff; |
|
1115 background: #00a699; } |
|
1116 |
|
1117 .SingleDatePickerInput { |
|
1118 display: inline-block; |
|
1119 background-color: #fff; } |
|
1120 |
|
1121 .SingleDatePickerInput__withBorder { |
|
1122 border-radius: 2px; |
|
1123 border: 1px solid #dbdbdb; } |
|
1124 |
|
1125 .SingleDatePickerInput__rtl { |
|
1126 direction: rtl; } |
|
1127 |
|
1128 .SingleDatePickerInput__disabled { |
|
1129 background-color: #f2f2f2; } |
|
1130 |
|
1131 .SingleDatePickerInput__block { |
|
1132 display: block; } |
|
1133 |
|
1134 .SingleDatePickerInput__showClearDate { |
|
1135 padding-right: 30px; } |
|
1136 |
|
1137 .SingleDatePickerInput_clearDate { |
|
1138 background: 0 0; |
|
1139 border: 0; |
|
1140 color: inherit; |
|
1141 font: inherit; |
|
1142 line-height: normal; |
|
1143 overflow: visible; |
|
1144 cursor: pointer; |
|
1145 padding: 10px; |
|
1146 margin: 0 10px 0 5px; |
|
1147 position: absolute; |
|
1148 right: 0; |
|
1149 top: 50%; |
|
1150 transform: translateY(-50%); } |
|
1151 |
|
1152 .SingleDatePickerInput_clearDate__default:focus, |
|
1153 .SingleDatePickerInput_clearDate__default:hover { |
|
1154 background: #dbdbdb; |
|
1155 border-radius: 50%; } |
|
1156 |
|
1157 .SingleDatePickerInput_clearDate__small { |
|
1158 padding: 6px; } |
|
1159 |
|
1160 .SingleDatePickerInput_clearDate__hide { |
|
1161 visibility: hidden; } |
|
1162 |
|
1163 .SingleDatePickerInput_clearDate_svg { |
|
1164 fill: #82888a; |
|
1165 height: 12px; |
|
1166 width: 15px; |
|
1167 vertical-align: middle; } |
|
1168 |
|
1169 .SingleDatePickerInput_clearDate_svg__small { |
|
1170 height: 9px; } |
|
1171 |
|
1172 .SingleDatePickerInput_calendarIcon { |
|
1173 background: 0 0; |
|
1174 border: 0; |
|
1175 color: inherit; |
|
1176 font: inherit; |
|
1177 line-height: normal; |
|
1178 overflow: visible; |
|
1179 cursor: pointer; |
|
1180 display: inline-block; |
|
1181 vertical-align: middle; |
|
1182 padding: 10px; |
|
1183 margin: 0 5px 0 10px; } |
|
1184 |
|
1185 .SingleDatePickerInput_calendarIcon_svg { |
|
1186 fill: #82888a; |
|
1187 height: 15px; |
|
1188 width: 14px; |
|
1189 vertical-align: middle; } |
|
1190 |
|
1191 .SingleDatePicker { |
|
1192 position: relative; |
|
1193 display: inline-block; } |
|
1194 |
|
1195 .SingleDatePicker__block { |
|
1196 display: block; } |
|
1197 |
|
1198 .SingleDatePicker_picker { |
|
1199 z-index: 1; |
|
1200 background-color: #fff; |
|
1201 position: absolute; } |
|
1202 |
|
1203 .SingleDatePicker_picker__rtl { |
|
1204 direction: rtl; } |
|
1205 |
|
1206 .SingleDatePicker_picker__directionLeft { |
|
1207 left: 0; } |
|
1208 |
|
1209 .SingleDatePicker_picker__directionRight { |
|
1210 right: 0; } |
|
1211 |
|
1212 .SingleDatePicker_picker__portal { |
|
1213 background-color: rgba(0, 0, 0, 0.3); |
|
1214 position: fixed; |
|
1215 top: 0; |
|
1216 left: 0; |
|
1217 height: 100%; |
|
1218 width: 100%; } |
|
1219 |
|
1220 .SingleDatePicker_picker__fullScreenPortal { |
|
1221 background-color: #fff; } |
|
1222 |
|
1223 .SingleDatePicker_closeButton { |
|
1224 background: 0 0; |
|
1225 border: 0; |
|
1226 color: inherit; |
|
1227 font: inherit; |
|
1228 line-height: normal; |
|
1229 overflow: visible; |
|
1230 cursor: pointer; |
|
1231 position: absolute; |
|
1232 top: 0; |
|
1233 right: 0; |
|
1234 padding: 15px; |
|
1235 z-index: 2; } |
|
1236 |
|
1237 .SingleDatePicker_closeButton:focus, |
|
1238 .SingleDatePicker_closeButton:hover { |
|
1239 color: #b0b3b4; |
|
1240 text-decoration: none; } |
|
1241 |
|
1242 .SingleDatePicker_closeButton_svg { |
|
1243 height: 15px; |
|
1244 width: 15px; |
|
1245 fill: #cacccd; } |
|
1246 |
|
1247 .DayPickerKeyboardShortcuts_buttonReset { |
|
1248 background: 0 0; |
|
1249 border: 0; |
|
1250 border-radius: 0; |
|
1251 color: inherit; |
|
1252 font: inherit; |
|
1253 line-height: normal; |
|
1254 overflow: visible; |
|
1255 padding: 0; |
|
1256 cursor: pointer; |
|
1257 font-size: 14px; } |
|
1258 |
|
1259 .DayPickerKeyboardShortcuts_buttonReset:active { |
|
1260 outline: 0; } |
|
1261 |
|
1262 .DayPickerKeyboardShortcuts_show { |
|
1263 width: 22px; |
|
1264 position: absolute; |
|
1265 z-index: 2; } |
|
1266 |
|
1267 .DayPickerKeyboardShortcuts_show__bottomRight { |
|
1268 border-top: 26px solid transparent; |
|
1269 border-right: 33px solid #00a699; |
|
1270 bottom: 0; |
|
1271 right: 0; } |
|
1272 |
|
1273 .DayPickerKeyboardShortcuts_show__bottomRight:hover { |
|
1274 border-right: 33px solid #008489; } |
|
1275 |
|
1276 .DayPickerKeyboardShortcuts_show__topRight { |
|
1277 border-bottom: 26px solid transparent; |
|
1278 border-right: 33px solid #00a699; |
|
1279 top: 0; |
|
1280 right: 0; } |
|
1281 |
|
1282 .DayPickerKeyboardShortcuts_show__topRight:hover { |
|
1283 border-right: 33px solid #008489; } |
|
1284 |
|
1285 .DayPickerKeyboardShortcuts_show__topLeft { |
|
1286 border-bottom: 26px solid transparent; |
|
1287 border-left: 33px solid #00a699; |
|
1288 top: 0; |
|
1289 left: 0; } |
|
1290 |
|
1291 .DayPickerKeyboardShortcuts_show__topLeft:hover { |
|
1292 border-left: 33px solid #008489; } |
|
1293 |
|
1294 .DayPickerKeyboardShortcuts_showSpan { |
|
1295 color: #fff; |
|
1296 position: absolute; } |
|
1297 |
|
1298 .DayPickerKeyboardShortcuts_showSpan__bottomRight { |
|
1299 bottom: 0; |
|
1300 right: -28px; } |
|
1301 |
|
1302 .DayPickerKeyboardShortcuts_showSpan__topRight { |
|
1303 top: 1px; |
|
1304 right: -28px; } |
|
1305 |
|
1306 .DayPickerKeyboardShortcuts_showSpan__topLeft { |
|
1307 top: 1px; |
|
1308 left: -28px; } |
|
1309 |
|
1310 .DayPickerKeyboardShortcuts_panel { |
|
1311 overflow: auto; |
|
1312 background: #fff; |
|
1313 border: 1px solid #dbdbdb; |
|
1314 border-radius: 2px; |
|
1315 position: absolute; |
|
1316 top: 0; |
|
1317 bottom: 0; |
|
1318 right: 0; |
|
1319 left: 0; |
|
1320 z-index: 2; |
|
1321 padding: 22px; |
|
1322 margin: 33px; } |
|
1323 |
|
1324 .DayPickerKeyboardShortcuts_title { |
|
1325 font-size: 16px; |
1047 font-size: 16px; |
1326 font-weight: 700; |
1048 padding: 2px; |
1327 margin: 0; } |
1049 margin: 0; |
1328 |
1050 line-height: inherit; |
1329 .DayPickerKeyboardShortcuts_list { |
1051 min-height: auto; |
1330 list-style: none; |
1052 } |
1331 padding: 0; |
1053 @media (min-width: 600px) { |
1332 font-size: 14px; } |
1054 input.components-combobox-control__input[type=text] { |
1333 |
1055 font-size: 13px; |
1334 .DayPickerKeyboardShortcuts_close { |
1056 } |
1335 position: absolute; |
1057 } |
1336 right: 22px; |
1058 input.components-combobox-control__input[type=text]:focus { |
1337 top: 22px; |
1059 outline: none; |
1338 z-index: 2; } |
|
1339 |
|
1340 .DayPickerKeyboardShortcuts_close:active { |
|
1341 outline: 0; } |
|
1342 |
|
1343 .DayPickerKeyboardShortcuts_closeSvg { |
|
1344 height: 15px; |
|
1345 width: 15px; |
|
1346 fill: #cacccd; } |
|
1347 |
|
1348 .DayPickerKeyboardShortcuts_closeSvg:focus, |
|
1349 .DayPickerKeyboardShortcuts_closeSvg:hover { |
|
1350 fill: #82888a; } |
|
1351 |
|
1352 .CalendarDay { |
|
1353 box-sizing: border-box; |
|
1354 cursor: pointer; |
|
1355 font-size: 14px; |
|
1356 text-align: center; } |
|
1357 |
|
1358 .CalendarDay:active { |
|
1359 outline: 0; } |
|
1360 |
|
1361 .CalendarDay__defaultCursor { |
|
1362 cursor: default; } |
|
1363 |
|
1364 .CalendarDay__default { |
|
1365 border: 1px solid #e4e7e7; |
|
1366 color: #484848; |
|
1367 background: #fff; } |
|
1368 |
|
1369 .CalendarDay__default:hover { |
|
1370 background: #e4e7e7; |
|
1371 border: 1px double #e4e7e7; |
|
1372 color: inherit; } |
|
1373 |
|
1374 .CalendarDay__hovered_offset { |
|
1375 background: #f4f5f5; |
|
1376 border: 1px double #e4e7e7; |
|
1377 color: inherit; } |
|
1378 |
|
1379 .CalendarDay__outside { |
|
1380 border: 0; |
|
1381 background: #fff; |
|
1382 color: #484848; } |
|
1383 |
|
1384 .CalendarDay__outside:hover { |
|
1385 border: 0; } |
|
1386 |
|
1387 .CalendarDay__blocked_minimum_nights { |
|
1388 background: #fff; |
|
1389 border: 1px solid #eceeee; |
|
1390 color: #cacccd; } |
|
1391 |
|
1392 .CalendarDay__blocked_minimum_nights:active, |
|
1393 .CalendarDay__blocked_minimum_nights:hover { |
|
1394 background: #fff; |
|
1395 color: #cacccd; } |
|
1396 |
|
1397 .CalendarDay__highlighted_calendar { |
|
1398 background: #ffe8bc; |
|
1399 color: #484848; } |
|
1400 |
|
1401 .CalendarDay__highlighted_calendar:active, |
|
1402 .CalendarDay__highlighted_calendar:hover { |
|
1403 background: #ffce71; |
|
1404 color: #484848; } |
|
1405 |
|
1406 .CalendarDay__selected_span { |
|
1407 background: #66e2da; |
|
1408 border: 1px solid #33dacd; |
|
1409 color: #fff; } |
|
1410 |
|
1411 .CalendarDay__selected_span:active, |
|
1412 .CalendarDay__selected_span:hover { |
|
1413 background: #33dacd; |
|
1414 border: 1px solid #33dacd; |
|
1415 color: #fff; } |
|
1416 |
|
1417 .CalendarDay__last_in_range { |
|
1418 border-right: #00a699; } |
|
1419 |
|
1420 .CalendarDay__selected, |
|
1421 .CalendarDay__selected:active, |
|
1422 .CalendarDay__selected:hover { |
|
1423 background: #00a699; |
|
1424 border: 1px solid #00a699; |
|
1425 color: #fff; } |
|
1426 |
|
1427 .CalendarDay__hovered_span, |
|
1428 .CalendarDay__hovered_span:hover { |
|
1429 background: #b2f1ec; |
|
1430 border: 1px solid #80e8e0; |
|
1431 color: #007a87; } |
|
1432 |
|
1433 .CalendarDay__hovered_span:active { |
|
1434 background: #80e8e0; |
|
1435 border: 1px solid #80e8e0; |
|
1436 color: #007a87; } |
|
1437 |
|
1438 .CalendarDay__blocked_calendar, |
|
1439 .CalendarDay__blocked_calendar:active, |
|
1440 .CalendarDay__blocked_calendar:hover { |
|
1441 background: #cacccd; |
|
1442 border: 1px solid #cacccd; |
|
1443 color: #82888a; } |
|
1444 |
|
1445 .CalendarDay__blocked_out_of_range, |
|
1446 .CalendarDay__blocked_out_of_range:active, |
|
1447 .CalendarDay__blocked_out_of_range:hover { |
|
1448 background: #fff; |
|
1449 border: 1px solid #e4e7e7; |
|
1450 color: #cacccd; } |
|
1451 |
|
1452 .CalendarMonth { |
|
1453 background: #fff; |
|
1454 text-align: center; |
|
1455 vertical-align: top; |
|
1456 -webkit-user-select: none; |
|
1457 -ms-user-select: none; |
|
1458 user-select: none; } |
|
1459 |
|
1460 .CalendarMonth_table { |
|
1461 border-collapse: collapse; |
|
1462 border-spacing: 0; } |
|
1463 |
|
1464 .CalendarMonth_verticalSpacing { |
|
1465 border-collapse: separate; } |
|
1466 |
|
1467 .CalendarMonth_caption { |
|
1468 color: #484848; |
|
1469 font-size: 18px; |
|
1470 text-align: center; |
|
1471 padding-top: 22px; |
|
1472 padding-bottom: 37px; |
|
1473 caption-side: initial; } |
|
1474 |
|
1475 .CalendarMonth_caption__verticalScrollable { |
|
1476 padding-top: 12px; |
|
1477 padding-bottom: 7px; } |
|
1478 |
|
1479 .CalendarMonthGrid { |
|
1480 background: #fff; |
|
1481 text-align: left; |
|
1482 z-index: 0; } |
|
1483 |
|
1484 .CalendarMonthGrid__animating { |
|
1485 z-index: 1; } |
|
1486 |
|
1487 .CalendarMonthGrid__horizontal { |
|
1488 position: absolute; |
|
1489 left: 9px; } |
|
1490 |
|
1491 .CalendarMonthGrid__vertical { |
|
1492 margin: 0 auto; } |
|
1493 |
|
1494 .CalendarMonthGrid__vertical_scrollable { |
|
1495 margin: 0 auto; |
|
1496 overflow-y: scroll; } |
|
1497 |
|
1498 .CalendarMonthGrid_month__horizontal { |
|
1499 display: inline-block; |
|
1500 vertical-align: top; |
|
1501 min-height: 100%; } |
|
1502 |
|
1503 .CalendarMonthGrid_month__hideForAnimation { |
|
1504 position: absolute; |
|
1505 z-index: -1; |
|
1506 opacity: 0; |
|
1507 pointer-events: none; } |
|
1508 |
|
1509 .CalendarMonthGrid_month__hidden { |
|
1510 visibility: hidden; } |
|
1511 |
|
1512 .DayPickerNavigation { |
|
1513 position: relative; |
|
1514 z-index: 2; } |
|
1515 |
|
1516 .DayPickerNavigation__horizontal { |
|
1517 height: 0; } |
|
1518 |
|
1519 .DayPickerNavigation__verticalDefault { |
|
1520 position: absolute; |
|
1521 width: 100%; |
|
1522 height: 52px; |
|
1523 bottom: 0; |
|
1524 left: 0; } |
|
1525 |
|
1526 .DayPickerNavigation__verticalScrollableDefault { |
|
1527 position: relative; } |
|
1528 |
|
1529 .DayPickerNavigation_button { |
|
1530 cursor: pointer; |
|
1531 -webkit-user-select: none; |
|
1532 -ms-user-select: none; |
|
1533 user-select: none; |
|
1534 border: 0; |
|
1535 padding: 0; |
|
1536 margin: 0; } |
|
1537 |
|
1538 .DayPickerNavigation_button__default { |
|
1539 border: 1px solid #e4e7e7; |
|
1540 background-color: #fff; |
|
1541 color: #757575; } |
|
1542 |
|
1543 .DayPickerNavigation_button__default:focus, |
|
1544 .DayPickerNavigation_button__default:hover { |
|
1545 border: 1px solid #c4c4c4; } |
|
1546 |
|
1547 .DayPickerNavigation_button__default:active { |
|
1548 background: #f2f2f2; } |
|
1549 |
|
1550 .DayPickerNavigation_button__horizontalDefault { |
|
1551 position: absolute; |
|
1552 top: 18px; |
|
1553 line-height: .78; |
|
1554 border-radius: 3px; |
|
1555 padding: 6px 9px; } |
|
1556 |
|
1557 .DayPickerNavigation_leftButton__horizontalDefault { |
|
1558 left: 22px; } |
|
1559 |
|
1560 .DayPickerNavigation_rightButton__horizontalDefault { |
|
1561 right: 22px; } |
|
1562 |
|
1563 .DayPickerNavigation_button__verticalDefault { |
|
1564 padding: 5px; |
|
1565 background: #fff; |
|
1566 box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1); |
|
1567 position: relative; |
|
1568 display: inline-block; |
|
1569 height: 100%; |
|
1570 width: 50%; } |
|
1571 |
|
1572 .DayPickerNavigation_nextButton__verticalDefault { |
|
1573 border-left: 0; } |
|
1574 |
|
1575 .DayPickerNavigation_nextButton__verticalScrollableDefault { |
|
1576 width: 100%; } |
|
1577 |
|
1578 .DayPickerNavigation_svg__horizontal { |
|
1579 height: 19px; |
|
1580 width: 19px; |
|
1581 fill: #82888a; |
|
1582 display: block; } |
|
1583 |
|
1584 .DayPickerNavigation_svg__vertical { |
|
1585 height: 42px; |
|
1586 width: 42px; |
|
1587 fill: #484848; |
|
1588 display: block; } |
|
1589 |
|
1590 .DayPicker { |
|
1591 background: #fff; |
|
1592 position: relative; |
|
1593 text-align: left; } |
|
1594 |
|
1595 .DayPicker__horizontal { |
|
1596 background: #fff; } |
|
1597 |
|
1598 .DayPicker__verticalScrollable { |
|
1599 height: 100%; } |
|
1600 |
|
1601 .DayPicker__hidden { |
|
1602 visibility: hidden; } |
|
1603 |
|
1604 .DayPicker__withBorder { |
|
1605 box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.07); |
|
1606 border-radius: 3px; } |
|
1607 |
|
1608 .DayPicker_portal__horizontal { |
|
1609 box-shadow: none; |
1060 box-shadow: none; |
1610 position: absolute; |
1061 } |
1611 left: 50%; |
1062 |
1612 top: 50%; } |
1063 .components-combobox-control__suggestions-container { |
1613 |
|
1614 .DayPicker_portal__vertical { |
|
1615 position: initial; } |
|
1616 |
|
1617 .DayPicker_focusRegion { |
|
1618 outline: 0; } |
|
1619 |
|
1620 .DayPicker_calendarInfo__horizontal, |
|
1621 .DayPicker_wrapper__horizontal { |
|
1622 display: inline-block; |
|
1623 vertical-align: top; } |
|
1624 |
|
1625 .DayPicker_weekHeaders { |
|
1626 position: relative; } |
|
1627 |
|
1628 .DayPicker_weekHeaders__horizontal { |
|
1629 margin-left: 9px; } |
|
1630 |
|
1631 .DayPicker_weekHeader { |
|
1632 color: #757575; |
|
1633 position: absolute; |
|
1634 top: 62px; |
|
1635 z-index: 2; |
|
1636 text-align: left; } |
|
1637 |
|
1638 .DayPicker_weekHeader__vertical { |
|
1639 left: 50%; } |
|
1640 |
|
1641 .DayPicker_weekHeader__verticalScrollable { |
|
1642 top: 0; |
|
1643 display: table-row; |
|
1644 border-bottom: 1px solid #dbdbdb; |
|
1645 background: #fff; |
|
1646 margin-left: 0; |
|
1647 left: 0; |
|
1648 width: 100%; |
|
1649 text-align: center; } |
|
1650 |
|
1651 .DayPicker_weekHeader_ul { |
|
1652 list-style: none; |
|
1653 margin: 1px 0; |
|
1654 padding-left: 0; |
|
1655 padding-right: 0; |
|
1656 font-size: 14px; } |
|
1657 |
|
1658 .DayPicker_weekHeader_li { |
|
1659 display: inline-block; |
|
1660 text-align: center; } |
|
1661 |
|
1662 .DayPicker_transitionContainer { |
|
1663 position: relative; |
|
1664 overflow: hidden; |
|
1665 border-radius: 3px; } |
|
1666 |
|
1667 .DayPicker_transitionContainer__horizontal { |
|
1668 transition: height .2s ease-in-out; } |
|
1669 |
|
1670 .DayPicker_transitionContainer__vertical { |
|
1671 width: 100%; } |
|
1672 |
|
1673 .DayPicker_transitionContainer__verticalScrollable { |
|
1674 padding-top: 20px; |
|
1675 height: 100%; |
|
1676 position: absolute; |
|
1677 top: 0; |
|
1678 bottom: 0; |
|
1679 right: 0; |
|
1680 left: 0; |
|
1681 overflow-y: scroll; } |
|
1682 |
|
1683 .DateInput { |
|
1684 margin: 0; |
|
1685 padding: 0; |
|
1686 background: #fff; |
|
1687 position: relative; |
|
1688 display: inline-block; |
|
1689 width: 130px; |
|
1690 vertical-align: middle; } |
|
1691 |
|
1692 .DateInput__small { |
|
1693 width: 97px; } |
|
1694 |
|
1695 .DateInput__block { |
|
1696 width: 100%; } |
|
1697 |
|
1698 .DateInput__disabled { |
|
1699 background: #f2f2f2; |
|
1700 color: #dbdbdb; } |
|
1701 |
|
1702 .DateInput_input { |
|
1703 font-weight: 200; |
|
1704 font-size: 19px; |
|
1705 line-height: 24px; |
|
1706 color: #484848; |
|
1707 background-color: #fff; |
|
1708 width: 100%; |
|
1709 padding: 11px 11px 9px; |
|
1710 border: 0; |
|
1711 border-top: 0; |
|
1712 border-right: 0; |
|
1713 border-bottom: 2px solid transparent; |
|
1714 border-left: 0; |
|
1715 border-radius: 0; } |
|
1716 |
|
1717 .DateInput_input__small { |
|
1718 font-size: 15px; |
|
1719 line-height: 18px; |
|
1720 letter-spacing: .2px; |
|
1721 padding: 7px 7px 5px; } |
|
1722 |
|
1723 .DateInput_input__regular { |
|
1724 font-weight: auto; } |
|
1725 |
|
1726 .DateInput_input__readOnly { |
|
1727 -webkit-user-select: none; |
|
1728 -ms-user-select: none; |
|
1729 user-select: none; } |
|
1730 |
|
1731 .DateInput_input__focused { |
|
1732 outline: 0; |
|
1733 background: #fff; |
|
1734 border: 0; |
|
1735 border-top: 0; |
|
1736 border-right: 0; |
|
1737 border-bottom: 2px solid #008489; |
|
1738 border-left: 0; } |
|
1739 |
|
1740 .DateInput_input__disabled { |
|
1741 background: #f2f2f2; |
|
1742 font-style: italic; } |
|
1743 |
|
1744 .DateInput_screenReaderMessage { |
|
1745 border: 0; |
|
1746 clip: rect(0, 0, 0, 0); |
|
1747 height: 1px; |
|
1748 margin: -1px; |
|
1749 overflow: hidden; |
|
1750 padding: 0; |
|
1751 position: absolute; |
|
1752 width: 1px; } |
|
1753 |
|
1754 .DateInput_fang { |
|
1755 position: absolute; |
|
1756 width: 20px; |
|
1757 height: 10px; |
|
1758 left: 22px; |
|
1759 z-index: 2; } |
|
1760 |
|
1761 .DateInput_fangShape { |
|
1762 fill: #fff; } |
|
1763 |
|
1764 .DateInput_fangStroke { |
|
1765 stroke: #dbdbdb; |
|
1766 fill: transparent; } |
|
1767 |
|
1768 .DateRangePickerInput { |
|
1769 background-color: #fff; |
|
1770 display: inline-block; } |
|
1771 |
|
1772 .DateRangePickerInput__disabled { |
|
1773 background: #f2f2f2; } |
|
1774 |
|
1775 .DateRangePickerInput__withBorder { |
|
1776 border-radius: 2px; |
|
1777 border: 1px solid #dbdbdb; } |
|
1778 |
|
1779 .DateRangePickerInput__rtl { |
|
1780 direction: rtl; } |
|
1781 |
|
1782 .DateRangePickerInput__block { |
|
1783 display: block; } |
|
1784 |
|
1785 .DateRangePickerInput__showClearDates { |
|
1786 padding-right: 30px; } |
|
1787 |
|
1788 .DateRangePickerInput_arrow { |
|
1789 display: inline-block; |
|
1790 vertical-align: middle; |
|
1791 color: #484848; } |
|
1792 |
|
1793 .DateRangePickerInput_arrow_svg { |
|
1794 vertical-align: middle; |
|
1795 fill: #484848; |
|
1796 height: 24px; |
|
1797 width: 24px; } |
|
1798 |
|
1799 .DateRangePickerInput_clearDates { |
|
1800 background: 0 0; |
|
1801 border: 0; |
|
1802 color: inherit; |
|
1803 font: inherit; |
|
1804 line-height: normal; |
|
1805 overflow: visible; |
|
1806 cursor: pointer; |
|
1807 padding: 10px; |
|
1808 margin: 0 10px 0 5px; |
|
1809 position: absolute; |
|
1810 right: 0; |
|
1811 top: 50%; |
|
1812 transform: translateY(-50%); } |
|
1813 |
|
1814 .DateRangePickerInput_clearDates__small { |
|
1815 padding: 6px; } |
|
1816 |
|
1817 .DateRangePickerInput_clearDates_default:focus, |
|
1818 .DateRangePickerInput_clearDates_default:hover { |
|
1819 background: #dbdbdb; |
|
1820 border-radius: 50%; } |
|
1821 |
|
1822 .DateRangePickerInput_clearDates__hide { |
|
1823 visibility: hidden; } |
|
1824 |
|
1825 .DateRangePickerInput_clearDates_svg { |
|
1826 fill: #82888a; |
|
1827 height: 12px; |
|
1828 width: 15px; |
|
1829 vertical-align: middle; } |
|
1830 |
|
1831 .DateRangePickerInput_clearDates_svg__small { |
|
1832 height: 9px; } |
|
1833 |
|
1834 .DateRangePickerInput_calendarIcon { |
|
1835 background: 0 0; |
|
1836 border: 0; |
|
1837 color: inherit; |
|
1838 font: inherit; |
|
1839 line-height: normal; |
|
1840 overflow: visible; |
|
1841 cursor: pointer; |
|
1842 display: inline-block; |
|
1843 vertical-align: middle; |
|
1844 padding: 10px; |
|
1845 margin: 0 5px 0 10px; } |
|
1846 |
|
1847 .DateRangePickerInput_calendarIcon_svg { |
|
1848 fill: #82888a; |
|
1849 height: 15px; |
|
1850 width: 14px; |
|
1851 vertical-align: middle; } |
|
1852 |
|
1853 .DateRangePicker { |
|
1854 position: relative; |
|
1855 display: inline-block; } |
|
1856 |
|
1857 .DateRangePicker__block { |
|
1858 display: block; } |
|
1859 |
|
1860 .DateRangePicker_picker { |
|
1861 z-index: 1; |
|
1862 background-color: #fff; |
|
1863 position: absolute; } |
|
1864 |
|
1865 .DateRangePicker_picker__rtl { |
|
1866 direction: rtl; } |
|
1867 |
|
1868 .DateRangePicker_picker__directionLeft { |
|
1869 left: 0; } |
|
1870 |
|
1871 .DateRangePicker_picker__directionRight { |
|
1872 right: 0; } |
|
1873 |
|
1874 .DateRangePicker_picker__portal { |
|
1875 background-color: rgba(0, 0, 0, 0.3); |
|
1876 position: fixed; |
|
1877 top: 0; |
|
1878 left: 0; |
|
1879 height: 100%; |
|
1880 width: 100%; } |
|
1881 |
|
1882 .DateRangePicker_picker__fullScreenPortal { |
|
1883 background-color: #fff; } |
|
1884 |
|
1885 .DateRangePicker_closeButton { |
|
1886 background: 0 0; |
|
1887 border: 0; |
|
1888 color: inherit; |
|
1889 font: inherit; |
|
1890 line-height: normal; |
|
1891 overflow: visible; |
|
1892 cursor: pointer; |
|
1893 position: absolute; |
|
1894 top: 0; |
|
1895 right: 0; |
|
1896 padding: 15px; |
|
1897 z-index: 2; } |
|
1898 |
|
1899 .DateRangePicker_closeButton:focus, |
|
1900 .DateRangePicker_closeButton:hover { |
|
1901 color: #b0b3b4; |
|
1902 text-decoration: none; } |
|
1903 |
|
1904 .DateRangePicker_closeButton_svg { |
|
1905 height: 15px; |
|
1906 width: 15px; |
|
1907 fill: #cacccd; } |
|
1908 .components-datetime { |
|
1909 padding: 0; } |
|
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; |
|
1923 margin: 0; } |
|
1924 .components-datetime select, |
|
1925 .components-datetime input { |
|
1926 box-shadow: 0 0 0 transparent; |
|
1927 transition: box-shadow 0.1s linear; |
|
1928 border-radius: 2px; |
|
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; } |
|
1940 |
|
1941 .components-datetime__date { |
|
1942 min-height: 236px; |
|
1943 border-top: 1px solid #ddd; } |
|
1944 .components-datetime__date .DayPickerNavigation_leftButton__horizontalDefault { |
|
1945 right: 0; } |
|
1946 .components-datetime__date .CalendarMonth_caption { |
|
1947 font-size: 13px; } |
|
1948 .components-datetime__date .CalendarMonth_table { |
|
1949 border-collapse: separate; |
|
1950 border-spacing: 2px; } |
|
1951 .components-datetime__date .CalendarDay { |
|
1952 font-size: 13px; |
|
1953 border: none; |
|
1954 border-radius: 50%; |
|
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; } |
|
1960 .components-datetime__date .CalendarDay__selected { |
|
1961 background: #007cba; |
|
1962 background: var(--wp-admin-theme-color); |
|
1963 border: 2px solid transparent; } |
|
1964 .components-datetime__date .CalendarDay__selected:hover { |
|
1965 background: #005a87; |
|
1966 background: var(--wp-admin-theme-color-darker-20); } |
|
1967 .components-datetime__date .CalendarDay__selected:focus { |
|
1968 box-shadow: inset 0 0 0 1px #fff; } |
|
1969 .components-datetime__date .DayPickerNavigation_button__horizontalDefault { |
|
1970 padding: 2px 8px; |
|
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; } |
|
1978 .components-datetime__date .DayPicker_weekHeader { |
|
1979 top: 50px; } |
|
1980 .components-datetime__date .DayPicker_weekHeader .DayPicker_weekHeader_ul { |
|
1981 margin: 1px 0; |
|
1982 padding-right: 0; |
|
1983 padding-left: 0; } |
|
1984 .components-datetime__date.is-description-visible .DayPicker { |
|
1985 visibility: hidden; } |
|
1986 |
|
1987 .components-datetime__time { |
|
1988 padding-bottom: 16px; } |
|
1989 .components-datetime__time fieldset { |
|
1990 position: relative; |
|
1991 margin-bottom: 0.5em; } |
|
1992 .components-datetime__time fieldset + fieldset { |
|
1993 margin-bottom: 0; } |
|
1994 .components-datetime__time .components-datetime__time-field-am-pm fieldset { |
|
1995 margin-top: 0; } |
|
1996 .components-datetime__time .components-datetime__time-wrapper { |
|
1997 display: flex; } |
|
1998 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-separator { |
|
1999 display: inline-block; |
|
2000 padding: 0 0 0 3px; |
|
2001 color: #555d66; } |
|
2002 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field-time { |
|
2003 direction: ltr; } |
|
2004 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select { |
|
2005 margin-left: 4px; } |
|
2006 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select:focus { |
|
2007 position: relative; |
|
2008 z-index: 1; } |
|
2009 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"] { |
|
2010 padding: 2px; |
|
2011 margin-left: 4px; |
|
2012 text-align: center; |
|
2013 -moz-appearance: textfield; } |
|
2014 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"]:focus { |
|
2015 position: relative; |
|
2016 z-index: 1; } |
|
2017 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type="number"]::-webkit-inner-spin-button { |
|
2018 -webkit-appearance: none; |
|
2019 margin: 0; } |
|
2020 .components-datetime__time.is-12-hour .components-datetime__time-field-day input { |
|
2021 margin: -4px 0 0 !important; |
|
2022 border-radius: 0 2px 2px 0 !important; } |
|
2023 .components-datetime__time.is-12-hour .components-datetime__time-field-year input { |
|
2024 border-radius: 2px 0 0 2px !important; } |
|
2025 |
|
2026 .components-datetime__time-legend { |
|
2027 font-weight: 600; |
|
2028 margin-top: 0.5em; } |
|
2029 .components-datetime__time-legend.invisible { |
|
2030 position: absolute; |
|
2031 top: -999em; |
|
2032 right: -999em; } |
|
2033 |
|
2034 .components-datetime__time-field-hours-input, |
|
2035 .components-datetime__time-field-minutes-input, |
|
2036 .components-datetime__time-field-day-input { |
|
2037 width: 35px; } |
|
2038 |
|
2039 .components-datetime__time-field-year-input { |
|
2040 width: 55px; } |
|
2041 |
|
2042 .components-datetime__time-field-month-select { |
|
2043 max-width: 145px; } |
|
2044 |
|
2045 .components-popover .components-datetime__date { |
|
2046 padding-right: 4px; } |
|
2047 |
|
2048 .block-editor-dimension-control .components-base-control__field { |
|
2049 display: flex; |
|
2050 align-items: center; } |
|
2051 |
|
2052 .block-editor-dimension-control .components-base-control__label { |
|
2053 display: flex; |
|
2054 align-items: center; |
|
2055 margin-left: 1em; |
|
2056 margin-bottom: 0; } |
|
2057 .block-editor-dimension-control .components-base-control__label .dashicon { |
|
2058 margin-left: 0.5em; } |
|
2059 |
|
2060 .block-editor-dimension-control.is-manual .components-base-control__label { |
|
2061 width: 10em; } |
|
2062 |
|
2063 .components-disabled { |
|
2064 position: relative; |
|
2065 pointer-events: none; } |
|
2066 .components-disabled::after { |
|
2067 content: ""; |
|
2068 position: absolute; |
|
2069 top: 0; |
|
2070 left: 0; |
|
2071 bottom: 0; |
|
2072 right: 0; } |
|
2073 .components-disabled * { |
|
2074 pointer-events: none; } |
|
2075 |
|
2076 body.is-dragging-components-draggable { |
|
2077 cursor: move; |
|
2078 /* Fallback for IE/Edge < 14 */ |
|
2079 cursor: grabbing !important; } |
|
2080 |
|
2081 .components-draggable__invisible-drag-image { |
|
2082 position: fixed; |
|
2083 right: -1000px; |
|
2084 height: 50px; |
|
2085 width: 50px; } |
|
2086 |
|
2087 .components-draggable__clone { |
|
2088 position: fixed; |
|
2089 padding: 0; |
|
2090 background: transparent; |
|
2091 pointer-events: none; |
|
2092 z-index: 1000000000; } |
|
2093 |
|
2094 .components-drop-zone { |
|
2095 position: absolute; |
|
2096 top: 0; |
|
2097 left: 0; |
|
2098 bottom: 0; |
|
2099 right: 0; |
|
2100 z-index: 40; |
|
2101 visibility: hidden; |
|
2102 opacity: 0; |
|
2103 transition: 0.3s opacity, 0.3s background-color, 0s visibility 0.3s; |
|
2104 border: 2px solid #007cba; |
|
2105 border: 2px solid var(--wp-admin-theme-color); |
|
2106 border-radius: 2px; } |
|
2107 @media (prefers-reduced-motion: reduce) { |
|
2108 .components-drop-zone { |
|
2109 transition-duration: 0s; } } |
|
2110 .components-drop-zone.is-active { |
|
2111 opacity: 1; |
|
2112 visibility: visible; |
|
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; } } |
|
2117 .components-drop-zone.is-dragging-over-element { |
|
2118 background-color: #007cba; |
|
2119 background-color: var(--wp-admin-theme-color); } |
|
2120 |
|
2121 .components-drop-zone__content { |
|
2122 position: absolute; |
|
2123 top: 50%; |
|
2124 right: 0; |
|
2125 left: 0; |
|
2126 z-index: 50; |
|
2127 transform: translateY(-50%); |
|
2128 width: 100%; |
|
2129 text-align: center; |
|
2130 color: #fff; |
|
2131 transition: transform 0.2s ease-in-out; } |
|
2132 @media (prefers-reduced-motion: reduce) { |
|
2133 .components-drop-zone__content { |
|
2134 transition-duration: 0s; } } |
|
2135 |
|
2136 .components-drop-zone.is-dragging-over-element .components-drop-zone__content { |
|
2137 transform: translateY(-50%) scale(1.05); } |
|
2138 |
|
2139 .components-drop-zone__content-icon, |
|
2140 .components-drop-zone__content-text { |
|
2141 display: block; } |
|
2142 |
|
2143 .components-drop-zone__content-icon { |
|
2144 margin: 0 auto; |
|
2145 line-height: 0; |
|
2146 fill: currentColor; } |
|
2147 |
|
2148 .components-drop-zone__content-text { |
|
2149 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; } |
|
2150 |
|
2151 .components-drop-zone__provider { |
|
2152 height: 100%; } |
|
2153 |
|
2154 .components-dropdown { |
|
2155 display: inline-block; } |
|
2156 |
|
2157 .components-dropdown__content .components-popover__content > div { |
|
2158 padding: 12px; } |
|
2159 |
|
2160 .components-dropdown-menu__popover .components-popover__content { |
|
2161 width: 200px; } |
|
2162 |
|
2163 .components-dropdown-menu__menu { |
|
2164 width: 100%; |
|
2165 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
2166 font-size: 13px; |
|
2167 line-height: 1.4; } |
|
2168 .components-dropdown-menu__menu .components-dropdown-menu__menu-item, |
|
2169 .components-dropdown-menu__menu .components-menu-item { |
|
2170 width: 100%; |
|
2171 padding: 6px; |
|
2172 outline: none; |
|
2173 cursor: pointer; |
|
2174 margin-bottom: 4px; } |
|
2175 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator, |
|
2176 .components-dropdown-menu__menu .components-menu-item.has-separator { |
|
2177 margin-top: 6px; |
|
2178 position: relative; |
|
2179 overflow: visible; } |
|
2180 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator::before, |
|
2181 .components-dropdown-menu__menu .components-menu-item.has-separator::before { |
|
2182 display: block; |
|
2183 content: ""; |
|
2184 box-sizing: content-box; |
|
2185 background-color: #ddd; |
|
2186 position: absolute; |
|
2187 top: -3px; |
|
2188 right: 0; |
|
2189 left: 0; |
|
2190 height: 1px; } |
|
2191 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.is-active svg, |
|
2192 .components-dropdown-menu__menu .components-menu-item.is-active svg { |
|
2193 color: #fff; |
|
2194 background: #1e1e1e; |
|
2195 box-shadow: 0 0 0 1px #1e1e1e; |
|
2196 border-radius: 1px; } |
|
2197 .components-dropdown-menu__menu .components-dropdown-menu__menu-item > svg, |
|
2198 .components-dropdown-menu__menu .components-menu-item > svg { |
|
2199 border-radius: 2px; |
|
2200 width: 24px; |
|
2201 height: 24px; } |
|
2202 .components-dropdown-menu__menu .components-menu-item__button, |
|
2203 .components-dropdown-menu__menu .components-menu-item__button.components-button { |
|
2204 min-height: 36px; |
|
2205 height: auto; |
|
2206 padding-right: 40px; |
|
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; } |
|
2230 |
|
2231 .components-external-link__icon { |
|
2232 width: 1.4em; |
|
2233 height: 1.4em; |
|
2234 margin: -0.2em 0.1em 0; |
|
2235 vertical-align: middle; |
|
2236 fill: currentColor; } |
|
2237 |
|
2238 .components-focal-point-picker-wrapper { |
|
2239 background-color: transparent; |
|
2240 border: 1px solid #ddd; |
|
2241 height: 200px; |
|
2242 width: 100%; |
|
2243 padding: 14px; } |
|
2244 |
|
2245 .components-focal-point-picker { |
|
2246 align-items: center; |
|
2247 cursor: pointer; |
|
2248 display: flex; |
|
2249 height: 100%; |
|
2250 justify-content: center; |
|
2251 position: relative; |
|
2252 width: 100%; } |
|
2253 .components-focal-point-picker img { |
|
2254 height: auto; |
|
2255 max-height: 100%; |
|
2256 max-width: 100%; |
|
2257 width: auto; |
|
2258 -webkit-user-select: none; |
|
2259 -ms-user-select: none; |
|
2260 user-select: none; } |
|
2261 |
|
2262 .components-focal-point-picker__icon_container { |
|
2263 background-color: transparent; |
|
2264 cursor: grab; |
|
2265 height: 30px; |
|
2266 opacity: 0.8; |
|
2267 position: absolute; |
|
2268 will-change: transform; |
|
2269 width: 30px; |
|
2270 z-index: 10000; } |
|
2271 .components-focal-point-picker__icon_container.is-dragging { |
|
2272 cursor: grabbing; } |
|
2273 |
|
2274 .components-focal-point-picker__icon { |
|
2275 display: block; |
|
2276 height: 100%; |
|
2277 right: -15px; |
|
2278 position: absolute; |
|
2279 top: -15px; |
|
2280 width: 100%; } |
|
2281 .components-focal-point-picker__icon .components-focal-point-picker__icon-outline { |
|
2282 fill: #fff; } |
|
2283 .components-focal-point-picker__icon .components-focal-point-picker__icon-fill { |
|
2284 fill: #007cba; |
|
2285 fill: var(--wp-admin-theme-color); } |
|
2286 |
|
2287 .components-focal-point-picker_position-display-container { |
|
2288 margin: 1em 0; |
|
2289 display: flex; } |
|
2290 .components-focal-point-picker_position-display-container .components-base-control__field { |
|
2291 margin: 0 0 0 1em; } |
|
2292 .components-focal-point-picker_position-display-container input[type="number"].components-text-control__input { |
|
2293 max-width: 4em; |
|
2294 padding: 6px 4px; } |
|
2295 .components-focal-point-picker_position-display-container span { |
|
2296 margin: 0 0.2em 0 0; } |
|
2297 |
|
2298 .components-font-size-picker__controls { |
|
2299 max-width: 248px; |
|
2300 display: flex; |
|
2301 flex-wrap: wrap; |
|
2302 align-items: center; |
|
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; |
|
2317 height: 30px; |
|
2318 margin-bottom: 0; |
|
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 { |
|
2352 cursor: default; |
|
2353 opacity: 0.3; |
|
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; } |
|
2363 |
|
2364 .components-font-size-picker__custom-input .components-range-control__slider + .dashicon { |
|
2365 width: 30px; |
|
2366 height: 30px; } |
|
2367 |
|
2368 .components-font-size-picker { |
|
2369 border: 0; |
|
2370 padding: 0; |
|
2371 margin: 0; } |
|
2372 |
|
2373 .components-form-toggle { |
|
2374 position: relative; |
|
2375 display: inline-block; } |
|
2376 .components-form-toggle .components-form-toggle__track { |
|
2377 content: ""; |
|
2378 display: inline-block; |
|
2379 box-sizing: border-box; |
|
2380 vertical-align: top; |
|
2381 background-color: #fff; |
|
2382 border: 1px solid #1e1e1e; |
|
2383 width: 36px; |
|
2384 height: 18px; |
|
2385 border-radius: 9px; |
|
2386 transition: 0.2s background ease; } |
|
2387 @media (prefers-reduced-motion: reduce) { |
|
2388 .components-form-toggle .components-form-toggle__track { |
|
2389 transition-duration: 0s; } } |
|
2390 .components-form-toggle .components-form-toggle__thumb { |
|
2391 display: block; |
|
2392 position: absolute; |
|
2393 box-sizing: border-box; |
|
2394 top: 3px; |
|
2395 right: 3px; |
|
2396 width: 12px; |
|
2397 height: 12px; |
|
2398 border-radius: 50%; |
|
2399 transition: 0.1s transform ease; |
|
2400 background-color: #1e1e1e; |
|
2401 border: 5px solid #1e1e1e; } |
|
2402 @media (prefers-reduced-motion: reduce) { |
|
2403 .components-form-toggle .components-form-toggle__thumb { |
|
2404 transition-duration: 0s; } } |
|
2405 .components-form-toggle.is-checked .components-form-toggle__track { |
|
2406 background-color: #007cba; |
|
2407 background-color: var(--wp-admin-theme-color); |
|
2408 border: 1px solid #007cba; |
|
2409 border: 1px solid var(--wp-admin-theme-color); |
|
2410 border: 9px solid transparent; } |
|
2411 .components-form-toggle .components-form-toggle__input:focus + .components-form-toggle__track { |
|
2412 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #007cba; |
|
2413 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--wp-admin-theme-color); |
|
2414 outline: 2px solid transparent; |
|
2415 outline-offset: 2px; } |
|
2416 .components-form-toggle.is-checked .components-form-toggle__thumb { |
|
2417 background-color: #fff; |
|
2418 border-width: 0; |
|
2419 transform: translateX(-18px); } |
|
2420 .components-disabled .components-form-toggle { |
|
2421 opacity: 0.3; } |
|
2422 |
|
2423 .components-form-toggle input.components-form-toggle__input[type="checkbox"] { |
|
2424 position: absolute; |
|
2425 top: 0; |
|
2426 right: 0; |
|
2427 width: 100%; |
|
2428 height: 100%; |
|
2429 opacity: 0; |
|
2430 margin: 0; |
|
2431 padding: 0; |
|
2432 z-index: 1; |
|
2433 border: none; } |
|
2434 .components-form-toggle input.components-form-toggle__input[type="checkbox"]:checked { |
|
2435 background: none; } |
|
2436 .components-form-toggle input.components-form-toggle__input[type="checkbox"]::before { |
|
2437 content: ""; } |
|
2438 |
|
2439 .components-form-token-field__input-container { |
|
2440 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
1064 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
2441 padding: 6px 8px; |
1065 padding: 6px 8px; |
2442 box-shadow: 0 0 0 transparent; |
1066 box-shadow: 0 0 0 transparent; |
2443 transition: box-shadow 0.1s linear; |
1067 transition: box-shadow 0.1s linear; |
2444 border-radius: 2px; |
1068 border-radius: 2px; |
2451 flex-wrap: wrap; |
1075 flex-wrap: wrap; |
2452 align-items: flex-start; |
1076 align-items: flex-start; |
2453 width: 100%; |
1077 width: 100%; |
2454 margin: 0 0 8px 0; |
1078 margin: 0 0 8px 0; |
2455 padding: 4px; |
1079 padding: 4px; |
2456 cursor: text; } |
1080 } |
2457 @media (prefers-reduced-motion: reduce) { |
1081 @media (prefers-reduced-motion: reduce) { |
2458 .components-form-token-field__input-container { |
1082 .components-combobox-control__suggestions-container { |
2459 transition-duration: 0s; } } |
1083 transition-duration: 0s; |
2460 @media (min-width: 600px) { |
1084 transition-delay: 0s; |
2461 .components-form-token-field__input-container { |
1085 } |
2462 font-size: 13px; |
1086 } |
2463 /* Override core line-height. To be reviewed. */ |
1087 @media (min-width: 600px) { |
2464 line-height: normal; } } |
1088 .components-combobox-control__suggestions-container { |
2465 .components-form-token-field__input-container:focus { |
1089 font-size: 13px; |
2466 border-color: #007cba; |
1090 /* Override core line-height. To be reviewed. */ |
2467 border-color: var(--wp-admin-theme-color); |
1091 line-height: normal; |
2468 box-shadow: 0 0 0 0.5px #007cba; |
1092 } |
2469 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
1093 } |
2470 outline: 2px solid transparent; } |
1094 .components-combobox-control__suggestions-container:focus { |
2471 .components-form-token-field__input-container::-webkit-input-placeholder { |
1095 border-color: var(--wp-admin-theme-color); |
2472 color: rgba(30, 30, 30, 0.62); } |
1096 box-shadow: 0 0 0 1px var(--wp-admin-theme-color); |
2473 .components-form-token-field__input-container::-moz-placeholder { |
1097 outline: 2px solid transparent; |
2474 opacity: 1; |
1098 } |
2475 color: rgba(30, 30, 30, 0.62); } |
1099 .components-combobox-control__suggestions-container::-webkit-input-placeholder { |
2476 .components-form-token-field__input-container:-ms-input-placeholder { |
1100 color: rgba(30, 30, 30, 0.62); |
2477 color: rgba(30, 30, 30, 0.62); } |
1101 } |
2478 .is-dark-theme .components-form-token-field__input-container::-webkit-input-placeholder { |
1102 .components-combobox-control__suggestions-container::-moz-placeholder { |
2479 color: rgba(255, 255, 255, 0.65); } |
1103 opacity: 1; |
2480 .is-dark-theme .components-form-token-field__input-container::-moz-placeholder { |
1104 color: rgba(30, 30, 30, 0.62); |
2481 opacity: 1; |
1105 } |
2482 color: rgba(255, 255, 255, 0.65); } |
1106 .components-combobox-control__suggestions-container:-ms-input-placeholder { |
2483 .is-dark-theme .components-form-token-field__input-container:-ms-input-placeholder { |
1107 color: rgba(30, 30, 30, 0.62); |
2484 color: rgba(255, 255, 255, 0.65); } |
1108 } |
2485 .components-form-token-field__input-container.is-disabled { |
1109 .components-combobox-control__suggestions-container:focus-within { |
2486 background: #ddd; |
1110 border-color: var(--wp-admin-theme-color); |
2487 border-color: #ccd0d4; } |
1111 box-shadow: 0 0 0 1px var(--wp-admin-theme-color); |
2488 .components-form-token-field__input-container input[type="text"].components-form-token-field__input { |
1112 outline: 2px solid transparent; |
2489 display: inline-block; |
1113 } |
2490 width: 100%; |
1114 |
2491 max-width: 100%; |
1115 .components-combobox-control__reset.components-button { |
2492 margin-right: 4px; |
1116 display: flex; |
2493 padding: 0; |
1117 height: 24px; |
2494 min-height: 24px; |
1118 min-width: 24px; |
2495 background: inherit; |
1119 padding: 0; |
2496 border: 0; |
1120 } |
2497 color: #1e1e1e; |
1121 |
2498 box-shadow: none; } |
1122 .components-color-list-picker, |
2499 .components-form-token-field__input-container input[type="text"].components-form-token-field__input:focus, |
1123 .components-color-list-picker__swatch-button { |
2500 .components-form-token-field.is-active .components-form-token-field__input-container input[type="text"].components-form-token-field__input { |
1124 width: 100%; |
2501 outline: none; |
1125 } |
2502 box-shadow: none; } |
1126 |
2503 .components-form-token-field__input-container .components-form-token-field__token + input[type="text"].components-form-token-field__input { |
1127 .components-custom-gradient-picker__gradient-bar:not(.has-gradient) { |
2504 width: auto; } |
1128 opacity: 0.4; |
|
1129 } |
|
1130 |
|
1131 .components-custom-gradient-picker__gradient-bar { |
|
1132 margin-top: 12px; |
|
1133 width: 100%; |
|
1134 height: 36px; |
|
1135 border-radius: 36px; |
|
1136 margin-bottom: 12px; |
|
1137 padding-right: 6px; |
|
1138 padding-left: 30px; |
|
1139 } |
|
1140 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__markers-container { |
|
1141 position: relative; |
|
1142 } |
|
1143 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__insert-point { |
|
1144 border-radius: 50%; |
|
1145 background: #fff; |
|
1146 padding: 2px; |
|
1147 top: 6px; |
|
1148 min-width: 24px; |
|
1149 width: 24px; |
|
1150 height: 24px; |
|
1151 position: relative; |
|
1152 color: #1e1e1e; |
|
1153 } |
|
1154 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__insert-point svg { |
|
1155 height: 100%; |
|
1156 width: 100%; |
|
1157 } |
|
1158 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button { |
|
1159 border: 2px solid transparent; |
|
1160 box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) #fff; |
|
1161 border-radius: 50%; |
|
1162 height: 24px; |
|
1163 width: 24px; |
|
1164 padding: 0; |
|
1165 position: absolute; |
|
1166 top: 6px; |
|
1167 } |
|
1168 .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button:focus, .components-custom-gradient-picker__gradient-bar .components-custom-gradient-picker__control-point-button.is-active { |
|
1169 box-shadow: 0 0 0 1px #fff, 0 0 0 3px #1e1e1e; |
|
1170 } |
|
1171 |
|
1172 .components-custom-gradient-picker__color-picker-popover .components-custom-gradient-picker__remove-control-point { |
|
1173 margin-right: auto; |
|
1174 margin-left: auto; |
|
1175 display: block; |
|
1176 margin-bottom: 8px; |
|
1177 } |
|
1178 |
|
1179 .components-custom-gradient-picker__inserter { |
|
1180 width: 100%; |
|
1181 } |
|
1182 |
|
1183 .components-custom-gradient-picker__liner-gradient-indicator { |
|
1184 display: inline-block; |
|
1185 flex: 0 auto; |
|
1186 width: 20px; |
|
1187 height: 20px; |
|
1188 } |
|
1189 |
|
1190 .components-custom-gradient-picker .components-custom-gradient-picker__ui-line { |
|
1191 margin-bottom: 16px; |
|
1192 } |
|
1193 .components-custom-gradient-picker .components-custom-gradient-picker__ui-line .components-base-control.components-angle-picker, |
|
1194 .components-custom-gradient-picker .components-custom-gradient-picker__ui-line .components-base-control.components-custom-gradient-picker__type-picker { |
|
1195 margin-bottom: 0; |
|
1196 } |
|
1197 |
|
1198 .components-custom-gradient-picker .components-custom-gradient-picker__toolbar { |
|
1199 border: none; |
|
1200 } |
|
1201 .components-custom-gradient-picker .components-custom-gradient-picker__toolbar > div + div { |
|
1202 margin-right: 1px; |
|
1203 } |
|
1204 .components-custom-gradient-picker .components-custom-gradient-picker__toolbar button.is-pressed > svg { |
|
1205 background: #fff; |
|
1206 border: 1px solid #949494; |
|
1207 border-radius: 2px; |
|
1208 } |
|
1209 |
|
1210 .components-custom-select-control { |
|
1211 position: relative; |
|
1212 } |
|
1213 |
|
1214 .components-custom-select-control__label { |
|
1215 display: block; |
|
1216 margin-bottom: 8px; |
|
1217 } |
|
1218 |
|
1219 .components-custom-select-control__button { |
|
1220 border: 1px solid #757575; |
|
1221 border-radius: 2px; |
|
1222 min-height: 30px; |
|
1223 min-width: 130px; |
|
1224 position: relative; |
|
1225 text-align: right; |
|
1226 } |
|
1227 .components-custom-select-control__button.components-custom-select-control__button { |
|
1228 padding-left: 24px; |
|
1229 } |
|
1230 .components-custom-select-control__button:focus:not(:disabled) { |
|
1231 border-color: var(--wp-admin-theme-color); |
|
1232 box-shadow: 0 0 0 1px var(--wp-admin-theme-color); |
|
1233 } |
|
1234 .components-custom-select-control__button .components-custom-select-control__button-icon { |
|
1235 height: 100%; |
|
1236 padding: 0; |
|
1237 position: absolute; |
|
1238 left: 0; |
|
1239 top: 0; |
|
1240 } |
|
1241 |
|
1242 .components-custom-select-control__menu { |
|
1243 border: 1px solid #1e1e1e; |
|
1244 background-color: #fff; |
|
1245 border-radius: 2px; |
|
1246 outline: none; |
|
1247 transition: none; |
|
1248 max-height: 400px; |
|
1249 min-width: 100%; |
|
1250 overflow: auto; |
|
1251 padding: 0; |
|
1252 position: absolute; |
|
1253 z-index: 1000000; |
|
1254 } |
|
1255 .components-custom-select-control__menu[aria-hidden=true] { |
|
1256 display: none; |
|
1257 } |
|
1258 |
|
1259 .components-custom-select-control__item { |
|
1260 align-items: center; |
|
1261 display: flex; |
|
1262 list-style-type: none; |
|
1263 padding: 8px; |
|
1264 cursor: default; |
|
1265 line-height: 28px; |
|
1266 } |
|
1267 .components-custom-select-control__item.is-highlighted { |
|
1268 background: #ddd; |
|
1269 } |
|
1270 .components-custom-select-control__item .components-custom-select-control__item-icon { |
|
1271 margin-left: 0; |
|
1272 margin-right: auto; |
|
1273 } |
|
1274 .components-custom-select-control__item:last-child { |
|
1275 margin-bottom: 0; |
|
1276 } |
|
1277 |
|
1278 /** |
|
1279 * Parts of this source were derived and modified from react-dates, |
|
1280 * released under the MIT license. |
|
1281 * |
|
1282 * https://github.com/airbnb/react-dates |
|
1283 * |
|
1284 * The MIT License (MIT) |
|
1285 * |
|
1286 * Copyright (c) 2016 Airbnb |
|
1287 * |
|
1288 * Permission is hereby granted, free of charge, to any person obtaining a copy |
|
1289 * of this software and associated documentation files (the "Software"), to deal |
|
1290 * in the Software without restriction, including without limitation the rights |
|
1291 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell |
|
1292 * copies of the Software, and to permit persons to whom the Software is |
|
1293 * furnished to do so, subject to the following conditions: |
|
1294 * |
|
1295 * The above copyright notice and this permission notice shall be included in all |
|
1296 * copies or substantial portions of the Software. |
|
1297 * |
|
1298 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR |
|
1299 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, |
|
1300 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE |
|
1301 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER |
|
1302 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, |
|
1303 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE |
|
1304 * SOFTWARE. |
|
1305 */ |
|
1306 .PresetDateRangePicker_panel { |
|
1307 padding: 0 22px 11px; |
|
1308 } |
|
1309 |
|
1310 .PresetDateRangePicker_button { |
|
1311 position: relative; |
|
1312 height: 100%; |
|
1313 text-align: center; |
|
1314 background: 0 0; |
|
1315 border: 2px solid #00a699; |
|
1316 color: #00a699; |
|
1317 padding: 4px 12px; |
|
1318 margin-right: 8px; |
|
1319 font: inherit; |
|
1320 font-weight: 700; |
|
1321 line-height: normal; |
|
1322 overflow: visible; |
|
1323 box-sizing: border-box; |
|
1324 cursor: pointer; |
|
1325 } |
|
1326 |
|
1327 .PresetDateRangePicker_button:active { |
|
1328 outline: 0; |
|
1329 } |
|
1330 |
|
1331 .PresetDateRangePicker_button__selected { |
|
1332 color: #fff; |
|
1333 background: #00a699; |
|
1334 } |
|
1335 |
|
1336 .SingleDatePickerInput { |
|
1337 display: inline-block; |
|
1338 background-color: #fff; |
|
1339 } |
|
1340 |
|
1341 .SingleDatePickerInput__withBorder { |
|
1342 border-radius: 2px; |
|
1343 border: 1px solid #dbdbdb; |
|
1344 } |
|
1345 |
|
1346 .SingleDatePickerInput__rtl { |
|
1347 direction: rtl; |
|
1348 } |
|
1349 |
|
1350 .SingleDatePickerInput__disabled { |
|
1351 background-color: #f2f2f2; |
|
1352 } |
|
1353 |
|
1354 .SingleDatePickerInput__block { |
|
1355 display: block; |
|
1356 } |
|
1357 |
|
1358 .SingleDatePickerInput__showClearDate { |
|
1359 padding-right: 30px; |
|
1360 } |
|
1361 |
|
1362 .SingleDatePickerInput_clearDate { |
|
1363 background: 0 0; |
|
1364 border: 0; |
|
1365 color: inherit; |
|
1366 font: inherit; |
|
1367 line-height: normal; |
|
1368 overflow: visible; |
|
1369 cursor: pointer; |
|
1370 padding: 10px; |
|
1371 margin: 0 10px 0 5px; |
|
1372 position: absolute; |
|
1373 right: 0; |
|
1374 top: 50%; |
|
1375 transform: translateY(-50%); |
|
1376 } |
|
1377 |
|
1378 .SingleDatePickerInput_clearDate__default:focus, |
|
1379 .SingleDatePickerInput_clearDate__default:hover { |
|
1380 background: #dbdbdb; |
|
1381 border-radius: 50%; |
|
1382 } |
|
1383 |
|
1384 .SingleDatePickerInput_clearDate__small { |
|
1385 padding: 6px; |
|
1386 } |
|
1387 |
|
1388 .SingleDatePickerInput_clearDate__hide { |
|
1389 visibility: hidden; |
|
1390 } |
|
1391 |
|
1392 .SingleDatePickerInput_clearDate_svg { |
|
1393 fill: #82888a; |
|
1394 height: 12px; |
|
1395 width: 15px; |
|
1396 vertical-align: middle; |
|
1397 } |
|
1398 |
|
1399 .SingleDatePickerInput_clearDate_svg__small { |
|
1400 height: 9px; |
|
1401 } |
|
1402 |
|
1403 .SingleDatePickerInput_calendarIcon { |
|
1404 background: 0 0; |
|
1405 border: 0; |
|
1406 color: inherit; |
|
1407 font: inherit; |
|
1408 line-height: normal; |
|
1409 overflow: visible; |
|
1410 cursor: pointer; |
|
1411 display: inline-block; |
|
1412 vertical-align: middle; |
|
1413 padding: 10px; |
|
1414 margin: 0 5px 0 10px; |
|
1415 } |
|
1416 |
|
1417 .SingleDatePickerInput_calendarIcon_svg { |
|
1418 fill: #82888a; |
|
1419 height: 15px; |
|
1420 width: 14px; |
|
1421 vertical-align: middle; |
|
1422 } |
|
1423 |
|
1424 .SingleDatePicker { |
|
1425 position: relative; |
|
1426 display: inline-block; |
|
1427 } |
|
1428 |
|
1429 .SingleDatePicker__block { |
|
1430 display: block; |
|
1431 } |
|
1432 |
|
1433 .SingleDatePicker_picker { |
|
1434 z-index: 1; |
|
1435 background-color: #fff; |
|
1436 position: absolute; |
|
1437 } |
|
1438 |
|
1439 .SingleDatePicker_picker__rtl { |
|
1440 direction: rtl; |
|
1441 } |
|
1442 |
|
1443 .SingleDatePicker_picker__directionLeft { |
|
1444 left: 0; |
|
1445 } |
|
1446 |
|
1447 .SingleDatePicker_picker__directionRight { |
|
1448 right: 0; |
|
1449 } |
|
1450 |
|
1451 .SingleDatePicker_picker__portal { |
|
1452 background-color: rgba(0, 0, 0, 0.3); |
|
1453 position: fixed; |
|
1454 top: 0; |
|
1455 left: 0; |
|
1456 height: 100%; |
|
1457 width: 100%; |
|
1458 } |
|
1459 |
|
1460 .SingleDatePicker_picker__fullScreenPortal { |
|
1461 background-color: #fff; |
|
1462 } |
|
1463 |
|
1464 .SingleDatePicker_closeButton { |
|
1465 background: 0 0; |
|
1466 border: 0; |
|
1467 color: inherit; |
|
1468 font: inherit; |
|
1469 line-height: normal; |
|
1470 overflow: visible; |
|
1471 cursor: pointer; |
|
1472 position: absolute; |
|
1473 top: 0; |
|
1474 right: 0; |
|
1475 padding: 15px; |
|
1476 z-index: 2; |
|
1477 } |
|
1478 |
|
1479 .SingleDatePicker_closeButton:focus, |
|
1480 .SingleDatePicker_closeButton:hover { |
|
1481 color: #b0b3b4; |
|
1482 text-decoration: none; |
|
1483 } |
|
1484 |
|
1485 .SingleDatePicker_closeButton_svg { |
|
1486 height: 15px; |
|
1487 width: 15px; |
|
1488 fill: #cacccd; |
|
1489 } |
|
1490 |
|
1491 .DayPickerKeyboardShortcuts_buttonReset { |
|
1492 background: 0 0; |
|
1493 border: 0; |
|
1494 border-radius: 0; |
|
1495 color: inherit; |
|
1496 font: inherit; |
|
1497 line-height: normal; |
|
1498 overflow: visible; |
|
1499 padding: 0; |
|
1500 cursor: pointer; |
|
1501 font-size: 14px; |
|
1502 } |
|
1503 |
|
1504 .DayPickerKeyboardShortcuts_buttonReset:active { |
|
1505 outline: 0; |
|
1506 } |
|
1507 |
|
1508 .DayPickerKeyboardShortcuts_show { |
|
1509 width: 22px; |
|
1510 position: absolute; |
|
1511 z-index: 2; |
|
1512 } |
|
1513 |
|
1514 .DayPickerKeyboardShortcuts_show__bottomRight { |
|
1515 border-top: 26px solid transparent; |
|
1516 border-right: 33px solid #00a699; |
|
1517 bottom: 0; |
|
1518 right: 0; |
|
1519 } |
|
1520 |
|
1521 .DayPickerKeyboardShortcuts_show__bottomRight:hover { |
|
1522 border-right: 33px solid #008489; |
|
1523 } |
|
1524 |
|
1525 .DayPickerKeyboardShortcuts_show__topRight { |
|
1526 border-bottom: 26px solid transparent; |
|
1527 border-right: 33px solid #00a699; |
|
1528 top: 0; |
|
1529 right: 0; |
|
1530 } |
|
1531 |
|
1532 .DayPickerKeyboardShortcuts_show__topRight:hover { |
|
1533 border-right: 33px solid #008489; |
|
1534 } |
|
1535 |
|
1536 .DayPickerKeyboardShortcuts_show__topLeft { |
|
1537 border-bottom: 26px solid transparent; |
|
1538 border-left: 33px solid #00a699; |
|
1539 top: 0; |
|
1540 left: 0; |
|
1541 } |
|
1542 |
|
1543 .DayPickerKeyboardShortcuts_show__topLeft:hover { |
|
1544 border-left: 33px solid #008489; |
|
1545 } |
|
1546 |
|
1547 .DayPickerKeyboardShortcuts_showSpan { |
|
1548 color: #fff; |
|
1549 position: absolute; |
|
1550 } |
|
1551 |
|
1552 .DayPickerKeyboardShortcuts_showSpan__bottomRight { |
|
1553 bottom: 0; |
|
1554 right: -28px; |
|
1555 } |
|
1556 |
|
1557 .DayPickerKeyboardShortcuts_showSpan__topRight { |
|
1558 top: 1px; |
|
1559 right: -28px; |
|
1560 } |
|
1561 |
|
1562 .DayPickerKeyboardShortcuts_showSpan__topLeft { |
|
1563 top: 1px; |
|
1564 left: -28px; |
|
1565 } |
|
1566 |
|
1567 .DayPickerKeyboardShortcuts_panel { |
|
1568 overflow: auto; |
|
1569 background: #fff; |
|
1570 border: 1px solid #dbdbdb; |
|
1571 border-radius: 2px; |
|
1572 position: absolute; |
|
1573 top: 0; |
|
1574 bottom: 0; |
|
1575 right: 0; |
|
1576 left: 0; |
|
1577 z-index: 2; |
|
1578 padding: 22px; |
|
1579 margin: 33px; |
|
1580 } |
|
1581 |
|
1582 .DayPickerKeyboardShortcuts_title { |
|
1583 font-size: 16px; |
|
1584 font-weight: 700; |
|
1585 margin: 0; |
|
1586 } |
|
1587 |
|
1588 .DayPickerKeyboardShortcuts_list { |
|
1589 list-style: none; |
|
1590 padding: 0; |
|
1591 font-size: 14px; |
|
1592 } |
|
1593 |
|
1594 .DayPickerKeyboardShortcuts_close { |
|
1595 position: absolute; |
|
1596 right: 22px; |
|
1597 top: 22px; |
|
1598 z-index: 2; |
|
1599 } |
|
1600 |
|
1601 .DayPickerKeyboardShortcuts_close:active { |
|
1602 outline: 0; |
|
1603 } |
|
1604 |
|
1605 .DayPickerKeyboardShortcuts_closeSvg { |
|
1606 height: 15px; |
|
1607 width: 15px; |
|
1608 fill: #cacccd; |
|
1609 } |
|
1610 |
|
1611 .DayPickerKeyboardShortcuts_closeSvg:focus, |
|
1612 .DayPickerKeyboardShortcuts_closeSvg:hover { |
|
1613 fill: #82888a; |
|
1614 } |
|
1615 |
|
1616 .CalendarDay { |
|
1617 box-sizing: border-box; |
|
1618 cursor: pointer; |
|
1619 font-size: 14px; |
|
1620 text-align: center; |
|
1621 } |
|
1622 |
|
1623 .CalendarDay:active { |
|
1624 outline: 0; |
|
1625 } |
|
1626 |
|
1627 .CalendarDay__defaultCursor { |
|
1628 cursor: default; |
|
1629 } |
|
1630 |
|
1631 .CalendarDay__default { |
|
1632 border: 1px solid #e4e7e7; |
|
1633 color: #484848; |
|
1634 background: #fff; |
|
1635 } |
|
1636 |
|
1637 .CalendarDay__default:hover { |
|
1638 background: #e4e7e7; |
|
1639 border: 1px double #e4e7e7; |
|
1640 color: inherit; |
|
1641 } |
|
1642 |
|
1643 .CalendarDay__hovered_offset { |
|
1644 background: #f4f5f5; |
|
1645 border: 1px double #e4e7e7; |
|
1646 color: inherit; |
|
1647 } |
|
1648 |
|
1649 .CalendarDay__outside { |
|
1650 border: 0; |
|
1651 background: #fff; |
|
1652 color: #484848; |
|
1653 } |
|
1654 |
|
1655 .CalendarDay__outside:hover { |
|
1656 border: 0; |
|
1657 } |
|
1658 |
|
1659 .CalendarDay__blocked_minimum_nights { |
|
1660 background: #fff; |
|
1661 border: 1px solid #eceeee; |
|
1662 color: #cacccd; |
|
1663 } |
|
1664 |
|
1665 .CalendarDay__blocked_minimum_nights:active, |
|
1666 .CalendarDay__blocked_minimum_nights:hover { |
|
1667 background: #fff; |
|
1668 color: #cacccd; |
|
1669 } |
|
1670 |
|
1671 .CalendarDay__highlighted_calendar { |
|
1672 background: #ffe8bc; |
|
1673 color: #484848; |
|
1674 } |
|
1675 |
|
1676 .CalendarDay__highlighted_calendar:active, |
|
1677 .CalendarDay__highlighted_calendar:hover { |
|
1678 background: #ffce71; |
|
1679 color: #484848; |
|
1680 } |
|
1681 |
|
1682 .CalendarDay__selected_span { |
|
1683 background: #66e2da; |
|
1684 border: 1px solid #33dacd; |
|
1685 color: #fff; |
|
1686 } |
|
1687 |
|
1688 .CalendarDay__selected_span:active, |
|
1689 .CalendarDay__selected_span:hover { |
|
1690 background: #33dacd; |
|
1691 border: 1px solid #33dacd; |
|
1692 color: #fff; |
|
1693 } |
|
1694 |
|
1695 .CalendarDay__last_in_range { |
|
1696 border-right: #00a699; |
|
1697 } |
|
1698 |
|
1699 .CalendarDay__selected, |
|
1700 .CalendarDay__selected:active, |
|
1701 .CalendarDay__selected:hover { |
|
1702 background: #00a699; |
|
1703 border: 1px solid #00a699; |
|
1704 color: #fff; |
|
1705 } |
|
1706 |
|
1707 .CalendarDay__hovered_span, |
|
1708 .CalendarDay__hovered_span:hover { |
|
1709 background: #b2f1ec; |
|
1710 border: 1px solid #80e8e0; |
|
1711 color: #007a87; |
|
1712 } |
|
1713 |
|
1714 .CalendarDay__hovered_span:active { |
|
1715 background: #80e8e0; |
|
1716 border: 1px solid #80e8e0; |
|
1717 color: #007a87; |
|
1718 } |
|
1719 |
|
1720 .CalendarDay__blocked_calendar, |
|
1721 .CalendarDay__blocked_calendar:active, |
|
1722 .CalendarDay__blocked_calendar:hover { |
|
1723 background: #cacccd; |
|
1724 border: 1px solid #cacccd; |
|
1725 color: #82888a; |
|
1726 } |
|
1727 |
|
1728 .CalendarDay__blocked_out_of_range, |
|
1729 .CalendarDay__blocked_out_of_range:active, |
|
1730 .CalendarDay__blocked_out_of_range:hover { |
|
1731 background: #fff; |
|
1732 border: 1px solid #e4e7e7; |
|
1733 color: #cacccd; |
|
1734 } |
|
1735 |
|
1736 .CalendarMonth { |
|
1737 background: #fff; |
|
1738 text-align: center; |
|
1739 vertical-align: top; |
|
1740 -webkit-user-select: none; |
|
1741 user-select: none; |
|
1742 } |
|
1743 |
|
1744 .CalendarMonth_table { |
|
1745 border-collapse: collapse; |
|
1746 border-spacing: 0; |
|
1747 } |
|
1748 |
|
1749 .CalendarMonth_verticalSpacing { |
|
1750 border-collapse: separate; |
|
1751 } |
|
1752 |
|
1753 .CalendarMonth_caption { |
|
1754 color: #484848; |
|
1755 font-size: 18px; |
|
1756 text-align: center; |
|
1757 padding-top: 22px; |
|
1758 padding-bottom: 37px; |
|
1759 caption-side: initial; |
|
1760 } |
|
1761 |
|
1762 .CalendarMonth_caption__verticalScrollable { |
|
1763 padding-top: 12px; |
|
1764 padding-bottom: 7px; |
|
1765 } |
|
1766 |
|
1767 .CalendarMonthGrid { |
|
1768 background: #fff; |
|
1769 text-align: left; |
|
1770 z-index: 0; |
|
1771 } |
|
1772 |
|
1773 .CalendarMonthGrid__animating { |
|
1774 z-index: 1; |
|
1775 } |
|
1776 |
|
1777 .CalendarMonthGrid__horizontal { |
|
1778 position: absolute; |
|
1779 left: 0; |
|
1780 } |
|
1781 |
|
1782 .CalendarMonthGrid__vertical { |
|
1783 margin: 0 auto; |
|
1784 } |
|
1785 |
|
1786 .CalendarMonthGrid__vertical_scrollable { |
|
1787 margin: 0 auto; |
|
1788 overflow-y: scroll; |
|
1789 } |
|
1790 |
|
1791 .CalendarMonthGrid_month__horizontal { |
|
1792 display: inline-block; |
|
1793 vertical-align: top; |
|
1794 min-height: 100%; |
|
1795 } |
|
1796 |
|
1797 .CalendarMonthGrid_month__hideForAnimation { |
|
1798 position: absolute; |
|
1799 z-index: -1; |
|
1800 opacity: 0; |
|
1801 pointer-events: none; |
|
1802 } |
|
1803 |
|
1804 .CalendarMonthGrid_month__hidden { |
|
1805 visibility: hidden; |
|
1806 } |
|
1807 |
|
1808 .DayPickerNavigation { |
|
1809 position: relative; |
|
1810 z-index: 2; |
|
1811 } |
|
1812 |
|
1813 .DayPickerNavigation__horizontal { |
|
1814 height: 0; |
|
1815 } |
|
1816 |
|
1817 .DayPickerNavigation__verticalDefault { |
|
1818 position: absolute; |
|
1819 width: 100%; |
|
1820 height: 52px; |
|
1821 bottom: 0; |
|
1822 left: 0; |
|
1823 } |
|
1824 |
|
1825 .DayPickerNavigation__verticalScrollableDefault { |
|
1826 position: relative; |
|
1827 } |
|
1828 |
|
1829 .DayPickerNavigation_button { |
|
1830 cursor: pointer; |
|
1831 -webkit-user-select: none; |
|
1832 user-select: none; |
|
1833 border: 0; |
|
1834 padding: 0; |
|
1835 margin: 0; |
|
1836 } |
|
1837 |
|
1838 .DayPickerNavigation_button__default { |
|
1839 border: 1px solid #e4e7e7; |
|
1840 background-color: #fff; |
|
1841 color: #757575; |
|
1842 } |
|
1843 |
|
1844 .DayPickerNavigation_button__default:focus, |
|
1845 .DayPickerNavigation_button__default:hover { |
|
1846 border: 1px solid #c4c4c4; |
|
1847 } |
|
1848 |
|
1849 .DayPickerNavigation_button__default:active { |
|
1850 background: #f2f2f2; |
|
1851 } |
|
1852 |
|
1853 .DayPickerNavigation_button__horizontalDefault { |
|
1854 position: absolute; |
|
1855 top: 18px; |
|
1856 line-height: 0.78; |
|
1857 border-radius: 3px; |
|
1858 padding: 6px 9px; |
|
1859 } |
|
1860 |
|
1861 .DayPickerNavigation_leftButton__horizontalDefault { |
|
1862 left: 22px; |
|
1863 } |
|
1864 |
|
1865 .DayPickerNavigation_rightButton__horizontalDefault { |
|
1866 right: 22px; |
|
1867 } |
|
1868 |
|
1869 .DayPickerNavigation_button__verticalDefault { |
|
1870 padding: 5px; |
|
1871 background: #fff; |
|
1872 box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.1); |
|
1873 position: relative; |
|
1874 display: inline-block; |
|
1875 height: 100%; |
|
1876 width: 50%; |
|
1877 } |
|
1878 |
|
1879 .DayPickerNavigation_nextButton__verticalDefault { |
|
1880 border-left: 0; |
|
1881 } |
|
1882 |
|
1883 .DayPickerNavigation_nextButton__verticalScrollableDefault { |
|
1884 width: 100%; |
|
1885 } |
|
1886 |
|
1887 .DayPickerNavigation_svg__horizontal { |
|
1888 height: 19px; |
|
1889 width: 19px; |
|
1890 fill: #82888a; |
|
1891 display: block; |
|
1892 } |
|
1893 |
|
1894 .DayPickerNavigation_svg__vertical { |
|
1895 height: 42px; |
|
1896 width: 42px; |
|
1897 fill: #484848; |
|
1898 display: block; |
|
1899 } |
|
1900 |
|
1901 .DayPicker { |
|
1902 background: #fff; |
|
1903 position: relative; |
|
1904 text-align: left; |
|
1905 } |
|
1906 |
|
1907 .DayPicker__horizontal { |
|
1908 background: #fff; |
|
1909 } |
|
1910 |
|
1911 .DayPicker__verticalScrollable { |
|
1912 height: 100%; |
|
1913 } |
|
1914 |
|
1915 .DayPicker__hidden { |
|
1916 visibility: hidden; |
|
1917 } |
|
1918 |
|
1919 .DayPicker__withBorder { |
|
1920 box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.07); |
|
1921 border-radius: 3px; |
|
1922 } |
|
1923 |
|
1924 .DayPicker_portal__horizontal { |
|
1925 box-shadow: none; |
|
1926 position: absolute; |
|
1927 left: 50%; |
|
1928 top: 50%; |
|
1929 } |
|
1930 |
|
1931 .DayPicker_portal__vertical { |
|
1932 position: initial; |
|
1933 } |
|
1934 |
|
1935 .DayPicker_focusRegion { |
|
1936 outline: 0; |
|
1937 } |
|
1938 |
|
1939 .DayPicker_calendarInfo__horizontal, |
|
1940 .DayPicker_wrapper__horizontal { |
|
1941 display: inline-block; |
|
1942 vertical-align: top; |
|
1943 } |
|
1944 |
|
1945 .DayPicker_weekHeaders { |
|
1946 position: relative; |
|
1947 } |
|
1948 |
|
1949 .DayPicker_weekHeaders__horizontal { |
|
1950 margin-left: 13px; |
|
1951 } |
|
1952 |
|
1953 .DayPicker_weekHeader { |
|
1954 color: #757575; |
|
1955 position: absolute; |
|
1956 top: 62px; |
|
1957 z-index: 2; |
|
1958 text-align: left; |
|
1959 padding: 0 !important; |
|
1960 } |
|
1961 |
|
1962 .DayPicker_weekHeader__vertical { |
|
1963 left: 50%; |
|
1964 } |
|
1965 |
|
1966 .DayPicker_weekHeader__verticalScrollable { |
|
1967 top: 0; |
|
1968 display: table-row; |
|
1969 border-bottom: 1px solid #dbdbdb; |
|
1970 background: #fff; |
|
1971 margin-left: 0; |
|
1972 left: 0; |
|
1973 width: 100%; |
|
1974 text-align: center; |
|
1975 } |
|
1976 |
|
1977 .DayPicker_weekHeader_ul { |
|
1978 list-style: none; |
|
1979 margin: 1px 0; |
|
1980 padding-left: 0; |
|
1981 padding-right: 0; |
|
1982 font-size: 14px; |
|
1983 } |
|
1984 |
|
1985 .DayPicker_weekHeader_li { |
|
1986 display: inline-block; |
|
1987 text-align: center; |
|
1988 margin: 0 1px; |
|
1989 } |
|
1990 |
|
1991 .DayPicker_transitionContainer { |
|
1992 position: relative; |
|
1993 overflow: hidden; |
|
1994 border-radius: 3px; |
|
1995 } |
|
1996 |
|
1997 .DayPicker_transitionContainer__horizontal { |
|
1998 transition: height 0.2s ease-in-out; |
|
1999 } |
|
2000 |
|
2001 .DayPicker_transitionContainer__vertical { |
|
2002 width: 100%; |
|
2003 } |
|
2004 |
|
2005 .DayPicker_transitionContainer__verticalScrollable { |
|
2006 padding-top: 20px; |
|
2007 height: 100%; |
|
2008 position: absolute; |
|
2009 top: 0; |
|
2010 bottom: 0; |
|
2011 right: 0; |
|
2012 left: 0; |
|
2013 overflow-y: scroll; |
|
2014 } |
|
2015 |
|
2016 .DateInput { |
|
2017 margin: 0; |
|
2018 padding: 0; |
|
2019 background: #fff; |
|
2020 position: relative; |
|
2021 display: inline-block; |
|
2022 width: 130px; |
|
2023 vertical-align: middle; |
|
2024 } |
|
2025 |
|
2026 .DateInput__small { |
|
2027 width: 97px; |
|
2028 } |
|
2029 |
|
2030 .DateInput__block { |
|
2031 width: 100%; |
|
2032 } |
|
2033 |
|
2034 .DateInput__disabled { |
|
2035 background: #f2f2f2; |
|
2036 color: #dbdbdb; |
|
2037 } |
|
2038 |
|
2039 .DateInput_input { |
|
2040 font-weight: 200; |
|
2041 font-size: 19px; |
|
2042 line-height: 24px; |
|
2043 color: #484848; |
|
2044 background-color: #fff; |
|
2045 width: 100%; |
|
2046 padding: 11px 11px 9px; |
|
2047 border: 0; |
|
2048 border-top: 0; |
|
2049 border-right: 0; |
|
2050 border-bottom: 2px solid transparent; |
|
2051 border-left: 0; |
|
2052 border-radius: 0; |
|
2053 } |
|
2054 |
|
2055 .DateInput_input__small { |
|
2056 font-size: 15px; |
|
2057 line-height: 18px; |
|
2058 letter-spacing: 0.2px; |
|
2059 padding: 7px 7px 5px; |
|
2060 } |
|
2061 |
|
2062 .DateInput_input__regular { |
|
2063 font-weight: auto; |
|
2064 } |
|
2065 |
|
2066 .DateInput_input__readOnly { |
|
2067 -webkit-user-select: none; |
|
2068 user-select: none; |
|
2069 } |
|
2070 |
|
2071 .DateInput_input__focused { |
|
2072 outline: 0; |
|
2073 background: #fff; |
|
2074 border: 0; |
|
2075 border-top: 0; |
|
2076 border-right: 0; |
|
2077 border-bottom: 2px solid #008489; |
|
2078 border-left: 0; |
|
2079 } |
|
2080 |
|
2081 .DateInput_input__disabled { |
|
2082 background: #f2f2f2; |
|
2083 font-style: italic; |
|
2084 } |
|
2085 |
|
2086 .DateInput_screenReaderMessage { |
|
2087 border: 0; |
|
2088 clip: rect(0, 0, 0, 0); |
|
2089 height: 1px; |
|
2090 margin: -1px; |
|
2091 overflow: hidden; |
|
2092 padding: 0; |
|
2093 position: absolute; |
|
2094 width: 1px; |
|
2095 } |
|
2096 |
|
2097 .DateInput_fang { |
|
2098 position: absolute; |
|
2099 width: 20px; |
|
2100 height: 10px; |
|
2101 left: 22px; |
|
2102 z-index: 2; |
|
2103 } |
|
2104 |
|
2105 .DateInput_fangShape { |
|
2106 fill: #fff; |
|
2107 } |
|
2108 |
|
2109 .DateInput_fangStroke { |
|
2110 stroke: #dbdbdb; |
|
2111 fill: transparent; |
|
2112 } |
|
2113 |
|
2114 .DateRangePickerInput { |
|
2115 background-color: #fff; |
|
2116 display: inline-block; |
|
2117 } |
|
2118 |
|
2119 .DateRangePickerInput__disabled { |
|
2120 background: #f2f2f2; |
|
2121 } |
|
2122 |
|
2123 .DateRangePickerInput__withBorder { |
|
2124 border-radius: 2px; |
|
2125 border: 1px solid #dbdbdb; |
|
2126 } |
|
2127 |
|
2128 .DateRangePickerInput__rtl { |
|
2129 direction: rtl; |
|
2130 } |
|
2131 |
|
2132 .DateRangePickerInput__block { |
|
2133 display: block; |
|
2134 } |
|
2135 |
|
2136 .DateRangePickerInput__showClearDates { |
|
2137 padding-right: 30px; |
|
2138 } |
|
2139 |
|
2140 .DateRangePickerInput_arrow { |
|
2141 display: inline-block; |
|
2142 vertical-align: middle; |
|
2143 color: #484848; |
|
2144 } |
|
2145 |
|
2146 .DateRangePickerInput_arrow_svg { |
|
2147 vertical-align: middle; |
|
2148 fill: #484848; |
|
2149 height: 24px; |
|
2150 width: 24px; |
|
2151 } |
|
2152 |
|
2153 .DateRangePickerInput_clearDates { |
|
2154 background: 0 0; |
|
2155 border: 0; |
|
2156 color: inherit; |
|
2157 font: inherit; |
|
2158 line-height: normal; |
|
2159 overflow: visible; |
|
2160 cursor: pointer; |
|
2161 padding: 10px; |
|
2162 margin: 0 10px 0 5px; |
|
2163 position: absolute; |
|
2164 right: 0; |
|
2165 top: 50%; |
|
2166 transform: translateY(-50%); |
|
2167 } |
|
2168 |
|
2169 .DateRangePickerInput_clearDates__small { |
|
2170 padding: 6px; |
|
2171 } |
|
2172 |
|
2173 .DateRangePickerInput_clearDates_default:focus, |
|
2174 .DateRangePickerInput_clearDates_default:hover { |
|
2175 background: #dbdbdb; |
|
2176 border-radius: 50%; |
|
2177 } |
|
2178 |
|
2179 .DateRangePickerInput_clearDates__hide { |
|
2180 visibility: hidden; |
|
2181 } |
|
2182 |
|
2183 .DateRangePickerInput_clearDates_svg { |
|
2184 fill: #82888a; |
|
2185 height: 12px; |
|
2186 width: 15px; |
|
2187 vertical-align: middle; |
|
2188 } |
|
2189 |
|
2190 .DateRangePickerInput_clearDates_svg__small { |
|
2191 height: 9px; |
|
2192 } |
|
2193 |
|
2194 .DateRangePickerInput_calendarIcon { |
|
2195 background: 0 0; |
|
2196 border: 0; |
|
2197 color: inherit; |
|
2198 font: inherit; |
|
2199 line-height: normal; |
|
2200 overflow: visible; |
|
2201 cursor: pointer; |
|
2202 display: inline-block; |
|
2203 vertical-align: middle; |
|
2204 padding: 10px; |
|
2205 margin: 0 5px 0 10px; |
|
2206 } |
|
2207 |
|
2208 .DateRangePickerInput_calendarIcon_svg { |
|
2209 fill: #82888a; |
|
2210 height: 15px; |
|
2211 width: 14px; |
|
2212 vertical-align: middle; |
|
2213 } |
|
2214 |
|
2215 .DateRangePicker { |
|
2216 position: relative; |
|
2217 display: inline-block; |
|
2218 } |
|
2219 |
|
2220 .DateRangePicker__block { |
|
2221 display: block; |
|
2222 } |
|
2223 |
|
2224 .DateRangePicker_picker { |
|
2225 z-index: 1; |
|
2226 background-color: #fff; |
|
2227 position: absolute; |
|
2228 } |
|
2229 |
|
2230 .DateRangePicker_picker__rtl { |
|
2231 direction: rtl; |
|
2232 } |
|
2233 |
|
2234 .DateRangePicker_picker__directionLeft { |
|
2235 left: 0; |
|
2236 } |
|
2237 |
|
2238 .DateRangePicker_picker__directionRight { |
|
2239 right: 0; |
|
2240 } |
|
2241 |
|
2242 .DateRangePicker_picker__portal { |
|
2243 background-color: rgba(0, 0, 0, 0.3); |
|
2244 position: fixed; |
|
2245 top: 0; |
|
2246 left: 0; |
|
2247 height: 100%; |
|
2248 width: 100%; |
|
2249 } |
|
2250 |
|
2251 .DateRangePicker_picker__fullScreenPortal { |
|
2252 background-color: #fff; |
|
2253 } |
|
2254 |
|
2255 .DateRangePicker_closeButton { |
|
2256 background: 0 0; |
|
2257 border: 0; |
|
2258 color: inherit; |
|
2259 font: inherit; |
|
2260 line-height: normal; |
|
2261 overflow: visible; |
|
2262 cursor: pointer; |
|
2263 position: absolute; |
|
2264 top: 0; |
|
2265 right: 0; |
|
2266 padding: 15px; |
|
2267 z-index: 2; |
|
2268 } |
|
2269 |
|
2270 .DateRangePicker_closeButton:focus, |
|
2271 .DateRangePicker_closeButton:hover { |
|
2272 color: #b0b3b4; |
|
2273 text-decoration: none; |
|
2274 } |
|
2275 |
|
2276 .DateRangePicker_closeButton_svg { |
|
2277 height: 15px; |
|
2278 width: 15px; |
|
2279 fill: #cacccd; |
|
2280 } |
|
2281 .components-datetime { |
|
2282 padding: 16px; |
|
2283 } |
|
2284 .components-panel__body .components-datetime { |
|
2285 padding: 0; |
|
2286 } |
|
2287 .components-datetime .components-datetime__calendar-help { |
|
2288 padding: 16px; |
|
2289 } |
|
2290 .components-datetime .components-datetime__calendar-help h4 { |
|
2291 margin: 0; |
|
2292 } |
|
2293 .components-datetime .components-datetime__buttons { |
|
2294 display: flex; |
|
2295 justify-content: space-between; |
|
2296 } |
|
2297 .components-datetime .components-datetime__date-help-toggle { |
|
2298 display: block; |
|
2299 margin-right: auto; |
|
2300 } |
|
2301 .components-datetime fieldset { |
|
2302 border: 0; |
|
2303 padding: 0; |
|
2304 margin: 0; |
|
2305 } |
|
2306 .components-datetime select, |
|
2307 .components-datetime input { |
|
2308 box-shadow: 0 0 0 transparent; |
|
2309 transition: box-shadow 0.1s linear; |
|
2310 border-radius: 2px; |
|
2311 border: 1px solid #757575; |
|
2312 } |
|
2313 @media (prefers-reduced-motion: reduce) { |
|
2314 .components-datetime select, |
|
2315 .components-datetime input { |
|
2316 transition-duration: 0s; |
|
2317 transition-delay: 0s; |
|
2318 } |
|
2319 } |
|
2320 .components-datetime select, |
|
2321 .components-datetime input[type=number], |
|
2322 .components-datetime .components-button { |
|
2323 height: 30px; |
|
2324 margin-top: 0; |
|
2325 margin-bottom: 0; |
|
2326 } |
|
2327 |
|
2328 .components-datetime__date { |
|
2329 min-height: 236px; |
|
2330 border-top: 1px solid #ddd; |
|
2331 } |
|
2332 .components-datetime__date .DayPickerNavigation_leftButton__horizontalDefault { |
|
2333 left: 13px; |
|
2334 } |
|
2335 .components-datetime__date .CalendarMonth_caption { |
|
2336 font-size: 13px; |
|
2337 } |
|
2338 .components-datetime__date .CalendarMonth_table { |
|
2339 border-collapse: separate; |
|
2340 border-spacing: 2px; |
|
2341 } |
|
2342 .components-datetime__date .CalendarDay { |
|
2343 font-size: 13px; |
|
2344 border: none; |
|
2345 border-radius: 50%; |
|
2346 text-align: center; |
|
2347 } |
|
2348 .components-datetime__date .CalendarDay:focus { |
|
2349 box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 3px #fff; |
|
2350 outline: 2px solid transparent; |
|
2351 } |
|
2352 .components-datetime__date .CalendarDay__selected { |
|
2353 background: var(--wp-admin-theme-color); |
|
2354 border: 2px solid transparent; |
|
2355 } |
|
2356 .components-datetime__date .CalendarDay__selected:hover { |
|
2357 background: var(--wp-admin-theme-color-darker-20); |
|
2358 } |
|
2359 .components-datetime__date .CalendarDay__selected:focus { |
|
2360 box-shadow: inset 0 0 0 1px #fff; |
|
2361 } |
|
2362 .components-datetime__date .DayPickerNavigation_button__horizontalDefault { |
|
2363 padding: 2px 8px; |
|
2364 top: 20px; |
|
2365 } |
|
2366 .components-datetime__date .DayPickerNavigation_button__horizontalDefault:focus { |
|
2367 border-color: var(--wp-admin-theme-color); |
|
2368 box-shadow: 0 0 0 1px var(--wp-admin-theme-color); |
|
2369 outline: 2px solid transparent; |
|
2370 } |
|
2371 .components-datetime__date .DayPicker_weekHeader { |
|
2372 top: 50px; |
|
2373 } |
|
2374 .components-datetime__date .DayPicker_weekHeader .DayPicker_weekHeader_ul { |
|
2375 margin: 1px; |
|
2376 padding-right: 0; |
|
2377 padding-left: 0; |
|
2378 } |
|
2379 .components-datetime__date.is-description-visible .DayPicker { |
|
2380 visibility: hidden; |
|
2381 } |
|
2382 |
|
2383 .components-datetime__date .CalendarDay .components-datetime__date__day { |
|
2384 height: 100%; |
|
2385 display: flex; |
|
2386 justify-content: center; |
|
2387 align-content: center; |
|
2388 flex-direction: column; |
|
2389 position: relative; |
|
2390 } |
|
2391 .components-datetime__date .CalendarDay .components-datetime__date__day.has-events::before { |
|
2392 content: " "; |
|
2393 width: 4px; |
|
2394 height: 4px; |
|
2395 border-radius: 2px; |
|
2396 position: absolute; |
|
2397 right: 50%; |
|
2398 margin-right: -2px; |
|
2399 bottom: 0; |
|
2400 background-color: #fff; |
|
2401 } |
|
2402 |
|
2403 .components-datetime__date .CalendarDay:not(.CalendarDay__selected) .components-datetime__date__day.has-events::before { |
|
2404 background: var(--wp-admin-theme-color); |
|
2405 } |
|
2406 |
|
2407 .components-datetime__time { |
|
2408 padding-bottom: 16px; |
|
2409 } |
|
2410 .components-datetime__time fieldset { |
|
2411 position: relative; |
|
2412 margin-bottom: 0.5em; |
|
2413 } |
|
2414 .components-datetime__time fieldset + fieldset { |
|
2415 margin-bottom: 0; |
|
2416 } |
|
2417 .components-datetime__time .components-datetime__time-field-am-pm fieldset { |
|
2418 margin-top: 0; |
|
2419 } |
|
2420 .components-datetime__time .components-datetime__time-wrapper { |
|
2421 display: flex; |
|
2422 } |
|
2423 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-separator { |
|
2424 display: inline-block; |
|
2425 padding: 0 0 0 3px; |
|
2426 } |
|
2427 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field-time { |
|
2428 direction: ltr; |
|
2429 } |
|
2430 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select { |
|
2431 margin-left: 4px; |
|
2432 } |
|
2433 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field select:focus { |
|
2434 position: relative; |
|
2435 z-index: 1; |
|
2436 } |
|
2437 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type=number] { |
|
2438 padding: 2px; |
|
2439 margin-left: 4px; |
|
2440 text-align: center; |
|
2441 -moz-appearance: textfield; |
|
2442 } |
|
2443 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type=number]:focus { |
|
2444 position: relative; |
|
2445 z-index: 1; |
|
2446 } |
|
2447 .components-datetime__time .components-datetime__time-wrapper .components-datetime__time-field input[type=number]::-webkit-inner-spin-button { |
|
2448 -webkit-appearance: none; |
|
2449 margin: 0; |
|
2450 } |
|
2451 .components-datetime__time.is-12-hour .components-datetime__time-field-day input { |
|
2452 margin: -4px 0 0 !important; |
|
2453 border-radius: 0 2px 2px 0 !important; |
|
2454 } |
|
2455 .components-datetime__time.is-12-hour .components-datetime__time-field-year input { |
|
2456 border-radius: 2px 0 0 2px !important; |
|
2457 } |
|
2458 |
|
2459 .components-datetime__timezone { |
|
2460 line-height: 30px; |
|
2461 margin-right: 4px; |
|
2462 -webkit-text-decoration: underline dotted; |
|
2463 text-decoration: underline dotted; |
|
2464 } |
|
2465 |
|
2466 .components-datetime__time-legend { |
|
2467 font-weight: 600; |
|
2468 margin-top: 0.5em; |
|
2469 } |
|
2470 .components-datetime__time-legend.invisible { |
|
2471 position: absolute; |
|
2472 top: -999em; |
|
2473 right: -999em; |
|
2474 } |
|
2475 |
|
2476 .components-datetime__time-field-hours-input, |
|
2477 .components-datetime__time-field-minutes-input, |
|
2478 .components-datetime__time-field-day-input { |
|
2479 width: 35px; |
|
2480 } |
|
2481 |
|
2482 .components-datetime__time-field-year-input { |
|
2483 width: 55px; |
|
2484 } |
|
2485 |
|
2486 .components-datetime__time-field-month-select { |
|
2487 max-width: 145px; |
|
2488 } |
|
2489 |
|
2490 .components-popover .components-datetime__date { |
|
2491 padding-right: 4px; |
|
2492 } |
|
2493 |
|
2494 .block-editor-dimension-control .components-base-control__field { |
|
2495 display: flex; |
|
2496 align-items: center; |
|
2497 } |
|
2498 .block-editor-dimension-control .components-base-control__label { |
|
2499 display: flex; |
|
2500 align-items: center; |
|
2501 margin-left: 1em; |
|
2502 margin-bottom: 0; |
|
2503 } |
|
2504 .block-editor-dimension-control .components-base-control__label .dashicon { |
|
2505 margin-left: 0.5em; |
|
2506 } |
|
2507 .block-editor-dimension-control.is-manual .components-base-control__label { |
|
2508 width: 10em; |
|
2509 } |
|
2510 |
|
2511 body.is-dragging-components-draggable { |
|
2512 cursor: move; |
|
2513 /* Fallback for IE/Edge < 14 */ |
|
2514 cursor: grabbing !important; |
|
2515 } |
|
2516 |
|
2517 .components-draggable__invisible-drag-image { |
|
2518 position: fixed; |
|
2519 right: -1000px; |
|
2520 height: 50px; |
|
2521 width: 50px; |
|
2522 } |
|
2523 |
|
2524 .components-draggable__clone { |
|
2525 position: fixed; |
|
2526 padding: 0; |
|
2527 background: transparent; |
|
2528 pointer-events: none; |
|
2529 z-index: 1000000000; |
|
2530 } |
|
2531 |
|
2532 .components-drop-zone { |
|
2533 position: absolute; |
|
2534 top: 0; |
|
2535 left: 0; |
|
2536 bottom: 0; |
|
2537 right: 0; |
|
2538 z-index: 40; |
|
2539 visibility: hidden; |
|
2540 opacity: 0; |
|
2541 transition: 0.3s opacity, 0.3s background-color, 0s visibility 0.3s; |
|
2542 border: 2px solid var(--wp-admin-theme-color); |
|
2543 border-radius: 2px; |
|
2544 } |
|
2545 @media (prefers-reduced-motion: reduce) { |
|
2546 .components-drop-zone { |
|
2547 transition-duration: 0s; |
|
2548 transition-delay: 0s; |
|
2549 } |
|
2550 } |
|
2551 .components-drop-zone.is-active { |
|
2552 opacity: 1; |
|
2553 visibility: visible; |
|
2554 transition: 0.3s opacity, 0.3s background-color; |
|
2555 } |
|
2556 @media (prefers-reduced-motion: reduce) { |
|
2557 .components-drop-zone.is-active { |
|
2558 transition-duration: 0s; |
|
2559 transition-delay: 0s; |
|
2560 } |
|
2561 } |
|
2562 .components-drop-zone.is-dragging-over-element { |
|
2563 background-color: var(--wp-admin-theme-color); |
|
2564 } |
|
2565 |
|
2566 .components-drop-zone__content { |
|
2567 position: absolute; |
|
2568 top: 50%; |
|
2569 right: 0; |
|
2570 left: 0; |
|
2571 z-index: 50; |
|
2572 transform: translateY(-50%); |
|
2573 width: 100%; |
|
2574 text-align: center; |
|
2575 color: #fff; |
|
2576 transition: transform 0.2s ease-in-out; |
|
2577 } |
|
2578 @media (prefers-reduced-motion: reduce) { |
|
2579 .components-drop-zone__content { |
|
2580 transition-duration: 0s; |
|
2581 transition-delay: 0s; |
|
2582 } |
|
2583 } |
|
2584 |
|
2585 .components-drop-zone.is-dragging-over-element .components-drop-zone__content { |
|
2586 transform: translateY(-50%) scale(1.05); |
|
2587 } |
|
2588 |
|
2589 .components-drop-zone__content-icon, |
|
2590 .components-drop-zone__content-text { |
|
2591 display: block; |
|
2592 } |
|
2593 |
|
2594 .components-drop-zone__content-icon { |
|
2595 margin: 0 auto; |
|
2596 line-height: 0; |
|
2597 fill: currentColor; |
|
2598 } |
|
2599 |
|
2600 .components-drop-zone__content-text { |
|
2601 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
2602 } |
|
2603 |
|
2604 .components-dropdown { |
|
2605 display: inline-block; |
|
2606 } |
|
2607 |
|
2608 .components-dropdown__content .components-popover__content > div { |
|
2609 padding: 12px; |
|
2610 } |
|
2611 |
|
2612 .components-dropdown-menu__popover .components-popover__content { |
|
2613 min-width: 200px; |
|
2614 } |
|
2615 |
|
2616 .components-dropdown-menu__menu { |
|
2617 width: 100%; |
|
2618 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
2619 font-size: 13px; |
|
2620 line-height: 1.4; |
|
2621 } |
|
2622 .components-dropdown-menu__menu .components-dropdown-menu__menu-item, |
|
2623 .components-dropdown-menu__menu .components-menu-item { |
|
2624 width: 100%; |
|
2625 padding: 6px; |
|
2626 outline: none; |
|
2627 cursor: pointer; |
|
2628 white-space: nowrap; |
|
2629 } |
|
2630 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator, |
|
2631 .components-dropdown-menu__menu .components-menu-item.has-separator { |
|
2632 margin-top: 6px; |
|
2633 position: relative; |
|
2634 overflow: visible; |
|
2635 } |
|
2636 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.has-separator::before, |
|
2637 .components-dropdown-menu__menu .components-menu-item.has-separator::before { |
|
2638 display: block; |
|
2639 content: ""; |
|
2640 box-sizing: content-box; |
|
2641 background-color: #ddd; |
|
2642 position: absolute; |
|
2643 top: -3px; |
|
2644 right: 0; |
|
2645 left: 0; |
|
2646 height: 1px; |
|
2647 } |
|
2648 .components-dropdown-menu__menu .components-dropdown-menu__menu-item.is-active svg, |
|
2649 .components-dropdown-menu__menu .components-menu-item.is-active svg { |
|
2650 color: #fff; |
|
2651 background: #1e1e1e; |
|
2652 box-shadow: 0 0 0 1px #1e1e1e; |
|
2653 border-radius: 1px; |
|
2654 } |
|
2655 .components-dropdown-menu__menu .components-dropdown-menu__menu-item > svg, |
|
2656 .components-dropdown-menu__menu .components-menu-item > svg { |
|
2657 border-radius: 2px; |
|
2658 width: 24px; |
|
2659 height: 24px; |
|
2660 } |
|
2661 .components-dropdown-menu__menu .components-menu-item__button, |
|
2662 .components-dropdown-menu__menu .components-menu-item__button.components-button { |
|
2663 min-height: 36px; |
|
2664 height: auto; |
|
2665 text-align: right; |
|
2666 padding-right: 8px; |
|
2667 padding-left: 8px; |
|
2668 } |
|
2669 .components-dropdown-menu__menu .components-menu-group { |
|
2670 padding: 12px; |
|
2671 margin-top: 0; |
|
2672 margin-bottom: 0; |
|
2673 margin-right: -12px; |
|
2674 margin-left: -12px; |
|
2675 } |
|
2676 .components-dropdown-menu__menu .components-menu-group:first-child { |
|
2677 margin-top: -12px; |
|
2678 } |
|
2679 .components-dropdown-menu__menu .components-menu-group:last-child { |
|
2680 margin-bottom: -12px; |
|
2681 } |
|
2682 .components-dropdown-menu__menu .components-menu-group + .components-menu-group { |
|
2683 margin-top: 0; |
|
2684 border-top: 1px solid #ccc; |
|
2685 padding: 12px; |
|
2686 } |
|
2687 .is-alternate .components-dropdown-menu__menu .components-menu-group + .components-menu-group { |
|
2688 border-color: #1e1e1e; |
|
2689 } |
|
2690 |
|
2691 .components-font-size-picker__controls { |
|
2692 max-width: 248px; |
|
2693 display: flex; |
|
2694 flex-wrap: wrap; |
|
2695 align-items: center; |
|
2696 margin-bottom: 24px; |
|
2697 } |
|
2698 .components-font-size-picker__controls .components-unit-control-wrapper { |
|
2699 margin-left: 8px; |
|
2700 } |
|
2701 .components-font-size-picker__controls .components-unit-control-wrapper .components-input-control__label { |
|
2702 font-weight: 300; |
|
2703 padding-bottom: 0 !important; |
|
2704 margin-bottom: 8px !important; |
|
2705 } |
|
2706 .components-font-size-picker__controls .components-custom-select-control__button { |
|
2707 min-width: 120px; |
|
2708 } |
|
2709 .components-font-size-picker__controls .components-font-size-picker__number { |
|
2710 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
2711 padding: 6px 8px; |
|
2712 box-shadow: 0 0 0 transparent; |
|
2713 transition: box-shadow 0.1s linear; |
|
2714 border-radius: 2px; |
|
2715 border: 1px solid #757575; |
|
2716 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
|
2717 font-size: 16px; |
|
2718 /* Override core line-height. To be reviewed. */ |
|
2719 line-height: normal; |
|
2720 display: inline-block; |
|
2721 font-weight: 500; |
|
2722 height: 30px; |
|
2723 margin-bottom: 0; |
|
2724 margin-right: 0; |
|
2725 margin-left: 8px; |
|
2726 margin-top: 8px; |
|
2727 width: 54px; |
|
2728 } |
|
2729 @media (prefers-reduced-motion: reduce) { |
|
2730 .components-font-size-picker__controls .components-font-size-picker__number { |
|
2731 transition-duration: 0s; |
|
2732 transition-delay: 0s; |
|
2733 } |
|
2734 } |
|
2735 @media (min-width: 600px) { |
|
2736 .components-font-size-picker__controls .components-font-size-picker__number { |
|
2737 font-size: 13px; |
|
2738 /* Override core line-height. To be reviewed. */ |
|
2739 line-height: normal; |
|
2740 } |
|
2741 } |
|
2742 .components-font-size-picker__controls .components-font-size-picker__number:focus { |
|
2743 border-color: var(--wp-admin-theme-color); |
|
2744 box-shadow: 0 0 0 1px var(--wp-admin-theme-color); |
|
2745 outline: 2px solid transparent; |
|
2746 } |
|
2747 .components-font-size-picker__controls .components-font-size-picker__number::-webkit-input-placeholder { |
|
2748 color: rgba(30, 30, 30, 0.62); |
|
2749 } |
|
2750 .components-font-size-picker__controls .components-font-size-picker__number::-moz-placeholder { |
|
2751 opacity: 1; |
|
2752 color: rgba(30, 30, 30, 0.62); |
|
2753 } |
|
2754 .components-font-size-picker__controls .components-font-size-picker__number:-ms-input-placeholder { |
|
2755 color: rgba(30, 30, 30, 0.62); |
|
2756 } |
|
2757 .components-font-size-picker__controls .components-font-size-picker__number[value=""] + .components-button { |
|
2758 cursor: default; |
|
2759 opacity: 0.3; |
|
2760 pointer-events: none; |
|
2761 } |
|
2762 .components-font-size-picker__controls .components-font-size-picker__number-container { |
|
2763 display: flex; |
|
2764 flex-direction: column; |
|
2765 } |
|
2766 .components-font-size-picker__controls .components-font-size-picker__select { |
|
2767 margin-left: 8px; |
|
2768 } |
|
2769 .components-font-size-picker__controls .components-color-palette__clear { |
|
2770 height: 30px; |
|
2771 margin-top: 26px; |
|
2772 } |
|
2773 |
|
2774 .components-font-size-picker__custom-input .components-range-control__slider + .dashicon { |
|
2775 width: 30px; |
|
2776 height: 30px; |
|
2777 } |
|
2778 |
|
2779 .components-font-size-picker { |
|
2780 border: 0; |
|
2781 padding: 0; |
|
2782 margin: 0; |
|
2783 } |
|
2784 |
|
2785 .components-form-toggle { |
|
2786 position: relative; |
|
2787 display: inline-block; |
|
2788 } |
|
2789 .components-form-toggle .components-form-toggle__track { |
|
2790 content: ""; |
|
2791 display: inline-block; |
|
2792 box-sizing: border-box; |
|
2793 vertical-align: top; |
|
2794 background-color: #fff; |
|
2795 border: 1px solid #1e1e1e; |
|
2796 width: 36px; |
|
2797 height: 18px; |
|
2798 border-radius: 9px; |
|
2799 transition: 0.2s background ease; |
|
2800 } |
|
2801 @media (prefers-reduced-motion: reduce) { |
|
2802 .components-form-toggle .components-form-toggle__track { |
|
2803 transition-duration: 0s; |
|
2804 transition-delay: 0s; |
|
2805 } |
|
2806 } |
|
2807 .components-form-toggle .components-form-toggle__thumb { |
|
2808 display: block; |
|
2809 position: absolute; |
|
2810 box-sizing: border-box; |
|
2811 top: 3px; |
|
2812 right: 3px; |
|
2813 width: 12px; |
|
2814 height: 12px; |
|
2815 border-radius: 50%; |
|
2816 transition: 0.1s transform ease; |
|
2817 background-color: #1e1e1e; |
|
2818 border: 5px solid #1e1e1e; |
|
2819 } |
|
2820 @media (prefers-reduced-motion: reduce) { |
|
2821 .components-form-toggle .components-form-toggle__thumb { |
|
2822 transition-duration: 0s; |
|
2823 transition-delay: 0s; |
|
2824 } |
|
2825 } |
|
2826 .components-form-toggle.is-checked .components-form-toggle__track { |
|
2827 background-color: var(--wp-admin-theme-color); |
|
2828 border: 1px solid var(--wp-admin-theme-color); |
|
2829 border: 9px solid transparent; |
|
2830 } |
|
2831 .components-form-toggle .components-form-toggle__input:focus + .components-form-toggle__track { |
|
2832 box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color); |
|
2833 outline: 2px solid transparent; |
|
2834 outline-offset: 2px; |
|
2835 } |
|
2836 .components-form-toggle.is-checked .components-form-toggle__thumb { |
|
2837 background-color: #fff; |
|
2838 border-width: 0; |
|
2839 transform: translateX(-18px); |
|
2840 } |
|
2841 .components-form-toggle.is-disabled, .components-disabled .components-form-toggle { |
|
2842 opacity: 0.3; |
|
2843 } |
|
2844 |
|
2845 .components-form-toggle input.components-form-toggle__input[type=checkbox] { |
|
2846 position: absolute; |
|
2847 top: 0; |
|
2848 right: 0; |
|
2849 width: 100%; |
|
2850 height: 100%; |
|
2851 opacity: 0; |
|
2852 margin: 0; |
|
2853 padding: 0; |
|
2854 z-index: 1; |
|
2855 border: none; |
|
2856 } |
|
2857 .components-form-toggle input.components-form-toggle__input[type=checkbox]:checked { |
|
2858 background: none; |
|
2859 } |
|
2860 .components-form-toggle input.components-form-toggle__input[type=checkbox]::before { |
|
2861 content: ""; |
|
2862 } |
|
2863 |
|
2864 .components-form-token-field__input-container { |
|
2865 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
|
2866 padding: 6px 8px; |
|
2867 box-shadow: 0 0 0 transparent; |
|
2868 transition: box-shadow 0.1s linear; |
|
2869 border-radius: 2px; |
|
2870 border: 1px solid #757575; |
|
2871 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
|
2872 font-size: 16px; |
|
2873 /* Override core line-height. To be reviewed. */ |
|
2874 line-height: normal; |
|
2875 display: flex; |
|
2876 flex-wrap: wrap; |
|
2877 align-items: center; |
|
2878 width: 100%; |
|
2879 margin: 0 0 8px 0; |
|
2880 padding: 2px 4px; |
|
2881 cursor: text; |
|
2882 } |
|
2883 @media (prefers-reduced-motion: reduce) { |
|
2884 .components-form-token-field__input-container { |
|
2885 transition-duration: 0s; |
|
2886 transition-delay: 0s; |
|
2887 } |
|
2888 } |
|
2889 @media (min-width: 600px) { |
|
2890 .components-form-token-field__input-container { |
|
2891 font-size: 13px; |
|
2892 /* Override core line-height. To be reviewed. */ |
|
2893 line-height: normal; |
|
2894 } |
|
2895 } |
|
2896 .components-form-token-field__input-container:focus { |
|
2897 border-color: var(--wp-admin-theme-color); |
|
2898 box-shadow: 0 0 0 1px var(--wp-admin-theme-color); |
|
2899 outline: 2px solid transparent; |
|
2900 } |
|
2901 .components-form-token-field__input-container::-webkit-input-placeholder { |
|
2902 color: rgba(30, 30, 30, 0.62); |
|
2903 } |
|
2904 .components-form-token-field__input-container::-moz-placeholder { |
|
2905 opacity: 1; |
|
2906 color: rgba(30, 30, 30, 0.62); |
|
2907 } |
|
2908 .components-form-token-field__input-container:-ms-input-placeholder { |
|
2909 color: rgba(30, 30, 30, 0.62); |
|
2910 } |
|
2911 .components-form-token-field__input-container.is-disabled { |
|
2912 background: #ddd; |
|
2913 border-color: #ddd; |
|
2914 } |
|
2915 .components-form-token-field__input-container.is-active { |
|
2916 border-color: var(--wp-admin-theme-color); |
|
2917 box-shadow: 0 0 0 1px var(--wp-admin-theme-color); |
|
2918 outline: 2px solid transparent; |
|
2919 } |
|
2920 .components-form-token-field__input-container input[type=text].components-form-token-field__input { |
|
2921 display: inline-block; |
|
2922 flex: 1; |
|
2923 font-size: 16px; |
|
2924 width: 100%; |
|
2925 max-width: 100%; |
|
2926 margin-right: 4px; |
|
2927 padding: 0; |
|
2928 min-height: 24px; |
|
2929 min-width: 50px; |
|
2930 background: inherit; |
|
2931 border: 0; |
|
2932 color: #1e1e1e; |
|
2933 box-shadow: none; |
|
2934 } |
|
2935 @media (min-width: 600px) { |
|
2936 .components-form-token-field__input-container input[type=text].components-form-token-field__input { |
|
2937 font-size: 13px; |
|
2938 } |
|
2939 } |
|
2940 .components-form-token-field__input-container input[type=text].components-form-token-field__input:focus, .components-form-token-field.is-active .components-form-token-field__input-container input[type=text].components-form-token-field__input { |
|
2941 outline: none; |
|
2942 box-shadow: none; |
|
2943 } |
|
2944 .components-form-token-field__input-container .components-form-token-field__token + input[type=text].components-form-token-field__input { |
|
2945 width: auto; |
|
2946 } |
2505 |
2947 |
2506 .components-form-token-field__label { |
2948 .components-form-token-field__label { |
2507 display: inline-block; |
2949 display: inline-block; |
2508 margin-bottom: 4px; } |
2950 margin-bottom: 4px; |
|
2951 } |
2509 |
2952 |
2510 .components-form-token-field__help { |
2953 .components-form-token-field__help { |
2511 font-style: italic; } |
2954 font-size: 12px; |
|
2955 font-style: normal; |
|
2956 color: #757575; |
|
2957 } |
2512 |
2958 |
2513 .components-form-token-field__token { |
2959 .components-form-token-field__token { |
2514 font-size: 13px; |
2960 font-size: 13px; |
2515 display: flex; |
2961 display: flex; |
2516 margin: 2px 0 2px 4px; |
2962 margin: 2px 0 2px 4px; |
2517 color: #32373c; |
2963 color: #1e1e1e; |
2518 overflow: hidden; } |
2964 max-width: 100%; |
2519 .components-form-token-field__token.is-success .components-form-token-field__token-text, |
2965 } |
2520 .components-form-token-field__token.is-success .components-form-token-field__remove-token { |
2966 .components-form-token-field__token.is-success .components-form-token-field__token-text, |
2521 background: #4ab866; } |
2967 .components-form-token-field__token.is-success .components-form-token-field__remove-token { |
2522 .components-form-token-field__token.is-error .components-form-token-field__token-text, |
2968 background: #4ab866; |
2523 .components-form-token-field__token.is-error .components-form-token-field__remove-token { |
2969 } |
2524 background: #d94f4f; } |
2970 .components-form-token-field__token.is-error .components-form-token-field__token-text, |
2525 .components-form-token-field__token.is-validating .components-form-token-field__token-text, |
2971 .components-form-token-field__token.is-error .components-form-token-field__remove-token { |
2526 .components-form-token-field__token.is-validating .components-form-token-field__remove-token { |
2972 background: #cc1818; |
2527 color: #555d66; } |
2973 } |
2528 .components-form-token-field__token.is-borderless { |
2974 .components-form-token-field__token.is-validating .components-form-token-field__token-text, |
2529 position: relative; |
2975 .components-form-token-field__token.is-validating .components-form-token-field__remove-token { |
2530 padding: 0 0 0 16px; } |
2976 color: #757575; |
2531 .components-form-token-field__token.is-borderless .components-form-token-field__token-text { |
2977 } |
2532 background: transparent; |
2978 .components-form-token-field__token.is-borderless { |
2533 color: #007cba; |
2979 position: relative; |
2534 color: var(--wp-admin-theme-color); } |
2980 padding: 0 0 0 16px; |
2535 .components-form-token-field__token.is-borderless .components-form-token-field__remove-token { |
2981 } |
2536 background: transparent; |
2982 .components-form-token-field__token.is-borderless .components-form-token-field__token-text { |
2537 color: #555d66; |
2983 background: transparent; |
2538 position: absolute; |
2984 color: var(--wp-admin-theme-color); |
2539 top: 1px; |
2985 } |
2540 left: 0; } |
2986 .components-form-token-field__token.is-borderless .components-form-token-field__remove-token { |
2541 .components-form-token-field__token.is-borderless.is-success .components-form-token-field__token-text { |
2987 background: transparent; |
2542 color: #4ab866; } |
2988 color: #757575; |
2543 .components-form-token-field__token.is-borderless.is-error .components-form-token-field__token-text { |
2989 position: absolute; |
2544 color: #d94f4f; |
2990 top: 1px; |
2545 border-radius: 0 4px 4px 0; |
2991 left: 0; |
2546 padding: 0 6px 0 4px; } |
2992 } |
2547 .components-form-token-field__token.is-borderless.is-validating .components-form-token-field__token-text { |
2993 .components-form-token-field__token.is-borderless.is-success .components-form-token-field__token-text { |
2548 color: #1e1e1e; } |
2994 color: #4ab866; |
2549 .components-form-token-field__token.is-disabled .components-form-token-field__remove-token { |
2995 } |
2550 cursor: default; } |
2996 .components-form-token-field__token.is-borderless.is-error .components-form-token-field__token-text { |
|
2997 color: #cc1818; |
|
2998 border-radius: 0 4px 4px 0; |
|
2999 padding: 0 6px 0 4px; |
|
3000 } |
|
3001 .components-form-token-field__token.is-borderless.is-validating .components-form-token-field__token-text { |
|
3002 color: #1e1e1e; |
|
3003 } |
|
3004 .components-form-token-field__token.is-disabled .components-form-token-field__remove-token { |
|
3005 cursor: default; |
|
3006 } |
2551 |
3007 |
2552 .components-form-token-field__token-text, |
3008 .components-form-token-field__token-text, |
2553 .components-form-token-field__remove-token.components-button { |
3009 .components-form-token-field__remove-token.components-button { |
2554 display: inline-block; |
3010 display: inline-block; |
2555 line-height: 24px; |
3011 line-height: 24px; |
2556 height: auto; |
3012 height: auto; |
2557 background: #ddd; |
3013 background: #ddd; |
2558 transition: all 0.2s cubic-bezier(0.4, 1, 0.4, 1); } |
3014 min-width: unset; |
2559 @media (prefers-reduced-motion: reduce) { |
3015 transition: all 0.2s cubic-bezier(0.4, 1, 0.4, 1); |
2560 .components-form-token-field__token-text, |
3016 } |
2561 .components-form-token-field__remove-token.components-button { |
3017 @media (prefers-reduced-motion: reduce) { |
2562 transition-duration: 0s; |
3018 .components-form-token-field__token-text, |
2563 animation-duration: 1ms; } } |
3019 .components-form-token-field__remove-token.components-button { |
|
3020 transition-duration: 0s; |
|
3021 transition-delay: 0s; |
|
3022 animation-duration: 1ms; |
|
3023 animation-delay: 0s; |
|
3024 } |
|
3025 } |
2564 |
3026 |
2565 .components-form-token-field__token-text { |
3027 .components-form-token-field__token-text { |
2566 border-radius: 0 12px 12px 0; |
3028 border-radius: 0 2px 2px 0; |
2567 padding: 0 8px 0 4px; |
3029 padding: 0 8px 0 0; |
2568 white-space: nowrap; |
3030 white-space: nowrap; |
2569 overflow: hidden; |
3031 overflow: hidden; |
2570 text-overflow: ellipsis; } |
3032 text-overflow: ellipsis; |
|
3033 } |
2571 |
3034 |
2572 .components-form-token-field__remove-token.components-button { |
3035 .components-form-token-field__remove-token.components-button { |
2573 cursor: pointer; |
3036 cursor: pointer; |
2574 border-radius: 12px 0 0 12px; |
3037 border-radius: 2px 0 0 2px; |
2575 padding: 0 2px; |
3038 padding: 0 2px; |
2576 color: #555d66; |
3039 color: #1e1e1e; |
2577 line-height: 10px; |
3040 line-height: 10px; |
2578 overflow: initial; } |
3041 overflow: initial; |
2579 .components-form-token-field__remove-token.components-button:hover { |
3042 } |
2580 color: #32373c; } |
3043 .components-form-token-field__remove-token.components-button:hover { |
|
3044 color: #1e1e1e; |
|
3045 } |
2581 |
3046 |
2582 .components-form-token-field__suggestions-list { |
3047 .components-form-token-field__suggestions-list { |
2583 flex: 1 0 100%; |
3048 flex: 1 0 100%; |
2584 min-width: 100%; |
3049 min-width: 100%; |
2585 max-height: 9em; |
3050 max-height: 9em; |
2586 overflow-y: scroll; |
3051 overflow-y: auto; |
2587 transition: all 0.15s ease-in-out; |
3052 transition: all 0.15s ease-in-out; |
2588 list-style: none; |
3053 list-style: none; |
2589 border-top: 1px solid #6c7781; |
3054 border-top: 1px solid #757575; |
2590 margin: 4px -4px -4px; |
3055 margin: 4px -4px -4px; |
2591 padding-top: 3px; } |
3056 padding: 0; |
2592 @media (prefers-reduced-motion: reduce) { |
3057 } |
2593 .components-form-token-field__suggestions-list { |
3058 @media (prefers-reduced-motion: reduce) { |
2594 transition-duration: 0s; } } |
3059 .components-form-token-field__suggestions-list { |
|
3060 transition-duration: 0s; |
|
3061 transition-delay: 0s; |
|
3062 } |
|
3063 } |
2595 |
3064 |
2596 .components-form-token-field__suggestion { |
3065 .components-form-token-field__suggestion { |
2597 color: #555d66; |
3066 color: #757575; |
2598 display: block; |
3067 display: block; |
2599 font-size: 13px; |
3068 font-size: 13px; |
2600 padding: 4px 8px; |
3069 padding: 4px 8px; |
2601 cursor: pointer; } |
3070 margin: 0; |
2602 .components-form-token-field__suggestion.is-selected { |
3071 cursor: pointer; |
2603 background: #007cba; |
3072 } |
2604 background: var(--wp-admin-theme-color); |
3073 .components-form-token-field__suggestion.is-selected { |
2605 color: #fff; } |
3074 background: var(--wp-admin-theme-color); |
|
3075 color: #fff; |
|
3076 } |
2606 |
3077 |
2607 .components-form-token-field__suggestion-match { |
3078 .components-form-token-field__suggestion-match { |
2608 text-decoration: underline; } |
3079 text-decoration: underline; |
|
3080 } |
2609 |
3081 |
2610 @media (min-width: 600px) { |
3082 @media (min-width: 600px) { |
2611 .components-guide { |
3083 .components-guide { |
2612 width: 600px; } } |
3084 width: 600px; |
2613 |
3085 } |
|
3086 } |
2614 .components-guide .components-modal__header { |
3087 .components-guide .components-modal__header { |
2615 background: none; |
3088 background: none; |
2616 border-bottom: none; |
3089 border-bottom: none; |
2617 width: 100%; |
3090 width: 100%; |
2618 padding: 0; |
3091 padding: 0; |
2619 margin: 0; } |
3092 margin: 0; |
2620 .components-guide .components-modal__header .components-button { |
3093 } |
2621 align-self: flex-start; |
3094 .components-guide .components-modal__header .components-button { |
2622 margin: 8px 0 0 8px; |
3095 align-self: flex-start; |
2623 position: static; } |
3096 margin: 8px 0 0 8px; |
2624 .components-guide .components-modal__header .components-button:hover svg { |
3097 position: static; |
2625 fill: #fff; } |
3098 } |
2626 |
3099 .components-guide .components-modal__header .components-button:hover svg { |
|
3100 fill: #fff; |
|
3101 } |
2627 .components-guide__container { |
3102 .components-guide__container { |
2628 display: flex; |
3103 display: flex; |
2629 flex-direction: column; |
3104 flex-direction: column; |
2630 justify-content: space-between; |
3105 justify-content: space-between; |
2631 margin-top: -60px; |
3106 margin-top: -60px; |
2632 min-height: 100%; } |
3107 min-height: 100%; |
2633 |
3108 } |
2634 .components-guide__page { |
3109 .components-guide__page { |
2635 display: flex; |
3110 display: flex; |
2636 flex-direction: column; |
3111 flex-direction: column; |
2637 justify-content: center; |
3112 justify-content: center; |
2638 position: relative; } |
3113 position: relative; |
2639 @media (min-width: 600px) { |
3114 } |
2640 .components-guide__page { |
3115 @media (min-width: 600px) { |
2641 min-height: 300px; } } |
3116 .components-guide__page { |
2642 |
3117 min-height: 300px; |
|
3118 } |
|
3119 } |
2643 .components-guide__footer { |
3120 .components-guide__footer { |
2644 align-content: center; |
3121 align-content: center; |
2645 display: flex; |
3122 display: flex; |
2646 height: 30px; |
3123 height: 30px; |
2647 justify-content: center; |
3124 justify-content: center; |
2648 margin: 0 0 24px 0; |
3125 margin: 0 0 24px 0; |
2649 padding: 0 32px; |
3126 padding: 0 32px; |
2650 position: relative; |
3127 position: relative; |
2651 width: 100%; } |
3128 width: 100%; |
2652 @media (max-width: 600px) { |
3129 } |
2653 .components-guide__footer { |
3130 @media (max-width: 600px) { |
2654 position: absolute; |
3131 .components-guide__footer { |
2655 bottom: 0; } } |
3132 position: absolute; |
2656 |
3133 bottom: 0; |
|
3134 } |
|
3135 } |
2657 .components-guide__page-control { |
3136 .components-guide__page-control { |
2658 margin: 8px 0 8px 0; |
3137 margin: 0; |
2659 text-align: center; } |
3138 text-align: center; |
2660 .components-guide__page-control li { |
3139 } |
2661 display: inline-block; } |
3140 .components-guide__page-control li { |
2662 .components-guide__page-control .components-button { |
3141 display: inline-block; |
2663 height: 30px; |
3142 margin: 0; |
2664 min-width: 20px; } |
3143 } |
2665 |
3144 .components-guide__page-control .components-button { |
|
3145 height: 30px; |
|
3146 min-width: 20px; |
|
3147 margin: -6px 0; |
|
3148 } |
2666 .components-guide .components-modal__content { |
3149 .components-guide .components-modal__content { |
2667 padding: 0; } |
3150 padding: 0; |
|
3151 } |
2668 |
3152 |
2669 .components-modal__frame.components-guide { |
3153 .components-modal__frame.components-guide { |
2670 border: none; |
3154 border: none; |
2671 min-width: 312px; |
3155 min-width: 312px; |
2672 height: 80vh; |
3156 height: 80vh; |
2673 max-height: 575px; } |
3157 max-height: 575px; |
2674 @media (max-width: 600px) { |
3158 } |
2675 .components-modal__frame.components-guide { |
3159 @media (max-width: 600px) { |
2676 bottom: 5%; |
3160 .components-modal__frame.components-guide { |
2677 right: 16px; |
3161 bottom: 5%; |
2678 left: 16px; |
3162 right: 16px; |
2679 top: 5%; |
3163 left: 16px; |
2680 margin: 0 auto; } } |
3164 top: 5%; |
|
3165 margin: 0 auto; |
|
3166 } |
|
3167 } |
2681 |
3168 |
2682 .components-button.components-guide__back-button, .components-button.components-guide__forward-button, .components-button.components-guide__finish-button { |
3169 .components-button.components-guide__back-button, .components-button.components-guide__forward-button, .components-button.components-guide__finish-button { |
2683 height: 30px; |
3170 height: 30px; |
2684 position: absolute; } |
3171 position: absolute; |
2685 |
3172 } |
2686 .components-button.components-guide__back-button, .components-button.components-guide__forward-button { |
3173 .components-button.components-guide__back-button, .components-button.components-guide__forward-button { |
2687 font-size: 13px; |
3174 font-size: 13px; |
2688 padding: 4px 2px; } |
3175 padding: 4px 2px; |
2689 .components-button.components-guide__back-button.has-text svg, .components-button.components-guide__forward-button.has-text svg { |
3176 } |
2690 margin: 0; } |
3177 .components-button.components-guide__back-button.has-text svg, .components-button.components-guide__forward-button.has-text svg { |
2691 .components-button.components-guide__back-button:hover, .components-button.components-guide__forward-button:hover { |
3178 margin: 0; |
2692 text-decoration: underline; } |
3179 } |
2693 |
3180 .components-button.components-guide__back-button:hover, .components-button.components-guide__forward-button:hover { |
|
3181 text-decoration: underline; |
|
3182 } |
2694 .components-button.components-guide__back-button { |
3183 .components-button.components-guide__back-button { |
2695 right: 32px; } |
3184 right: 32px; |
2696 |
3185 } |
2697 .components-button.components-guide__forward-button { |
3186 .components-button.components-guide__forward-button { |
2698 left: 32px; |
3187 left: 32px; |
2699 color: #1386bf; |
3188 color: #1386bf; |
2700 font-weight: bold; } |
3189 font-weight: bold; |
2701 |
3190 } |
2702 .components-button.components-guide__finish-button { |
3191 .components-button.components-guide__finish-button { |
2703 left: 32px; } |
3192 left: 32px; |
2704 |
3193 } |
2705 .components-button.components-guide__inline-finish-button { |
3194 .components-button.components-guide__inline-finish-button { |
2706 display: none; } |
3195 display: none; |
2707 |
3196 } |
2708 .components-navigate-regions.is-focusing-regions [role="region"] { |
3197 |
2709 position: relative; } |
3198 [role=region] { |
2710 .components-navigate-regions.is-focusing-regions [role="region"]:focus::after { |
3199 position: relative; |
2711 content: ""; |
3200 } |
2712 position: absolute; |
3201 |
2713 top: 0; |
3202 .is-focusing-regions [role=region]:focus::after { |
2714 bottom: 0; |
3203 content: ""; |
2715 right: 0; |
3204 position: absolute; |
2716 left: 0; |
3205 top: 0; |
2717 pointer-events: none; |
3206 bottom: 0; |
2718 outline: 4px solid transparent; |
3207 right: 0; |
2719 box-shadow: inset 0 0 0 4px #007cba; |
3208 left: 0; |
2720 box-shadow: inset 0 0 0 4px var(--wp-admin-theme-color); } |
3209 pointer-events: none; |
2721 @supports (outline-offset: 1px) { |
3210 outline: 4px solid transparent; |
2722 .components-navigate-regions.is-focusing-regions [role="region"]:focus::after { |
3211 box-shadow: inset 0 0 0 4px var(--wp-admin-theme-color); |
2723 content: none; } |
3212 } |
2724 .components-navigate-regions.is-focusing-regions [role="region"]:focus { |
3213 @supports (outline-offset: 1px) { |
2725 outline-style: solid; |
3214 .is-focusing-regions [role=region]:focus::after { |
2726 outline-color: #007cba; |
3215 content: none; |
2727 outline-color: var(--wp-admin-theme-color); |
3216 } |
2728 outline-width: 4px; |
3217 .is-focusing-regions [role=region]:focus { |
2729 outline-offset: -4px; } } |
3218 outline-style: solid; |
|
3219 outline-color: var(--wp-admin-theme-color); |
|
3220 outline-width: 4px; |
|
3221 outline-offset: -4px; |
|
3222 } |
|
3223 } |
2730 |
3224 |
2731 .components-menu-group + .components-menu-group { |
3225 .components-menu-group + .components-menu-group { |
2732 margin-top: 8px; |
3226 margin-top: 8px; |
2733 padding-top: 8px; |
3227 padding-top: 8px; |
2734 border-top: 1px solid #1e1e1e; } |
3228 border-top: 1px solid #1e1e1e; |
|
3229 } |
|
3230 .components-menu-group + .components-menu-group.has-hidden-separator { |
|
3231 border-top: none; |
|
3232 margin-top: 0; |
|
3233 padding-top: 0; |
|
3234 } |
2735 |
3235 |
2736 .components-menu-group__label { |
3236 .components-menu-group__label { |
2737 padding: 0; |
3237 padding: 0 8px; |
|
3238 margin-top: 4px; |
2738 margin-bottom: 12px; |
3239 margin-bottom: 12px; |
2739 color: #757575; |
3240 color: #757575; |
2740 text-transform: uppercase; |
3241 text-transform: uppercase; |
2741 font-size: 11px; |
3242 font-size: 11px; |
2742 font-weight: 500; } |
3243 font-weight: 500; |
|
3244 } |
2743 |
3245 |
2744 .components-menu-item__button, |
3246 .components-menu-item__button, |
2745 .components-menu-item__button.components-button { |
3247 .components-menu-item__button.components-button { |
2746 width: 100%; } |
3248 width: 100%; |
2747 .components-menu-item__button .dashicon, |
3249 } |
2748 .components-menu-item__button .components-menu-items__item-icon, |
3250 .components-menu-item__button .components-menu-items__item-icon, |
2749 .components-menu-item__button svg.components-menu-items__item-icon, |
3251 .components-menu-item__button.components-button .components-menu-items__item-icon { |
2750 .components-menu-item__button > span > svg, |
3252 margin-left: -2px; |
2751 .components-menu-item__button.components-button .dashicon, |
3253 margin-right: 24px; |
2752 .components-menu-item__button.components-button .components-menu-items__item-icon, |
3254 display: inline-block; |
2753 .components-menu-item__button.components-button svg.components-menu-items__item-icon, |
3255 flex: 0 0 auto; |
2754 .components-menu-item__button.components-button > span > svg { |
3256 } |
2755 margin-left: 8px; } |
3257 .components-menu-item__button .components-menu-item__shortcut + .components-menu-items__item-icon, |
2756 .components-menu-item__button .components-menu-items__item-icon, |
3258 .components-menu-item__button.components-button .components-menu-item__shortcut + .components-menu-items__item-icon { |
2757 .components-menu-item__button.components-button .components-menu-items__item-icon { |
3259 margin-right: 8px; |
2758 display: inline-block; |
3260 } |
2759 flex: 0 0 auto; } |
3261 .components-menu-item__button .block-editor-block-icon, |
|
3262 .components-menu-item__button.components-button .block-editor-block-icon { |
|
3263 margin-right: -2px; |
|
3264 margin-left: 8px; |
|
3265 } |
|
3266 .components-menu-item__button.is-primary, |
|
3267 .components-menu-item__button.components-button.is-primary { |
|
3268 justify-content: center; |
|
3269 } |
|
3270 .components-menu-item__button.is-primary .components-menu-item__item, |
|
3271 .components-menu-item__button.components-button.is-primary .components-menu-item__item { |
|
3272 margin-left: 0; |
|
3273 } |
2760 |
3274 |
2761 .components-menu-item__info-wrapper { |
3275 .components-menu-item__info-wrapper { |
2762 display: flex; |
3276 display: flex; |
2763 flex-direction: column; } |
3277 flex-direction: column; |
|
3278 margin-left: auto; |
|
3279 } |
2764 |
3280 |
2765 .components-menu-item__info { |
3281 .components-menu-item__info { |
2766 margin-top: 4px; |
3282 margin-top: 4px; |
2767 font-size: 12px; |
3283 font-size: 12px; |
2768 color: #757575; } |
3284 color: #757575; |
|
3285 white-space: normal; |
|
3286 } |
|
3287 |
|
3288 .components-menu-item__item { |
|
3289 white-space: nowrap; |
|
3290 margin-left: auto; |
|
3291 display: inline-flex; |
|
3292 align-items: center; |
|
3293 } |
2769 |
3294 |
2770 .components-menu-item__shortcut { |
3295 .components-menu-item__shortcut { |
2771 -ms-grid-row-align: center; |
3296 align-self: center; |
2772 align-self: center; |
|
2773 margin-left: 0; |
3297 margin-left: 0; |
2774 margin-right: auto; |
3298 margin-right: auto; |
|
3299 padding-right: 24px; |
|
3300 color: currentColor; |
|
3301 display: none; |
|
3302 } |
|
3303 @media (min-width: 480px) { |
|
3304 .components-menu-item__shortcut { |
|
3305 display: inline; |
|
3306 } |
|
3307 } |
|
3308 |
|
3309 .components-menu-items-choice svg, |
|
3310 .components-menu-items-choice.components-button svg { |
|
3311 margin-left: 12px; |
|
3312 } |
|
3313 .components-menu-items-choice.has-icon, |
|
3314 .components-menu-items-choice.components-button.has-icon { |
2775 padding-right: 12px; |
3315 padding-right: 12px; |
2776 color: currentColor; |
3316 } |
2777 display: none; } |
|
2778 @media (min-width: 480px) { |
|
2779 .components-menu-item__shortcut { |
|
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; } |
|
2791 |
3317 |
2792 .components-modal__screen-overlay { |
3318 .components-modal__screen-overlay { |
2793 position: fixed; |
3319 position: fixed; |
2794 top: 0; |
3320 top: 0; |
2795 left: 0; |
3321 left: 0; |
2796 bottom: 0; |
3322 bottom: 0; |
2797 right: 0; |
3323 right: 0; |
2798 background-color: rgba(0, 0, 0, 0.7); |
3324 background-color: rgba(0, 0, 0, 0.35); |
2799 z-index: 100000; |
3325 z-index: 100000; |
2800 animation: edit-post__fade-in-animation 0.2s ease-out 0s; |
3326 animation: edit-post__fade-in-animation 0.2s ease-out 0s; |
2801 animation-fill-mode: forwards; } |
3327 animation-fill-mode: forwards; |
2802 @media (prefers-reduced-motion: reduce) { |
3328 } |
2803 .components-modal__screen-overlay { |
3329 @media (prefers-reduced-motion: reduce) { |
2804 animation-duration: 1ms; } } |
3330 .components-modal__screen-overlay { |
|
3331 animation-duration: 1ms; |
|
3332 animation-delay: 0s; |
|
3333 } |
|
3334 } |
2805 |
3335 |
2806 .components-modal__frame { |
3336 .components-modal__frame { |
2807 position: absolute; |
3337 position: absolute; |
2808 top: 0; |
3338 top: 0; |
2809 left: 0; |
3339 left: 0; |
2810 bottom: 0; |
3340 bottom: 0; |
2811 right: 0; |
3341 right: 0; |
2812 box-sizing: border-box; |
3342 box-sizing: border-box; |
2813 margin: 0; |
3343 margin: 0; |
2814 border: 1px solid #ddd; |
|
2815 background: #fff; |
3344 background: #fff; |
2816 box-shadow: 0 3px 30px rgba(0, 0, 0, 0.2); |
3345 box-shadow: 0 10px 10px rgba(0, 0, 0, 0.25); |
2817 overflow: auto; } |
3346 border-radius: 2px; |
2818 @media (min-width: 600px) { |
3347 overflow: auto; |
2819 .components-modal__frame { |
3348 } |
2820 top: 50%; |
3349 @media (min-width: 600px) { |
2821 left: auto; |
3350 .components-modal__frame { |
2822 bottom: auto; |
3351 top: 50%; |
2823 right: 50%; |
3352 left: auto; |
2824 min-width: 360px; |
3353 bottom: auto; |
2825 max-width: calc(100% - 16px - 16px); |
3354 right: 50%; |
2826 max-height: calc(100% - 60px - 60px); |
3355 min-width: 360px; |
2827 transform: translate(50%, -50%); |
3356 max-width: calc(100% - 16px - 16px); |
2828 animation: components-modal__appear-animation 0.1s ease-out; |
3357 max-height: 90%; |
2829 animation-fill-mode: forwards; } } |
3358 transform: translate(50%, -50%); |
2830 @media (min-width: 600px) and (prefers-reduced-motion: reduce) { |
3359 animation: components-modal__appear-animation 0.1s ease-out; |
2831 .components-modal__frame { |
3360 animation-fill-mode: forwards; |
2832 animation-duration: 1ms; } } |
3361 } |
|
3362 } |
|
3363 @media (min-width: 600px) and (prefers-reduced-motion: reduce) { |
|
3364 .components-modal__frame { |
|
3365 animation-duration: 1ms; |
|
3366 animation-delay: 0s; |
|
3367 } |
|
3368 } |
2833 |
3369 |
2834 @keyframes components-modal__appear-animation { |
3370 @keyframes components-modal__appear-animation { |
2835 from { |
3371 from { |
2836 margin-top: 32px; } |
3372 margin-top: 32px; |
|
3373 } |
2837 to { |
3374 to { |
2838 margin-top: 0; } } |
3375 margin-top: 0; |
2839 |
3376 } |
|
3377 } |
2840 .components-modal__header { |
3378 .components-modal__header { |
2841 box-sizing: border-box; |
3379 box-sizing: border-box; |
2842 border-bottom: 1px solid #ddd; |
3380 border-bottom: 1px solid #ddd; |
2843 padding: 0 24px; |
3381 padding: 0 32px; |
2844 display: flex; |
3382 display: flex; |
2845 flex-direction: row; |
3383 flex-direction: row; |
2846 justify-content: space-between; |
3384 justify-content: space-between; |
2847 background: #fff; |
3385 background: #fff; |
2848 align-items: center; |
3386 align-items: center; |
2849 height: 60px; |
3387 height: 60px; |
2850 z-index: 10; |
3388 z-index: 10; |
2851 position: relative; |
3389 position: relative; |
2852 position: -webkit-sticky; |
|
2853 position: sticky; |
3390 position: sticky; |
2854 top: 0; |
3391 top: 0; |
2855 margin: 0 -24px 24px; } |
3392 margin: 0 -32px 24px; |
2856 @supports (-ms-ime-align: auto) { |
3393 } |
2857 .components-modal__header { |
3394 @supports (-ms-ime-align: auto) { |
2858 position: fixed; |
3395 .components-modal__header { |
2859 width: 100%; } } |
3396 position: fixed; |
2860 .components-modal__header .components-modal__header-heading { |
3397 width: 100%; |
2861 font-size: 1rem; |
3398 } |
2862 font-weight: 600; } |
3399 } |
2863 .components-modal__header h1 { |
3400 .components-modal__header .components-modal__header-heading { |
2864 line-height: 1; |
3401 font-size: 1rem; |
2865 margin: 0; } |
3402 font-weight: 600; |
2866 .components-modal__header .components-button { |
3403 } |
2867 position: relative; |
3404 .components-modal__header h1 { |
2868 right: 8px; } |
3405 line-height: 1; |
|
3406 margin: 0; |
|
3407 } |
|
3408 .components-modal__header .components-button { |
|
3409 position: relative; |
|
3410 right: 8px; |
|
3411 } |
2869 |
3412 |
2870 .components-modal__header-heading-container { |
3413 .components-modal__header-heading-container { |
2871 align-items: center; |
3414 align-items: center; |
2872 flex-grow: 1; |
3415 flex-grow: 1; |
2873 display: flex; |
3416 display: flex; |
2874 flex-direction: row; |
3417 flex-direction: row; |
2875 justify-content: left; } |
3418 justify-content: left; |
|
3419 } |
2876 |
3420 |
2877 .components-modal__header-icon-container { |
3421 .components-modal__header-icon-container { |
2878 display: inline-block; } |
3422 display: inline-block; |
2879 .components-modal__header-icon-container svg { |
3423 } |
2880 max-width: 36px; |
3424 .components-modal__header-icon-container svg { |
2881 max-height: 36px; |
3425 max-width: 36px; |
2882 padding: 8px; } |
3426 max-height: 36px; |
|
3427 padding: 8px; |
|
3428 } |
2883 |
3429 |
2884 .components-modal__content { |
3430 .components-modal__content { |
2885 box-sizing: border-box; |
3431 box-sizing: border-box; |
2886 height: 100%; |
3432 height: 100%; |
2887 padding: 0 24px 24px; } |
3433 padding: 0 32px 24px; |
2888 @supports (-ms-ime-align: auto) { |
3434 } |
2889 .components-modal__content { |
3435 @supports (-ms-ime-align: auto) { |
2890 padding-top: 60px; } } |
3436 .components-modal__content { |
|
3437 padding-top: 60px; |
|
3438 } |
|
3439 } |
2891 |
3440 |
2892 .components-notice { |
3441 .components-notice { |
2893 display: flex; |
3442 display: flex; |
2894 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
3443 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
2895 font-size: 13px; |
3444 font-size: 13px; |
2896 background-color: #fff; |
3445 background-color: #fff; |
2897 border-right: 4px solid #007cba; |
|
2898 border-right: 4px solid var(--wp-admin-theme-color); |
3446 border-right: 4px solid var(--wp-admin-theme-color); |
2899 margin: 5px 15px 2px; |
3447 margin: 5px 15px 2px; |
2900 padding: 8px 12px; |
3448 padding: 8px 12px; |
2901 align-items: center; } |
3449 align-items: center; |
2902 .components-notice.is-dismissible { |
3450 } |
2903 padding-left: 36px; |
3451 .components-notice.is-dismissible { |
2904 position: relative; } |
3452 padding-left: 36px; |
2905 .components-notice.is-success { |
3453 position: relative; |
2906 border-right-color: #4ab866; |
3454 } |
2907 background-color: #eff9f1; } |
3455 .components-notice.is-success { |
2908 .components-notice.is-warning { |
3456 border-right-color: #4ab866; |
2909 border-right-color: #f0b849; |
3457 background-color: #eff9f1; |
2910 background-color: #fef8ee; } |
3458 } |
2911 .components-notice.is-error { |
3459 .components-notice.is-warning { |
2912 border-right-color: #d94f4f; |
3460 border-right-color: #f0b849; |
2913 background-color: #f9e2e2; } |
3461 background-color: #fef8ee; |
|
3462 } |
|
3463 .components-notice.is-error { |
|
3464 border-right-color: #cc1818; |
|
3465 background-color: #f4a2a2; |
|
3466 } |
2914 |
3467 |
2915 .components-notice__content { |
3468 .components-notice__content { |
2916 flex-grow: 1; |
3469 flex-grow: 1; |
2917 margin: 4px 0 4px 25px; } |
3470 margin: 4px 0 4px 25px; |
2918 |
3471 } |
|
3472 |
|
3473 .components-notice__actions { |
|
3474 display: flex; |
|
3475 flex-wrap: wrap; |
|
3476 } |
|
3477 |
|
3478 .components-notice__action.components-button { |
|
3479 margin-left: 8px; |
|
3480 } |
2919 .components-notice__action.components-button, .components-notice__action.components-button.is-link { |
3481 .components-notice__action.components-button, .components-notice__action.components-button.is-link { |
2920 margin-right: 12px; } |
3482 margin-right: 12px; |
2921 |
3483 } |
2922 .components-notice__action.components-button.is-secondary { |
3484 .components-notice__action.components-button.is-secondary { |
2923 vertical-align: initial; } |
3485 vertical-align: initial; |
|
3486 } |
2924 |
3487 |
2925 .components-notice__dismiss { |
3488 .components-notice__dismiss { |
2926 color: #6c7781; |
3489 color: #757575; |
2927 align-self: flex-start; |
3490 align-self: flex-start; |
2928 flex-shrink: 0; } |
3491 flex-shrink: 0; |
2929 .components-notice__dismiss:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):hover, .components-notice__dismiss:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):active, .components-notice__dismiss:not(:disabled):not([aria-disabled="true"]):focus { |
3492 } |
2930 color: #1e1e1e; |
3493 .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):hover, .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):active, .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):focus { |
2931 background-color: transparent; } |
3494 color: #1e1e1e; |
2932 .components-notice__dismiss:not(:disabled):not([aria-disabled="true"]):not(.is-secondary):hover { |
3495 background-color: transparent; |
2933 box-shadow: none; } |
3496 } |
|
3497 .components-notice__dismiss:not(:disabled):not([aria-disabled=true]):not(.is-secondary):hover { |
|
3498 box-shadow: none; |
|
3499 } |
2934 |
3500 |
2935 .components-notice-list { |
3501 .components-notice-list { |
2936 max-width: 100vw; |
3502 max-width: 100vw; |
2937 box-sizing: border-box; |
3503 box-sizing: border-box; |
2938 z-index: 29; } |
3504 } |
2939 .components-notice-list .components-notice__content { |
3505 .components-notice-list .components-notice__content { |
2940 margin-top: 12px; |
3506 margin-top: 12px; |
2941 margin-bottom: 12px; |
3507 margin-bottom: 12px; |
2942 line-height: 2; } |
3508 line-height: 2; |
2943 .components-notice-list .components-notice__action.components-button { |
3509 } |
2944 display: block; |
3510 .components-notice-list .components-notice__action.components-button { |
2945 margin-right: 0; |
3511 display: block; |
2946 margin-top: 8px; } |
3512 margin-right: 0; |
|
3513 margin-top: 8px; |
|
3514 } |
2947 |
3515 |
2948 .components-panel { |
3516 .components-panel { |
2949 background: #fff; |
3517 background: #fff; |
2950 border: 1px solid #f0f0f0; } |
3518 border: 1px solid #e0e0e0; |
2951 .components-panel > .components-panel__header:first-child, |
3519 } |
2952 .components-panel > .components-panel__body:first-child { |
3520 .components-panel > .components-panel__header:first-child, |
2953 margin-top: -1px; } |
3521 .components-panel > .components-panel__body:first-child { |
2954 .components-panel > .components-panel__header:last-child, |
3522 margin-top: -1px; |
2955 .components-panel > .components-panel__body:last-child { |
3523 } |
2956 border-bottom-width: 0; } |
3524 .components-panel > .components-panel__header:last-child, |
|
3525 .components-panel > .components-panel__body:last-child { |
|
3526 border-bottom-width: 0; |
|
3527 } |
2957 |
3528 |
2958 .components-panel + .components-panel { |
3529 .components-panel + .components-panel { |
2959 margin-top: -1px; } |
3530 margin-top: -1px; |
|
3531 } |
2960 |
3532 |
2961 .components-panel__body { |
3533 .components-panel__body { |
2962 border-top: 1px solid #f0f0f0; |
3534 border-top: 1px solid #e0e0e0; |
2963 border-bottom: 1px solid #f0f0f0; } |
3535 border-bottom: 1px solid #e0e0e0; |
2964 .components-panel__body h3 { |
3536 } |
2965 margin: 0 0 0.5em; } |
3537 .components-panel__body h3 { |
2966 .components-panel__body.is-opened { |
3538 margin: 0 0 0.5em; |
2967 padding: 16px; } |
3539 } |
|
3540 .components-panel__body.is-opened { |
|
3541 padding: 16px; |
|
3542 } |
2968 |
3543 |
2969 .components-panel__header { |
3544 .components-panel__header { |
2970 display: flex; |
3545 display: flex; |
2971 justify-content: space-between; |
3546 justify-content: space-between; |
2972 align-items: center; |
3547 align-items: center; |
2973 padding: 0 16px; |
3548 padding: 0 16px; |
2974 height: 48px; |
3549 height: 48px; |
2975 border-top: 1px solid #ddd; |
3550 border-top: 1px solid #ddd; |
2976 border-bottom: 1px solid #ddd; } |
3551 border-bottom: 1px solid #ddd; |
2977 .components-panel__header h2 { |
3552 } |
2978 margin: 0; |
3553 .components-panel__header h2 { |
2979 font-size: inherit; |
3554 margin: 0; |
2980 color: inherit; } |
3555 font-size: inherit; |
|
3556 color: inherit; |
|
3557 } |
2981 |
3558 |
2982 .components-panel__body + .components-panel__body, |
3559 .components-panel__body + .components-panel__body, |
2983 .components-panel__body + .components-panel__header, |
3560 .components-panel__body + .components-panel__header, |
2984 .components-panel__header + .components-panel__body, |
3561 .components-panel__header + .components-panel__body, |
2985 .components-panel__header + .components-panel__header { |
3562 .components-panel__header + .components-panel__header { |
2986 margin-top: -1px; } |
3563 margin-top: -1px; |
|
3564 } |
2987 |
3565 |
2988 .components-panel__body > .components-panel__body-title { |
3566 .components-panel__body > .components-panel__body-title { |
2989 display: block; |
3567 display: block; |
2990 padding: 0; |
3568 padding: 0; |
2991 font-size: inherit; |
3569 font-size: inherit; |
2992 margin-top: 0; |
3570 margin-top: 0; |
2993 margin-bottom: 0; |
3571 margin-bottom: 0; |
2994 transition: 0.1s background ease-in-out; } |
3572 transition: 0.1s background ease-in-out; |
2995 @media (prefers-reduced-motion: reduce) { |
3573 } |
2996 .components-panel__body > .components-panel__body-title { |
3574 @media (prefers-reduced-motion: reduce) { |
2997 transition-duration: 0s; } } |
3575 .components-panel__body > .components-panel__body-title { |
|
3576 transition-duration: 0s; |
|
3577 transition-delay: 0s; |
|
3578 } |
|
3579 } |
2998 |
3580 |
2999 .components-panel__body.is-opened > .components-panel__body-title { |
3581 .components-panel__body.is-opened > .components-panel__body-title { |
3000 margin: -16px; |
3582 margin: -16px; |
3001 margin-bottom: 5px; } |
3583 margin-bottom: 5px; |
|
3584 } |
3002 |
3585 |
3003 .components-panel__body > .components-panel__body-title:hover { |
3586 .components-panel__body > .components-panel__body-title:hover { |
3004 background: #f0f0f0; |
3587 background: #f0f0f0; |
3005 border: none; } |
3588 border: none; |
|
3589 } |
3006 |
3590 |
3007 .components-panel__body-toggle.components-button { |
3591 .components-panel__body-toggle.components-button { |
3008 position: relative; |
3592 position: relative; |
3009 padding: 16px; |
3593 padding: 16px 16px 16px 48px; |
3010 outline: none; |
3594 outline: none; |
3011 width: 100%; |
3595 width: 100%; |
3012 font-weight: 500; |
3596 font-weight: 500; |
3013 text-align: right; |
3597 text-align: right; |
3014 color: #1e1e1e; |
3598 color: #1e1e1e; |
3015 border: none; |
3599 border: none; |
3016 box-shadow: none; |
3600 box-shadow: none; |
3017 transition: 0.1s background ease-in-out; |
3601 transition: 0.1s background ease-in-out; |
3018 height: auto; } |
3602 height: auto; |
3019 @media (prefers-reduced-motion: reduce) { |
3603 } |
3020 .components-panel__body-toggle.components-button { |
3604 @media (prefers-reduced-motion: reduce) { |
3021 transition-duration: 0s; } } |
3605 .components-panel__body-toggle.components-button { |
3022 .components-panel__body-toggle.components-button:focus { |
3606 transition-duration: 0s; |
3023 box-shadow: inset 0 0 0 1.5px #007cba; |
3607 transition-delay: 0s; |
3024 box-shadow: inset 0 0 0 1.5px var(--wp-admin-theme-color); |
3608 } |
3025 border-radius: 0; } |
3609 } |
|
3610 .components-panel__body-toggle.components-button:focus { |
|
3611 box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); |
|
3612 border-radius: 0; |
|
3613 } |
|
3614 .components-panel__body-toggle.components-button .components-panel__arrow { |
|
3615 position: absolute; |
|
3616 left: 16px; |
|
3617 top: 50%; |
|
3618 transform: translateY(-50%); |
|
3619 color: #1e1e1e; |
|
3620 fill: currentColor; |
|
3621 transition: 0.1s color ease-in-out; |
|
3622 } |
|
3623 @media (prefers-reduced-motion: reduce) { |
3026 .components-panel__body-toggle.components-button .components-panel__arrow { |
3624 .components-panel__body-toggle.components-button .components-panel__arrow { |
3027 position: absolute; |
3625 transition-duration: 0s; |
3028 left: 16px; |
3626 transition-delay: 0s; |
3029 top: 50%; |
3627 } |
3030 transform: translateY(-50%); |
3628 } |
3031 color: #1e1e1e; |
3629 body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right { |
3032 fill: currentColor; |
3630 transform: scaleX(-1); |
3033 transition: 0.1s color ease-in-out; } |
3631 -ms-filter: fliph; |
3034 @media (prefers-reduced-motion: reduce) { |
3632 filter: FlipH; |
3035 .components-panel__body-toggle.components-button .components-panel__arrow { |
3633 margin-top: -10px; |
3036 transition-duration: 0s; } } |
3634 } |
3037 body.rtl .components-panel__body-toggle.components-button .dashicons-arrow-right { |
|
3038 transform: scaleX(-1); |
|
3039 -ms-filter: fliph; |
|
3040 filter: FlipH; |
|
3041 margin-top: -10px; } |
|
3042 |
3635 |
3043 .components-panel__icon { |
3636 .components-panel__icon { |
3044 color: #555d66; |
3637 color: #757575; |
3045 margin: -2px 6px -2px 0; } |
3638 margin: -2px 6px -2px 0; |
|
3639 } |
3046 |
3640 |
3047 .components-panel__body-toggle-icon { |
3641 .components-panel__body-toggle-icon { |
3048 margin-left: -5px; } |
3642 margin-left: -5px; |
|
3643 } |
3049 |
3644 |
3050 .components-panel__color-title { |
3645 .components-panel__color-title { |
3051 float: right; |
3646 float: right; |
3052 height: 19px; } |
3647 height: 19px; |
|
3648 } |
3053 |
3649 |
3054 .components-panel__row { |
3650 .components-panel__row { |
3055 display: flex; |
3651 display: flex; |
3056 justify-content: space-between; |
3652 justify-content: space-between; |
3057 align-items: center; |
3653 align-items: center; |
3058 margin-top: 8px; |
3654 margin-top: 8px; |
3059 min-height: 36px; } |
3655 min-height: 36px; |
3060 .components-panel__row select { |
3656 } |
3061 min-width: 0; } |
3657 .components-panel__row select { |
3062 .components-panel__row label { |
3658 min-width: 0; |
3063 margin-left: 12px; |
3659 } |
3064 flex-shrink: 0; |
3660 .components-panel__row label { |
3065 max-width: 75%; } |
3661 margin-left: 12px; |
3066 .components-panel__row:empty, .components-panel__row:first-of-type { |
3662 flex-shrink: 0; |
3067 margin-top: 0; } |
3663 max-width: 75%; |
|
3664 } |
|
3665 .components-panel__row:empty, .components-panel__row:first-of-type { |
|
3666 margin-top: 0; |
|
3667 } |
3068 |
3668 |
3069 .components-panel .circle-picker { |
3669 .components-panel .circle-picker { |
3070 padding-bottom: 20px; } |
3670 padding-bottom: 20px; |
|
3671 } |
3071 |
3672 |
3072 .components-placeholder.components-placeholder { |
3673 .components-placeholder.components-placeholder { |
|
3674 box-sizing: border-box; |
3073 position: relative; |
3675 position: relative; |
3074 padding: 1em; |
3676 padding: 1em; |
3075 min-height: 200px; |
3677 min-height: 200px; |
3076 width: 100%; |
3678 width: 100%; |
3077 text-align: right; |
3679 text-align: right; |
3135 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
3750 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
3136 font-size: 16px; |
3751 font-size: 16px; |
3137 /* Override core line-height. To be reviewed. */ |
3752 /* Override core line-height. To be reviewed. */ |
3138 line-height: normal; |
3753 line-height: normal; |
3139 margin: 0 0 0 8px; |
3754 margin: 0 0 0 8px; |
3140 flex: 1 1 auto; } |
3755 flex: 1 1 auto; |
3141 @media (prefers-reduced-motion: reduce) { |
3756 } |
3142 .components-placeholder__input[type="url"] { |
3757 @media (prefers-reduced-motion: reduce) { |
3143 transition-duration: 0s; } } |
3758 .components-placeholder__input[type=url] { |
3144 @media (min-width: 600px) { |
3759 transition-duration: 0s; |
3145 .components-placeholder__input[type="url"] { |
3760 transition-delay: 0s; |
3146 font-size: 13px; |
3761 } |
3147 /* Override core line-height. To be reviewed. */ |
3762 } |
3148 line-height: normal; } } |
3763 @media (min-width: 600px) { |
3149 .components-placeholder__input[type="url"]:focus { |
3764 .components-placeholder__input[type=url] { |
3150 border-color: #007cba; |
3765 font-size: 13px; |
3151 border-color: var(--wp-admin-theme-color); |
3766 /* Override core line-height. To be reviewed. */ |
3152 box-shadow: 0 0 0 0.5px #007cba; |
3767 line-height: normal; |
3153 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
3768 } |
3154 outline: 2px solid transparent; } |
3769 } |
3155 .components-placeholder__input[type="url"]::-webkit-input-placeholder { |
3770 .components-placeholder__input[type=url]:focus { |
3156 color: rgba(30, 30, 30, 0.62); } |
3771 border-color: var(--wp-admin-theme-color); |
3157 .components-placeholder__input[type="url"]::-moz-placeholder { |
3772 box-shadow: 0 0 0 1px var(--wp-admin-theme-color); |
3158 opacity: 1; |
3773 outline: 2px solid transparent; |
3159 color: rgba(30, 30, 30, 0.62); } |
3774 } |
3160 .components-placeholder__input[type="url"]:-ms-input-placeholder { |
3775 .components-placeholder__input[type=url]::-webkit-input-placeholder { |
3161 color: rgba(30, 30, 30, 0.62); } |
3776 color: rgba(30, 30, 30, 0.62); |
3162 .is-dark-theme .components-placeholder__input[type="url"]::-webkit-input-placeholder { |
3777 } |
3163 color: rgba(255, 255, 255, 0.65); } |
3778 .components-placeholder__input[type=url]::-moz-placeholder { |
3164 .is-dark-theme .components-placeholder__input[type="url"]::-moz-placeholder { |
3779 opacity: 1; |
3165 opacity: 1; |
3780 color: rgba(30, 30, 30, 0.62); |
3166 color: rgba(255, 255, 255, 0.65); } |
3781 } |
3167 .is-dark-theme .components-placeholder__input[type="url"]:-ms-input-placeholder { |
3782 .components-placeholder__input[type=url]:-ms-input-placeholder { |
3168 color: rgba(255, 255, 255, 0.65); } |
3783 color: rgba(30, 30, 30, 0.62); |
|
3784 } |
3169 |
3785 |
3170 .components-placeholder__instructions { |
3786 .components-placeholder__instructions { |
3171 margin-bottom: 1em; } |
3787 margin-bottom: 1em; |
|
3788 } |
3172 |
3789 |
3173 .components-placeholder__error { |
3790 .components-placeholder__error { |
3174 margin-top: 1em; |
3791 margin-top: 1em; |
3175 width: 100%; } |
3792 width: 100%; |
|
3793 } |
3176 |
3794 |
3177 .components-placeholder__preview img { |
3795 .components-placeholder__preview img { |
3178 margin: 3%; |
3796 margin: 3%; |
3179 width: 50%; } |
3797 width: 50%; |
|
3798 } |
3180 |
3799 |
3181 .components-placeholder__fieldset .components-button { |
3800 .components-placeholder__fieldset .components-button { |
3182 margin-left: 12px; |
3801 margin-left: 12px; |
3183 margin-bottom: 12px; } |
3802 margin-bottom: 12px; |
3184 .components-placeholder__fieldset .components-button:last-child { |
3803 } |
3185 margin-bottom: 0; |
3804 .components-placeholder__fieldset .components-button:last-child { |
3186 margin-left: 0; } |
3805 margin-bottom: 0; |
|
3806 margin-left: 0; |
|
3807 } |
3187 |
3808 |
3188 .components-placeholder__fieldset .components-button:not(.is-link) ~ .components-button.is-link { |
3809 .components-placeholder__fieldset .components-button:not(.is-link) ~ .components-button.is-link { |
3189 margin-right: 10px; |
3810 margin-right: 10px; |
3190 margin-left: 10px; } |
3811 margin-left: 10px; |
3191 .components-placeholder__fieldset .components-button:not(.is-link) ~ .components-button.is-link:last-child { |
3812 } |
3192 margin-left: 0; } |
3813 .components-placeholder__fieldset .components-button:not(.is-link) ~ .components-button.is-link:last-child { |
|
3814 margin-left: 0; |
|
3815 } |
3193 |
3816 |
3194 .components-placeholder.is-large .components-placeholder__label { |
3817 .components-placeholder.is-large .components-placeholder__label { |
3195 font-size: 18pt; |
3818 font-size: 18pt; |
3196 font-weight: normal; } |
3819 font-weight: normal; |
3197 |
3820 } |
3198 .components-placeholder.is-medium .components-placeholder__instructions, .components-placeholder.is-small .components-placeholder__instructions { |
3821 .components-placeholder.is-medium .components-placeholder__instructions, .components-placeholder.is-small .components-placeholder__instructions { |
3199 display: none; } |
3822 display: none; |
3200 |
3823 } |
3201 .components-placeholder.is-medium .components-placeholder__fieldset, |
3824 .components-placeholder.is-medium .components-placeholder__fieldset, |
3202 .components-placeholder.is-medium .components-placeholder__fieldset form, .components-placeholder.is-small .components-placeholder__fieldset, |
3825 .components-placeholder.is-medium .components-placeholder__fieldset form, .components-placeholder.is-small .components-placeholder__fieldset, |
3203 .components-placeholder.is-small .components-placeholder__fieldset form { |
3826 .components-placeholder.is-small .components-placeholder__fieldset form { |
3204 flex-direction: column; } |
3827 flex-direction: column; |
3205 |
3828 } |
3206 .components-placeholder.is-medium .components-placeholder__fieldset .components-button, .components-placeholder.is-small .components-placeholder__fieldset .components-button { |
3829 .components-placeholder.is-medium .components-placeholder__fieldset .components-button, .components-placeholder.is-small .components-placeholder__fieldset .components-button { |
3207 margin-left: auto; } |
3830 margin-left: auto; |
3208 |
3831 } |
3209 .components-placeholder.is-small .components-button { |
3832 .components-placeholder.is-small .components-button { |
3210 padding: 0 8px 2px; } |
3833 padding: 0 8px 2px; |
|
3834 } |
3211 .components-popover { |
3835 .components-popover { |
3212 position: fixed; |
3836 position: fixed; |
3213 z-index: 1000000; |
3837 z-index: 1000000; |
3214 top: 0; |
3838 top: 0; |
3215 left: 0; |
3839 left: 0; |
3216 opacity: 0; } |
3840 opacity: 0; |
3217 .components-popover.is-expanded, .components-popover[data-x-axis][data-y-axis] { |
3841 } |
3218 opacity: 1; } |
3842 .components-popover.is-expanded, .components-popover[data-x-axis][data-y-axis] { |
3219 .components-popover.is-expanded { |
3843 opacity: 1; |
3220 top: 0; |
3844 } |
3221 left: 0; |
3845 .components-popover.is-expanded { |
3222 right: 0; |
3846 top: 0; |
3223 bottom: 0; |
3847 left: 0; |
3224 z-index: 1000000 !important; } |
3848 right: 0; |
3225 .components-popover:not(.is-without-arrow) { |
3849 bottom: 0; |
3226 margin-left: 2px; } |
3850 z-index: 1000000 !important; |
3227 .components-popover:not(.is-without-arrow)::before { |
3851 } |
3228 border: 8px solid #ccc; } |
3852 .components-popover:not(.is-without-arrow) { |
3229 .components-popover:not(.is-without-arrow).is-alternate::before { |
3853 margin-left: 2px; |
3230 border-color: #1e1e1e; } |
3854 } |
3231 .components-popover:not(.is-without-arrow)::after { |
3855 .components-popover:not(.is-without-arrow)::before { |
3232 border: 8px solid #fff; } |
3856 border: 8px solid #ccc; |
3233 .components-popover:not(.is-without-arrow)::before, .components-popover:not(.is-without-arrow)::after { |
3857 } |
3234 content: ""; |
3858 .components-popover:not(.is-without-arrow).is-alternate::before { |
3235 position: absolute; |
3859 border-color: #1e1e1e; |
3236 height: 0; |
3860 } |
3237 width: 0; |
3861 .components-popover:not(.is-without-arrow)::after { |
3238 line-height: 0; } |
3862 border: 8px solid #fff; |
3239 .components-popover:not(.is-without-arrow)[data-y-axis="top"] { |
3863 } |
3240 margin-top: -8px; } |
3864 .components-popover:not(.is-without-arrow)::before, .components-popover:not(.is-without-arrow)::after { |
3241 .components-popover:not(.is-without-arrow)[data-y-axis="top"]::before { |
3865 content: ""; |
3242 bottom: -8px; } |
3866 position: absolute; |
3243 .components-popover:not(.is-without-arrow)[data-y-axis="top"]::after { |
3867 height: 0; |
3244 bottom: -6px; } |
3868 width: 0; |
3245 .components-popover:not(.is-without-arrow)[data-y-axis="top"]::before, .components-popover:not(.is-without-arrow)[data-y-axis="top"]::after { |
3869 line-height: 0; |
3246 border-bottom: none; |
3870 } |
3247 border-left-color: transparent; |
3871 .components-popover:not(.is-without-arrow)[data-y-axis=top] { |
3248 border-right-color: transparent; |
3872 margin-top: -8px; |
3249 border-top-style: solid; |
3873 } |
3250 margin-left: -10px; } |
3874 .components-popover:not(.is-without-arrow)[data-y-axis=top]::before { |
3251 .components-popover:not(.is-without-arrow)[data-y-axis="bottom"] { |
3875 bottom: -8px; |
3252 margin-top: 8px; } |
3876 } |
3253 .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::before { |
3877 .components-popover:not(.is-without-arrow)[data-y-axis=top]::after { |
3254 top: -8px; } |
3878 bottom: -6px; |
3255 .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::after { |
3879 } |
3256 top: -6px; } |
3880 .components-popover:not(.is-without-arrow)[data-y-axis=top]::before, .components-popover:not(.is-without-arrow)[data-y-axis=top]::after { |
3257 .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::before, .components-popover:not(.is-without-arrow)[data-y-axis="bottom"]::after { |
3881 border-bottom: none; |
3258 border-bottom-style: solid; |
3882 border-left-color: transparent; |
3259 border-left-color: transparent; |
3883 border-right-color: transparent; |
3260 border-right-color: transparent; |
3884 border-top-style: solid; |
3261 border-top: none; |
3885 margin-left: -10px; |
3262 margin-left: -10px; } |
3886 } |
3263 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"] { |
3887 .components-popover:not(.is-without-arrow)[data-y-axis=bottom] { |
3264 margin-left: -8px; } |
3888 margin-top: 8px; |
3265 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"]::before { |
3889 } |
3266 right: -8px; } |
3890 .components-popover:not(.is-without-arrow)[data-y-axis=bottom]::before { |
3267 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="left"]::after { |
3891 top: -8px; |
3268 right: -6px; } |
3892 } |
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 { |
3893 .components-popover:not(.is-without-arrow)[data-y-axis=bottom]::after { |
3270 border-bottom-color: transparent; |
3894 top: -6px; |
3271 border-left-style: solid; |
3895 } |
3272 border-right: none; |
3896 .components-popover:not(.is-without-arrow)[data-y-axis=bottom]::before, .components-popover:not(.is-without-arrow)[data-y-axis=bottom]::after { |
3273 border-top-color: transparent; } |
3897 border-bottom-style: solid; |
3274 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"] { |
3898 border-left-color: transparent; |
3275 margin-left: 8px; } |
3899 border-right-color: transparent; |
3276 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"]::before { |
3900 border-top: none; |
3277 left: -8px; } |
3901 margin-left: -10px; |
3278 .components-popover:not(.is-without-arrow)[data-y-axis="middle"][data-x-axis="right"]::after { |
3902 } |
3279 left: -6px; } |
3903 .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=left] { |
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 { |
3904 margin-left: -8px; |
3281 border-bottom-color: transparent; |
3905 } |
3282 border-left: none; |
3906 .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=left]::before { |
3283 border-right-style: solid; |
3907 right: -8px; |
3284 border-top-color: transparent; } |
3908 } |
3285 .components-popover[data-y-axis="top"] { |
3909 .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=left]::after { |
3286 bottom: 100%; } |
3910 right: -6px; |
3287 .components-popover[data-y-axis="bottom"] { |
3911 } |
3288 top: 100%; } |
3912 .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 { |
3289 .components-popover[data-y-axis="middle"] { |
3913 border-bottom-color: transparent; |
3290 align-items: center; |
3914 border-left-style: solid; |
3291 display: flex; } |
3915 border-right: none; |
3292 .components-popover.is-from-top { |
3916 border-top-color: transparent; |
3293 margin-top: 12px; } |
3917 } |
3294 .components-popover.is-from-bottom { |
3918 .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=right] { |
3295 margin-top: -12px; } |
3919 margin-left: 8px; |
3296 .components-popover.is-from-left:not(.is-from-top):not(.is-from-bottom) { |
3920 } |
3297 margin-left: 12px; } |
3921 .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=right]::before { |
3298 .components-popover.is-from-right:not(.is-from-top):not(.is-from-bottom) { |
3922 left: -8px; |
3299 margin-right: 12px; } |
3923 } |
|
3924 .components-popover:not(.is-without-arrow)[data-y-axis=middle][data-x-axis=right]::after { |
|
3925 left: -6px; |
|
3926 } |
|
3927 .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 { |
|
3928 border-bottom-color: transparent; |
|
3929 border-left: none; |
|
3930 border-right-style: solid; |
|
3931 border-top-color: transparent; |
|
3932 } |
|
3933 .components-popover[data-y-axis=top] { |
|
3934 bottom: 100%; |
|
3935 } |
|
3936 .components-popover[data-y-axis=bottom] { |
|
3937 top: 100%; |
|
3938 } |
|
3939 .components-popover[data-y-axis=middle] { |
|
3940 align-items: center; |
|
3941 display: flex; |
|
3942 } |
|
3943 .components-popover.is-from-top { |
|
3944 margin-top: 12px; |
|
3945 } |
|
3946 .components-popover.is-from-bottom { |
|
3947 margin-top: -12px; |
|
3948 } |
|
3949 .components-popover.is-from-left:not(.is-from-top):not(.is-from-bottom) { |
|
3950 margin-left: 12px; |
|
3951 } |
|
3952 .components-popover.is-from-right:not(.is-from-top):not(.is-from-bottom) { |
|
3953 margin-right: 12px; |
|
3954 } |
3300 |
3955 |
3301 .components-popover__content { |
3956 .components-popover__content { |
3302 height: 100%; |
3957 height: 100%; |
3303 background: #fff; |
3958 background: #fff; |
3304 border: 1px solid #ccc; |
3959 border: 1px solid #ccc; |
3305 box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05); |
3960 box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05); |
3306 border-radius: 2px; } |
3961 border-radius: 2px; |
3307 .is-alternate .components-popover__content { |
3962 } |
3308 border: 1px solid #1e1e1e; |
3963 .is-alternate .components-popover__content { |
3309 box-shadow: none; } |
3964 border: 1px solid #1e1e1e; |
3310 .components-popover .components-popover__content { |
3965 box-shadow: none; |
3311 position: absolute; |
3966 } |
3312 height: auto; |
3967 .components-popover .components-popover__content { |
3313 overflow-y: auto; |
3968 position: absolute; |
3314 min-width: 260px; } |
3969 height: auto; |
3315 .components-popover.is-expanded .components-popover__content { |
3970 overflow-y: auto; |
3316 position: static; |
3971 } |
3317 height: calc(100% - 48px); |
3972 .components-popover.is-expanded .components-popover__content { |
3318 overflow-y: visible; |
3973 position: static; |
3319 min-width: auto; |
3974 height: calc(100% - 48px); |
3320 border: none; |
3975 overflow-y: visible; |
3321 border-top: 1px solid #1e1e1e; } |
3976 min-width: auto; |
3322 .components-popover[data-y-axis="top"] .components-popover__content { |
3977 border: none; |
3323 bottom: 100%; } |
3978 border-top: 1px solid #1e1e1e; |
3324 .components-popover[data-x-axis="center"] .components-popover__content { |
3979 } |
3325 left: 50%; |
3980 .components-popover[data-y-axis=top] .components-popover__content { |
3326 transform: translateX(-50%); } |
3981 bottom: 100%; |
3327 .components-popover[data-x-axis="right"] .components-popover__content { |
3982 } |
3328 position: absolute; |
3983 .components-popover[data-x-axis=center] .components-popover__content { |
3329 left: 100%; } |
3984 left: 50%; |
3330 .components-popover:not([data-y-axis="middle"])[data-x-axis="right"] .components-popover__content { |
3985 transform: translateX(-50%); |
3331 margin-left: -25px; } |
3986 } |
3332 .components-popover[data-x-axis="left"] .components-popover__content { |
3987 .components-popover[data-x-axis=right] .components-popover__content { |
3333 position: absolute; |
3988 position: absolute; |
3334 right: 100%; } |
3989 left: 100%; |
3335 .components-popover:not([data-y-axis="middle"])[data-x-axis="left"] .components-popover__content { |
3990 } |
3336 margin-right: -25px; } |
3991 .components-popover:not([data-y-axis=middle])[data-x-axis=right] .components-popover__content { |
|
3992 margin-left: -25px; |
|
3993 } |
|
3994 .components-popover[data-x-axis=left] .components-popover__content { |
|
3995 position: absolute; |
|
3996 right: 100%; |
|
3997 } |
|
3998 .components-popover:not([data-y-axis=middle])[data-x-axis=left] .components-popover__content { |
|
3999 margin-right: -25px; |
|
4000 } |
3337 |
4001 |
3338 .components-popover__header { |
4002 .components-popover__header { |
3339 align-items: center; |
4003 align-items: center; |
3340 background: #fff; |
4004 background: #fff; |
3341 display: flex; |
4005 display: flex; |
3342 height: 48px; |
4006 height: 48px; |
3343 justify-content: space-between; |
4007 justify-content: space-between; |
3344 padding: 0 8px 0 16px; } |
4008 padding: 0 8px 0 16px; |
|
4009 } |
3345 |
4010 |
3346 .components-popover__header-title { |
4011 .components-popover__header-title { |
3347 overflow: hidden; |
4012 overflow: hidden; |
3348 text-overflow: ellipsis; |
4013 text-overflow: ellipsis; |
3349 white-space: nowrap; |
4014 white-space: nowrap; |
3350 width: 100%; } |
4015 width: 100%; |
|
4016 } |
3351 |
4017 |
3352 .components-popover__close.components-button { |
4018 .components-popover__close.components-button { |
3353 z-index: 5; } |
4019 z-index: 5; |
|
4020 } |
3354 .components-radio-control { |
4021 .components-radio-control { |
3355 display: flex; |
4022 display: flex; |
3356 flex-direction: column; } |
4023 flex-direction: column; |
3357 .components-radio-control .components-base-control__help { |
4024 } |
3358 margin-top: 0; } |
4025 .components-radio-control .components-base-control__help { |
3359 .components-radio-control .components-base-control__field { |
4026 margin-top: 0; |
3360 margin-bottom: 0; } |
4027 } |
|
4028 .components-radio-control .components-base-control__field { |
|
4029 margin-bottom: 0; |
|
4030 } |
3361 |
4031 |
3362 .components-radio-control__option:not(:last-child) { |
4032 .components-radio-control__option:not(:last-child) { |
3363 margin-bottom: 4px; } |
4033 margin-bottom: 4px; |
3364 |
4034 } |
3365 .components-radio-control__input[type="radio"] { |
4035 |
|
4036 .components-radio-control__input[type=radio] { |
3366 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
4037 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
3367 padding: 6px 8px; |
4038 padding: 6px 8px; |
3368 box-shadow: 0 0 0 transparent; |
4039 box-shadow: 0 0 0 transparent; |
3369 transition: box-shadow 0.1s linear; |
4040 transition: box-shadow 0.1s linear; |
3370 border-radius: 2px; |
4041 border-radius: 2px; |
3375 line-height: normal; |
4046 line-height: normal; |
3376 border: 1px solid #1e1e1e; |
4047 border: 1px solid #1e1e1e; |
3377 margin-left: 12px; |
4048 margin-left: 12px; |
3378 transition: none; |
4049 transition: none; |
3379 border-radius: 50%; |
4050 border-radius: 50%; |
|
4051 width: 24px; |
|
4052 height: 24px; |
3380 margin-top: 0; |
4053 margin-top: 0; |
3381 margin-left: 6px; } |
4054 margin-left: 6px; |
3382 @media (prefers-reduced-motion: reduce) { |
4055 } |
3383 .components-radio-control__input[type="radio"] { |
4056 @media (prefers-reduced-motion: reduce) { |
3384 transition-duration: 0s; } } |
4057 .components-radio-control__input[type=radio] { |
3385 @media (min-width: 600px) { |
4058 transition-duration: 0s; |
3386 .components-radio-control__input[type="radio"] { |
4059 transition-delay: 0s; |
3387 font-size: 13px; |
4060 } |
3388 /* Override core line-height. To be reviewed. */ |
4061 } |
3389 line-height: normal; } } |
4062 @media (min-width: 600px) { |
3390 .components-radio-control__input[type="radio"]:focus { |
4063 .components-radio-control__input[type=radio] { |
3391 border-color: #007cba; |
4064 font-size: 13px; |
3392 border-color: var(--wp-admin-theme-color); |
4065 /* Override core line-height. To be reviewed. */ |
3393 box-shadow: 0 0 0 0.5px #007cba; |
4066 line-height: normal; |
3394 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
4067 } |
3395 outline: 2px solid transparent; } |
4068 } |
3396 .components-radio-control__input[type="radio"]::-webkit-input-placeholder { |
4069 .components-radio-control__input[type=radio]:focus { |
3397 color: rgba(30, 30, 30, 0.62); } |
4070 border-color: var(--wp-admin-theme-color); |
3398 .components-radio-control__input[type="radio"]::-moz-placeholder { |
4071 box-shadow: 0 0 0 1px var(--wp-admin-theme-color); |
3399 opacity: 1; |
4072 outline: 2px solid transparent; |
3400 color: rgba(30, 30, 30, 0.62); } |
4073 } |
3401 .components-radio-control__input[type="radio"]:-ms-input-placeholder { |
4074 .components-radio-control__input[type=radio]::-webkit-input-placeholder { |
3402 color: rgba(30, 30, 30, 0.62); } |
4075 color: rgba(30, 30, 30, 0.62); |
3403 .is-dark-theme .components-radio-control__input[type="radio"]::-webkit-input-placeholder { |
4076 } |
3404 color: rgba(255, 255, 255, 0.65); } |
4077 .components-radio-control__input[type=radio]::-moz-placeholder { |
3405 .is-dark-theme .components-radio-control__input[type="radio"]::-moz-placeholder { |
4078 opacity: 1; |
3406 opacity: 1; |
4079 color: rgba(30, 30, 30, 0.62); |
3407 color: rgba(255, 255, 255, 0.65); } |
4080 } |
3408 .is-dark-theme .components-radio-control__input[type="radio"]:-ms-input-placeholder { |
4081 .components-radio-control__input[type=radio]:-ms-input-placeholder { |
3409 color: rgba(255, 255, 255, 0.65); } |
4082 color: rgba(30, 30, 30, 0.62); |
3410 .components-radio-control__input[type="radio"]:checked::before { |
4083 } |
3411 width: 7px; |
4084 @media (min-width: 600px) { |
3412 height: 7px; |
4085 .components-radio-control__input[type=radio] { |
3413 margin: 8px 8px 0 0; |
4086 height: 20px; |
3414 background-color: #fff; |
4087 width: 20px; |
3415 border: 3px solid #fff; } |
4088 } |
3416 @media (min-width: 782px) { |
4089 } |
3417 .components-radio-control__input[type="radio"]:checked::before { |
4090 .components-radio-control__input[type=radio]:checked::before { |
3418 width: 6px; |
4091 box-sizing: inherit; |
3419 height: 6px; |
4092 width: 8px; |
3420 margin: 4px 4px 0 0; } } |
4093 height: 8px; |
3421 .components-radio-control__input[type="radio"]:focus { |
4094 transform: translate(-7px, 7px); |
3422 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #007cba; |
4095 margin: 0; |
3423 box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px var(--wp-admin-theme-color); |
4096 background-color: #fff; |
3424 outline: 2px solid transparent; } |
4097 border: 4px solid #fff; |
3425 .components-radio-control__input[type="radio"]:checked { |
4098 } |
3426 background: #007cba; |
4099 @media (min-width: 600px) { |
3427 background: var(--wp-admin-theme-color); |
4100 .components-radio-control__input[type=radio]:checked::before { |
3428 border-color: #007cba; |
4101 transform: translate(-5px, 5px); |
3429 border-color: var(--wp-admin-theme-color); } |
4102 } |
|
4103 } |
|
4104 .components-radio-control__input[type=radio]:focus { |
|
4105 box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color); |
|
4106 outline: 2px solid transparent; |
|
4107 } |
|
4108 .components-radio-control__input[type=radio]:checked { |
|
4109 background: var(--wp-admin-theme-color); |
|
4110 border-color: var(--wp-admin-theme-color); |
|
4111 } |
3430 |
4112 |
3431 .components-resizable-box__handle { |
4113 .components-resizable-box__handle { |
3432 display: none; |
4114 display: none; |
3433 width: 23px; |
4115 width: 23px; |
3434 height: 23px; } |
4116 height: 23px; |
3435 .components-resizable-box__container.has-show-handle .components-resizable-box__handle { |
4117 z-index: 2; |
3436 display: block; } |
4118 } |
|
4119 .components-resizable-box__container.has-show-handle .components-resizable-box__handle { |
|
4120 display: block; |
|
4121 } |
3437 |
4122 |
3438 .components-resizable-box__handle::after { |
4123 .components-resizable-box__handle::after { |
3439 display: block; |
4124 display: block; |
3440 content: ""; |
4125 content: ""; |
3441 width: 15px; |
4126 width: 15px; |
3442 height: 15px; |
4127 height: 15px; |
3443 border: 2px solid #fff; |
4128 border: 2px solid var(--wp-admin-theme-color); |
3444 border-radius: 50%; |
4129 border-radius: 50%; |
3445 background: #007cba; |
4130 background: #fff; |
|
4131 cursor: inherit; |
|
4132 position: absolute; |
|
4133 top: calc(50% - 8px); |
|
4134 left: calc(50% - 8px); |
|
4135 } |
|
4136 |
|
4137 .components-resizable-box__side-handle::before { |
|
4138 display: block; |
|
4139 border-radius: 2px; |
|
4140 content: ""; |
|
4141 width: 3px; |
|
4142 height: 3px; |
3446 background: var(--wp-admin-theme-color); |
4143 background: var(--wp-admin-theme-color); |
3447 cursor: inherit; |
4144 cursor: inherit; |
3448 position: absolute; |
4145 position: absolute; |
3449 top: calc(50% - 8px); |
4146 top: calc(50% - 1px); |
3450 left: calc(50% - 8px); } |
4147 left: calc(50% - 1px); |
3451 |
|
3452 .components-resizable-box__side-handle::before { |
|
3453 display: block; |
|
3454 content: ""; |
|
3455 width: 7px; |
|
3456 height: 7px; |
|
3457 border: 2px solid #fff; |
|
3458 background: #007cba; |
|
3459 background: var(--wp-admin-theme-color); |
|
3460 cursor: inherit; |
|
3461 position: absolute; |
|
3462 top: calc(50% - 4px); |
|
3463 left: calc(50% - 4px); |
|
3464 transition: transform 0.1s ease-in; |
4148 transition: transform 0.1s ease-in; |
3465 opacity: 0; } |
4149 opacity: 0; |
3466 @media (prefers-reduced-motion: reduce) { |
4150 } |
3467 .components-resizable-box__side-handle::before { |
4151 @media (prefers-reduced-motion: reduce) { |
3468 transition-duration: 0s; } } |
4152 .components-resizable-box__side-handle::before { |
3469 |
4153 transition-duration: 0s; |
3470 .is-dark-theme .components-resizable-box__side-handle::before, |
4154 transition-delay: 0s; |
3471 .is-dark-theme .components-resizable-box__handle::after { |
4155 } |
3472 border-color: #d7dade; } |
4156 } |
3473 |
|
3474 .components-resizable-box__handle { |
|
3475 z-index: 2; } |
|
3476 |
4157 |
3477 .components-resizable-box__side-handle { |
4158 .components-resizable-box__side-handle { |
3478 z-index: 2; } |
4159 z-index: 2; |
|
4160 } |
3479 |
4161 |
3480 .components-resizable-box__corner-handle { |
4162 .components-resizable-box__corner-handle { |
3481 z-index: 2; } |
4163 z-index: 2; |
|
4164 } |
3482 |
4165 |
3483 .components-resizable-box__side-handle.components-resizable-box__handle-top, |
4166 .components-resizable-box__side-handle.components-resizable-box__handle-top, |
3484 .components-resizable-box__side-handle.components-resizable-box__handle-bottom, |
4167 .components-resizable-box__side-handle.components-resizable-box__handle-bottom, |
3485 .components-resizable-box__side-handle.components-resizable-box__handle-top::before, |
4168 .components-resizable-box__side-handle.components-resizable-box__handle-top::before, |
3486 .components-resizable-box__side-handle.components-resizable-box__handle-bottom::before { |
4169 .components-resizable-box__side-handle.components-resizable-box__handle-bottom::before { |
3487 width: 100%; |
4170 width: 100%; |
3488 right: 0; |
4171 right: 0; |
3489 border-right: 0; |
4172 border-right: 0; |
3490 border-left: 0; } |
4173 border-left: 0; |
|
4174 } |
3491 |
4175 |
3492 .components-resizable-box__side-handle.components-resizable-box__handle-left, |
4176 .components-resizable-box__side-handle.components-resizable-box__handle-left, |
3493 .components-resizable-box__side-handle.components-resizable-box__handle-right, |
4177 .components-resizable-box__side-handle.components-resizable-box__handle-right, |
3494 .components-resizable-box__side-handle.components-resizable-box__handle-left::before, |
4178 .components-resizable-box__side-handle.components-resizable-box__handle-left::before, |
3495 .components-resizable-box__side-handle.components-resizable-box__handle-right::before { |
4179 .components-resizable-box__side-handle.components-resizable-box__handle-right::before { |
3496 height: 100%; |
4180 height: 100%; |
3497 top: 0; |
4181 top: 0; |
3498 border-top: 0; |
4182 border-top: 0; |
3499 border-bottom: 0; } |
4183 border-bottom: 0; |
|
4184 } |
3500 |
4185 |
3501 .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before, |
4186 .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, |
4187 .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, |
4188 .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 { |
4189 .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; |
4190 animation: components-resizable-box__top-bottom-animation 0.1s ease-out 0s; |
3506 animation-fill-mode: forwards; } |
4191 animation-fill-mode: forwards; |
3507 @media (prefers-reduced-motion: reduce) { |
4192 } |
3508 .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before, |
4193 @media (prefers-reduced-motion: reduce) { |
3509 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before, |
4194 .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before, |
3510 .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before, |
4195 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before, |
3511 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before { |
4196 .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before, |
3512 animation-duration: 1ms; } } |
4197 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before { |
|
4198 animation-duration: 1ms; |
|
4199 animation-delay: 0s; |
|
4200 } |
|
4201 } |
3513 |
4202 |
3514 .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before, |
4203 .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, |
4204 .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, |
4205 .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 { |
4206 .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; |
4207 animation: components-resizable-box__left-right-animation 0.1s ease-out 0s; |
3519 animation-fill-mode: forwards; } |
4208 animation-fill-mode: forwards; |
3520 @media (prefers-reduced-motion: reduce) { |
4209 } |
|
4210 @media (prefers-reduced-motion: reduce) { |
|
4211 .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before, |
|
4212 .components-resizable-box__side-handle.components-resizable-box__handle-right:hover::before, |
|
4213 .components-resizable-box__side-handle.components-resizable-box__handle-left:active::before, |
|
4214 .components-resizable-box__side-handle.components-resizable-box__handle-right:active::before { |
|
4215 animation-duration: 1ms; |
|
4216 animation-delay: 0s; |
|
4217 } |
|
4218 } |
|
4219 |
|
4220 /* This CSS is shown only to Safari, which has a bug with table-caption making it jumpy. |
|
4221 See https://bugs.webkit.org/show_bug.cgi?id=187903. */ |
|
4222 @media not all and (-webkit-min-device-pixel-ratio: 0), not all and (min-resolution: 0.001dpcm) { |
|
4223 @supports (-webkit-appearance: none) { |
|
4224 .components-resizable-box__side-handle.components-resizable-box__handle-top:hover::before, |
|
4225 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:hover::before, |
|
4226 .components-resizable-box__side-handle.components-resizable-box__handle-top:active::before, |
|
4227 .components-resizable-box__side-handle.components-resizable-box__handle-bottom:active::before { |
|
4228 animation: none; |
|
4229 } |
|
4230 |
3521 .components-resizable-box__side-handle.components-resizable-box__handle-left:hover::before, |
4231 .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, |
4232 .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, |
4233 .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 { |
4234 .components-resizable-box__side-handle.components-resizable-box__handle-right:active::before { |
3525 animation-duration: 1ms; } } |
4235 animation: none; |
3526 |
4236 } |
|
4237 } |
|
4238 } |
3527 @keyframes components-resizable-box__top-bottom-animation { |
4239 @keyframes components-resizable-box__top-bottom-animation { |
3528 from { |
4240 from { |
3529 transform: scaleX(0); |
4241 transform: scaleX(0); |
3530 opacity: 0; } |
4242 opacity: 0; |
|
4243 } |
3531 to { |
4244 to { |
3532 transform: scaleX(1); |
4245 transform: scaleX(1); |
3533 opacity: 1; } } |
4246 opacity: 1; |
3534 |
4247 } |
|
4248 } |
3535 @keyframes components-resizable-box__left-right-animation { |
4249 @keyframes components-resizable-box__left-right-animation { |
3536 from { |
4250 from { |
3537 transform: scaleY(0); |
4251 transform: scaleY(0); |
3538 opacity: 0; } |
4252 opacity: 0; |
|
4253 } |
3539 to { |
4254 to { |
3540 transform: scaleY(1); |
4255 transform: scaleY(1); |
3541 opacity: 1; } } |
4256 opacity: 1; |
|
4257 } |
|
4258 } |
3542 .components-resizable-box__handle-right { |
4259 .components-resizable-box__handle-right { |
3543 right: calc(11.5px * -1); } |
4260 right: calc(11.5px * -1); |
|
4261 } |
3544 |
4262 |
3545 .components-resizable-box__handle-left { |
4263 .components-resizable-box__handle-left { |
3546 left: calc(11.5px * -1); } |
4264 left: calc(11.5px * -1); |
|
4265 } |
3547 |
4266 |
3548 .components-resizable-box__handle-top { |
4267 .components-resizable-box__handle-top { |
3549 top: calc(11.5px * -1); } |
4268 top: calc(11.5px * -1); |
|
4269 } |
3550 |
4270 |
3551 .components-resizable-box__handle-bottom { |
4271 .components-resizable-box__handle-bottom { |
3552 bottom: calc(11.5px * -1); } |
4272 bottom: calc(11.5px * -1); |
|
4273 } |
3553 .components-responsive-wrapper { |
4274 .components-responsive-wrapper { |
3554 position: relative; |
4275 position: relative; |
3555 max-width: 100%; } |
4276 max-width: 100%; |
3556 .components-responsive-wrapper, |
4277 } |
3557 .components-responsive-wrapper > span { |
4278 .components-responsive-wrapper, .components-responsive-wrapper > span { |
3558 display: block; } |
4279 display: block; |
|
4280 } |
3559 |
4281 |
3560 .components-responsive-wrapper__content { |
4282 .components-responsive-wrapper__content { |
3561 position: absolute; |
4283 position: absolute; |
3562 top: 0; |
4284 top: 0; |
3563 left: 0; |
4285 left: 0; |
3564 bottom: 0; |
4286 bottom: 0; |
3565 right: 0; |
4287 right: 0; |
3566 width: 100%; |
4288 width: 100%; |
3567 height: 100%; |
4289 height: 100%; |
3568 margin: auto; } |
4290 margin: auto; |
|
4291 } |
3569 |
4292 |
3570 .components-sandbox { |
4293 .components-sandbox { |
3571 overflow: hidden; } |
4294 overflow: hidden; |
|
4295 } |
3572 |
4296 |
3573 iframe.components-sandbox { |
4297 iframe.components-sandbox { |
3574 width: 100%; } |
4298 width: 100%; |
|
4299 } |
3575 |
4300 |
3576 html.lockscroll, |
4301 html.lockscroll, |
3577 body.lockscroll { |
4302 body.lockscroll { |
3578 overflow: hidden; } |
4303 overflow: hidden; |
|
4304 } |
3579 |
4305 |
3580 .components-select-control__input { |
4306 .components-select-control__input { |
3581 background: #fff; |
4307 background: #fff; |
3582 height: 36px; |
4308 height: 36px; |
3583 line-height: 36px; |
4309 line-height: 36px; |
3584 margin: 1px; |
4310 margin: 1px; |
3585 outline: 0; |
4311 outline: 0; |
3586 width: 100%; |
4312 width: 100%; |
3587 -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important; } |
4313 -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important; |
3588 @media (min-width: 782px) { |
4314 } |
3589 .components-select-control__input { |
4315 @media (min-width: 782px) { |
3590 height: 28px; |
4316 .components-select-control__input { |
3591 line-height: 28px; } } |
4317 height: 28px; |
|
4318 line-height: 28px; |
|
4319 } |
|
4320 } |
3592 |
4321 |
3593 @media (max-width: 782px) { |
4322 @media (max-width: 782px) { |
3594 .components-base-control .components-base-control__field .components-select-control__input { |
4323 .components-base-control .components-base-control__field .components-select-control__input { |
3595 font-size: 16px; } } |
4324 font-size: 16px; |
3596 |
4325 } |
|
4326 } |
3597 .components-snackbar { |
4327 .components-snackbar { |
3598 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
4328 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
3599 font-size: 13px; |
4329 font-size: 13px; |
3600 background-color: #1e1e1e; |
4330 background-color: #1e1e1e; |
3601 border-radius: 2px; |
4331 border-radius: 2px; |
3687 height: 48px; |
4442 height: 48px; |
3688 padding: 3px 16px; |
4443 padding: 3px 16px; |
3689 margin-right: 0; |
4444 margin-right: 0; |
3690 font-weight: 500; |
4445 font-weight: 500; |
3691 transition: box-shadow 0.1s linear; |
4446 transition: box-shadow 0.1s linear; |
3692 box-sizing: border-box; } |
4447 box-sizing: border-box; |
3693 .components-tab-panel__tabs-item::after { |
4448 } |
3694 content: attr(data-label); |
4449 .components-tab-panel__tabs-item::after { |
3695 display: block; |
4450 content: attr(data-label); |
3696 height: 0; |
4451 display: block; |
3697 overflow: hidden; |
4452 height: 0; |
3698 speak: none; |
4453 overflow: hidden; |
3699 visibility: hidden; } |
4454 speak: none; |
3700 .components-tab-panel__tabs-item:focus:not(:disabled) { |
4455 visibility: hidden; |
3701 box-shadow: inset 0 1.5px #007cba; |
4456 } |
3702 box-shadow: inset 0 1.5px var(--wp-admin-theme-color); } |
4457 .components-tab-panel__tabs-item:focus:not(:disabled) { |
3703 .components-tab-panel__tabs-item.is-active { |
4458 box-shadow: inset 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); |
3704 box-shadow: inset 0 0 0 1.5px transparent, inset 0 -4px 0 0 #007cba; |
4459 } |
3705 box-shadow: inset 0 0 0 1.5px transparent, inset 0 -4px 0 0 var(--wp-admin-theme-color); |
4460 .components-tab-panel__tabs-item.is-active { |
3706 position: relative; } |
4461 box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) transparent, inset 0 -4px 0 0 var(--wp-admin-theme-color); |
3707 .components-tab-panel__tabs-item.is-active::before { |
4462 position: relative; |
3708 content: ""; |
4463 } |
3709 position: absolute; |
4464 .components-tab-panel__tabs-item.is-active::before { |
3710 top: 0; |
4465 content: ""; |
3711 bottom: 1px; |
4466 position: absolute; |
3712 left: 0; |
4467 top: 0; |
3713 right: 0; |
4468 bottom: 1px; |
3714 border-bottom: 4px solid transparent; } |
4469 left: 0; |
3715 .components-tab-panel__tabs-item:focus { |
4470 right: 0; |
3716 box-shadow: inset 0 0 0 1.5px #007cba; |
4471 border-bottom: 4px solid transparent; |
3717 box-shadow: inset 0 0 0 1.5px var(--wp-admin-theme-color); } |
4472 } |
3718 .components-tab-panel__tabs-item.is-active:focus { |
4473 .components-tab-panel__tabs-item:focus { |
3719 box-shadow: inset 0 0 0 1.5px #007cba, inset 0 -4px 0 0 #007cba; |
4474 box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); |
3720 box-shadow: inset 0 0 0 1.5px var(--wp-admin-theme-color), inset 0 -4px 0 0 var(--wp-admin-theme-color); } |
4475 } |
|
4476 .components-tab-panel__tabs-item.is-active:focus { |
|
4477 box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 -4px 0 0 var(--wp-admin-theme-color); |
|
4478 } |
3721 |
4479 |
3722 .components-text-control__input, |
4480 .components-text-control__input, |
3723 .components-text-control__input[type="text"], |
4481 .components-text-control__input[type=text], |
3724 .components-text-control__input[type="tel"], |
4482 .components-text-control__input[type=tel], |
3725 .components-text-control__input[type="time"], |
4483 .components-text-control__input[type=time], |
3726 .components-text-control__input[type="url"], |
4484 .components-text-control__input[type=url], |
3727 .components-text-control__input[type="week"], |
4485 .components-text-control__input[type=week], |
3728 .components-text-control__input[type="password"], |
4486 .components-text-control__input[type=password], |
3729 .components-text-control__input[type="color"], |
4487 .components-text-control__input[type=color], |
3730 .components-text-control__input[type="date"], |
4488 .components-text-control__input[type=date], |
3731 .components-text-control__input[type="datetime"], |
4489 .components-text-control__input[type=datetime], |
3732 .components-text-control__input[type="datetime-local"], |
4490 .components-text-control__input[type=datetime-local], |
3733 .components-text-control__input[type="email"], |
4491 .components-text-control__input[type=email], |
3734 .components-text-control__input[type="month"], |
4492 .components-text-control__input[type=month], |
3735 .components-text-control__input[type="number"] { |
4493 .components-text-control__input[type=number] { |
3736 width: 100%; |
4494 width: 100%; |
3737 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
4495 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
3738 padding: 6px 8px; |
4496 padding: 6px 8px; |
3739 box-shadow: 0 0 0 transparent; |
4497 box-shadow: 0 0 0 transparent; |
3740 transition: box-shadow 0.1s linear; |
4498 transition: box-shadow 0.1s linear; |
3741 border-radius: 2px; |
4499 border-radius: 2px; |
3742 border: 1px solid #757575; |
4500 border: 1px solid #757575; |
3743 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
4501 /* Fonts smaller than 16px causes mobile safari to zoom. */ |
3744 font-size: 16px; |
4502 font-size: 16px; |
3745 /* Override core line-height. To be reviewed. */ |
4503 /* Override core line-height. To be reviewed. */ |
3746 line-height: normal; } |
4504 line-height: normal; |
3747 @media (prefers-reduced-motion: reduce) { |
4505 } |
3748 .components-text-control__input, |
4506 @media (prefers-reduced-motion: reduce) { |
3749 .components-text-control__input[type="text"], |
4507 .components-text-control__input, |
3750 .components-text-control__input[type="tel"], |
4508 .components-text-control__input[type=text], |
3751 .components-text-control__input[type="time"], |
4509 .components-text-control__input[type=tel], |
3752 .components-text-control__input[type="url"], |
4510 .components-text-control__input[type=time], |
3753 .components-text-control__input[type="week"], |
4511 .components-text-control__input[type=url], |
3754 .components-text-control__input[type="password"], |
4512 .components-text-control__input[type=week], |
3755 .components-text-control__input[type="color"], |
4513 .components-text-control__input[type=password], |
3756 .components-text-control__input[type="date"], |
4514 .components-text-control__input[type=color], |
3757 .components-text-control__input[type="datetime"], |
4515 .components-text-control__input[type=date], |
3758 .components-text-control__input[type="datetime-local"], |
4516 .components-text-control__input[type=datetime], |
3759 .components-text-control__input[type="email"], |
4517 .components-text-control__input[type=datetime-local], |
3760 .components-text-control__input[type="month"], |
4518 .components-text-control__input[type=email], |
3761 .components-text-control__input[type="number"] { |
4519 .components-text-control__input[type=month], |
3762 transition-duration: 0s; } } |
4520 .components-text-control__input[type=number] { |
3763 @media (min-width: 600px) { |
4521 transition-duration: 0s; |
3764 .components-text-control__input, |
4522 transition-delay: 0s; |
3765 .components-text-control__input[type="text"], |
4523 } |
3766 .components-text-control__input[type="tel"], |
4524 } |
3767 .components-text-control__input[type="time"], |
4525 @media (min-width: 600px) { |
3768 .components-text-control__input[type="url"], |
4526 .components-text-control__input, |
3769 .components-text-control__input[type="week"], |
4527 .components-text-control__input[type=text], |
3770 .components-text-control__input[type="password"], |
4528 .components-text-control__input[type=tel], |
3771 .components-text-control__input[type="color"], |
4529 .components-text-control__input[type=time], |
3772 .components-text-control__input[type="date"], |
4530 .components-text-control__input[type=url], |
3773 .components-text-control__input[type="datetime"], |
4531 .components-text-control__input[type=week], |
3774 .components-text-control__input[type="datetime-local"], |
4532 .components-text-control__input[type=password], |
3775 .components-text-control__input[type="email"], |
4533 .components-text-control__input[type=color], |
3776 .components-text-control__input[type="month"], |
4534 .components-text-control__input[type=date], |
3777 .components-text-control__input[type="number"] { |
4535 .components-text-control__input[type=datetime], |
3778 font-size: 13px; |
4536 .components-text-control__input[type=datetime-local], |
3779 /* Override core line-height. To be reviewed. */ |
4537 .components-text-control__input[type=email], |
3780 line-height: normal; } } |
4538 .components-text-control__input[type=month], |
3781 .components-text-control__input:focus, |
4539 .components-text-control__input[type=number] { |
3782 .components-text-control__input[type="text"]:focus, |
4540 font-size: 13px; |
3783 .components-text-control__input[type="tel"]:focus, |
4541 /* Override core line-height. To be reviewed. */ |
3784 .components-text-control__input[type="time"]:focus, |
4542 line-height: normal; |
3785 .components-text-control__input[type="url"]:focus, |
4543 } |
3786 .components-text-control__input[type="week"]:focus, |
4544 } |
3787 .components-text-control__input[type="password"]:focus, |
4545 .components-text-control__input:focus, |
3788 .components-text-control__input[type="color"]:focus, |
4546 .components-text-control__input[type=text]:focus, |
3789 .components-text-control__input[type="date"]:focus, |
4547 .components-text-control__input[type=tel]:focus, |
3790 .components-text-control__input[type="datetime"]:focus, |
4548 .components-text-control__input[type=time]:focus, |
3791 .components-text-control__input[type="datetime-local"]:focus, |
4549 .components-text-control__input[type=url]:focus, |
3792 .components-text-control__input[type="email"]:focus, |
4550 .components-text-control__input[type=week]:focus, |
3793 .components-text-control__input[type="month"]:focus, |
4551 .components-text-control__input[type=password]:focus, |
3794 .components-text-control__input[type="number"]:focus { |
4552 .components-text-control__input[type=color]:focus, |
3795 border-color: #007cba; |
4553 .components-text-control__input[type=date]:focus, |
3796 border-color: var(--wp-admin-theme-color); |
4554 .components-text-control__input[type=datetime]:focus, |
3797 box-shadow: 0 0 0 0.5px #007cba; |
4555 .components-text-control__input[type=datetime-local]:focus, |
3798 box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color); |
4556 .components-text-control__input[type=email]:focus, |
3799 outline: 2px solid transparent; } |
4557 .components-text-control__input[type=month]:focus, |
3800 .components-text-control__input::-webkit-input-placeholder, |
4558 .components-text-control__input[type=number]:focus { |
3801 .components-text-control__input[type="text"]::-webkit-input-placeholder, |
4559 border-color: var(--wp-admin-theme-color); |
3802 .components-text-control__input[type="tel"]::-webkit-input-placeholder, |
4560 box-shadow: 0 0 0 1px var(--wp-admin-theme-color); |
3803 .components-text-control__input[type="time"]::-webkit-input-placeholder, |
4561 outline: 2px solid transparent; |
3804 .components-text-control__input[type="url"]::-webkit-input-placeholder, |
4562 } |
3805 .components-text-control__input[type="week"]::-webkit-input-placeholder, |
4563 .components-text-control__input::-webkit-input-placeholder, |
3806 .components-text-control__input[type="password"]::-webkit-input-placeholder, |
4564 .components-text-control__input[type=text]::-webkit-input-placeholder, |
3807 .components-text-control__input[type="color"]::-webkit-input-placeholder, |
4565 .components-text-control__input[type=tel]::-webkit-input-placeholder, |
3808 .components-text-control__input[type="date"]::-webkit-input-placeholder, |
4566 .components-text-control__input[type=time]::-webkit-input-placeholder, |
3809 .components-text-control__input[type="datetime"]::-webkit-input-placeholder, |
4567 .components-text-control__input[type=url]::-webkit-input-placeholder, |
3810 .components-text-control__input[type="datetime-local"]::-webkit-input-placeholder, |
4568 .components-text-control__input[type=week]::-webkit-input-placeholder, |
3811 .components-text-control__input[type="email"]::-webkit-input-placeholder, |
4569 .components-text-control__input[type=password]::-webkit-input-placeholder, |
3812 .components-text-control__input[type="month"]::-webkit-input-placeholder, |
4570 .components-text-control__input[type=color]::-webkit-input-placeholder, |
3813 .components-text-control__input[type="number"]::-webkit-input-placeholder { |
4571 .components-text-control__input[type=date]::-webkit-input-placeholder, |
3814 color: rgba(30, 30, 30, 0.62); } |
4572 .components-text-control__input[type=datetime]::-webkit-input-placeholder, |
3815 .components-text-control__input::-moz-placeholder, |
4573 .components-text-control__input[type=datetime-local]::-webkit-input-placeholder, |
3816 .components-text-control__input[type="text"]::-moz-placeholder, |
4574 .components-text-control__input[type=email]::-webkit-input-placeholder, |
3817 .components-text-control__input[type="tel"]::-moz-placeholder, |
4575 .components-text-control__input[type=month]::-webkit-input-placeholder, |
3818 .components-text-control__input[type="time"]::-moz-placeholder, |
4576 .components-text-control__input[type=number]::-webkit-input-placeholder { |
3819 .components-text-control__input[type="url"]::-moz-placeholder, |
4577 color: rgba(30, 30, 30, 0.62); |
3820 .components-text-control__input[type="week"]::-moz-placeholder, |
4578 } |
3821 .components-text-control__input[type="password"]::-moz-placeholder, |
4579 .components-text-control__input::-moz-placeholder, |
3822 .components-text-control__input[type="color"]::-moz-placeholder, |
4580 .components-text-control__input[type=text]::-moz-placeholder, |
3823 .components-text-control__input[type="date"]::-moz-placeholder, |
4581 .components-text-control__input[type=tel]::-moz-placeholder, |
3824 .components-text-control__input[type="datetime"]::-moz-placeholder, |
4582 .components-text-control__input[type=time]::-moz-placeholder, |
3825 .components-text-control__input[type="datetime-local"]::-moz-placeholder, |
4583 .components-text-control__input[type=url]::-moz-placeholder, |
3826 .components-text-control__input[type="email"]::-moz-placeholder, |
4584 .components-text-control__input[type=week]::-moz-placeholder, |
3827 .components-text-control__input[type="month"]::-moz-placeholder, |
4585 .components-text-control__input[type=password]::-moz-placeholder, |
3828 .components-text-control__input[type="number"]::-moz-placeholder { |
4586 .components-text-control__input[type=color]::-moz-placeholder, |
3829 opacity: 1; |
4587 .components-text-control__input[type=date]::-moz-placeholder, |
3830 color: rgba(30, 30, 30, 0.62); } |
4588 .components-text-control__input[type=datetime]::-moz-placeholder, |
3831 .components-text-control__input:-ms-input-placeholder, |
4589 .components-text-control__input[type=datetime-local]::-moz-placeholder, |
3832 .components-text-control__input[type="text"]:-ms-input-placeholder, |
4590 .components-text-control__input[type=email]::-moz-placeholder, |
3833 .components-text-control__input[type="tel"]:-ms-input-placeholder, |
4591 .components-text-control__input[type=month]::-moz-placeholder, |
3834 .components-text-control__input[type="time"]:-ms-input-placeholder, |
4592 .components-text-control__input[type=number]::-moz-placeholder { |
3835 .components-text-control__input[type="url"]:-ms-input-placeholder, |
4593 opacity: 1; |
3836 .components-text-control__input[type="week"]:-ms-input-placeholder, |
4594 color: rgba(30, 30, 30, 0.62); |
3837 .components-text-control__input[type="password"]:-ms-input-placeholder, |
4595 } |
3838 .components-text-control__input[type="color"]:-ms-input-placeholder, |
4596 .components-text-control__input:-ms-input-placeholder, |
3839 .components-text-control__input[type="date"]:-ms-input-placeholder, |
4597 .components-text-control__input[type=text]:-ms-input-placeholder, |
3840 .components-text-control__input[type="datetime"]:-ms-input-placeholder, |
4598 .components-text-control__input[type=tel]:-ms-input-placeholder, |
3841 .components-text-control__input[type="datetime-local"]:-ms-input-placeholder, |
4599 .components-text-control__input[type=time]:-ms-input-placeholder, |
3842 .components-text-control__input[type="email"]:-ms-input-placeholder, |
4600 .components-text-control__input[type=url]:-ms-input-placeholder, |
3843 .components-text-control__input[type="month"]:-ms-input-placeholder, |
4601 .components-text-control__input[type=week]:-ms-input-placeholder, |
3844 .components-text-control__input[type="number"]:-ms-input-placeholder { |
4602 .components-text-control__input[type=password]:-ms-input-placeholder, |
3845 color: rgba(30, 30, 30, 0.62); } |
4603 .components-text-control__input[type=color]:-ms-input-placeholder, |
3846 .is-dark-theme .components-text-control__input::-webkit-input-placeholder, .is-dark-theme |
4604 .components-text-control__input[type=date]:-ms-input-placeholder, |
3847 .components-text-control__input[type="text"]::-webkit-input-placeholder, .is-dark-theme |
4605 .components-text-control__input[type=datetime]:-ms-input-placeholder, |
3848 .components-text-control__input[type="tel"]::-webkit-input-placeholder, .is-dark-theme |
4606 .components-text-control__input[type=datetime-local]:-ms-input-placeholder, |
3849 .components-text-control__input[type="time"]::-webkit-input-placeholder, .is-dark-theme |
4607 .components-text-control__input[type=email]:-ms-input-placeholder, |
3850 .components-text-control__input[type="url"]::-webkit-input-placeholder, .is-dark-theme |
4608 .components-text-control__input[type=month]:-ms-input-placeholder, |
3851 .components-text-control__input[type="week"]::-webkit-input-placeholder, .is-dark-theme |
4609 .components-text-control__input[type=number]:-ms-input-placeholder { |
3852 .components-text-control__input[type="password"]::-webkit-input-placeholder, .is-dark-theme |
4610 color: rgba(30, 30, 30, 0.62); |
3853 .components-text-control__input[type="color"]::-webkit-input-placeholder, .is-dark-theme |
4611 } |
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); } |
|
3892 |
|
3893 .components-textarea-control__input { |
|
3894 width: 100%; |
|
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 |
4612 |
3934 .components-tip { |
4613 .components-tip { |
3935 display: flex; |
4614 display: flex; |
3936 color: #555d66; } |
4615 color: #757575; |
3937 .components-tip svg { |
4616 } |
3938 -ms-grid-row-align: center; |
4617 .components-tip svg { |
3939 align-self: center; |
4618 align-self: center; |
3940 fill: #f0b849; |
4619 fill: #f0b849; |
3941 flex-shrink: 0; |
4620 flex-shrink: 0; |
3942 margin-left: 16px; } |
4621 margin-left: 16px; |
3943 .components-tip p { |
4622 } |
3944 margin: 0; } |
4623 .components-tip p { |
|
4624 margin: 0; |
|
4625 } |
3945 |
4626 |
3946 .components-toggle-control .components-base-control__field { |
4627 .components-toggle-control .components-base-control__field { |
3947 display: flex; |
4628 display: flex; |
3948 margin-bottom: 12px; |
4629 margin-bottom: 12px; |
3949 line-height: initial; |
4630 line-height: initial; |
3950 align-items: center; } |
4631 align-items: center; |
3951 .components-toggle-control .components-base-control__field .components-form-toggle { |
4632 } |
3952 margin-left: 12px; } |
4633 .components-toggle-control .components-base-control__field .components-form-toggle { |
3953 .components-toggle-control .components-base-control__field .components-toggle-control__label { |
4634 margin-left: 12px; |
3954 display: block; } |
4635 } |
|
4636 .components-toggle-control .components-base-control__field .components-toggle-control__label { |
|
4637 display: block; |
|
4638 } |
3955 |
4639 |
3956 .components-accessible-toolbar { |
4640 .components-accessible-toolbar { |
3957 display: inline-flex; |
4641 display: inline-flex; |
3958 border: 1px solid #1e1e1e; |
4642 border: 1px solid #1e1e1e; |
3959 border-radius: 2px; |
4643 border-radius: 2px; |
3960 flex-shrink: 0; } |
4644 flex-shrink: 0; |
3961 .components-accessible-toolbar > .components-toolbar-group:last-child { |
4645 } |
3962 border-left: none; } |
4646 .components-accessible-toolbar > .components-toolbar-group:last-child { |
|
4647 border-left: none; |
|
4648 } |
3963 |
4649 |
3964 .components-accessible-toolbar .components-button, |
4650 .components-accessible-toolbar .components-button, |
3965 .components-toolbar .components-button { |
4651 .components-toolbar .components-button { |
3966 position: relative; |
4652 position: relative; |
3967 height: 48px; |
4653 height: 48px; |
3968 z-index: 1; |
4654 z-index: 1; |
3969 padding-right: 16px; |
4655 padding-right: 16px; |
3970 padding-left: 16px; } |
4656 padding-left: 16px; |
3971 .components-accessible-toolbar .components-button:focus:enabled, |
4657 } |
3972 .components-toolbar .components-button:focus:enabled { |
4658 .components-accessible-toolbar .components-button:focus:enabled, |
3973 box-shadow: none; |
4659 .components-toolbar .components-button:focus:enabled { |
3974 outline: none; } |
4660 box-shadow: none; |
|
4661 outline: none; |
|
4662 } |
|
4663 .components-accessible-toolbar .components-button::before, |
|
4664 .components-toolbar .components-button::before { |
|
4665 content: ""; |
|
4666 position: absolute; |
|
4667 display: block; |
|
4668 border-radius: 2px; |
|
4669 height: 32px; |
|
4670 right: 8px; |
|
4671 left: 8px; |
|
4672 z-index: -1; |
|
4673 animation: components-button__appear-animation 0.1s ease; |
|
4674 animation-fill-mode: forwards; |
|
4675 } |
|
4676 @media (prefers-reduced-motion: reduce) { |
3975 .components-accessible-toolbar .components-button::before, |
4677 .components-accessible-toolbar .components-button::before, |
3976 .components-toolbar .components-button::before { |
4678 .components-toolbar .components-button::before { |
3977 content: ""; |
4679 animation-duration: 1ms; |
3978 position: absolute; |
4680 animation-delay: 0s; |
3979 display: block; |
4681 } |
3980 border-radius: 2px; |
4682 } |
3981 height: 32px; |
4683 .components-accessible-toolbar .components-button svg, |
3982 right: 8px; |
4684 .components-toolbar .components-button svg { |
3983 left: 8px; |
4685 position: relative; |
3984 z-index: -1; |
4686 margin-right: auto; |
3985 animation: components-button__appear-animation 0.1s ease; |
4687 margin-left: auto; |
3986 animation-fill-mode: forwards; } |
4688 } |
3987 @media (prefers-reduced-motion: reduce) { |
4689 .components-accessible-toolbar .components-button.is-pressed, |
3988 .components-accessible-toolbar .components-button::before, |
4690 .components-toolbar .components-button.is-pressed { |
3989 .components-toolbar .components-button::before { |
4691 background: transparent; |
3990 animation-duration: 1ms; } } |
4692 } |
3991 .components-accessible-toolbar .components-button svg, |
4693 .components-accessible-toolbar .components-button.is-pressed:hover, |
3992 .components-toolbar .components-button svg { |
4694 .components-toolbar .components-button.is-pressed:hover { |
3993 position: relative; |
4695 background: transparent; |
3994 margin-right: auto; |
4696 } |
3995 margin-left: auto; } |
4697 .components-accessible-toolbar .components-button.is-pressed::before, |
3996 .components-accessible-toolbar .components-button.is-pressed, |
4698 .components-toolbar .components-button.is-pressed::before { |
3997 .components-toolbar .components-button.is-pressed { |
4699 background: #1e1e1e; |
3998 background: transparent; } |
4700 } |
3999 .components-accessible-toolbar .components-button.is-pressed:hover, |
4701 .components-accessible-toolbar .components-button:focus::before, |
4000 .components-toolbar .components-button.is-pressed:hover { |
4702 .components-toolbar .components-button:focus::before { |
4001 background: transparent; } |
4703 box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 4px #fff; |
4002 .components-accessible-toolbar .components-button.is-pressed::before, |
4704 outline: 2px solid transparent; |
4003 .components-toolbar .components-button.is-pressed::before { |
4705 } |
4004 background: #1e1e1e; } |
4706 .components-accessible-toolbar .components-button.has-icon, |
4005 .components-accessible-toolbar .components-button:focus::before, |
4707 .components-toolbar .components-button.has-icon { |
4006 .components-toolbar .components-button:focus::before { |
4708 padding-right: 8px; |
4007 box-shadow: inset 0 0 0 1.5px #007cba, inset 0 0 0 4px #fff; |
4709 padding-left: 8px; |
4008 box-shadow: inset 0 0 0 1.5px var(--wp-admin-theme-color), inset 0 0 0 4px #fff; |
4710 min-width: 48px; |
4009 outline: 2px solid transparent; } |
4711 justify-content: center; |
4010 .components-accessible-toolbar .components-button.has-icon, |
4712 } |
4011 .components-toolbar .components-button.has-icon { |
4713 .components-accessible-toolbar .components-button.components-tab-button, |
4012 padding-right: 8px; |
4714 .components-toolbar .components-button.components-tab-button { |
4013 padding-left: 8px; |
4715 font-weight: 500; |
4014 min-width: 48px; |
4716 } |
4015 justify-content: center; } |
4717 .components-accessible-toolbar .components-button.components-tab-button span, |
4016 .components-accessible-toolbar .components-button.components-tab-button, |
4718 .components-toolbar .components-button.components-tab-button span { |
4017 .components-toolbar .components-button.components-tab-button { |
4719 display: inline-block; |
4018 font-weight: 500; } |
4720 padding-right: 0; |
4019 .components-accessible-toolbar .components-button.components-tab-button span, |
4721 padding-left: 0; |
4020 .components-toolbar .components-button.components-tab-button span { |
4722 position: relative; |
4021 display: inline-block; |
4723 } |
4022 padding-right: 0; |
|
4023 padding-left: 0; |
|
4024 position: relative; } |
|
4025 |
4724 |
4026 @keyframes components-button__appear-animation { |
4725 @keyframes components-button__appear-animation { |
4027 from { |
4726 from { |
4028 transform: scaleY(0); } |
4727 transform: scaleY(0); |
|
4728 } |
4029 to { |
4729 to { |
4030 transform: scaleY(1); } } |
4730 transform: scaleY(1); |
4031 |
4731 } |
|
4732 } |
4032 .components-toolbar__control.components-button { |
4733 .components-toolbar__control.components-button { |
4033 position: relative; } |
4734 position: relative; |
4034 .components-toolbar__control.components-button[data-subscript] svg { |
4735 } |
4035 padding: 5px 0 5px 10px; } |
4736 .components-toolbar__control.components-button[data-subscript] svg { |
4036 .components-toolbar__control.components-button[data-subscript]::after { |
4737 padding: 5px 0 5px 10px; |
4037 content: attr(data-subscript); |
4738 } |
4038 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
4739 .components-toolbar__control.components-button[data-subscript]::after { |
4039 font-size: 13px; |
4740 content: attr(data-subscript); |
4040 font-weight: 600; |
4741 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; |
4041 line-height: 12px; |
4742 font-size: 13px; |
4042 position: absolute; |
4743 font-weight: 600; |
4043 left: 8px; |
4744 line-height: 12px; |
4044 bottom: 10px; } |
4745 position: absolute; |
4045 .components-toolbar__control.components-button:active::before { |
4746 left: 8px; |
4046 display: none; } |
4747 bottom: 10px; |
4047 .components-toolbar__control.components-button:not(:disabled).is-pressed[data-subscript]::after { |
4748 } |
4048 color: #fff; } |
4749 .components-toolbar__control.components-button:active::before { |
|
4750 display: none; |
|
4751 } |
|
4752 .components-toolbar__control.components-button:not(:disabled).is-pressed[data-subscript]::after { |
|
4753 color: #fff; |
|
4754 } |
4049 |
4755 |
4050 .components-toolbar-group { |
4756 .components-toolbar-group { |
4051 min-height: 48px; |
4757 min-height: 48px; |
4052 border-left: 1px solid #1e1e1e; |
4758 border-left: 1px solid #1e1e1e; |
4053 background-color: #fff; |
4759 background-color: #fff; |
4054 display: inline-flex; |
4760 display: inline-flex; |
4055 flex-shrink: 0; |
4761 flex-shrink: 0; |
4056 flex-wrap: wrap; |
4762 flex-wrap: wrap; |
4057 line-height: 0; } |
4763 line-height: 0; |
4058 .components-toolbar-group .components-toolbar-group { |
4764 } |
4059 border-width: 0; |
4765 .components-toolbar-group .components-toolbar-group.components-toolbar-group { |
4060 margin: 0; } |
4766 border-width: 0; |
|
4767 margin: 0; |
|
4768 } |
4061 |
4769 |
4062 .components-toolbar { |
4770 .components-toolbar { |
4063 min-height: 48px; |
4771 min-height: 48px; |
4064 margin: 0; |
4772 margin: 0; |
4065 border: 1px solid #1e1e1e; |
4773 border: 1px solid #1e1e1e; |
4066 border-radius: 2px; |
|
4067 background-color: #fff; |
4774 background-color: #fff; |
4068 display: inline-flex; |
4775 display: inline-flex; |
4069 flex-shrink: 0; |
4776 flex-shrink: 0; |
4070 flex-wrap: wrap; } |
4777 flex-wrap: wrap; |
|
4778 } |
|
4779 .components-toolbar .components-toolbar.components-toolbar { |
|
4780 border-width: 0; |
|
4781 margin: 0; |
|
4782 } |
4071 |
4783 |
4072 div.components-toolbar > div { |
4784 div.components-toolbar > div { |
4073 display: block; |
4785 display: block; |
4074 margin: 0; } |
4786 margin: 0; |
4075 @supports ((position: -webkit-sticky) or (position: sticky)) { |
4787 } |
4076 div.components-toolbar > div { |
4788 @supports (position: sticky) { |
4077 display: flex; } } |
4789 div.components-toolbar > div { |
4078 |
4790 display: flex; |
|
4791 } |
|
4792 } |
4079 div.components-toolbar > div + div.has-left-divider { |
4793 div.components-toolbar > div + div.has-left-divider { |
4080 margin-right: 6px; |
4794 margin-right: 6px; |
4081 position: relative; |
4795 position: relative; |
4082 overflow: visible; } |
4796 overflow: visible; |
4083 |
4797 } |
4084 div.components-toolbar > div + div.has-left-divider::before { |
4798 div.components-toolbar > div + div.has-left-divider::before { |
4085 display: inline-block; |
4799 display: inline-block; |
4086 content: ""; |
4800 content: ""; |
4087 box-sizing: content-box; |
4801 box-sizing: content-box; |
4088 background-color: #ddd; |
4802 background-color: #ddd; |
4089 position: absolute; |
4803 position: absolute; |
4090 top: 8px; |
4804 top: 8px; |
4091 right: -3px; |
4805 right: -3px; |
4092 width: 1px; |
4806 width: 1px; |
4093 height: 20px; } |
4807 height: 20px; |
4094 |
4808 } |
4095 .components-accessible-toolbar .components-toolbar-group > .components-button.components-button.has-icon, |
4809 |
4096 .components-toolbar div > .components-button.components-button.has-icon { |
4810 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:first-child:last-child, |
|
4811 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:first-child:last-child .components-button, .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot.components-dropdown > .components-button.components-button, .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot.components-dropdown > * .components-button, |
|
4812 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:first-child:last-child, |
|
4813 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:first-child:last-child .components-button, |
|
4814 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot.components-dropdown > .components-button.components-button, |
|
4815 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot.components-dropdown > * .components-button, |
|
4816 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:first-child:last-child, |
|
4817 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:first-child:last-child .components-button, |
|
4818 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar.components-dropdown > .components-button.components-button, |
|
4819 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar.components-dropdown > * .components-button, |
|
4820 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:first-child:last-child, |
|
4821 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:first-child:last-child .components-button, |
|
4822 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown.components-dropdown > .components-button.components-button, |
|
4823 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown.components-dropdown > * .components-button, |
|
4824 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:first-child:last-child, |
|
4825 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:first-child:last-child .components-button, |
|
4826 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group.components-dropdown > .components-button.components-button, |
|
4827 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group.components-dropdown > * .components-button { |
|
4828 min-width: 48px; |
|
4829 padding-right: 12px; |
|
4830 padding-left: 12px; |
|
4831 } |
|
4832 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:first-child:last-child::before, |
|
4833 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:first-child:last-child .components-button::before, .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot.components-dropdown > .components-button.components-button::before, .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot.components-dropdown > * .components-button::before, |
|
4834 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:first-child:last-child::before, |
|
4835 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:first-child:last-child .components-button::before, |
|
4836 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot.components-dropdown > .components-button.components-button::before, |
|
4837 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot.components-dropdown > * .components-button::before, |
|
4838 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:first-child:last-child::before, |
|
4839 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:first-child:last-child .components-button::before, |
|
4840 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar.components-dropdown > .components-button.components-button::before, |
|
4841 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar.components-dropdown > * .components-button::before, |
|
4842 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:first-child:last-child::before, |
|
4843 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:first-child:last-child .components-button::before, |
|
4844 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown.components-dropdown > .components-button.components-button::before, |
|
4845 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown.components-dropdown > * .components-button::before, |
|
4846 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:first-child:last-child::before, |
|
4847 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:first-child:last-child .components-button::before, |
|
4848 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group.components-dropdown > .components-button.components-button::before, |
|
4849 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group.components-dropdown > * .components-button::before { |
|
4850 right: 8px; |
|
4851 left: 8px; |
|
4852 } |
|
4853 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:first-child, |
|
4854 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div:first-child > .components-button, |
|
4855 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:first-child .components-button, |
|
4856 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:first-child, |
|
4857 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div:first-child > .components-button, |
|
4858 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:first-child .components-button, |
|
4859 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:first-child, |
|
4860 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div:first-child > .components-button, |
|
4861 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:first-child .components-button, |
|
4862 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:first-child, |
|
4863 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div:first-child > .components-button, |
|
4864 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:first-child .components-button, |
|
4865 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:first-child, |
|
4866 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div:first-child > .components-button, |
|
4867 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:first-child .components-button { |
|
4868 min-width: 42px; |
|
4869 padding-right: 11px; |
|
4870 padding-left: 6px; |
|
4871 } |
|
4872 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:first-child::before, |
|
4873 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div:first-child > .components-button::before, |
|
4874 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:first-child .components-button::before, |
|
4875 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:first-child::before, |
|
4876 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div:first-child > .components-button::before, |
|
4877 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:first-child .components-button::before, |
|
4878 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:first-child::before, |
|
4879 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div:first-child > .components-button::before, |
|
4880 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:first-child .components-button::before, |
|
4881 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:first-child::before, |
|
4882 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div:first-child > .components-button::before, |
|
4883 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:first-child .components-button::before, |
|
4884 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:first-child::before, |
|
4885 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div:first-child > .components-button::before, |
|
4886 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:first-child .components-button::before { |
|
4887 right: 8px; |
|
4888 left: 2px; |
|
4889 } |
|
4890 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button, |
|
4891 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div > .components-button, |
|
4892 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button, |
|
4893 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button, |
|
4894 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div > .components-button, |
|
4895 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown .components-button, |
|
4896 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button, |
|
4897 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div > .components-button, |
|
4898 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown .components-button, |
|
4899 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button, |
|
4900 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div > .components-button, |
|
4901 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown .components-button, |
|
4902 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button, |
|
4903 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div > .components-button, |
|
4904 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown .components-button { |
4097 min-width: 36px; |
4905 min-width: 36px; |
4098 padding-right: 6px; |
4906 padding-right: 6px; |
4099 padding-left: 6px; } |
4907 padding-left: 6px; |
4100 .components-accessible-toolbar .components-toolbar-group > .components-button.components-button.has-icon svg, |
4908 } |
4101 .components-toolbar div > .components-button.components-button.has-icon svg { |
4909 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button svg, |
4102 min-width: 24px; } |
4910 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div > .components-button svg, |
4103 .components-accessible-toolbar .components-toolbar-group > .components-button.components-button.has-icon::before, |
4911 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button svg, |
4104 .components-toolbar div > .components-button.components-button.has-icon::before { |
4912 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button svg, |
4105 right: 2px; |
4913 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div > .components-button svg, |
4106 left: 2px; } |
4914 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown .components-button svg, |
4107 |
4915 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button svg, |
4108 .components-accessible-toolbar .components-toolbar-group > .components-button:first-child.has-icon, |
4916 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div > .components-button svg, |
4109 .components-accessible-toolbar .components-toolbar-group > div:first-child > .components-button.has-icon, |
4917 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown .components-button svg, |
4110 .components-toolbar div:first-child .components-button.has-icon { |
4918 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button svg, |
4111 min-width: 42px; |
4919 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div > .components-button svg, |
4112 padding-right: 11px; |
4920 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown .components-button svg, |
4113 padding-left: 6px; } |
4921 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button svg, |
4114 .components-accessible-toolbar .components-toolbar-group > .components-button:first-child.has-icon::before, |
4922 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div > .components-button svg, |
4115 .components-accessible-toolbar .components-toolbar-group > div:first-child > .components-button.has-icon::before, |
4923 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown .components-button svg { |
4116 .components-toolbar div:first-child .components-button.has-icon::before { |
4924 min-width: 24px; |
4117 right: 8px; |
4925 } |
4118 left: 2px; } |
4926 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button::before, |
4119 |
4927 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div > .components-button::before, |
4120 .components-accessible-toolbar .components-toolbar-group > .components-button:last-of-type.has-icon, |
4928 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button::before, |
4121 .components-accessible-toolbar .components-toolbar-group > div:last-child > .components-button.has-icon, |
4929 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button::before, |
4122 .components-toolbar div:last-child .components-button.has-icon { |
4930 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div > .components-button::before, |
|
4931 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown .components-button::before, |
|
4932 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button::before, |
|
4933 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div > .components-button::before, |
|
4934 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown .components-button::before, |
|
4935 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button::before, |
|
4936 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div > .components-button::before, |
|
4937 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown .components-button::before, |
|
4938 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button::before, |
|
4939 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div > .components-button::before, |
|
4940 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown .components-button::before { |
|
4941 right: 2px; |
|
4942 left: 2px; |
|
4943 } |
|
4944 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:last-child, |
|
4945 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div:last-child > .components-button, |
|
4946 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:last-child .components-button, |
|
4947 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:last-child, |
|
4948 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div:last-child > .components-button, |
|
4949 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:last-child .components-button, |
|
4950 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:last-child, |
|
4951 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div:last-child > .components-button, |
|
4952 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:last-child .components-button, |
|
4953 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:last-child, |
|
4954 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div:last-child > .components-button, |
|
4955 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:last-child .components-button, |
|
4956 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:last-child, |
|
4957 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div:last-child > .components-button, |
|
4958 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:last-child .components-button { |
4123 min-width: 42px; |
4959 min-width: 42px; |
4124 padding-right: 6px; |
4960 padding-right: 6px; |
4125 padding-left: 11px; } |
4961 padding-left: 11px; |
4126 .components-accessible-toolbar .components-toolbar-group > .components-button:last-of-type.has-icon::before, |
4962 } |
4127 .components-accessible-toolbar .components-toolbar-group > div:last-child > .components-button.has-icon::before, |
4963 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-button:last-child::before, |
4128 .components-toolbar div:last-child .components-button.has-icon::before { |
4964 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > div:last-child > .components-button::before, |
4129 right: 2px; |
4965 .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot > .components-dropdown:last-child .components-button::before, |
4130 left: 8px; } |
4966 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-button:last-child::before, |
4131 |
4967 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > div:last-child > .components-button::before, |
4132 .components-accessible-toolbar .components-toolbar-group > .components-button:first-of-type:last-of-type.has-icon, |
4968 .block-editor-block-toolbar > .components-toolbar-group > .block-editor-block-toolbar__slot > .components-dropdown:last-child .components-button::before, |
4133 .components-accessible-toolbar .components-toolbar-group > div:first-child:last-child > .components-button.has-icon, |
4969 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-button:last-child::before, |
4134 .components-toolbar div:first-child:last-child > .components-button.has-icon { |
4970 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > div:last-child > .components-button::before, |
4135 min-width: 48px; |
4971 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar > .components-dropdown:last-child .components-button::before, |
4136 padding-right: 12px; |
4972 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-button:last-child::before, |
4137 padding-left: 12px; } |
4973 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > div:last-child > .components-button::before, |
4138 .components-accessible-toolbar .components-toolbar-group > .components-button:first-of-type:last-of-type.has-icon::before, |
4974 .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown > .components-dropdown:last-child .components-button::before, |
4139 .components-accessible-toolbar .components-toolbar-group > div:first-child:last-child > .components-button.has-icon::before, |
4975 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-button:last-child::before, |
4140 .components-toolbar div:first-child:last-child > .components-button.has-icon::before { |
4976 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > div:last-child > .components-button::before, |
4141 right: 8px; |
4977 .block-editor-block-toolbar .block-editor-block-toolbar__slot .components-toolbar-group > .components-dropdown:last-child .components-button::before { |
4142 left: 8px; } |
4978 right: 2px; |
|
4979 left: 8px; |
|
4980 } |
4143 |
4981 |
4144 .components-tooltip.components-popover { |
4982 .components-tooltip.components-popover { |
4145 z-index: 1000002; } |
4983 z-index: 1000002; |
4146 .components-tooltip.components-popover .components-popover__content { |
4984 } |
4147 min-width: 0; } |
4985 .components-tooltip.components-popover .components-popover__content { |
|
4986 min-width: 0; |
|
4987 } |
4148 |
4988 |
4149 .components-tooltip .components-popover__content { |
4989 .components-tooltip .components-popover__content { |
4150 background: #1e1e1e; |
4990 background: #1e1e1e; |
4151 border-radius: 2px; |
4991 border-radius: 2px; |
4152 border-width: 0; |
4992 border-width: 0; |
4153 color: #fff; |
4993 color: #fff; |
4154 white-space: nowrap; |
4994 white-space: nowrap; |
4155 text-align: center; |
4995 text-align: center; |
4156 line-height: 1.4; |
4996 line-height: 1.4; |
4157 font-size: 12px; |
4997 font-size: 12px; |
4158 box-shadow: none; } |
4998 box-shadow: none; |
4159 .components-tooltip .components-popover__content > div { |
4999 } |
4160 padding: 4px 8px; } |
5000 .components-tooltip .components-popover__content > div { |
|
5001 padding: 4px 8px; |
|
5002 } |
4161 |
5003 |
4162 .components-tooltip__shortcut { |
5004 .components-tooltip__shortcut { |
4163 display: inline-block; |
5005 display: inline-block; |
4164 margin-right: 8px; } |
5006 margin-right: 8px; |
|
5007 } |
|
5008 |
|
5009 .disabled-element-wrapper { |
|
5010 position: relative; |
|
5011 } |
|
5012 .disabled-element-wrapper .event-catcher { |
|
5013 z-index: 100002; |
|
5014 position: absolute; |
|
5015 width: 100%; |
|
5016 height: 100%; |
|
5017 top: 0; |
|
5018 right: 0; |
|
5019 bottom: 0; |
|
5020 left: 0; |
|
5021 } |
4165 |
5022 |
4166 .components-visually-hidden { |
5023 .components-visually-hidden { |
4167 border: 0; |
5024 border: 0; |
4168 clip: rect(1px, 1px, 1px, 1px); |
5025 clip: rect(1px, 1px, 1px, 1px); |
4169 -webkit-clip-path: inset(50%); |
5026 -webkit-clip-path: inset(50%); |