PluginProbe
Gutenberg / 23.6.2
Gutenberg v23.6.2
23.9.1 23.9.0 23.8.0 23.7.2 23.7.1 23.7.0 23.6.1 23.6.2 23.6.0 23.5.3 23.5.2 23.5.1 23.5.0 23.4.0 23.3.2 23.3.1 23.3.0 23.2.0 23.2.1 23.2.2 23.1.1 23.1.0 23.0.1 12.6.0 7.4.0 All 402 releases
gutenberg / build / styles / block-library / editor-rtl.css

editor-rtl.css in Gutenberg 23.6.2, at build/styles/block-library/editor-rtl.css

2,907 lines 74.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Typography
3 */
4 /**
5 * SCSS Variables.
6 *
7 * Please use variables from this sheet to ensure consistency across the UI.
8 * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
9 * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
10 */
11 /**
12 * Colors
13 */
14 /**
15 * Fonts & basic variables.
16 */
17 /**
18 * Typography
19 */
20 /**
21 * Grid System.
22 * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
23 */
24 /**
25 * Radius scale.
26 */
27 /**
28 * Elevation scale.
29 */
30 /**
31 * Dimensions.
32 */
33 /**
34 * Mobile specific styles
35 */
36 /**
37 * Editor styles.
38 */
39 /**
40 * Block & Editor UI.
41 */
42 /**
43 * Block paddings.
44 */
45 /**
46 * React Native specific.
47 * These variables do not appear to be used anywhere else.
48 */
49 /**
50 * Breakpoints & Media Queries
51 */
52 /**
53 * Converts a hex value into the rgb equivalent.
54 *
55 * @param {string} hex - the hexadecimal value to convert
56 * @return {string} comma separated rgb values
57 */
58 /**
59 * Long content fade mixin
60 *
61 * Creates a fading overlay to signify that the content is longer
62 * than the space allows.
63 */
64 /**
65 * Breakpoint mixins
66 */
67 /**
68 * Focus styles.
69 */
70 /**
71 * Standard focus rings for the WordPress Design System.
72 *
73 * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
74 * e.g. `&:focus { @include outset-ring__focus(); }`.
75 */
76 /**
77 * Applies editor left position to the selector passed as argument
78 */
79 /**
80 * Styles that are reused verbatim in a few places
81 */
82 /**
83 * Allows users to opt-out of animations via OS-level preferences.
84 */
85 /**
86 * Reset default styles for JavaScript UI based pages.
87 * This is a WP-admin agnostic reset
88 */
89 /**
90 * Reset the WP Admin page styles for Gutenberg-like pages.
91 */
92 /**
93 * Creates a checkerboard pattern background to indicate transparency.
94 * @param {String} $size - The size of the squares in the checkerboard pattern. Default is 12px.
95 */
96 .block-library-utils__media-control {
97 position: relative;
98 }
99 .block-library-utils__media-control .components-drop-zone__content-icon {
100 display: none;
101 }
102 .block-library-utils__media-control .block-library-utils__media-control__replace-flow {
103 display: block;
104 }
105 .block-library-utils__media-control .block-library-utils__media-control__replace-flow button.components-button {
106 color: #1e1e1e;
107 border-color: #ccc;
108 width: 100%;
109 display: block;
110 height: 40px;
111 padding-left: 32px;
112 }
113 .block-library-utils__media-control .block-library-utils__media-control__replace-flow button.components-button:hover {
114 color: var(--wp-admin-theme-color);
115 }
116
117 .block-library-utils__media-control__inspector-media-replace-title {
118 word-break: break-all;
119 white-space: normal;
120 text-align: start;
121 }
122
123 .block-library-utils__media-control__inspector-image-indicator {
124 width: 20px;
125 height: 20px;
126 border-radius: 2px;
127 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
128 background: #fff linear-gradient(45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
129 background-size: cover;
130 outline: 1px solid transparent;
131 }
132
133 .block-library-utils__media-control__reset {
134 position: absolute;
135 left: 0;
136 top: 8px;
137 margin: auto 8px auto;
138 opacity: 0;
139 border-radius: 2px;
140 }
141 @media not (prefers-reduced-motion) {
142 .block-library-utils__media-control__reset {
143 transition: opacity 0.1s ease-in-out;
144 }
145 }
146 .block-library-utils__media-control:hover .block-library-utils__media-control__reset, .block-library-utils__media-control__reset:focus, .block-library-utils__media-control__reset:hover {
147 opacity: 1;
148 }
149 @media (hover: none) {
150 .block-library-utils__media-control__reset {
151 opacity: 1;
152 }
153 }
154
155 .wp-block-audio {
156 margin-right: 0;
157 margin-left: 0;
158 position: relative;
159 }
160 .wp-block-audio.is-transient audio {
161 opacity: 0.3;
162 }
163 .wp-block-audio .components-spinner {
164 position: absolute;
165 top: 50%;
166 right: 50%;
167 margin-top: -9px;
168 margin-right: -9px;
169 }
170
171 .wp-block-avatar__image img {
172 width: 100%;
173 }
174
175 .wp-block-avatar.aligncenter .components-resizable-box__container {
176 margin: 0 auto;
177 }
178
179 .wp-block[data-align=center] > .wp-block-button {
180 text-align: center;
181 margin-right: auto;
182 margin-left: auto;
183 }
184
185 .wp-block[data-align=right] > .wp-block-button {
186 text-align: right;
187 }
188
189 .wp-block-button {
190 position: relative;
191 cursor: text;
192 }
193 .wp-block-button:focus {
194 box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--wp-admin-theme-color);
195 outline: 2px solid transparent;
196 outline-offset: -2px;
197 }
198 .wp-block-button[data-rich-text-placeholder]::after {
199 opacity: 0.8;
200 }
201
202 div[data-type="core/button"] {
203 display: table;
204 }
205
206 .wp-block-buttons > .wp-block {
207 margin: 0;
208 }
209 .wp-block-buttons > .wp-block-button.wp-block-button.wp-block-button.wp-block-button.wp-block-button {
210 margin: 0;
211 }
212 .wp-block-buttons > .block-list-appender {
213 display: inline-flex;
214 align-items: center;
215 }
216 .wp-block-buttons.is-vertical > .block-list-appender .block-list-appender__toggle {
217 justify-content: flex-start;
218 }
219 .wp-block-buttons > .wp-block-button:focus {
220 box-shadow: none;
221 }
222 .wp-block-buttons {
223 /* stylelint-disable @stylistic/indentation -- Disable the stylelint rule, otherwise this selector is ugly! */
224 }
225 .wp-block-buttons:not(.is-content-justification-space-between,
226 .is-content-justification-right,
227 .is-content-justification-left,
228 .is-content-justification-center) .wp-block[data-align=center] {
229 /* stylelint-enable @stylistic/indentation */
230 margin-right: auto;
231 margin-left: auto;
232 margin-top: 0;
233 width: 100%;
234 }
235 .wp-block-buttons:not(.is-content-justification-space-between,
236 .is-content-justification-right,
237 .is-content-justification-left,
238 .is-content-justification-center) .wp-block[data-align=center] .wp-block-button {
239 margin-bottom: 0;
240 }
241
242 .wp-block[data-align=center] > .wp-block-buttons {
243 align-items: center;
244 justify-content: center;
245 }
246
247 .wp-block[data-align=right] > .wp-block-buttons {
248 justify-content: flex-end;
249 }
250
251 .wp-block-categories ul {
252 padding-right: 2.5em;
253 }
254 .wp-block-categories ul ul {
255 margin-top: 6px;
256 }
257
258 /* Center alignment for classic themes. */
259 [data-align=center] .wp-block-categories {
260 text-align: center;
261 }
262
263 .wp-block-categories__indentation {
264 padding-right: 16px;
265 }
266
267 .wp-block-code code {
268 background: none;
269 }
270
271 .wp-block-columns :where(.wp-block) {
272 max-width: none;
273 margin-right: 0;
274 margin-left: 0;
275 }
276
277 html :where(.wp-block-column) {
278 margin-top: 0;
279 margin-bottom: 0;
280 }
281
282 /* Styles for backwards compatibility with the legacy `post-comments` block */
283 .wp-block-post-comments, .wp-block-comments__legacy-placeholder {
284 box-sizing: border-box;
285 /* utility classes */
286 }
287 .wp-block-post-comments .alignleft, .wp-block-comments__legacy-placeholder .alignleft {
288 float: right;
289 }
290 .wp-block-post-comments .alignright, .wp-block-comments__legacy-placeholder .alignright {
291 float: left;
292 }
293 .wp-block-post-comments, .wp-block-comments__legacy-placeholder {
294 /* end utility classes */
295 }
296 .wp-block-post-comments .navigation::after, .wp-block-comments__legacy-placeholder .navigation::after {
297 content: "";
298 display: table;
299 clear: both;
300 }
301 .wp-block-post-comments .commentlist, .wp-block-comments__legacy-placeholder .commentlist {
302 clear: both;
303 list-style: none;
304 margin: 0;
305 padding: 0;
306 }
307 .wp-block-post-comments .commentlist .comment, .wp-block-comments__legacy-placeholder .commentlist .comment {
308 min-height: 2.25em;
309 padding-right: 3.25em;
310 }
311 .wp-block-post-comments .commentlist .comment p, .wp-block-comments__legacy-placeholder .commentlist .comment p {
312 font-size: 1em;
313 line-height: 1.8;
314 margin: 1em 0;
315 }
316 .wp-block-post-comments .commentlist .children, .wp-block-comments__legacy-placeholder .commentlist .children {
317 list-style: none;
318 margin: 0;
319 padding: 0;
320 }
321 .wp-block-post-comments .comment-author, .wp-block-comments__legacy-placeholder .comment-author {
322 line-height: 1.5;
323 }
324 .wp-block-post-comments .comment-author .avatar, .wp-block-comments__legacy-placeholder .comment-author .avatar {
325 border-radius: 1.5em;
326 display: block;
327 float: right;
328 height: 2.5em;
329 margin-top: 0.5em;
330 margin-left: 0.75em;
331 width: 2.5em;
332 }
333 .wp-block-post-comments .comment-author cite, .wp-block-comments__legacy-placeholder .comment-author cite {
334 font-style: normal;
335 }
336 .wp-block-post-comments .comment-meta, .wp-block-comments__legacy-placeholder .comment-meta {
337 font-size: 0.875em;
338 line-height: 1.5;
339 }
340 .wp-block-post-comments .comment-meta b, .wp-block-comments__legacy-placeholder .comment-meta b {
341 font-weight: normal;
342 }
343 .wp-block-post-comments .comment-meta .comment-awaiting-moderation, .wp-block-comments__legacy-placeholder .comment-meta .comment-awaiting-moderation {
344 margin-top: 1em;
345 margin-bottom: 1em;
346 display: block;
347 }
348 .wp-block-post-comments .comment-body .commentmetadata, .wp-block-comments__legacy-placeholder .comment-body .commentmetadata {
349 font-size: 0.875em;
350 }
351 .wp-block-post-comments .comment-form-comment label, .wp-block-comments__legacy-placeholder .comment-form-comment label,
352 .wp-block-post-comments .comment-form-author label,
353 .wp-block-comments__legacy-placeholder .comment-form-author label,
354 .wp-block-post-comments .comment-form-email label,
355 .wp-block-comments__legacy-placeholder .comment-form-email label,
356 .wp-block-post-comments .comment-form-url label,
357 .wp-block-comments__legacy-placeholder .comment-form-url label {
358 display: block;
359 margin-bottom: 0.25em;
360 }
361 .wp-block-post-comments .comment-form textarea, .wp-block-comments__legacy-placeholder .comment-form textarea,
362 .wp-block-post-comments .comment-form input:not([type=submit]):not([type=checkbox]),
363 .wp-block-comments__legacy-placeholder .comment-form input:not([type=submit]):not([type=checkbox]) {
364 display: block;
365 box-sizing: border-box;
366 width: 100%;
367 }
368 .wp-block-post-comments .comment-form-cookies-consent, .wp-block-comments__legacy-placeholder .comment-form-cookies-consent {
369 display: flex;
370 gap: 0.25em;
371 }
372 .wp-block-post-comments .comment-form-cookies-consent #wp-comment-cookies-consent, .wp-block-comments__legacy-placeholder .comment-form-cookies-consent #wp-comment-cookies-consent {
373 margin-top: 0.35em;
374 }
375 .wp-block-post-comments .comment-reply-title, .wp-block-comments__legacy-placeholder .comment-reply-title {
376 margin-bottom: 0;
377 }
378 .wp-block-post-comments .comment-reply-title :where(small), .wp-block-comments__legacy-placeholder .comment-reply-title :where(small) {
379 font-size: var(--wp--preset--font-size--medium, smaller);
380 margin-right: 0.5em;
381 }
382 .wp-block-post-comments .reply, .wp-block-comments__legacy-placeholder .reply {
383 font-size: 0.875em;
384 margin-bottom: 1.4em;
385 }
386 .wp-block-post-comments textarea, .wp-block-comments__legacy-placeholder textarea,
387 .wp-block-post-comments input:not([type=submit]),
388 .wp-block-comments__legacy-placeholder input:not([type=submit]) {
389 border: 1px solid #949494;
390 font-size: 1em;
391 font-family: inherit;
392 }
393 .wp-block-post-comments textarea, .wp-block-comments__legacy-placeholder textarea,
394 .wp-block-post-comments input:not([type=submit]):not([type=checkbox]),
395 .wp-block-comments__legacy-placeholder input:not([type=submit]):not([type=checkbox]) {
396 padding: calc(0.667em + 2px);
397 }
398
399 :where(.wp-block-post-comments input[type=submit], .wp-block-comments__legacy-placeholder input[type=submit]) {
400 border: none;
401 }
402
403 .wp-block-comments {
404 box-sizing: border-box;
405 }
406
407 .block-library-comments-toolbar__popover .components-popover__content {
408 min-width: 230px;
409 }
410
411 .wp-block-comments__legacy-placeholder * {
412 pointer-events: none;
413 }
414
415 .wp-block-comment-author-avatar__placeholder {
416 border: currentColor 1px dashed;
417 width: 100%;
418 height: 100%;
419 stroke: currentColor;
420 stroke-dasharray: 3;
421 }
422
423 .wp-block[data-align=center] > .wp-block-comments-pagination {
424 justify-content: center;
425 }
426
427 :where(.editor-styles-wrapper) .wp-block-comments-pagination {
428 max-width: 100%;
429 }
430
431 .wp-block-comments-pagination > .wp-block-comments-pagination-next,
432 .wp-block-comments-pagination > .wp-block-comments-pagination-previous,
433 .wp-block-comments-pagination > .wp-block-comments-pagination-numbers {
434 font-size: inherit;
435 }
436
437 .wp-block-comments-pagination-numbers a {
438 text-decoration: underline;
439 }
440 .wp-block-comments-pagination-numbers .page-numbers {
441 margin-left: 2px;
442 }
443 .wp-block-comments-pagination-numbers .page-numbers:last-child {
444 margin-right: 0;
445 }
446
447 .wp-block-comments-title.has-background {
448 padding: inherit;
449 }
450
451 .wp-block-cover.is-placeholder {
452 padding: 0 !important;
453 display: flex;
454 align-items: stretch;
455 min-height: 240px;
456 }
457 .wp-block-cover.is-placeholder .components-placeholder.is-large {
458 justify-content: flex-start;
459 z-index: 1;
460 }
461 .wp-block-cover.is-placeholder:focus::after {
462 min-height: auto;
463 }
464 .wp-block-cover.components-placeholder h2 {
465 color: inherit;
466 }
467 .wp-block-cover.is-transient {
468 position: relative;
469 }
470 .wp-block-cover.is-transient::before {
471 background-color: #fff;
472 content: "";
473 height: 100%;
474 opacity: 0.3;
475 position: absolute;
476 width: 100%;
477 z-index: 1;
478 }
479 .wp-block-cover.is-transient .wp-block-cover__inner-container {
480 z-index: 2;
481 }
482 .wp-block-cover .components-spinner {
483 position: absolute;
484 top: 50%;
485 right: 50%;
486 transform: translate(50%, -50%);
487 margin: 0;
488 }
489 .wp-block-cover .wp-block-cover__inner-container {
490 text-align: right;
491 margin-right: 0;
492 margin-left: 0;
493 }
494 .wp-block-cover .wp-block-cover__placeholder-background-options {
495 width: 100%;
496 }
497 .wp-block-cover .wp-block-cover__image--placeholder-image {
498 position: absolute;
499 top: 0;
500 left: 0;
501 bottom: 0;
502 right: 0;
503 }
504
505 [data-align=left] > .wp-block-cover,
506 [data-align=right] > .wp-block-cover {
507 max-width: 420px;
508 width: 100%;
509 }
510
511 .block-library-cover__reset-button {
512 margin-right: auto;
513 }
514
515 .block-library-cover__resize-container {
516 position: absolute !important;
517 top: 0;
518 right: 0;
519 left: 0;
520 bottom: 0;
521 min-height: 50px;
522 }
523
524 .components-popover.block-editor-block-popover.block-library-cover__resizable-box-popover .components-popover__content > div,
525 .components-popover.block-editor-block-popover.block-library-cover__resizable-box-popover .block-library-cover__resize-container {
526 pointer-events: none;
527 overflow: visible;
528 }
529
530 .block-editor-block-patterns-list__list-item .has-parallax.wp-block-cover {
531 background-attachment: scroll;
532 }
533
534 .color-block-support-panel__inner-wrapper > :not(.block-editor-tools-panel-color-gradient-settings__item) {
535 margin-top: 24px;
536 }
537
538 .wp-block-details summary div {
539 display: inline;
540 }
541
542 .wp-block-embed {
543 margin-right: 0;
544 margin-left: 0;
545 clear: both;
546 }
547 .wp-block-embed.is-loading {
548 display: flex;
549 justify-content: center;
550 }
551 .wp-block-embed .wp-block-embed__placeholder-input {
552 flex: 1 1 auto;
553 }
554 .wp-block-embed .components-placeholder__error {
555 word-break: break-word;
556 }
557
558 .wp-block-post-content .wp-block-embed__learn-more a {
559 color: var(--wp-admin-theme-color);
560 }
561
562 .block-library-embed__interactive-overlay {
563 position: absolute;
564 top: 0;
565 right: 0;
566 left: 0;
567 bottom: 0;
568 opacity: 0;
569 }
570
571 .wp-block[data-align=left] > .wp-block-embed,
572 .wp-block[data-align=right] > .wp-block-embed {
573 max-width: 360px;
574 width: 100%;
575 }
576 .wp-block[data-align=left] > .wp-block-embed .wp-block-embed__wrapper,
577 .wp-block[data-align=right] > .wp-block-embed .wp-block-embed__wrapper {
578 min-width: 280px;
579 }
580
581 .wp-block[data-align=left] > .wp-block-file, .wp-block[data-align=right] > .wp-block-file {
582 height: auto;
583 }
584 .wp-block[data-align=center] > .wp-block-file {
585 text-align: center;
586 }
587 .wp-block-file {
588 display: flex;
589 flex-wrap: wrap;
590 justify-content: space-between;
591 align-items: center;
592 margin-bottom: 0;
593 }
594 .wp-block-file .components-resizable-box__container {
595 margin-bottom: 1em;
596 }
597 .wp-block-file .wp-block-file__preview {
598 margin-bottom: 1em;
599 width: 100%;
600 height: 100%;
601 }
602 .wp-block-file .wp-block-file__preview-overlay {
603 position: absolute;
604 top: 0;
605 left: 0;
606 bottom: 0;
607 right: 0;
608 }
609 .wp-block-file .wp-block-file__content-wrapper {
610 flex-grow: 1;
611 }
612 .wp-block-file a {
613 min-width: 1em;
614 }
615 .wp-block-file a:not(.wp-block-file__button) {
616 display: inline-block;
617 }
618 .wp-block-file .wp-block-file__button-richtext-wrapper {
619 display: inline-block;
620 margin-right: 0.75em;
621 }
622
623 .wp-block-form-input .is-input-hidden {
624 display: flex;
625 position: relative;
626 font-size: 0.85em;
627 opacity: 0.3;
628 border: 1px dashed;
629 padding: 0.5em;
630 box-sizing: border-box;
631 background: repeating-linear-gradient(-45deg, transparent, transparent 5px, currentColor 5px, currentColor 6px);
632 justify-content: center;
633 align-items: center;
634 }
635 .wp-block-form-input .is-input-hidden::after {
636 content: attr(data-message);
637 }
638 .wp-block-form-input.is-selected .is-input-hidden {
639 opacity: 1;
640 background: none;
641 }
642
643 .wp-block-form-submission-notification > * {
644 opacity: 0.25;
645 border: 1px dashed;
646 box-sizing: border-box;
647 background: repeating-linear-gradient(-45deg, transparent, transparent 5px, currentColor 5px, currentColor 6px);
648 }
649 .wp-block-form-submission-notification.is-selected > *, .wp-block-form-submission-notification:has(.is-selected) > * {
650 opacity: 1;
651 background: none;
652 }
653 .wp-block-form-submission-notification.is-selected::after, .wp-block-form-submission-notification:has(.is-selected)::after {
654 display: none !important;
655 }
656 .wp-block-form-submission-notification::after {
657 display: flex;
658 position: absolute;
659 width: 100%;
660 height: 100%;
661 top: 0;
662 right: 0;
663 justify-content: center;
664 align-items: center;
665 font-size: 1.1em;
666 }
667 .wp-block-form-submission-notification.form-notification-type-success::after {
668 content: attr(data-message-success);
669 }
670 .wp-block-form-submission-notification.form-notification-type-error::after {
671 content: attr(data-message-error);
672 }
673
674 .block-editor-freeform-modal .block-editor-freeform-modal__content .mce-edit-area iframe {
675 height: 50vh !important;
676 }
677 @media (min-width: 960px) {
678 .block-editor-freeform-modal .block-editor-freeform-modal__content:not(.is-full-screen) {
679 height: 9999rem;
680 }
681 .block-editor-freeform-modal .block-editor-freeform-modal__content .components-modal__header + div {
682 height: 100%;
683 }
684 .block-editor-freeform-modal .block-editor-freeform-modal__content .mce-tinymce {
685 height: calc(100% - 36px - 16px);
686 }
687 .block-editor-freeform-modal .block-editor-freeform-modal__content .mce-container-body {
688 height: 100%;
689 display: flex;
690 flex-direction: column;
691 min-width: 50vw;
692 }
693 .block-editor-freeform-modal .block-editor-freeform-modal__content .mce-edit-area {
694 flex-grow: 1;
695 display: flex;
696 flex-direction: column;
697 }
698 .block-editor-freeform-modal .block-editor-freeform-modal__content .mce-edit-area iframe {
699 flex-grow: 1;
700 height: 10px !important;
701 }
702 }
703 .block-editor-freeform-modal__actions {
704 margin-top: 16px;
705 }
706
707 :root :where(figure.wp-block-gallery) {
708 display: block;
709 }
710 :root :where(figure.wp-block-gallery) > .blocks-gallery-caption {
711 flex: 0 0 100%;
712 }
713 :root :where(figure.wp-block-gallery) .block-editor-media-placeholder.is-appender .components-placeholder__label {
714 display: none;
715 }
716 :root :where(figure.wp-block-gallery) .block-editor-media-placeholder.is-appender .block-editor-media-placeholder__button {
717 margin-bottom: 0;
718 }
719 :root :where(figure.wp-block-gallery) .block-editor-media-placeholder {
720 margin: 0;
721 }
722 :root :where(figure.wp-block-gallery) .block-editor-media-placeholder .components-placeholder__label {
723 display: flex;
724 }
725 :root :where(figure.wp-block-gallery) .block-editor-media-placeholder figcaption {
726 z-index: 2;
727 }
728 :root :where(figure.wp-block-gallery) .components-spinner {
729 position: absolute;
730 top: 50%;
731 right: 50%;
732 margin-top: -9px;
733 margin-right: -9px;
734 }
735
736 /**
737 * Gallery inspector controls settings.
738 */
739 .gallery-settings-buttons .components-button:first-child {
740 margin-left: 8px;
741 }
742
743 /**
744 * Deprecated css past this point. This can be removed once all galleries are migrated
745 * to V2.
746 */
747 .blocks-gallery-item figure:not(.is-selected):focus,
748 .blocks-gallery-item img:focus {
749 outline: none;
750 }
751 .blocks-gallery-item figure.is-selected::before {
752 box-shadow: 0 0 0 1px #fff inset, 0 0 0 3px var(--wp-admin-theme-color) inset;
753 content: "";
754 outline: 2px solid transparent;
755 position: absolute;
756 top: 0;
757 left: 0;
758 bottom: 0;
759 right: 0;
760 z-index: 1;
761 pointer-events: none;
762 }
763 .blocks-gallery-item figure.is-transient img {
764 opacity: 0.3;
765 }
766 .blocks-gallery-item .block-editor-media-placeholder {
767 margin: 0;
768 height: 100%;
769 }
770 .blocks-gallery-item .block-editor-media-placeholder .components-placeholder__label {
771 display: flex;
772 }
773
774 .wp-block-gallery ul.blocks-gallery-grid {
775 padding: 0;
776 margin: 0;
777 }
778
779 @media (min-width: 600px) {
780 .wp-block-update-gallery-modal {
781 max-width: 480px;
782 }
783 }
784
785 .wp-block-update-gallery-modal-buttons {
786 display: flex;
787 justify-content: flex-end;
788 gap: 12px;
789 }
790
791 .wp-block-gallery__source-settings {
792 grid-column: 1/-1;
793 display: flex;
794 flex-direction: column;
795 gap: 8px;
796 }
797 .wp-block-gallery__source-settings .wp-block-gallery__source-description {
798 margin: 0;
799 color: #757575;
800 font-size: 12px;
801 }
802 .wp-block-gallery__source-settings .components-button {
803 justify-content: center;
804 width: 100%;
805 }
806
807 .wp-block-gallery__source-notice {
808 grid-column: 1/-1;
809 margin: 0;
810 }
811
812 /**
813 * Group: All Alignment Settings
814 */
815 .wp-block-group .block-editor-block-list__insertion-point {
816 right: 0;
817 left: 0;
818 }
819
820 [data-type="core/group"].is-selected .block-list-appender {
821 margin-right: 0;
822 margin-left: 0;
823 }
824 [data-type="core/group"].is-selected .has-background .block-list-appender {
825 margin-top: 18px;
826 margin-bottom: 18px;
827 }
828
829 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child {
830 gap: inherit;
831 }
832 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child,
833 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child .block-editor-default-block-appender__content,
834 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child .block-editor-inserter {
835 display: inherit;
836 width: 100%;
837 flex-direction: inherit;
838 flex: 1;
839 }
840 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child::after {
841 content: "";
842 display: flex;
843 flex: 1 0 40px;
844 pointer-events: none;
845 min-height: 38px;
846 border: 1px dashed currentColor;
847 }
848 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child {
849 pointer-events: none;
850 }
851 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child .block-editor-inserter,
852 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child .block-editor-button-block-appender {
853 pointer-events: all;
854 }
855
856 .block-library-html__edit .block-library-html__preview-overlay {
857 position: absolute;
858 width: 100%;
859 height: 100%;
860 top: 0;
861 right: 0;
862 }
863
864 .block-library-html__edit-code {
865 margin: 16px;
866 }
867 .block-library-html__edit-code .block-library-html__edit-code-button {
868 justify-content: center;
869 }
870
871 @media (min-width: 600px) {
872 .block-library-html__modal:not(.is-full-screen) {
873 height: 9999rem;
874 }
875 }
876 .block-library-html__modal .components-modal__children-container {
877 height: 100%;
878 }
879
880 .block-library-html__modal-tabs {
881 flex: 1;
882 }
883
884 .block-library-html__modal-content {
885 flex: 1;
886 }
887
888 .block-library-html__modal-tab {
889 height: 100%;
890 display: flex;
891 flex-direction: column;
892 margin: 0;
893 box-sizing: border-box;
894 border: 1px solid #e0e0e0;
895 border-radius: 2px;
896 padding: 16px;
897 font-family: Menlo, Consolas, monaco, monospace;
898 }
899
900 .block-library-html__modal-editor {
901 width: 100%;
902 height: 100%;
903 flex: 1;
904 border: none;
905 background: transparent;
906 padding: 0;
907 font-family: inherit;
908 font-size: inherit;
909 line-height: inherit;
910 color: inherit;
911 resize: none;
912 direction: ltr;
913 overflow-x: auto;
914 box-sizing: border-box;
915 }
916 .block-library-html__modal-editor:focus {
917 outline: none;
918 box-shadow: none;
919 }
920
921 .block-library-html__preview {
922 display: flex;
923 align-items: center;
924 justify-content: center;
925 min-height: 0;
926 overflow-y: auto;
927 flex: 1;
928 }
929 .block-library-html__preview iframe {
930 height: 100%;
931 }
932
933 .wp-block[data-align=center] > .wp-block-icon {
934 display: flex;
935 justify-content: center;
936 }
937
938 .wp-block-icon__inserter-sidebar {
939 padding-bottom: 24px;
940 }
941 @media (min-width: 782px) {
942 .wp-block-icon__inserter-sidebar {
943 overflow-x: visible;
944 overflow-y: auto;
945 position: absolute;
946 top: 72px;
947 right: 0;
948 bottom: 0;
949 width: 280px;
950 padding-top: 24px;
951 padding-inline: 24px;
952 }
953 }
954
955 @media (min-width: 782px) {
956 .wp-block-icon__inserter-panel {
957 margin-inline-start: 280px;
958 }
959 }
960
961 .wp-block-icon__inserter-loading {
962 display: flex;
963 justify-content: center;
964 padding: 24px;
965 }
966
967 .wp-block-icon__inserter-grid-icons-list {
968 display: grid;
969 grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
970 }
971
972 .wp-block-icon__inserter-grid-no-results {
973 display: flex;
974 justify-content: center;
975 }
976
977 .wp-block-icon__inserter-grid-icons-list-item {
978 display: flex;
979 flex-direction: column;
980 height: auto !important;
981 }
982
983 .wp-block-icon__inserter-grid-icons-list-item-icon {
984 padding: 12px;
985 }
986 .wp-block-icon__inserter-grid-icons-list-item-icon svg {
987 display: block;
988 width: 24px;
989 height: 24px;
990 }
991
992 .wp-block-icon__inserter-grid-icons-list-item-title {
993 font-size: 12px;
994 padding: 4px 4px 8px;
995 overflow-wrap: break-word;
996 }
997
998 .wp-block-icon__toolbar-content {
999 width: 250px;
1000 }
1001
1002 .wp-block-icon__placeholder {
1003 backdrop-filter: blur(100px);
1004 }
1005
1006 .wp-block-image.wp-block-image .block-editor-media-placeholder.is-small {
1007 min-height: 60px;
1008 }
1009
1010 figure.wp-block-image:not(.wp-block) {
1011 margin: 0;
1012 }
1013
1014 .wp-block-image {
1015 position: relative;
1016 }
1017 .wp-block-image.is-transient:not(.alignwide):not(.alignfull) {
1018 width: -moz-fit-content;
1019 width: fit-content;
1020 }
1021 .wp-block-image .is-applying img, .wp-block-image.is-transient img {
1022 opacity: 0.3;
1023 }
1024 .wp-block-image figcaption img {
1025 display: inline;
1026 }
1027 .wp-block-image .components-spinner {
1028 position: absolute;
1029 top: 50%;
1030 right: 50%;
1031 transform: translate(50%, -50%);
1032 margin: 0;
1033 }
1034
1035 .wp-block-image__placeholder {
1036 aspect-ratio: 4/3;
1037 }
1038 .wp-block-image__placeholder.has-illustration::before {
1039 background: #fff;
1040 opacity: 0.8;
1041 }
1042 .wp-block-image__placeholder .components-placeholder__illustration {
1043 opacity: 0.1;
1044 }
1045
1046 .wp-block-image.is-selected .block-editor-media-placeholder {
1047 filter: none !important;
1048 }
1049
1050 .block-editor-block-list__block[data-type="core/image"] .block-editor-block-toolbar .block-editor-url-input__button-modal {
1051 position: absolute;
1052 right: 0;
1053 left: 0;
1054 margin: -1px 0;
1055 }
1056 @media (min-width: 600px) {
1057 .block-editor-block-list__block[data-type="core/image"] .block-editor-block-toolbar .block-editor-url-input__button-modal {
1058 margin: -1px;
1059 }
1060 }
1061
1062 [data-align=wide] > .wp-block-image img,
1063 [data-align=full] > .wp-block-image img {
1064 height: auto;
1065 width: 100%;
1066 }
1067
1068 .wp-block[data-align=left] > .wp-block-image,
1069 .wp-block[data-align=center] > .wp-block-image,
1070 .wp-block[data-align=right] > .wp-block-image {
1071 display: table;
1072 }
1073 .wp-block[data-align=left] > .wp-block-image > figcaption,
1074 .wp-block[data-align=center] > .wp-block-image > figcaption,
1075 .wp-block[data-align=right] > .wp-block-image > figcaption {
1076 display: table-caption;
1077 caption-side: bottom;
1078 }
1079
1080 .wp-block[data-align=left] > .wp-block-image {
1081 margin-left: 1em;
1082 margin-right: 0;
1083 margin-top: 0.5em;
1084 margin-bottom: 0.5em;
1085 }
1086
1087 .wp-block[data-align=right] > .wp-block-image {
1088 margin-right: 1em;
1089 margin-left: 0;
1090 margin-top: 0.5em;
1091 margin-bottom: 0.5em;
1092 }
1093
1094 .wp-block[data-align=center] > .wp-block-image {
1095 margin-right: auto;
1096 margin-left: auto;
1097 text-align: center;
1098 }
1099
1100 .wp-block[data-align]:has(> .wp-block-image) {
1101 position: relative;
1102 }
1103
1104 .wp-block-image__crop-area {
1105 position: relative;
1106 max-width: 100%;
1107 width: 100%;
1108 overflow: hidden;
1109 }
1110 .wp-block-image__crop-area .reactEasyCrop_Container {
1111 pointer-events: auto;
1112 }
1113 .wp-block-image__crop-area .reactEasyCrop_Container .reactEasyCrop_Image {
1114 border: none;
1115 border-radius: 0;
1116 }
1117
1118 .wp-block-image__crop-icon {
1119 padding: 0 8px;
1120 min-width: 48px;
1121 display: flex;
1122 justify-content: center;
1123 align-items: center;
1124 }
1125 .wp-block-image__crop-icon svg {
1126 fill: currentColor;
1127 }
1128
1129 .wp-block-image__zoom .components-popover__content {
1130 min-width: 260px;
1131 overflow: visible !important;
1132 }
1133
1134 .wp-block-image__toolbar_content_textarea__container {
1135 padding: 8px;
1136 }
1137
1138 .wp-block-image__toolbar_content_textarea {
1139 width: 250px;
1140 }
1141
1142 .wp-block-latest-posts > li {
1143 overflow: hidden;
1144 }
1145
1146 .wp-block-latest-posts li a > div {
1147 display: inline;
1148 }
1149
1150 :root :where(.wp-block-latest-posts) {
1151 padding-right: 2.5em;
1152 }
1153
1154 :root :where(.wp-block-latest-posts.is-grid),
1155 :root :where(.wp-block-latest-posts__list) {
1156 padding-right: 0;
1157 }
1158
1159 .wp-block-math__textarea-control textarea {
1160 font-family: Menlo, Consolas, monaco, monospace;
1161 direction: ltr;
1162 }
1163
1164 .wp-block-media-text__media {
1165 position: relative;
1166 }
1167 .wp-block-media-text__media.is-transient img {
1168 opacity: 0.3;
1169 }
1170 .wp-block-media-text__media .components-spinner {
1171 position: absolute;
1172 top: 50%;
1173 right: 50%;
1174 margin-top: -9px;
1175 margin-right: -9px;
1176 }
1177
1178 .wp-block-media-text .__resizable_base__ {
1179 grid-column: 1/span 2;
1180 grid-row: 2;
1181 }
1182
1183 .wp-block-media-text .editor-media-container__resizer {
1184 width: 100% !important;
1185 }
1186
1187 .wp-block-media-text.is-image-fill .editor-media-container__resizer,
1188 .wp-block-media-text.is-image-fill .components-placeholder.has-illustration,
1189 .wp-block-media-text.is-image-fill-element .editor-media-container__resizer,
1190 .wp-block-media-text.is-image-fill-element .components-placeholder.has-illustration {
1191 height: 100% !important;
1192 }
1193
1194 .wp-block-media-text > .block-editor-block-list__layout > .block-editor-block-list__block {
1195 max-width: unset;
1196 }
1197
1198 /* Make the featured image placeholder the same height as the media selection area. */
1199 .wp-block-media-text--placeholder-image {
1200 min-height: 205px;
1201 }
1202
1203 .block-editor-block-list__block[data-type="core/more"] {
1204 max-width: 100%;
1205 text-align: center;
1206 margin-top: 28px;
1207 margin-bottom: 28px;
1208 }
1209
1210 .wp-block-more {
1211 display: block;
1212 text-align: center;
1213 white-space: nowrap;
1214 }
1215 .wp-block-more .rich-text {
1216 position: relative;
1217 font-size: 13px;
1218 text-transform: uppercase;
1219 font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1220 font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1221 color: #757575;
1222 display: inline-flex;
1223 white-space: nowrap;
1224 text-align: center;
1225 background: #fff;
1226 padding: 10px 36px;
1227 }
1228 .wp-block-more::before {
1229 content: "";
1230 position: absolute;
1231 top: 50%;
1232 right: 0;
1233 left: 0;
1234 border-top: 3px dashed #ccc;
1235 }
1236
1237 /**
1238 * Editor only CSS.
1239 */
1240 .editor-styles-wrapper .wp-block-navigation ul {
1241 margin-top: 0;
1242 margin-bottom: 0;
1243 margin-right: 0;
1244 padding-right: 0;
1245 }
1246 .editor-styles-wrapper .wp-block-navigation .wp-block-navigation-item.wp-block {
1247 margin: revert;
1248 }
1249
1250 .wp-block-navigation-item__label {
1251 display: inline;
1252 }
1253
1254 /**
1255 * Submenus.
1256 */
1257 .wp-block-navigation__container,
1258 .wp-block-navigation-item {
1259 background-color: inherit;
1260 }
1261
1262 .wp-block-navigation:not(.is-selected):not(.has-child-selected) .has-child:hover > .wp-block-navigation__submenu-container {
1263 opacity: 0;
1264 visibility: hidden;
1265 }
1266
1267 .has-child.is-selected > .wp-block-navigation__submenu-container, .has-child.has-child-selected > .wp-block-navigation__submenu-container {
1268 display: flex;
1269 opacity: 1;
1270 visibility: visible;
1271 }
1272
1273 .is-dragging-components-draggable .has-child.is-dragging-within > .wp-block-navigation__submenu-container {
1274 opacity: 1;
1275 visibility: visible;
1276 }
1277
1278 .is-editing > .wp-block-navigation__container {
1279 visibility: visible;
1280 opacity: 1;
1281 display: flex;
1282 flex-direction: column;
1283 }
1284
1285 .is-dragging-components-draggable .wp-block-navigation-link > .wp-block-navigation__container {
1286 opacity: 1;
1287 visibility: hidden;
1288 }
1289 .is-dragging-components-draggable .wp-block-navigation-link > .wp-block-navigation__container .block-editor-block-draggable-chip-wrapper {
1290 visibility: visible;
1291 }
1292
1293 .is-editing > .wp-block-navigation__submenu-container > .block-list-appender {
1294 display: block;
1295 position: static;
1296 width: 100%;
1297 }
1298 .is-editing > .wp-block-navigation__submenu-container > .block-list-appender .block-editor-button-block-appender {
1299 color: #fff;
1300 background: #1e1e1e;
1301 padding: 0;
1302 width: 24px;
1303 margin-left: 0;
1304 margin-right: auto;
1305 }
1306
1307 .wp-block-navigation__submenu-container .block-list-appender {
1308 display: none;
1309 }
1310
1311 /**
1312 * Colors Selector component
1313 */
1314 .block-library-colors-selector {
1315 width: auto;
1316 }
1317 .block-library-colors-selector .block-library-colors-selector__toggle {
1318 display: block;
1319 margin: 0 auto;
1320 padding: 3px;
1321 width: auto;
1322 }
1323 .block-library-colors-selector .block-library-colors-selector__icon-container {
1324 height: 30px;
1325 position: relative;
1326 margin: 0 auto;
1327 padding: 3px;
1328 display: flex;
1329 align-items: center;
1330 border-radius: 4px;
1331 }
1332 .block-library-colors-selector .block-library-colors-selector__state-selection {
1333 margin-right: auto;
1334 margin-left: auto;
1335 border-radius: 11px;
1336 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
1337 width: 22px;
1338 min-width: 22px;
1339 height: 22px;
1340 min-height: 22px;
1341 line-height: 20px;
1342 padding: 2px;
1343 }
1344 .block-library-colors-selector .block-library-colors-selector__state-selection > svg {
1345 min-width: auto !important;
1346 }
1347 .block-library-colors-selector .block-library-colors-selector__state-selection.has-text-color > svg,
1348 .block-library-colors-selector .block-library-colors-selector__state-selection.has-text-color > svg path {
1349 color: inherit;
1350 }
1351
1352 .block-library-colors-selector__popover .color-palette-controller-container {
1353 padding: 16px;
1354 }
1355 .block-library-colors-selector__popover .components-base-control__label {
1356 height: 20px;
1357 line-height: 20px;
1358 }
1359 .block-library-colors-selector__popover .component-color-indicator {
1360 float: left;
1361 margin-top: 2px;
1362 }
1363 .block-library-colors-selector__popover .components-panel__body-title {
1364 display: none;
1365 }
1366
1367 .wp-block-navigation .wp-block + .block-list-appender .block-editor-button-block-appender {
1368 background-color: #1e1e1e;
1369 color: #fff;
1370 height: 24px;
1371 }
1372 .wp-block-navigation .wp-block + .block-list-appender .block-editor-button-block-appender.block-editor-button-block-appender.block-editor-button-block-appender {
1373 padding: 0;
1374 }
1375
1376 .wp-block-navigation .wp-block .wp-block .block-editor-button-block-appender {
1377 background-color: transparent;
1378 color: #1e1e1e;
1379 }
1380
1381 /**
1382 * Setup state
1383 */
1384 @keyframes loadingpulse {
1385 0% {
1386 opacity: 1;
1387 }
1388 50% {
1389 opacity: 0.5;
1390 }
1391 100% {
1392 opacity: 1;
1393 }
1394 }
1395 .components-placeholder.wp-block-navigation-placeholder {
1396 outline: none;
1397 padding: 0;
1398 box-shadow: none;
1399 background: none;
1400 min-height: 0;
1401 }
1402 .components-placeholder.wp-block-navigation-placeholder .components-placeholder__fieldset {
1403 font-size: inherit;
1404 }
1405 .components-placeholder.wp-block-navigation-placeholder .components-placeholder__fieldset .components-button {
1406 margin-bottom: 0;
1407 }
1408 .components-placeholder.wp-block-navigation-placeholder {
1409 color: inherit;
1410 }
1411 .wp-block-navigation.is-selected .components-placeholder.wp-block-navigation-placeholder {
1412 color: #1e1e1e;
1413 }
1414
1415 .wp-block-navigation-placeholder__preview {
1416 display: flex;
1417 align-items: center;
1418 min-width: 96px;
1419 font-size: 13px;
1420 font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1421 }
1422 .wp-block-navigation.is-selected .wp-block-navigation-placeholder__preview {
1423 display: none;
1424 }
1425 .wp-block-navigation-placeholder__preview {
1426 color: currentColor;
1427 background: transparent;
1428 }
1429 .wp-block-navigation-placeholder__preview::before {
1430 content: "";
1431 display: block;
1432 position: absolute;
1433 top: 0;
1434 left: 0;
1435 bottom: 0;
1436 right: 0;
1437 pointer-events: none;
1438 border: 1px dashed currentColor;
1439 border-radius: inherit;
1440 }
1441 .wp-block-navigation-placeholder__preview > svg {
1442 fill: currentColor;
1443 }
1444
1445 .wp-block-navigation.is-vertical .is-small .components-placeholder__fieldset,
1446 .wp-block-navigation.is-vertical .is-medium .components-placeholder__fieldset {
1447 min-height: 90px;
1448 }
1449
1450 .wp-block-navigation.is-vertical .is-large .components-placeholder__fieldset {
1451 min-height: 132px;
1452 }
1453
1454 .wp-block-navigation-placeholder__preview,
1455 .wp-block-navigation-placeholder__controls {
1456 padding: 6px 8px;
1457 flex-direction: row;
1458 align-items: flex-start;
1459 }
1460
1461 .wp-block-navigation-placeholder__controls {
1462 border-radius: 2px;
1463 background-color: #fff;
1464 box-shadow: inset 0 0 0 1px #1e1e1e;
1465 display: none;
1466 position: relative;
1467 z-index: 1;
1468 }
1469 .wp-block-navigation.is-selected .wp-block-navigation-placeholder__controls {
1470 display: flex;
1471 }
1472 .wp-block-navigation-placeholder__controls {
1473 float: right;
1474 width: 100%;
1475 }
1476 .is-small .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions__indicator,
1477 .is-small .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions__indicator + hr, .is-medium .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions__indicator,
1478 .is-medium .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions__indicator + hr {
1479 display: none;
1480 }
1481 .is-small .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions, .wp-block-navigation.is-vertical .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions {
1482 flex-direction: column;
1483 align-items: flex-start;
1484 }
1485 .is-small .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions hr, .wp-block-navigation.is-vertical .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__actions hr {
1486 display: none;
1487 }
1488 .wp-block-navigation-placeholder__controls .wp-block-navigation-placeholder__icon {
1489 margin-left: 12px;
1490 height: 36px;
1491 }
1492
1493 .wp-block-navigation-placeholder__actions__indicator {
1494 display: flex;
1495 padding: 0 0 0 6px;
1496 align-items: center;
1497 justify-content: flex-start;
1498 line-height: 0;
1499 height: 36px;
1500 margin-right: 4px;
1501 }
1502 .wp-block-navigation-placeholder__actions__indicator svg {
1503 margin-left: 4px;
1504 fill: currentColor;
1505 }
1506
1507 .wp-block-navigation .components-placeholder.is-medium .components-placeholder__fieldset {
1508 flex-direction: row !important;
1509 }
1510
1511 .wp-block-navigation-placeholder__actions {
1512 display: flex;
1513 font-size: 13px;
1514 font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1515 gap: 6px;
1516 align-items: center;
1517 }
1518 .wp-block-navigation-placeholder__actions .components-dropdown,
1519 .wp-block-navigation-placeholder__actions > .components-button {
1520 margin-left: 0;
1521 }
1522 .wp-block-navigation-placeholder__actions {
1523 height: 100%;
1524 }
1525 .wp-block-navigation-placeholder__actions.wp-block-navigation-placeholder__actions hr {
1526 border: 0;
1527 min-height: 1px;
1528 min-width: 1px;
1529 background-color: #1e1e1e;
1530 margin: auto 0;
1531 height: 100%;
1532 max-height: 16px;
1533 }
1534
1535 /**
1536 * Mobile menu.
1537 */
1538 @media (min-width: 600px) {
1539 .wp-block-navigation__responsive-container:not(.is-menu-open) .components-button.wp-block-navigation__responsive-container-close {
1540 display: none;
1541 }
1542 }
1543
1544 .wp-block-navigation__responsive-container.is-menu-open {
1545 position: fixed;
1546 top: 159px;
1547 }
1548 @media (min-width: 782px) {
1549 .wp-block-navigation__responsive-container.is-menu-open {
1550 top: 97px;
1551 }
1552 }
1553 @media (min-width: 782px) {
1554 .wp-block-navigation__responsive-container.is-menu-open {
1555 right: 36px;
1556 }
1557 }
1558 @media (min-width: 960px) {
1559 .wp-block-navigation__responsive-container.is-menu-open {
1560 right: 160px;
1561 }
1562 }
1563
1564 .is-mobile-preview .wp-block-navigation__responsive-container.is-menu-open,
1565 .is-tablet-preview .wp-block-navigation__responsive-container.is-menu-open {
1566 top: 145px;
1567 }
1568
1569 .is-fullscreen-mode .wp-block-navigation__responsive-container.is-menu-open {
1570 right: 0;
1571 top: 159px;
1572 }
1573 @media (min-width: 782px) {
1574 .is-fullscreen-mode .wp-block-navigation__responsive-container.is-menu-open {
1575 top: 65px;
1576 }
1577 }
1578 .is-fullscreen-mode .is-mobile-preview .wp-block-navigation__responsive-container.is-menu-open,
1579 .is-fullscreen-mode .is-tablet-preview .wp-block-navigation__responsive-container.is-menu-open {
1580 top: 113px;
1581 }
1582
1583 body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-open {
1584 top: 0;
1585 left: 0;
1586 bottom: 0;
1587 right: 0;
1588 }
1589
1590 .components-button.wp-block-navigation__responsive-container-open.wp-block-navigation__responsive-container-open,
1591 .components-button.wp-block-navigation__responsive-container-close.wp-block-navigation__responsive-container-close {
1592 padding: 0;
1593 height: auto;
1594 color: inherit;
1595 }
1596
1597 .components-heading.wp-block-navigation-off-canvas-editor__title {
1598 margin: 0;
1599 }
1600
1601 .wp-block-navigation-off-canvas-editor__header {
1602 margin-bottom: 8px;
1603 }
1604
1605 .is-menu-open .wp-block-navigation__responsive-container-content * .block-list-appender {
1606 margin-top: 16px;
1607 }
1608
1609 @keyframes fadein {
1610 0% {
1611 opacity: 0;
1612 }
1613 100% {
1614 opacity: 1;
1615 }
1616 }
1617 .wp-block-navigation__loading-indicator-container {
1618 padding: 8px 12px;
1619 }
1620
1621 .wp-block-navigation .wp-block-navigation__uncontrolled-inner-blocks-loading-indicator {
1622 margin-top: 0;
1623 }
1624
1625 @keyframes fadeouthalf {
1626 0% {
1627 opacity: 1;
1628 }
1629 100% {
1630 opacity: 0.5;
1631 }
1632 }
1633 .wp-block-navigation-delete-menu-button {
1634 width: 100%;
1635 justify-content: center;
1636 margin-bottom: 16px;
1637 }
1638
1639 .components-button.is-link.wp-block-navigation-manage-menus-button {
1640 margin-bottom: 16px;
1641 }
1642
1643 .wp-block-navigation__overlay-menu-preview {
1644 display: flex;
1645 align-items: center;
1646 justify-content: space-between;
1647 width: 100%;
1648 background-color: #f0f0f0;
1649 padding: 0 24px;
1650 height: 64px !important;
1651 grid-column: span 2;
1652 }
1653 .wp-block-navigation__overlay-menu-preview.open {
1654 border-color: #e0e0e0;
1655 background-color: #fff;
1656 }
1657
1658 .wp-block-navigation__toolbar-menu-selector.components-toolbar-group:empty {
1659 display: none;
1660 }
1661
1662 .wp-block-navigation-placeholder__actions hr + hr {
1663 display: none;
1664 }
1665
1666 /**
1667 * Navigation selector styles
1668 */
1669 .wp-block-navigation__navigation-selector {
1670 margin-bottom: 16px;
1671 width: 100%;
1672 }
1673
1674 .wp-block-navigation__navigation-selector-button {
1675 border: 1px solid;
1676 justify-content: space-between;
1677 width: 100%;
1678 }
1679
1680 .wp-block-navigation__navigation-selector-button__icon {
1681 flex: 0 0 auto;
1682 }
1683
1684 .wp-block-navigation__navigation-selector-button__label {
1685 flex: 0 1 auto;
1686 overflow: hidden;
1687 text-overflow: ellipsis;
1688 white-space: nowrap;
1689 }
1690
1691 .wp-block-navigation__navigation-selector-button--createnew {
1692 border: 1px solid;
1693 margin-bottom: 16px;
1694 width: 100%;
1695 }
1696
1697 .wp-block-navigation__responsive-container-open.components-button {
1698 opacity: 1;
1699 }
1700
1701 .wp-block-navigation__menu-inspector-controls__empty-message {
1702 margin-right: 24px;
1703 }
1704
1705 .editor-sidebar__panel .wp-block-navigation__submenu-header {
1706 margin-top: 0;
1707 margin-bottom: 0;
1708 }
1709
1710 .wp-block-navigation__submenu-accessibility-notice {
1711 grid-column: span 2;
1712 }
1713
1714 .wp-block-navigation__overlay-selector {
1715 position: relative;
1716 }
1717
1718 .wp-block-navigation__overlay-selector-controls {
1719 margin-bottom: 8px;
1720 }
1721
1722 .wp-block-navigation__overlay-create-button {
1723 position: absolute;
1724 top: -4px;
1725 left: 0;
1726 z-index: 1;
1727 }
1728
1729 .wp-block-navigation__overlay-preview {
1730 border: 1px solid #ddd;
1731 border-radius: 2px;
1732 overflow-y: auto;
1733 max-height: 200px;
1734 background: #fff;
1735 }
1736
1737 .wp-block-navigation__overlay-preview-loading {
1738 display: flex;
1739 align-items: center;
1740 justify-content: center;
1741 min-height: 200px;
1742 background: #f0f0f0;
1743 }
1744
1745 .wp-block-navigation__overlay-preview-empty {
1746 display: flex;
1747 align-items: center;
1748 justify-content: center;
1749 min-height: 200px;
1750 padding: 16px;
1751 text-align: center;
1752 color: #757575;
1753 background: #f0f0f0;
1754 font-style: italic;
1755 }
1756
1757 .wp-block-navigation__overlay-preview-placeholder {
1758 width: 100%;
1759 height: 200px;
1760 background: #f0f0f0;
1761 animation: wp-block-navigation-overlay-preview-pulse 1.5s ease-in-out infinite;
1762 }
1763
1764 @keyframes wp-block-navigation-overlay-preview-pulse {
1765 0%, 100% {
1766 opacity: 1;
1767 }
1768 50% {
1769 opacity: 0.5;
1770 }
1771 }
1772 .wp-block-navigation__deleted-overlay-warning {
1773 margin-top: 12px;
1774 }
1775
1776 .wp-block-navigation__overlay-create-button-prominent {
1777 width: 100%;
1778 justify-content: center;
1779 margin-bottom: 8px;
1780 }
1781
1782 .wp-block-navigation__overlay-help-text-wrapper {
1783 margin-top: 8px;
1784 }
1785
1786 /**
1787 * Appender
1788 */
1789 .wp-block-navigation .block-list-appender {
1790 position: relative;
1791 }
1792
1793 /**
1794 * Submenus.
1795 */
1796 .wp-block-navigation .has-child {
1797 cursor: pointer;
1798 }
1799 .wp-block-navigation .has-child .wp-block-navigation__submenu-container {
1800 z-index: 28;
1801 }
1802 .wp-block-navigation .has-child:hover .wp-block-navigation__submenu-container {
1803 z-index: 29;
1804 }
1805 .wp-block-navigation .has-child.is-selected > .wp-block-navigation__submenu-container, .wp-block-navigation .has-child.has-child-selected > .wp-block-navigation__submenu-container {
1806 visibility: visible !important;
1807 opacity: 1 !important;
1808 min-width: 200px !important;
1809 height: auto !important;
1810 width: auto !important;
1811 overflow: visible !important;
1812 }
1813
1814 /**
1815 * Navigation Items.
1816 */
1817 .wp-block-navigation-item .wp-block-navigation-item__content {
1818 cursor: text;
1819 }
1820 .wp-block-navigation-item.is-editing, .wp-block-navigation-item.is-selected {
1821 min-width: 20px;
1822 }
1823 .wp-block-navigation-item .block-list-appender {
1824 margin-top: 16px;
1825 margin-left: auto;
1826 margin-bottom: 16px;
1827 margin-right: 16px;
1828 }
1829
1830 .wp-block-navigation-link__invalid-item {
1831 color: #000;
1832 }
1833
1834 /**
1835 * Menu item setup state. Is shown when a menu item has no URL configured.
1836 */
1837 .wp-block-navigation-link__placeholder {
1838 position: relative;
1839 text-decoration: none !important;
1840 box-shadow: none !important;
1841 background-image: none !important;
1842 }
1843 .wp-block-navigation-link__placeholder .wp-block-navigation-link__placeholder-text span {
1844 -webkit-text-decoration: wavy underline;
1845 text-decoration: wavy underline;
1846 -webkit-text-decoration-skip-ink: none;
1847 text-decoration-skip-ink: none;
1848 text-underline-offset: 0.25rem;
1849 }
1850 .wp-block-navigation-link__placeholder.wp-block-navigation-item__content {
1851 cursor: pointer;
1852 }
1853
1854 /**
1855 * Link Control Transforms
1856 */
1857 .link-control-transform {
1858 border-top: 1px solid #ccc;
1859 padding: 0 16px 8px 16px;
1860 }
1861
1862 .link-control-transform__subheading {
1863 font-size: 11px;
1864 text-transform: uppercase;
1865 font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1866 color: #1e1e1e;
1867 margin-bottom: 1.5em;
1868 }
1869
1870 .link-control-transform__items {
1871 display: flex;
1872 justify-content: space-between;
1873 }
1874
1875 .link-control-transform__item {
1876 flex-basis: 33%;
1877 flex-direction: column;
1878 gap: 8px;
1879 height: auto;
1880 }
1881
1882 .link-ui-page-creator {
1883 max-width: 350px;
1884 min-width: auto;
1885 width: 90vw;
1886 padding-top: 8px;
1887 }
1888 .link-ui-page-creator__inner {
1889 padding: 16px;
1890 }
1891 .link-ui-page-creator__back {
1892 margin-right: 8px;
1893 text-transform: uppercase;
1894 }
1895
1896 /**
1897 * Error text styling for missing entity help text.
1898 */
1899 .navigation-link-control__error-text {
1900 color: #cc1818;
1901 }
1902
1903 .navigation-link-to__action-button {
1904 grid-column: auto;
1905 }
1906 .navigation-link-to__action-button:nth-last-child(1 of .navigation-link-to__action-button):nth-child(odd of .navigation-link-to__action-button) {
1907 grid-column: 1/-1;
1908 }
1909 .navigation-link-to__action-button.navigation-link-to__action-button.navigation-link-to__action-button {
1910 justify-content: center;
1911 }
1912
1913 .wp-block-navigation-submenu {
1914 display: block;
1915 }
1916 .wp-block-navigation-submenu .wp-block-navigation__submenu-container {
1917 z-index: 28;
1918 }
1919 .wp-block-navigation-submenu.is-selected > .wp-block-navigation__submenu-container, .wp-block-navigation-submenu.has-child-selected > .wp-block-navigation__submenu-container {
1920 visibility: visible !important;
1921 opacity: 1 !important;
1922 min-width: 200px !important;
1923 height: auto !important;
1924 width: auto !important;
1925 position: absolute;
1926 right: -1px;
1927 top: 100%;
1928 }
1929 @media (min-width: 782px) {
1930 .wp-block-navigation-submenu.is-selected > .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container, .wp-block-navigation-submenu.has-child-selected > .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container {
1931 right: 100%;
1932 top: -1px;
1933 }
1934 .wp-block-navigation-submenu.is-selected > .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container::before, .wp-block-navigation-submenu.has-child-selected > .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container::before {
1935 content: "";
1936 position: absolute;
1937 left: 100%;
1938 height: 100%;
1939 display: block;
1940 width: 0.5em;
1941 background: transparent;
1942 }
1943 }
1944
1945 .block-editor-block-list__block[data-type="core/nextpage"] {
1946 max-width: 100%;
1947 text-align: center;
1948 margin-top: 28px;
1949 margin-bottom: 28px;
1950 }
1951
1952 .wp-block-nextpage {
1953 display: block;
1954 text-align: center;
1955 white-space: nowrap;
1956 }
1957 .wp-block-nextpage > span {
1958 font-size: 13px;
1959 position: relative;
1960 text-transform: uppercase;
1961 font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1962 font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1963 color: #757575;
1964 border-radius: 4px;
1965 background: #fff;
1966 padding: 6px 8px;
1967 height: 24px;
1968 }
1969 .wp-block-nextpage::before {
1970 content: "";
1971 position: absolute;
1972 top: 50%;
1973 right: 0;
1974 left: 0;
1975 border-top: 3px dashed #ccc;
1976 }
1977
1978 .wp-block-navigation.items-justified-space-between .wp-block-page-list > div,
1979 .wp-block-navigation.items-justified-space-between .wp-block-page-list {
1980 display: contents;
1981 flex: 1;
1982 }
1983 .wp-block-navigation.items-justified-space-between.has-child-selected .wp-block-page-list > div, .wp-block-navigation.items-justified-space-between.has-child-selected .wp-block-page-list, .wp-block-navigation.items-justified-space-between.is-selected .wp-block-page-list > div, .wp-block-navigation.items-justified-space-between.is-selected .wp-block-page-list {
1984 flex: inherit;
1985 }
1986
1987 .wp-block-navigation .wp-block-navigation__submenu-container > .wp-block-page-list {
1988 display: block;
1989 }
1990
1991 .wp-block-pages-list__item__link {
1992 pointer-events: none;
1993 }
1994
1995 @media (min-width: 600px) {
1996 .wp-block-page-list-modal {
1997 max-width: 480px;
1998 }
1999 }
2000
2001 .wp-block-page-list-modal-buttons {
2002 display: flex;
2003 justify-content: flex-end;
2004 gap: 12px;
2005 }
2006
2007 .wp-block-page-list .open-on-click:focus-within > .wp-block-navigation__submenu-container {
2008 visibility: visible;
2009 opacity: 1;
2010 width: auto;
2011 height: auto;
2012 min-width: 200px;
2013 }
2014
2015 .wp-block-page-list__loading-indicator-container {
2016 padding: 8px 12px;
2017 }
2018
2019 .block-editor-block-list__block[data-type="core/paragraph"].has-drop-cap:focus {
2020 min-height: auto !important;
2021 }
2022
2023 .block-editor-block-list__block[data-empty=true] [data-rich-text-placeholder] {
2024 opacity: 1;
2025 }
2026
2027 .block-editor-block-list__block[data-empty=true] + .block-editor-block-list__block[data-empty=true]:not([data-custom-placeholder=true]) [data-rich-text-placeholder] {
2028 opacity: 0;
2029 }
2030
2031 .block-editor-block-list__block[data-type="core/paragraph"].has-text-align-right[style*="writing-mode: vertical-rl"],
2032 .block-editor-block-list__block[data-type="core/paragraph"].has-text-align-left[style*="writing-mode: vertical-lr"] {
2033 rotate: 180deg;
2034 }
2035
2036 .is-zoomed-out .block-editor-block-list__block[data-empty=true] [data-rich-text-placeholder] {
2037 opacity: 0;
2038 }
2039
2040 html[dir=rtl] .has-drop-cap:not(:focus)::first-letter {
2041 float: initial;
2042 margin-right: 0.1em;
2043 }
2044
2045 .wp-block-post-author__transform {
2046 background: #f0f0f0;
2047 border-radius: 2px;
2048 margin: 16px;
2049 padding: 16px;
2050 }
2051
2052 .wp-block-playlist__waveform-color-controls {
2053 display: grid;
2054 grid-column: 1/-1;
2055 row-gap: 0;
2056 }
2057
2058 .wp-block-post-excerpt .wp-block-post-excerpt__excerpt.is-inline {
2059 display: inline;
2060 }
2061
2062 .wp-block-pullquote.is-style-solid-color blockquote p {
2063 font-size: 32px;
2064 }
2065 .wp-block-pullquote.is-style-solid-color .wp-block-pullquote__citation {
2066 text-transform: none;
2067 font-style: normal;
2068 }
2069
2070 .wp-block-pullquote__citation {
2071 color: inherit;
2072 }
2073
2074 .wp-block-rss li a > div {
2075 display: inline;
2076 }
2077
2078 .wp-block-rss__placeholder-form .wp-block-rss__placeholder-input {
2079 flex: 1 1 auto;
2080 }
2081
2082 .wp-block-rss .wp-block-rss {
2083 all: inherit;
2084 margin: 0;
2085 padding: 0;
2086 }
2087
2088 .wp-block[data-align=center] .wp-block-search .wp-block-search__inside-wrapper {
2089 margin: auto;
2090 }
2091
2092 .wp-block-search :where(.wp-block-search__button) {
2093 height: auto;
2094 border-radius: initial;
2095 display: flex;
2096 align-items: center;
2097 justify-content: center;
2098 text-align: center;
2099 }
2100
2101 .wp-block-search__inspector-controls .components-base-control {
2102 margin-bottom: 0;
2103 }
2104
2105 .block-editor-block-list__block[data-type="core/separator"] {
2106 padding-top: 0.1px;
2107 padding-bottom: 0.1px;
2108 }
2109
2110 .blocks-shortcode__textarea {
2111 box-sizing: border-box;
2112 max-height: 250px;
2113 resize: none;
2114 font-family: Menlo, Consolas, monaco, monospace !important;
2115 color: #1e1e1e !important;
2116 background: #fff !important;
2117 padding: 12px !important;
2118 border: 1px solid #1e1e1e !important;
2119 box-shadow: none !important;
2120 border-radius: 2px !important;
2121 font-size: 16px !important;
2122 }
2123 @media (min-width: 600px) {
2124 .blocks-shortcode__textarea {
2125 font-size: 13px !important;
2126 }
2127 }
2128 .blocks-shortcode__textarea:focus {
2129 border-color: var(--wp-admin-theme-color) !important;
2130 box-shadow: 0 0 0 1px var(--wp-admin-theme-color) !important;
2131 outline: 2px solid transparent !important;
2132 }
2133
2134 .wp-block[data-align=center] > .wp-block-site-logo,
2135 .wp-block-site-logo.aligncenter > div {
2136 display: table;
2137 margin-right: auto;
2138 margin-left: auto;
2139 }
2140
2141 .wp-block-site-logo a {
2142 pointer-events: none;
2143 }
2144 .wp-block-site-logo .custom-logo-link {
2145 cursor: inherit;
2146 }
2147 .wp-block-site-logo .custom-logo-link:focus {
2148 box-shadow: none;
2149 }
2150 .wp-block-site-logo img {
2151 display: block;
2152 height: auto;
2153 max-width: 100%;
2154 }
2155 .wp-block-site-logo.is-transient {
2156 position: relative;
2157 }
2158 .wp-block-site-logo.is-transient img {
2159 opacity: 0.3;
2160 }
2161 .wp-block-site-logo.is-transient .components-spinner {
2162 position: absolute;
2163 top: 50%;
2164 right: 50%;
2165 transform: translate(50%, -50%);
2166 margin: 0;
2167 }
2168
2169 .wp-block-site-logo.wp-block-site-logo.is-default-size .components-placeholder {
2170 height: 60px;
2171 width: 60px;
2172 }
2173 .wp-block-site-logo.wp-block-site-logo > div,
2174 .wp-block-site-logo.wp-block-site-logo .components-resizable-box__container {
2175 border-radius: inherit;
2176 }
2177 .wp-block-site-logo.wp-block-site-logo .components-placeholder {
2178 display: flex;
2179 justify-content: center;
2180 align-items: center;
2181 padding: 0;
2182 border-radius: inherit;
2183 min-height: 48px;
2184 min-width: 48px;
2185 height: 100%;
2186 width: 100%;
2187 }
2188 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-form-file-upload {
2189 display: none;
2190 }
2191 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-drop-zone__content-text {
2192 display: none;
2193 }
2194 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button {
2195 padding: 0;
2196 margin: auto;
2197 display: flex;
2198 justify-content: center;
2199 align-items: center;
2200 width: 48px;
2201 height: 48px;
2202 border-radius: 50%;
2203 position: relative;
2204 background: var(--wp-admin-theme-color);
2205 border-color: var(--wp-admin-theme-color);
2206 border-style: solid;
2207 color: #fff;
2208 }
2209 .wp-block-site-logo.wp-block-site-logo .components-placeholder .components-button.components-button > svg {
2210 color: inherit;
2211 }
2212
2213 .block-library-site-logo__inspector-media-replace-container {
2214 position: relative;
2215 }
2216 .block-library-site-logo__inspector-media-replace-container .block-library-site-logo__inspector-media-replace-title {
2217 word-break: break-all;
2218 white-space: normal;
2219 text-align: start;
2220 -moz-text-align-last: center;
2221 text-align-last: center;
2222 }
2223 .block-library-site-logo__inspector-media-replace-container img {
2224 width: 20px;
2225 min-width: 20px;
2226 aspect-ratio: 1;
2227 box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2);
2228 border-radius: 2px;
2229 }
2230 .block-library-site-logo__inspector-media-replace-container .block-library-site-logo__inspector-readonly-logo-preview {
2231 padding: 6px 12px;
2232 display: flex;
2233 height: 40px;
2234 }
2235
2236 .wp-block-site-tagline__placeholder {
2237 padding: 1em 0;
2238 border: 1px dashed;
2239 }
2240
2241 .wp-block-site-title__placeholder {
2242 padding: 1em 0;
2243 border: 1px dashed;
2244 }
2245
2246 .wp-block-social-links .wp-social-link {
2247 line-height: 0;
2248 }
2249
2250 .wp-block-social-link-anchor {
2251 align-items: center;
2252 background: none;
2253 border: 0;
2254 box-sizing: border-box;
2255 cursor: pointer;
2256 display: inline-flex;
2257 font-size: inherit;
2258 color: currentColor;
2259 height: auto;
2260 font-weight: inherit;
2261 font-family: inherit;
2262 margin: 0;
2263 opacity: 1;
2264 padding: 0.25em;
2265 }
2266 .wp-block-social-link-anchor:hover {
2267 transform: none;
2268 }
2269
2270 :root :where(.wp-block-social-links.is-style-pill-shape .wp-social-link button) {
2271 padding-right: 0.6666666667em;
2272 padding-left: 0.6666666667em;
2273 }
2274
2275 :root :where(.wp-block-social-links.is-style-logos-only .wp-social-link button) {
2276 padding: 0;
2277 }
2278
2279 .wp-block-social-link__toolbar_content_text {
2280 width: 250px;
2281 }
2282
2283 .wp-block-social-links div.block-editor-url-input {
2284 display: inline-block;
2285 margin-right: 8px;
2286 }
2287
2288 .wp-social-link:hover {
2289 transform: none;
2290 }
2291
2292 :root :where(.wp-block-social-links) {
2293 padding: 0;
2294 }
2295
2296 .wp-block[data-align=center] > .wp-block-social-links,
2297 .wp-block.wp-block-social-links.aligncenter {
2298 justify-content: center;
2299 }
2300
2301 .block-editor-block-preview__content .components-button:disabled {
2302 opacity: 1;
2303 }
2304
2305 .wp-social-link.wp-social-link__is-incomplete {
2306 opacity: 0.5;
2307 }
2308
2309 .wp-block-social-links .is-selected .wp-social-link__is-incomplete,
2310 .wp-social-link.wp-social-link__is-incomplete:hover,
2311 .wp-social-link.wp-social-link__is-incomplete:focus {
2312 opacity: 1;
2313 }
2314
2315 .wp-block-social-links .block-list-appender {
2316 position: static;
2317 }
2318 .wp-block-social-links .block-list-appender .block-editor-inserter {
2319 font-size: inherit;
2320 }
2321 .wp-block-social-links .block-list-appender .block-editor-button-block-appender {
2322 height: 1.5em;
2323 width: 1.5em;
2324 font-size: inherit;
2325 padding: 0;
2326 }
2327
2328 .block-editor-block-list__block[data-type="core/spacer"]::before {
2329 content: "";
2330 display: block;
2331 position: absolute;
2332 z-index: 1;
2333 width: 100%;
2334 min-height: 8px;
2335 min-width: 8px;
2336 height: 100%;
2337 }
2338
2339 .wp-block-spacer.is-hovered .block-library-spacer__resize-container,
2340 .block-library-spacer__resize-container.has-show-handle,
2341 .wp-block-spacer.is-selected.custom-sizes-disabled {
2342 background: rgba(0, 0, 0, 0.1);
2343 }
2344 .is-dark-theme .wp-block-spacer.is-hovered .block-library-spacer__resize-container,
2345 .is-dark-theme .block-library-spacer__resize-container.has-show-handle,
2346 .is-dark-theme .wp-block-spacer.is-selected.custom-sizes-disabled {
2347 background: rgba(255, 255, 255, 0.15);
2348 }
2349
2350 .block-library-spacer__resize-container {
2351 clear: both;
2352 }
2353 .block-library-spacer__resize-container:not(.is-resizing) {
2354 height: 100% !important;
2355 width: 100% !important;
2356 }
2357 .block-library-spacer__resize-container .components-resizable-box__handle::before {
2358 content: none;
2359 }
2360 .block-library-spacer__resize-container.resize-horizontal {
2361 margin-bottom: 0;
2362 height: 100% !important;
2363 }
2364
2365 @media (min-width: 600px) {
2366 .wp-block-tab-list__mover-button {
2367 width: 24px;
2368 min-width: 0 !important;
2369 }
2370 }
2371
2372 .wp-block[data-align=left] > .wp-block-table, .wp-block[data-align=right] > .wp-block-table, .wp-block[data-align=center] > .wp-block-table {
2373 height: auto;
2374 }
2375 .wp-block[data-align=left] > .wp-block-table table, .wp-block[data-align=right] > .wp-block-table table, .wp-block[data-align=center] > .wp-block-table table {
2376 width: auto;
2377 }
2378 .wp-block[data-align=left] > .wp-block-table td,
2379 .wp-block[data-align=left] > .wp-block-table th, .wp-block[data-align=right] > .wp-block-table td,
2380 .wp-block[data-align=right] > .wp-block-table th, .wp-block[data-align=center] > .wp-block-table td,
2381 .wp-block[data-align=center] > .wp-block-table th {
2382 word-break: break-word;
2383 }
2384 .wp-block[data-align=center] > .wp-block-table {
2385 text-align: initial;
2386 }
2387 .wp-block[data-align=center] > .wp-block-table table {
2388 margin: 0 auto;
2389 }
2390 .wp-block-table td,
2391 .wp-block-table th {
2392 border: 1px solid;
2393 padding: 0.5em;
2394 }
2395 .wp-block-table td.is-selected,
2396 .wp-block-table th.is-selected {
2397 border-color: var(--wp-admin-theme-color);
2398 box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color);
2399 border-style: double;
2400 }
2401 .wp-block-table table.has-individual-borders > *,
2402 .wp-block-table table.has-individual-borders tr,
2403 .wp-block-table table.has-individual-borders th,
2404 .wp-block-table table.has-individual-borders td {
2405 border-width: 1px;
2406 border-style: solid;
2407 border-color: currentColor;
2408 }
2409
2410 .blocks-table__placeholder-form.blocks-table__placeholder-form {
2411 display: flex;
2412 flex-direction: column;
2413 align-items: flex-start;
2414 gap: 8px;
2415 }
2416 @media (min-width: 782px) {
2417 .blocks-table__placeholder-form.blocks-table__placeholder-form {
2418 flex-direction: row;
2419 align-items: flex-end;
2420 }
2421 }
2422
2423 .blocks-table__placeholder-input {
2424 width: 112px;
2425 }
2426
2427 .block-editor-template-part__selection-modal {
2428 z-index: 1000001;
2429 }
2430 .block-editor-template-part__selection-modal .block-editor-block-patterns-list {
2431 -moz-column-count: 2;
2432 column-count: 2;
2433 -moz-column-gap: 24px;
2434 column-gap: 24px;
2435 }
2436 @media (min-width: 1280px) {
2437 .block-editor-template-part__selection-modal .block-editor-block-patterns-list {
2438 -moz-column-count: 3;
2439 column-count: 3;
2440 }
2441 }
2442 .block-editor-template-part__selection-modal .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
2443 -moz-column-break-inside: avoid;
2444 break-inside: avoid-column;
2445 }
2446
2447 .block-library-template-part__selection-search {
2448 background: #fff;
2449 position: sticky;
2450 top: 0;
2451 padding: 16px 0;
2452 z-index: 2;
2453 }
2454
2455 .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.is-highlighted::after, .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.is-selected::after,
2456 .block-editor-block-list__block:not(.remove-outline).is-reusable.is-highlighted::after,
2457 .block-editor-block-list__block:not(.remove-outline).is-reusable.is-selected::after {
2458 outline-color: var(--wp-block-synced-color);
2459 }
2460 .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.block-editor-block-list__block:not([contenteditable]):focus::after,
2461 .block-editor-block-list__block:not(.remove-outline).is-reusable.block-editor-block-list__block:not([contenteditable]):focus::after {
2462 outline-color: var(--wp-block-synced-color);
2463 }
2464
2465 .is-outline-mode .block-editor-block-list__block:not(.remove-outline).wp-block-template-part.has-editable-outline::after {
2466 border: none;
2467 }
2468
2469 .wp-block-term-template .term-loading .term-loading-placeholder {
2470 width: 100%;
2471 height: 1.5em;
2472 margin-bottom: 0.25em;
2473 background-color: #f0f0f0;
2474 border-radius: 2px;
2475 }
2476 @media not (prefers-reduced-motion) {
2477 .wp-block-term-template .term-loading .term-loading-placeholder {
2478 animation: loadingpulse 1.5s ease-in-out infinite;
2479 }
2480 }
2481
2482 @keyframes loadingpulse {
2483 0% {
2484 opacity: 1;
2485 }
2486 50% {
2487 opacity: 0.5;
2488 }
2489 100% {
2490 opacity: 1;
2491 }
2492 }
2493 .wp-block-text-columns .block-editor-rich-text__editable:focus {
2494 outline: 1px solid #ddd;
2495 }
2496
2497 .wp-block[data-align=center] > .wp-block-video {
2498 text-align: center;
2499 }
2500
2501 .wp-block-video {
2502 position: relative;
2503 }
2504 .wp-block-video.is-transient video {
2505 opacity: 0.3;
2506 }
2507 .wp-block-video .components-spinner {
2508 position: absolute;
2509 top: 50%;
2510 right: 50%;
2511 margin-top: -9px;
2512 margin-right: -9px;
2513 }
2514
2515 .block-library-video-tracks-editor {
2516 z-index: 159990;
2517 }
2518
2519 .modal-open .block-library-video-tracks-editor {
2520 z-index: 99999;
2521 }
2522
2523 .block-library-video-tracks-editor__track-list-track {
2524 padding-right: 12px;
2525 }
2526
2527 .block-library-video-tracks-editor__single-track-editor-kind-select {
2528 max-width: 240px;
2529 }
2530
2531 .block-library-video-tracks-editor__tracks-informative-message-title,
2532 .block-library-video-tracks-editor__single-track-editor-edit-track-label {
2533 margin-top: 4px;
2534 color: #757575;
2535 text-transform: uppercase;
2536 font-size: 11px;
2537 font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2538 display: block;
2539 }
2540
2541 .block-library-video-tracks-editor > .components-popover__content {
2542 width: 360px;
2543 }
2544
2545 .block-library-video-tracks-editor__track-list .components-menu-group__label,
2546 .block-library-video-tracks-editor__add-tracks-container .components-menu-group__label {
2547 padding: 0;
2548 }
2549
2550 .block-library-video-tracks-editor__tracks-informative-message {
2551 padding: 8px;
2552 }
2553 .block-library-video-tracks-editor__tracks-informative-message-description {
2554 margin-bottom: 0;
2555 }
2556
2557 .block-library-query-pattern__selection-modal .block-editor-block-patterns-list {
2558 -moz-column-count: 2;
2559 column-count: 2;
2560 -moz-column-gap: 24px;
2561 column-gap: 24px;
2562 }
2563 @media (min-width: 1280px) {
2564 .block-library-query-pattern__selection-modal .block-editor-block-patterns-list {
2565 -moz-column-count: 3;
2566 column-count: 3;
2567 }
2568 }
2569 .block-library-query-pattern__selection-modal .block-editor-block-patterns-list .block-editor-block-patterns-list__list-item {
2570 -moz-column-break-inside: avoid;
2571 break-inside: avoid-column;
2572 }
2573 .block-library-query-pattern__selection-modal .block-library-query-pattern__selection-search {
2574 background: #fff;
2575 position: sticky;
2576 top: 0;
2577 padding: 16px 0;
2578 transform: translateY(-4px);
2579 margin-bottom: -4px;
2580 z-index: 2;
2581 }
2582
2583 @media (min-width: 600px) {
2584 .wp-block-query__enhanced-pagination-modal {
2585 max-width: 480px;
2586 }
2587 }
2588
2589 .block-editor-block-settings-menu__popover.is-expanded {
2590 overflow-y: scroll;
2591 }
2592 .block-editor-block-settings-menu__popover .block-library-query-pattern__selection-content {
2593 height: 100%;
2594 }
2595 .block-editor-block-settings-menu__popover .block-editor-block-patterns-list {
2596 display: grid;
2597 grid-template-columns: 1fr;
2598 }
2599 @media (min-width: 600px) {
2600 .block-editor-block-settings-menu__popover .block-editor-block-patterns-list {
2601 grid-template-columns: 1fr 1fr;
2602 }
2603 }
2604 .block-editor-block-settings-menu__popover .block-editor-block-patterns-list {
2605 grid-gap: 12px;
2606 min-width: 280px;
2607 }
2608 @media (min-width: 600px) {
2609 .block-editor-block-settings-menu__popover .block-editor-block-patterns-list {
2610 min-width: 480px;
2611 }
2612 }
2613 .block-editor-block-settings-menu__popover .block-editor-block-patterns-list__list-item {
2614 margin-bottom: 0;
2615 }
2616
2617 .wp-block-query > .block-editor-media-placeholder.is-small {
2618 min-height: 60px;
2619 }
2620
2621 .wp-block[data-align=center] > .wp-block-query-pagination {
2622 justify-content: center;
2623 }
2624
2625 :where(.editor-styles-wrapper) .wp-block-query-pagination {
2626 max-width: 100%;
2627 }
2628 :where(.editor-styles-wrapper) .wp-block-query-pagination.block-editor-block-list__layout {
2629 margin: 0;
2630 }
2631
2632 .wp-block-query-pagination-numbers a {
2633 text-decoration: underline;
2634 }
2635 .wp-block-query-pagination-numbers .page-numbers {
2636 margin-left: 2px;
2637 }
2638 .wp-block-query-pagination-numbers .page-numbers:last-child {
2639 margin-right: 0;
2640 }
2641
2642 .wp-block-post-featured-image .block-editor-media-placeholder {
2643 z-index: 1;
2644 backdrop-filter: none;
2645 }
2646 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder,
2647 .wp-block-post-featured-image .components-placeholder {
2648 justify-content: center;
2649 align-items: center;
2650 padding: 0;
2651 display: flex;
2652 }
2653 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-form-file-upload,
2654 .wp-block-post-featured-image .components-placeholder .components-form-file-upload {
2655 display: none;
2656 }
2657 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-button,
2658 .wp-block-post-featured-image .components-placeholder .components-button {
2659 margin: auto;
2660 padding: 0;
2661 display: flex;
2662 justify-content: center;
2663 align-items: center;
2664 width: 48px;
2665 height: 48px;
2666 border-radius: 50%;
2667 position: relative;
2668 background: var(--wp-admin-theme-color);
2669 border-color: var(--wp-admin-theme-color);
2670 border-style: solid;
2671 color: #fff;
2672 }
2673 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder .components-button > svg,
2674 .wp-block-post-featured-image .components-placeholder .components-button > svg {
2675 color: inherit;
2676 }
2677 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder,
2678 .wp-block-post-featured-image .components-placeholder {
2679 min-height: 200px;
2680 }
2681 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where(.has-border-color),
2682 .wp-block-post-featured-image .components-placeholder:where(.has-border-color),
2683 .wp-block-post-featured-image img:where(.has-border-color) {
2684 border-style: solid;
2685 }
2686 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-top-color]),
2687 .wp-block-post-featured-image .components-placeholder:where([style*=border-top-color]),
2688 .wp-block-post-featured-image img:where([style*=border-top-color]) {
2689 border-top-style: solid;
2690 }
2691 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-right-color]),
2692 .wp-block-post-featured-image .components-placeholder:where([style*=border-right-color]),
2693 .wp-block-post-featured-image img:where([style*=border-right-color]) {
2694 border-left-style: solid;
2695 }
2696 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-bottom-color]),
2697 .wp-block-post-featured-image .components-placeholder:where([style*=border-bottom-color]),
2698 .wp-block-post-featured-image img:where([style*=border-bottom-color]) {
2699 border-bottom-style: solid;
2700 }
2701 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-left-color]),
2702 .wp-block-post-featured-image .components-placeholder:where([style*=border-left-color]),
2703 .wp-block-post-featured-image img:where([style*=border-left-color]) {
2704 border-right-style: solid;
2705 }
2706 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-width]),
2707 .wp-block-post-featured-image .components-placeholder:where([style*=border-width]),
2708 .wp-block-post-featured-image img:where([style*=border-width]) {
2709 border-style: solid;
2710 }
2711 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-top-width]),
2712 .wp-block-post-featured-image .components-placeholder:where([style*=border-top-width]),
2713 .wp-block-post-featured-image img:where([style*=border-top-width]) {
2714 border-top-style: solid;
2715 }
2716 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-right-width]),
2717 .wp-block-post-featured-image .components-placeholder:where([style*=border-right-width]),
2718 .wp-block-post-featured-image img:where([style*=border-right-width]) {
2719 border-left-style: solid;
2720 }
2721 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-bottom-width]),
2722 .wp-block-post-featured-image .components-placeholder:where([style*=border-bottom-width]),
2723 .wp-block-post-featured-image img:where([style*=border-bottom-width]) {
2724 border-bottom-style: solid;
2725 }
2726 .wp-block-post-featured-image .wp-block-post-featured-image__placeholder:where([style*=border-left-width]),
2727 .wp-block-post-featured-image .components-placeholder:where([style*=border-left-width]),
2728 .wp-block-post-featured-image img:where([style*=border-left-width]) {
2729 border-right-style: solid;
2730 }
2731 .wp-block-post-featured-image[style*=height] .components-placeholder {
2732 min-height: 48px;
2733 min-width: 48px;
2734 height: 100%;
2735 width: 100%;
2736 }
2737 .wp-block-post-featured-image > a {
2738 pointer-events: none;
2739 }
2740 .wp-block-post-featured-image.is-selected .components-placeholder.has-illustration .components-button,
2741 .wp-block-post-featured-image.is-selected .components-placeholder.has-illustration .components-placeholder__instructions,
2742 .wp-block-post-featured-image.is-selected .components-placeholder.has-illustration .components-placeholder__label {
2743 opacity: 1;
2744 pointer-events: auto;
2745 }
2746 .wp-block-post-featured-image.is-transient {
2747 position: relative;
2748 }
2749 .wp-block-post-featured-image.is-transient img {
2750 opacity: 0.3;
2751 }
2752 .wp-block-post-featured-image.is-transient .components-spinner {
2753 position: absolute;
2754 top: 50%;
2755 right: 50%;
2756 transform: translate(50%, -50%);
2757 }
2758
2759 div[data-type="core/post-featured-image"] img {
2760 max-width: 100%;
2761 height: auto;
2762 display: block;
2763 }
2764
2765 .wp-block-post-comments-form * {
2766 pointer-events: none;
2767 }
2768 .wp-block-post-comments-form *.block-editor-warning * {
2769 pointer-events: auto;
2770 }
2771
2772 /**
2773 * Element styles for the editor
2774 */
2775 .wp-element-button {
2776 cursor: revert;
2777 }
2778 .wp-element-button[role=textbox] {
2779 cursor: text;
2780 }
2781
2782 .block-library-poster-image__container {
2783 position: relative;
2784 }
2785 .block-library-poster-image__container:hover .block-library-poster-image__actions, .block-library-poster-image__container:focus .block-library-poster-image__actions, .block-library-poster-image__container:focus-within .block-library-poster-image__actions {
2786 opacity: 1;
2787 }
2788 .block-library-poster-image__container .block-library-poster-image__actions.block-library-poster-image__actions-select {
2789 opacity: 1;
2790 margin-top: 16px;
2791 }
2792 .block-library-poster-image__container .components-drop-zone__content {
2793 border-radius: 2px;
2794 }
2795 .block-library-poster-image__container .components-drop-zone .components-drop-zone__content-inner {
2796 display: flex;
2797 align-items: center;
2798 gap: 8px;
2799 }
2800 .block-library-poster-image__container .components-drop-zone .components-drop-zone__content-inner .components-drop-zone__content-icon {
2801 margin: 0;
2802 }
2803 .block-library-poster-image__container .components-spinner {
2804 position: absolute;
2805 top: 50%;
2806 right: 50%;
2807 margin-top: -9px;
2808 margin-right: -9px;
2809 }
2810
2811 .block-library-poster-image__preview {
2812 width: 100%;
2813 padding: 0;
2814 overflow: hidden;
2815 outline-offset: -1px;
2816 min-height: 40px;
2817 display: flex;
2818 justify-content: center;
2819 height: auto !important;
2820 outline: 1px solid rgba(0, 0, 0, 0.1);
2821 }
2822 .block-library-poster-image__preview .block-library-poster-image__preview-image {
2823 -o-object-fit: cover;
2824 object-fit: cover;
2825 width: 100%;
2826 -o-object-position: 50% 50%;
2827 object-position: 50% 50%;
2828 aspect-ratio: 2/1;
2829 }
2830
2831 .block-library-poster-image__actions:not(.block-library-poster-image__actions-select) {
2832 bottom: 0;
2833 opacity: 0;
2834 padding: 8px;
2835 position: absolute;
2836 }
2837 @media not (prefers-reduced-motion) {
2838 .block-library-poster-image__actions:not(.block-library-poster-image__actions-select) {
2839 transition: opacity 50ms ease-out;
2840 }
2841 }
2842 .block-library-poster-image__actions:not(.block-library-poster-image__actions-select) .block-library-poster-image__action {
2843 backdrop-filter: blur(16px) saturate(180%);
2844 background: rgba(255, 255, 255, 0.75);
2845 }
2846 .block-library-poster-image__actions .block-library-poster-image__action {
2847 flex-grow: 1;
2848 justify-content: center;
2849 }
2850
2851 :root .editor-styles-wrapper .has-very-light-gray-background-color {
2852 background-color: #eee;
2853 }
2854 :root .editor-styles-wrapper .has-very-dark-gray-background-color {
2855 background-color: #313131;
2856 }
2857 :root .editor-styles-wrapper .has-very-light-gray-color {
2858 color: #eee;
2859 }
2860 :root .editor-styles-wrapper .has-very-dark-gray-color {
2861 color: #313131;
2862 }
2863 :root .editor-styles-wrapper {
2864 /* stylelint-disable @stylistic/function-comma-space-after -- We can not use spacing because of WP multi site kses rule. */
2865 }
2866 :root .editor-styles-wrapper .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background {
2867 background: linear-gradient(-135deg, rgb(0, 208, 132) 0%, rgb(6, 147, 227) 100%);
2868 }
2869 :root .editor-styles-wrapper .has-purple-crush-gradient-background {
2870 background: linear-gradient(-135deg, rgb(52, 226, 228) 0%, rgb(71, 33, 251) 50%, rgb(171, 29, 254) 100%);
2871 }
2872 :root .editor-styles-wrapper .has-hazy-dawn-gradient-background {
2873 background: linear-gradient(-135deg, rgb(250, 172, 168) 0%, rgb(218, 208, 236) 100%);
2874 }
2875 :root .editor-styles-wrapper .has-subdued-olive-gradient-background {
2876 background: linear-gradient(-135deg, rgb(250, 250, 225) 0%, rgb(103, 166, 113) 100%);
2877 }
2878 :root .editor-styles-wrapper .has-atomic-cream-gradient-background {
2879 background: linear-gradient(-135deg, rgb(253, 215, 154) 0%, rgb(0, 74, 89) 100%);
2880 }
2881 :root .editor-styles-wrapper .has-nightshade-gradient-background {
2882 background: linear-gradient(-135deg, rgb(51, 9, 104) 0%, rgb(49, 205, 207) 100%);
2883 }
2884 :root .editor-styles-wrapper .has-midnight-gradient-background {
2885 background: linear-gradient(-135deg, rgb(2, 3, 129) 0%, rgb(40, 116, 252) 100%);
2886 }
2887 :root .editor-styles-wrapper {
2888 /* stylelint-enable @stylistic/function-comma-space-after */
2889 }
2890
2891 :where(.editor-styles-wrapper) .has-regular-font-size {
2892 font-size: 16px;
2893 }
2894
2895 :where(.editor-styles-wrapper) .has-larger-font-size {
2896 font-size: 42px;
2897 }
2898
2899 /**
2900 * Editor Normalization Styles
2901 *
2902 * These are only output in the editor, but styles here are NOT prefixed .editor-styles-wrapper.
2903 * This allows us to create normalization styles that are easily overridden by editor styles.
2904 */
2905 :where(.editor-styles-wrapper) iframe:not([frameborder]) {
2906 border: 0;
2907 }