PluginProbe
Gutenberg / trunk
Gutenberg vtrunk
24.1.0 24.0.0 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 All 404 releases
← All changes | build/styles/edit-site/style-rtl.css +125 -254 23.9.1 → trunk View file →
@@ -241,8 +241,12 @@
241 241 .dataviews__search {
242 242 flex-grow: 1;
243 243 }
244 244
245 +.dataviews__search .dataviews-search {
246 + flex-basis: 210px;
247 +}
248 +
245 249 .dataviews-no-results,
246 250 .dataviews-loading {
247 251 padding: 0 var(--wpds-dimension-padding-2xl, 24px);
248 252 flex-grow: 1;
@@ -512,9 +516,9 @@
512 516 cursor: var(--wpds-cursor-control, pointer);
513 517 }
514 518
515 519 .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove svg {
516 - fill: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
520 + color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
517 521 }
518 522
519 523 .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus {
520 524 background: var(--wpds-color-background-interactive-neutral-weak-active, #ededed);
@@ -520,13 +524,13 @@
520 524 background: var(--wpds-color-background-interactive-neutral-weak-active, #ededed);
521 525 }
522 526
523 527 .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover svg, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus svg {
524 - fill: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
528 + color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
525 529 }
526 530
527 531 .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values svg {
528 - fill: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
532 + color: var(--wpds-color-foreground-interactive-brand, var(--wp-admin-theme-color, #3858e9));
529 533 }
530 534
531 535 .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values:hover {
532 536 background: var(--wpds-color-background-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
@@ -588,10 +592,11 @@
588 592 background: var(--wpds-color-background-interactive-brand-strong-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 93%, black));
589 593 }
590 594
591 595 .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection {
596 + /* stylelint-disable-next-line plugin-wpds/no-token-fallback-values -- Preserve custom background theming with older @wordpress/theme runtimes that do not set this token. */
597 + background-color: var(--wpds-color-background-interactive-neutral, var(--wpds-color-background-surface-neutral-strong, #fff));
592 598 border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
593 - background: var(--wpds-color-background-surface-neutral-strong, #fff);
594 599 }
595 600
596 601 .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection.is-selected {
597 602 border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
@@ -705,9 +710,9 @@
705 710 }
706 711 .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
707 712 --checkbox-size: 24px;
708 713 flex-shrink: 0;
709 - border: 1px solid #1e1e1e;
714 + border: var(--wpds-border-width-xs, 1px) solid var(--wpds-color-stroke-interactive-neutral, #8d8d8d);
710 715 margin-left: 12px;
711 716 transition: none;
712 717 border-radius: 2px;
713 718 font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
@@ -726,9 +731,9 @@
726 731 /* Override core line-height. To be reviewed. */
727 732 line-height: normal;
728 733 }
729 734 }
730 -.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:hover:not(:disabled, [aria-disabled=true], [type=checkbox]) {
735 +.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:hover:not(:disabled, [aria-disabled=true]) {
731 736 border-color: var(--wpds-color-stroke-interactive-neutral-active, #6e6e6e);
732 737 }
733 738
734 739 .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:focus {
@@ -737,14 +742,14 @@
737 742 border-color: var(--wpds-color-stroke-interactive-neutral, #8d8d8d);
738 743 box-shadow: none;
739 744 }
740 745
741 -.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::-moz-placeholder {
746 +.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::placeholder {
742 747 color: rgba(30, 30, 30, 0.62);
743 748 }
744 749
745 -.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection::placeholder {
746 - color: rgba(30, 30, 30, 0.62);
750 +.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:hover:not(:disabled, [aria-disabled=true]) {
751 + background: var(--wpds-color-background-interactive-neutral-active, #fff);
747 752 }
748 753
749 754 .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:focus {
750 755 box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-admin-theme-color);
@@ -777,9 +782,9 @@
777 782 display: inline-block;
778 783 vertical-align: middle;
779 784 width: 16px;
780 785 /* stylelint-disable-next-line font-family-no-missing-generic-family-keyword -- dashicons don't need a generic family keyword. */
781 - font: normal 30px/1 dashicons;
786 + font: 400 30px/1 dashicons;
782 787 speak: none;
783 788 -webkit-font-smoothing: antialiased;
784 789 -moz-osx-font-smoothing: grayscale;
785 790 }
@@ -790,17 +795,23 @@
790 795 font-size: 21px;
791 796 }
792 797 }
793 798 .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-disabled=true], .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:disabled {
794 - background: #f0f0f0;
795 - border-color: #ddd;
799 + background: var(--wpds-color-background-interactive-neutral-disabled, #fff);
800 + border-color: var(--wpds-color-stroke-interactive-neutral-disabled, #dbdbdb);
801 + color: var(--wpds-color-foreground-interactive-neutral-disabled, #8d8d8d);
796 802 cursor: default;
797 803 opacity: 1;
798 804 }
799 805
806 +.dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-disabled=true]:checked::before, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection[aria-disabled=true][aria-checked=mixed]::before, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:disabled:checked::before, .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection:disabled[aria-checked=mixed]::before {
807 + color: var(--wpds-color-foreground-interactive-neutral-disabled, #8d8d8d);
808 +}
809 +
800 810 .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
801 811 position: relative;
802 - background: var(--wpds-color-background-interactive-neutral-weak, rgba(0, 0, 0, 0));
812 + /* stylelint-disable-next-line plugin-wpds/no-token-fallback-values -- Preserve custom background theming with older @wordpress/theme runtimes that do not set this token. */
813 + background: var(--wpds-color-background-interactive-neutral, var(--wpds-color-background-surface-neutral-strong, #fff));
803 814 color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
804 815 margin: 0;
805 816 padding: 0;
806 817 width: var(--checkbox-size);
@@ -823,9 +834,9 @@
823 834 }
824 835
825 836 .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected svg {
826 837 --checkmark-size: var(--checkbox-size);
827 - fill: var(--wpds-color-foreground-interactive-neutral-strong, #f0f0f0);
838 + color: var(--wpds-color-foreground-interactive-neutral-strong, #f0f0f0);
828 839 position: absolute;
829 840 right: 50%;
830 841 top: 50%;
831 842 transform: translate(50%, -50%);
@@ -860,9 +871,9 @@
860 871 /* Override core line-height. To be reviewed. */
861 872 line-height: normal;
862 873 }
863 874 }
864 -.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:hover:not(:disabled, [aria-disabled=true], [type=checkbox]) {
875 +.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:hover:not(:disabled, [aria-disabled=true]) {
865 876 border-color: var(--wpds-color-stroke-interactive-neutral-active, #6e6e6e);
866 877 }
867 878
868 879 .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
@@ -871,12 +882,8 @@
871 882 border-color: var(--wpds-color-stroke-interactive-neutral, #8d8d8d);
872 883 box-shadow: none;
873 884 }
874 885
875 -.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
876 - color: rgba(30, 30, 30, 0.62);
877 -}
878 -
879 886 .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
880 887 color: rgba(30, 30, 30, 0.62);
881 888 }
882 889
@@ -899,12 +906,8 @@
899 906 .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
900 907 background: var(--wpds-color-background-surface-neutral-strong, #fff);
901 908 }
902 909
903 -.dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
904 - color: var(--wpds-color-foreground-content-neutral-weak, #707070);
905 -}
906 -
907 910 .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
908 911 color: var(--wpds-color-foreground-content-neutral-weak, #707070);
909 912 }
910 913
@@ -949,12 +952,8 @@
949 952 color: var(--wpds-color-foreground-interactive-neutral-strong, #f0f0f0);
950 953 box-sizing: border-box;
951 954 }
952 955
953 -.dataviews-search {
954 - flex-basis: 210px;
955 -}
956 -
957 956 .dataviews-filters__user-input-widget {
958 957 padding: var(--wpds-dimension-padding-lg, 16px);
959 958 }
960 959
@@ -1231,9 +1230,8 @@
1231 1230 }
1232 1231
1233 1232 .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-field--clickable,
1234 1233 .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__title-field--clickable {
1235 - width: -moz-fit-content;
1236 1234 width: fit-content;
1237 1235 }
1238 1236
1239 1237 .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value,
@@ -1267,9 +1265,8 @@
1267 1265 }
1268 1266
1269 1267 .dataviews-view-grid .dataviews-view-grid__media img,
1270 1268 .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media img {
1271 - -o-object-fit: cover;
1272 1269 object-fit: cover;
1273 1270 width: 100%;
1274 1271 height: 100%;
1275 1272 }
@@ -1303,9 +1300,8 @@
1303 1300 }
1304 1301
1305 1302 .dataviews-view-grid.has-media-fit-contain .dataviews-view-grid__media img,
1306 1303 .dataviews-view-grid-infinite-scroll.has-media-fit-contain .dataviews-view-grid__media img {
1307 - -o-object-fit: contain;
1308 1304 object-fit: contain;
1309 1305 }
1310 1306
1311 1307 .dataviews-view-grid .dataviews-view-grid__fields,
@@ -1469,9 +1465,8 @@
1469 1465
1470 1466 .dataviews-view-list div[role=row] .dataviews-view-list__item-actions,
1471 1467 .dataviews-view-list div[role=article] .dataviews-view-list__item-actions {
1472 1468 display: flex;
1473 - width: -moz-max-content;
1474 1469 width: max-content;
1475 1470 flex: 0 0 auto;
1476 1471 gap: var(--wpds-dimension-gap-xs, 4px);
1477 1472 white-space: nowrap;
@@ -1564,10 +1559,8 @@
1564 1559 position: absolute;
1565 1560 z-index: 1;
1566 1561 inset: 0;
1567 1562 scroll-margin: var(--wpds-dimension-gap-sm, 8px) 0;
1568 - -webkit-appearance: none;
1569 - -moz-appearance: none;
1570 1563 appearance: none;
1571 1564 border: none;
1572 1565 background: none;
1573 1566 padding: 0;
@@ -1610,9 +1603,8 @@
1610 1603
1611 1604 .dataviews-view-list .dataviews-view-list__media-wrapper img {
1612 1605 width: 100%;
1613 1606 height: 100%;
1614 - -o-object-fit: cover;
1615 1607 object-fit: cover;
1616 1608 }
1617 1609
1618 1610 .dataviews-view-list .dataviews-view-list__media-wrapper::after {
@@ -1751,9 +1743,9 @@
1751 1743
1752 1744 .dataviews-view-table th {
1753 1745 text-align: right;
1754 1746 color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1755 - font-weight: normal;
1747 + font-weight: 400;
1756 1748 font-size: var(--wpds-typography-font-size-md, 13px);
1757 1749 }
1758 1750
1759 1751 .dataviews-view-table td,
@@ -1995,9 +1987,8 @@
1995 1987
1996 1988 .dataviews-column-primary__media img {
1997 1989 width: var(--wpds-dimension-size-md, 32px);
1998 1990 height: var(--wpds-dimension-size-md, 32px);
1999 - -o-object-fit: cover;
2000 1991 object-fit: cover;
2001 1992 }
2002 1993
2003 1994 .dataviews-column-primary__media::after {
@@ -2076,9 +2067,8 @@
2076 2067 text-align: start;
2077 2068 }
2078 2069
2079 2070 .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-field--clickable {
2080 - width: -moz-fit-content;
2081 2071 width: fit-content;
2082 2072 }
2083 2073
2084 2074 .dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-value {
@@ -2119,9 +2109,8 @@
2119 2109 position: relative;
2120 2110 }
2121 2111
2122 2112 .dataviews-view-picker-grid .dataviews-view-picker-grid__media img {
2123 - -o-object-fit: cover;
2124 2113 object-fit: cover;
2125 2114 width: 100%;
2126 2115 height: 100%;
2127 2116 }
@@ -2142,9 +2131,8 @@
2142 2131 background-color: var(--wpds-color-background-surface-neutral, #fcfcfc);
2143 2132 }
2144 2133
2145 2134 .dataviews-view-picker-grid.has-media-fit-contain .dataviews-view-picker-grid__media img {
2146 - -o-object-fit: contain;
2147 2135 object-fit: contain;
2148 2136 }
2149 2137
2150 2138 .dataviews-view-picker-grid .dataviews-view-picker-grid__fields {
@@ -2309,9 +2297,8 @@
2309 2297 }
2310 2298
2311 2299 .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__primary-actions {
2312 2300 display: flex;
2313 - width: -moz-max-content;
2314 2301 width: max-content;
2315 2302 flex: 0 0 auto;
2316 2303 }
2317 2304
@@ -2443,9 +2430,8 @@
2443 2430 display: block;
2444 2431 width: 100%;
2445 2432 height: 100%;
2446 2433 margin: 0 auto;
2447 - -o-object-fit: cover;
2448 2434 object-fit: cover;
2449 2435 border-radius: 50%;
2450 2436 box-sizing: border-box;
2451 2437 box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-surface-neutral, #dbdbdb);
@@ -2660,9 +2646,8 @@
2660 2646 display: block;
2661 2647 width: 100%;
2662 2648 height: 100%;
2663 2649 margin: 0 auto;
2664 - -o-object-fit: cover;
2665 2650 object-fit: cover;
2666 2651 border-radius: 50%;
2667 2652 box-sizing: border-box;
2668 2653 box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-surface-neutral, #dbdbdb);
@@ -2717,27 +2702,19 @@
2717 2702 background-color: var(--wpds-color-background-interactive-neutral-strong-active, #1e1e1e);
2718 2703 }
2719 2704
2720 2705 .dataviews-validated-control__wrapper-with-error-delegate:has(input[type=radio]:invalid[data-validity-visible]), .dataviews-validated-control__wrapper-with-error-delegate:has(input:invalid[data-validity-visible]) .components-form-token-field__input-container:not(:has([aria-expanded=true])), .dataviews-validated-control .components-combobox-control__suggestions-container:has(input:invalid[data-validity-visible]):not(:has([aria-expanded=true])), .dataviews-validated-control:has(:is(input, select):invalid[data-validity-visible]) .components-input-control__backdrop {
2721 - --focus-color: #cc1818;
2706 + --focus-color: var(--wpds-color-stroke-interactive-error, #cc1818);
2722 2707 }
2723 2708
2724 -.dataviews-validated-control:has(:is(input, select):invalid[data-validity-visible]) .components-input-control__backdrop {
2725 - border-color: #cc1818;
2709 +.dataviews-validated-control__wrapper-with-error-delegate:has(input:invalid[data-validity-visible]) .components-form-token-field__input-container:not(:has([aria-expanded=true])), .dataviews-validated-control .components-combobox-control__suggestions-container:has(input:invalid[data-validity-visible]):not(:has([aria-expanded=true])), .dataviews-validated-control:has(:is(input, select):invalid[data-validity-visible]) .components-input-control__backdrop {
2710 + border-color: var(--wpds-color-stroke-interactive-error, #cc1818);
2726 2711 }
2727 2712
2728 -.dataviews-validated-control .components-combobox-control__suggestions-container:has(input:invalid[data-validity-visible]):not(:has([aria-expanded=true])) {
2729 - border-color: #cc1818;
2730 -}
2731 -
2732 2713 .dataviews-validated-control__wrapper-with-error-delegate {
2733 2714 position: relative;
2734 2715 }
2735 2716
2736 -.dataviews-validated-control__wrapper-with-error-delegate:has(input:invalid[data-validity-visible]) .components-form-token-field__input-container:not(:has([aria-expanded=true])) {
2737 - border-color: #cc1818;
2738 -}
2739 -
2740 2717 .dataviews-validated-control__error-delegate {
2741 2718 position: absolute;
2742 2719 top: 0;
2743 2720 height: 100%;
@@ -2868,9 +2845,10 @@
2868 2845 align-items: center;
2869 2846 overflow: clip;
2870 2847 padding-inline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
2871 2848 margin-inline: calc(-1 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
2872 - word-break: break-word;
2849 + word-break: normal;
2850 + overflow-wrap: anywhere;
2873 2851 font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2874 2852 }
2875 2853
2876 2854 .dataforms-layouts-panel__field-control:has(a, button) {
@@ -3129,9 +3107,9 @@
3129 3107 padding: 12px;
3130 3108 display: grid;
3131 3109 align-items: center;
3132 3110 grid-template-columns: min-content 1fr min-content;
3133 - grid-gap: 4px 8px;
3111 + gap: 4px 8px;
3134 3112 color: #1e1e1e;
3135 3113 }
3136 3114
3137 3115 .fields-create-template-part-modal__area-radio-wrapper + .fields-create-template-part-modal__area-radio-wrapper {
@@ -3414,11 +3392,9 @@
3414 3392
3415 3393 fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-thumbnail {
3416 3394 width: 100%;
3417 3395 height: 100%;
3418 - -o-object-fit: cover;
3419 3396 object-fit: cover;
3420 - -o-object-position: 50% 50%;
3421 3397 object-position: 50% 50%;
3422 3398 }
3423 3399
3424 3400 fieldset.fields__media-edit .fields__media-edit-expanded .fields__media-edit-filename {
@@ -3478,9 +3454,8 @@
3478 3454
3479 3455 .fields-controls__author-avatar img {
3480 3456 width: 16px;
3481 3457 height: 16px;
3482 - -o-object-fit: cover;
3483 3458 object-fit: cover;
3484 3459 opacity: 0;
3485 3460 border-radius: 100%;
3486 3461 }
@@ -3516,18 +3491,15 @@
3516 3491 padding: 0;
3517 3492 margin: 0;
3518 3493 }
3519 3494
3520 -.fields-controls__slug .fields-controls__slug-external-icon {
3521 - margin-right: 5ch;
3522 -}
3523 -
3524 3495 .fields-controls__slug .fields-controls__slug-input input.components-input-control__input {
3525 3496 padding-inline-start: 0 !important;
3526 3497 }
3527 3498
3528 3499 .fields-controls__slug .fields-controls__slug-help-link {
3529 - word-break: break-word;
3500 + word-break: normal;
3501 + overflow-wrap: anywhere;
3530 3502 }
3531 3503
3532 3504 .fields-controls__slug .fields-controls__slug-help {
3533 3505 display: flex;
@@ -3802,13 +3774,13 @@
3802 3774 position: relative;
3803 3775 }
3804 3776
3805 3777 .font-library__font-card .font-library__font-card__name {
3806 - font-weight: bold;
3778 + font-weight: 700;
3807 3779 }
3808 3780
3809 3781 .font-library__font-card .font-library__font-card__count {
3810 - color: #757575;
3782 + color: var(--wpds-color-foreground-content-neutral-weak, #707070);
3811 3783 }
3812 3784
3813 3785 .font-library__font-card .font-library__font-variant_demo-image {
3814 3786 display: block;
@@ -3868,9 +3840,9 @@
3868 3840 width: 80%;
3869 3841 }
3870 3842
3871 3843 .font-library__local-fonts .font-library__upload-area__text {
3872 - color: #757575;
3844 + color: var(--wpds-color-foreground-content-neutral-weak, #707070);
3873 3845 }
3874 3846
3875 3847 .font-library__google-fonts-confirm {
3876 3848 display: flex;
@@ -3905,113 +3877,22 @@
3905 3877 .font-library__select-all .components-checkbox-control__label {
3906 3878 padding-right: 16px;
3907 3879 }
3908 3880
3909 -.global-styles-ui-pagination .components-button.is-tertiary {
3910 - width: 32px;
3911 - height: 32px;
3912 - justify-content: center;
3913 -}
3914 -
3915 -.global-styles-ui-screen-revisions__revisions-list {
3916 - list-style: none;
3917 - margin: 0 16px 16px 16px;
3918 - flex-grow: 1;
3919 -}
3920 -
3921 -.global-styles-ui-screen-revisions__revisions-list li {
3922 - margin-bottom: 0;
3923 -}
3924 -
3925 -.global-styles-ui-screen-revisions__revision-item {
3926 - position: relative;
3927 - cursor: var(--wpds-cursor-control, pointer);
3881 +.global-styles-ui-screen-revisions {
3928 3882 display: flex;
3929 3883 flex-direction: column;
3884 + flex-grow: 1;
3885 + min-height: 0;
3930 3886 }
3931 3887
3932 -.global-styles-ui-screen-revisions__revision-item[role=option]:active, .global-styles-ui-screen-revisions__revision-item[role=option]:focus {
3933 - box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
3934 - outline: 2px solid transparent;
3888 +.global-styles-ui-screen-revisions__actions {
3889 + margin-inline-start: auto;
3935 3890 }
3936 3891
3937 -.global-styles-ui-screen-revisions__revision-item:hover {
3938 - background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
3939 -}
3940 -
3941 -.global-styles-ui-screen-revisions__revision-item:hover .global-styles-ui-screen-revisions__date {
3942 - color: var(--wp-admin-theme-color);
3943 -}
3944 -
3945 -.global-styles-ui-screen-revisions__revision-item::before, .global-styles-ui-screen-revisions__revision-item::after {
3946 - position: absolute;
3947 - content: "\a";
3948 - display: block;
3949 -}
3950 -
3951 -.global-styles-ui-screen-revisions__revision-item::before {
3952 - background: #ddd;
3953 - border-radius: 50%;
3954 - height: 8px;
3955 - width: 8px;
3956 - top: 18px;
3957 - right: 17px;
3958 - transform: translate(50%, -50%);
3959 - z-index: 1;
3960 - border: 4px solid transparent;
3961 -}
3962 -
3963 -.global-styles-ui-screen-revisions__revision-item[aria-selected=true] {
3964 - border-radius: 2px;
3965 - outline: 3px solid transparent;
3966 - outline-offset: -2px;
3967 - color: var(--wp-admin-theme-color);
3968 - background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
3969 -}
3970 -
3971 -.global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__date {
3972 - color: var(--wp-admin-theme-color);
3973 -}
3974 -
3975 -.global-styles-ui-screen-revisions__revision-item[aria-selected=true]::before {
3976 - background: var(--wp-admin-theme-color);
3977 -}
3978 -
3979 -.global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__changes > li,
3980 -.global-styles-ui-screen-revisions__revision-item[aria-selected=true] .global-styles-ui-screen-revisions__meta {
3981 - color: #1e1e1e;
3982 -}
3983 -
3984 -.global-styles-ui-screen-revisions__revision-item::after {
3985 - height: 100%;
3986 - right: 16px;
3987 - top: 0;
3988 - width: 0;
3989 - border: 0.5px solid var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3990 -}
3991 -
3992 -.global-styles-ui-screen-revisions__revision-item:first-child::after {
3993 - top: 18px;
3994 -}
3995 -
3996 -.global-styles-ui-screen-revisions__revision-item:last-child::after {
3997 - height: 18px;
3998 -}
3999 -
4000 -.global-styles-ui-screen-revisions__revision-item-wrapper {
4001 - display: block;
4002 - padding: 12px 40px 4px 12px;
4003 -}
4004 -
4005 -.global-styles-ui-screen-revisions__apply-button.is-primary,
4006 -.global-styles-ui-screen-revisions__active-badge {
4007 - align-self: flex-start;
4008 - margin: 0 40px 12px 12px;
4009 -}
4010 -
4011 -.global-styles-ui-screen-revisions__changes,
4012 -.global-styles-ui-screen-revisions__meta {
4013 - color: #757575;
3892 +.global-styles-ui-screen-revisions__date {
3893 + text-transform: uppercase;
3894 + font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4014 3895 font-size: 12px;
4015 3896 }
4016 3897
4017 3898 .global-styles-ui-screen-revisions__description {
@@ -4020,11 +3901,11 @@
4020 3901 align-items: flex-start;
4021 3902 gap: 8px;
4022 3903 }
4023 3904
4024 -.global-styles-ui-screen-revisions__description .global-styles-ui-screen-revisions__date {
4025 - text-transform: uppercase;
4026 - font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3905 +.global-styles-ui-screen-revisions__changes,
3906 +.global-styles-ui-screen-revisions__meta {
3907 + color: #2f2f2f;
4027 3908 font-size: 12px;
4028 3909 }
4029 3910
4030 3911 .global-styles-ui-screen-revisions__meta {
@@ -4030,11 +3911,10 @@
4030 3911 .global-styles-ui-screen-revisions__meta {
4031 3912 display: flex;
4032 3913 justify-content: start;
4033 3914 width: 100%;
4034 - align-items: flex-start;
3915 + align-items: center;
4035 3916 text-align: right;
4036 - margin-bottom: 4px;
4037 3917 }
4038 3918
4039 3919 .global-styles-ui-screen-revisions__meta img {
4040 3920 width: 16px;
@@ -4042,16 +3922,12 @@
4042 3922 border-radius: 100%;
4043 3923 margin-left: 8px;
4044 3924 }
4045 3925
4046 -.global-styles-ui-screen-revisions__loading {
4047 - margin: 24px auto !important;
4048 -}
4049 -
4050 3926 .global-styles-ui-screen-revisions__changes {
4051 3927 text-align: right;
4052 3928 line-height: 1.4;
4053 - margin-right: 12px;
3929 + margin: 0 12px 0 0;
4054 3930 list-style: disc;
4055 3931 }
4056 3932
4057 3933 .global-styles-ui-screen-revisions__changes li {
@@ -4057,47 +3933,8 @@
4057 3933 .global-styles-ui-screen-revisions__changes li {
4058 3934 margin-bottom: 4px;
4059 3935 }
4060 3936
4061 -.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination {
4062 - justify-content: space-between;
4063 - gap: 2px;
4064 -}
4065 -
4066 -.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .edit-site-pagination__total {
4067 - position: absolute;
4068 - right: -1000px;
4069 - height: 1px;
4070 - margin: -1px;
4071 - overflow: hidden;
4072 -}
4073 -
4074 -.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-text {
4075 - font-size: 12px;
4076 - will-change: opacity;
4077 -}
4078 -
4079 -.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary {
4080 - color: #1e1e1e;
4081 -}
4082 -
4083 -.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary:disabled,
4084 -.global-styles-ui-screen-revisions__pagination.global-styles-ui-screen-revisions__pagination .components-button.is-tertiary[aria-disabled=true] {
4085 - color: #949494;
4086 -}
4087 -
4088 -.global-styles-ui-screen-revisions__footer {
4089 - height: 56px;
4090 - z-index: 1;
4091 - position: sticky;
4092 - min-width: 100%;
4093 - bottom: 0;
4094 - background: #fff;
4095 - padding: 12px;
4096 - border-top: 1px solid var(--wpds-color-stroke-surface-neutral, #dbdbdb);
4097 - box-sizing: border-box;
4098 -}
4099 -
4100 3937 .global-styles-ui-variations_item {
4101 3938 box-sizing: border-box;
4102 3939 cursor: var(--wpds-cursor-control, pointer);
4103 3940 }
@@ -4247,10 +4084,20 @@
4247 4084
4248 4085 .global-styles-ui__color-indicator-wrapper {
4249 4086 height: 24px;
4250 4087 flex-shrink: 0;
4088 + display: flex;
4089 + align-items: center;
4251 4090 }
4252 4091
4092 +.global-styles-ui__palette-preview {
4093 + display: inline-flex;
4094 +}
4095 +
4096 +.global-styles-ui__palette-preview > * + * {
4097 + margin-inline-start: -8px;
4098 +}
4099 +
4253 4100 .global-styles-ui__shadows-panel__options-container,
4254 4101 .global-styles-ui__typography-panel__options-container {
4255 4102 height: 24px;
4256 4103 }
@@ -4262,9 +4109,10 @@
4262 4109 border-radius: 2px;
4263 4110 overflow: hidden;
4264 4111 }
4265 4112
4266 -.global-styles-ui__shadow-preview-panel {
4113 +.global-styles-ui__shadow-preview-panel,
4114 +.global-styles-ui__text-shadow-preview-panel {
4267 4115 height: 144px;
4268 4116 border: #ddd 1px solid;
4269 4117 border-radius: 2px;
4270 4118 overflow: auto;
@@ -4272,9 +4120,9 @@
4272 4120 background-position: 0 0, 8px 8px;
4273 4121 background-size: 16px 16px;
4274 4122 }
4275 4123
4276 -.global-styles-ui__shadow-preview-panel .global-styles-ui__shadow-preview-block {
4124 +.global-styles-ui__shadow-preview-block {
4277 4125 border: #ddd 1px solid;
4278 4126 border-radius: 2px;
4279 4127 background-color: #fff;
4280 4128 width: 60%;
@@ -4280,22 +4128,44 @@
4280 4128 width: 60%;
4281 4129 height: 60px;
4282 4130 }
4283 4131
4284 -.global-styles-ui__shadow-editor__dropdown-content {
4132 +.global-styles-ui__text-shadow-preview-panel {
4133 + margin-block: -8px 16px;
4134 +}
4135 +
4136 +.global-styles-ui__text-shadow-preview-text {
4137 + font-size: 24px;
4138 +}
4139 +
4140 +.global-styles-ui__text-shadow-editor__header {
4141 + margin-block-end: 8px;
4142 +}
4143 +
4144 +.global-styles-ui__text-shadow-editor__inputs {
4145 + display: grid;
4146 + grid-template-columns: repeat(2, 1fr);
4147 + gap: 16px;
4148 +}
4149 +
4150 +.global-styles-ui__shadow-editor__dropdown-content,
4151 +.global-styles-ui__text-shadow-editor__dropdown-content {
4285 4152 width: 280px;
4286 4153 }
4287 4154
4288 -.global-styles-ui__shadow-editor-panel {
4155 +.global-styles-ui__shadow-editor-panel,
4156 +.global-styles-ui__text-shadow-editor-panel {
4289 4157 margin-bottom: 4px;
4290 4158 }
4291 4159
4292 -.global-styles-ui__shadow-editor__dropdown {
4160 +.global-styles-ui__shadow-editor__dropdown,
4161 +.global-styles-ui__text-shadow-editor__dropdown {
4293 4162 width: 100%;
4294 4163 position: relative;
4295 4164 }
4296 4165
4297 -.global-styles-ui__shadow-editor__dropdown-toggle {
4166 +.global-styles-ui__shadow-editor__dropdown-toggle,
4167 +.global-styles-ui__text-shadow-editor__dropdown-toggle {
4298 4168 width: 100%;
4299 4169 height: auto;
4300 4170 padding-top: 8px;
4301 4171 padding-bottom: 8px;
@@ -4302,14 +4172,16 @@
4302 4172 text-align: right;
4303 4173 border-radius: inherit;
4304 4174 }
4305 4175
4306 -.global-styles-ui__shadow-editor__dropdown-toggle.is-open {
4176 +.global-styles-ui__shadow-editor__dropdown-toggle.is-open,
4177 +.global-styles-ui__text-shadow-editor__dropdown-toggle.is-open {
4307 4178 background: #f0f0f0;
4308 4179 color: var(--wp-admin-theme-color);
4309 4180 }
4310 4181
4311 -.global-styles-ui__shadow-editor__remove-button {
4182 +.global-styles-ui__shadow-editor__remove-button,
4183 +.global-styles-ui__text-shadow-editor__remove-button {
4312 4184 position: absolute;
4313 4185 left: 8px;
4314 4186 top: 8px;
4315 4187 opacity: 0;
@@ -4314,14 +4186,19 @@
4314 4186 top: 8px;
4315 4187 opacity: 0;
4316 4188 }
4317 4189
4318 -.global-styles-ui__shadow-editor__dropdown-toggle:hover + .global-styles-ui__shadow-editor__remove-button, .global-styles-ui__shadow-editor__remove-button:focus, .global-styles-ui__shadow-editor__remove-button:hover {
4190 +.global-styles-ui__shadow-editor__dropdown-toggle:hover + .global-styles-ui__shadow-editor__remove-button, .global-styles-ui__text-shadow-editor__dropdown-toggle:hover + .global-styles-ui__shadow-editor__remove-button, .global-styles-ui__shadow-editor__remove-button:focus, .global-styles-ui__shadow-editor__remove-button:hover,
4191 +.global-styles-ui__shadow-editor__dropdown-toggle:hover + .global-styles-ui__text-shadow-editor__remove-button,
4192 +.global-styles-ui__text-shadow-editor__dropdown-toggle:hover + .global-styles-ui__text-shadow-editor__remove-button,
4193 +.global-styles-ui__text-shadow-editor__remove-button:focus,
4194 +.global-styles-ui__text-shadow-editor__remove-button:hover {
4319 4195 opacity: 1;
4320 4196 }
4321 4197
4322 4198 @media (hover: none) {
4323 - .global-styles-ui__shadow-editor__remove-button {
4199 + .global-styles-ui__shadow-editor__remove-button,
4200 + .global-styles-ui__text-shadow-editor__remove-button {
4324 4201 opacity: 1;
4325 4202 }
4326 4203 }
4327 4204 .global-styles-ui-screen-css {
@@ -4417,13 +4294,8 @@
4417 4294 }
4418 4295 .edit-site-custom-template-modal__contents-wrapper > * {
4419 4296 width: 100%;
4420 4297 }
4421 -.edit-site-custom-template-modal__contents-wrapper__suggestions_list {
4422 - margin-right: -12px;
4423 - margin-left: -12px;
4424 - width: calc(100% + 24px);
4425 -}
4426 4298 .edit-site-custom-template-modal__contents > .components-button {
4427 4299 height: auto;
4428 4300 justify-content: center;
4429 4301 }
@@ -4433,10 +4305,14 @@
4433 4305 }
4434 4306 }
4435 4307 @media (min-width: 600px) {
4436 4308 .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list {
4437 - max-height: 224px;
4438 4309 overflow-y: auto;
4310 + max-height: calc(224px + 4 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
4311 + padding: calc(2 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
4312 + margin-inline: calc(-2 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
4313 + width: calc(100% + 4 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
4314 + scroll-padding-block: calc(2 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
4439 4315 }
4440 4316 }
4441 4317 .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item {
4442 4318 display: block;
@@ -4462,11 +4338,8 @@
4462 4338 }
4463 4339 .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item:focus {
4464 4340 background-color: #f0f0f0;
4465 4341 }
4466 -.edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item:focus:not(:disabled) {
4467 - box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color) inset;
4468 -}
4469 4342 .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item__title, .edit-site-custom-template-modal .edit-site-custom-template-modal__suggestions_list__list-item__info {
4470 4343 overflow: hidden;
4471 4344 text-overflow: ellipsis;
4472 4345 display: block;
@@ -4498,14 +4371,10 @@
4498 4371 }
4499 4372 }
4500 4373 .edit-site-add-new-template__modal .edit-site-add-new-template__template-button svg,
4501 4374 .edit-site-add-new-template__modal .edit-site-add-new-template__custom-template-button svg {
4502 - fill: var(--wp-admin-theme-color);
4375 + color: var(--wp-admin-theme-color);
4503 4376 }
4504 -.edit-site-add-new-template__modal .edit-site-add-new-template__custom-template-button .edit-site-add-new-template__template-name {
4505 - flex-grow: 1;
4506 - align-items: flex-start;
4507 -}
4508 4377 .edit-site-add-new-template__modal .edit-site-add-new-template__template-icon {
4509 4378 padding: 8px;
4510 4379 background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
4511 4380 border-radius: 100%;
@@ -4519,9 +4388,8 @@
4519 4388 display: flex;
4520 4389 flex-direction: column;
4521 4390 border: 1px solid #ddd;
4522 4391 justify-content: center;
4523 - outline: 1px solid transparent;
4524 4392 }
4525 4393 .edit-site-custom-template-modal__contents > .components-button span:first-child,
4526 4394 .edit-site-add-new-template__template-list__contents > .components-button span:first-child {
4527 4395 color: #1e1e1e;
@@ -4539,14 +4407,8 @@
4539 4407 .edit-site-custom-template-modal__contents > .components-button:hover span,
4540 4408 .edit-site-add-new-template__template-list__contents > .components-button:hover span {
4541 4409 color: var(--wp-admin-theme-color);
4542 4410 }
4543 -.edit-site-custom-template-modal__contents > .components-button:focus,
4544 -.edit-site-add-new-template__template-list__contents > .components-button:focus {
4545 - box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
4546 - border-color: transparent;
4547 - outline: 3px solid transparent;
4548 -}
4549 4411 .edit-site-custom-template-modal__contents > .components-button:focus span:first-child,
4550 4412 .edit-site-add-new-template__template-list__contents > .components-button:focus span:first-child {
4551 4413 color: var(--wp-admin-theme-color);
4552 4414 }
@@ -4558,10 +4420,12 @@
4558 4420 }
4559 4421
4560 4422 .edit-site-add-new-template__template-list__contents > .components-button {
4561 4423 height: 100%;
4424 + padding: 16px;
4562 4425 text-align: start;
4563 4426 align-items: flex-start;
4427 + justify-content: flex-start;
4564 4428 }
4565 4429
4566 4430 .edit-site-visual-editor__editor-canvas.is-focused {
4567 4431 outline: calc(2 * var(--wp-admin-border-width-focus)) solid var(--wp-admin-theme-color);
@@ -4770,10 +4634,9 @@
4770 4634 }
4771 4635 .edit-site-welcome-guide__image > img {
4772 4636 display: block;
4773 4637 max-width: 100%;
4774 - -o-object-fit: cover;
4775 - object-fit: cover;
4638 + object-fit: cover;
4776 4639 }
4777 4640 .edit-site-welcome-guide__heading {
4778 4641 font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4779 4642 font-size: 24px;
@@ -4794,9 +4657,9 @@
4794 4657 margin: 0 4px;
4795 4658 vertical-align: text-top;
4796 4659 }
4797 4660 .edit-site-welcome-guide .components-button:hover svg {
4798 - fill: #fff;
4661 + color: #fff;
4799 4662 }
4800 4663
4801 4664 .edit-site-layout {
4802 4665 height: 100%;
@@ -5363,13 +5226,8 @@
5363 5226 margin-right: -16px;
5364 5227 margin-left: -16px;
5365 5228 }
5366 5229
5367 -.edit-site-sidebar-navigation-screen-templates-browse {
5368 - margin-right: -16px;
5369 - margin-left: -16px;
5370 -}
5371 -
5372 5230 .edit-site-sidebar-dataviews {
5373 5231 margin-right: -16px;
5374 5232 margin-left: -16px;
5375 5233 }
@@ -5477,9 +5335,8 @@
5477 5335 }
5478 5336 body:has(.edit-site-resizable-frame__inner.is-resizing) {
5479 5337 cursor: col-resize;
5480 5338 -webkit-user-select: none;
5481 - -moz-user-select: none;
5482 5339 user-select: none;
5483 5340 }
5484 5341
5485 5342 .edit-site-resizable-frame__inner.is-resizing::before {
@@ -5563,8 +5420,14 @@
5563 5420 .edit-site-styles .edit-site-sidebar-button {
5564 5421 color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
5565 5422 }
5566 5423
5424 +.edit-site-styles__content {
5425 + flex-grow: 1;
5426 + min-height: 0;
5427 + background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
5428 +}
5429 +
5567 5430 .show-icon-labels .edit-site-styles__header-actions .components-button.has-icon {
5568 5431 width: auto;
5569 5432 padding: 0 var(--wpds-dimension-padding-xs, 4px);
5570 5433 }
@@ -5573,8 +5436,16 @@
5573 5436 }
5574 5437 .show-icon-labels .edit-site-styles__header-actions .components-button.has-icon::after {
5575 5438 content: attr(aria-label);
5576 5439 font-size: var(--wpds-typography-font-size-sm, 12px);
5440 +}
5441 +
5442 +.edit-site-sidebar-identity__form {
5443 + flex-grow: 1;
5444 + min-height: 0;
5445 + overflow: auto;
5446 + background-color: var(--wpds-color-background-surface-neutral-strong, #fff);
5447 + padding: var(--wpds-dimension-padding-lg, 16px) var(--wpds-dimension-padding-2xl, 24px);
5577 5448 }
5578 5449
5579 5450 ::view-transition-image-pair(root) {
5580 5451 isolation: auto;