@wordpress/edit-site 6.50.0 → 7.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/build/components/add-new-template/add-custom-template-modal-content.cjs +3 -3
  3. package/build/components/add-new-template/add-custom-template-modal-content.cjs.map +2 -2
  4. package/build/components/add-new-template/index.cjs +1 -1
  5. package/build/components/add-new-template/index.cjs.map +2 -2
  6. package/build/components/add-new-template-legacy/add-custom-template-modal-content.cjs +3 -3
  7. package/build/components/add-new-template-legacy/add-custom-template-modal-content.cjs.map +2 -2
  8. package/build/components/add-new-template-legacy/index.cjs +1 -1
  9. package/build/components/add-new-template-legacy/index.cjs.map +2 -2
  10. package/build/components/editor/index.cjs +22 -97
  11. package/build/components/editor/index.cjs.map +3 -3
  12. package/build/components/layout/index.cjs +12 -15
  13. package/build/components/layout/index.cjs.map +3 -3
  14. package/build/components/page-patterns/fields.cjs +0 -36
  15. package/build/components/page-patterns/fields.cjs.map +2 -2
  16. package/build/components/page-patterns/index.cjs +4 -15
  17. package/build/components/page-patterns/index.cjs.map +2 -2
  18. package/build/components/save-panel/index.cjs +1 -2
  19. package/build/components/save-panel/index.cjs.map +2 -2
  20. package/build/components/site-editor-routes/styles.cjs +4 -3
  21. package/build/components/site-editor-routes/styles.cjs.map +2 -2
  22. package/build/components/site-hub/index.cjs +13 -176
  23. package/build/components/site-hub/index.cjs.map +3 -3
  24. package/build/index.cjs +3 -1
  25. package/build/index.cjs.map +2 -2
  26. package/build-module/components/add-new-template/add-custom-template-modal-content.mjs +3 -3
  27. package/build-module/components/add-new-template/add-custom-template-modal-content.mjs.map +2 -2
  28. package/build-module/components/add-new-template/index.mjs +1 -1
  29. package/build-module/components/add-new-template/index.mjs.map +2 -2
  30. package/build-module/components/add-new-template-legacy/add-custom-template-modal-content.mjs +3 -3
  31. package/build-module/components/add-new-template-legacy/add-custom-template-modal-content.mjs.map +2 -2
  32. package/build-module/components/add-new-template-legacy/index.mjs +1 -1
  33. package/build-module/components/add-new-template-legacy/index.mjs.map +2 -2
  34. package/build-module/components/editor/index.mjs +25 -100
  35. package/build-module/components/editor/index.mjs.map +2 -2
  36. package/build-module/components/layout/index.mjs +12 -15
  37. package/build-module/components/layout/index.mjs.map +2 -2
  38. package/build-module/components/page-patterns/fields.mjs +2 -41
  39. package/build-module/components/page-patterns/fields.mjs.map +2 -2
  40. package/build-module/components/page-patterns/index.mjs +5 -16
  41. package/build-module/components/page-patterns/index.mjs.map +2 -2
  42. package/build-module/components/save-panel/index.mjs +1 -2
  43. package/build-module/components/save-panel/index.mjs.map +2 -2
  44. package/build-module/components/site-editor-routes/styles.mjs +4 -3
  45. package/build-module/components/site-editor-routes/styles.mjs.map +2 -2
  46. package/build-module/components/site-hub/index.mjs +17 -170
  47. package/build-module/components/site-hub/index.mjs.map +2 -2
  48. package/build-module/index.mjs +3 -1
  49. package/build-module/index.mjs.map +2 -2
  50. package/build-style/style-rtl.css +110 -330
  51. package/build-style/style.css +110 -330
  52. package/package.json +52 -52
  53. package/src/components/add-new-template/add-custom-template-modal-content.js +3 -3
  54. package/src/components/add-new-template/index.js +1 -1
  55. package/src/components/add-new-template-legacy/add-custom-template-modal-content.js +3 -3
  56. package/src/components/add-new-template-legacy/index.js +1 -1
  57. package/src/components/editor/index.js +31 -122
  58. package/src/components/editor/style.scss +0 -62
  59. package/src/components/layout/index.js +13 -18
  60. package/src/components/layout/style.scss +5 -62
  61. package/src/components/page-patterns/fields.js +2 -50
  62. package/src/components/page-patterns/index.js +5 -23
  63. package/src/components/page-patterns/style.scss +1 -1
  64. package/src/components/save-panel/index.js +1 -2
  65. package/src/components/sidebar/style.scss +2 -0
  66. package/src/components/sidebar-button/style.scss +1 -9
  67. package/src/components/sidebar-global-styles/style.scss +7 -4
  68. package/src/components/sidebar-navigation-item/style.scss +8 -4
  69. package/src/components/sidebar-navigation-screen/style.scss +1 -1
  70. package/src/components/sidebar-navigation-screen-navigation-menus/style.scss +2 -2
  71. package/src/components/sidebar-navigation-screen-patterns/style.scss +1 -1
  72. package/src/components/site-editor-routes/styles.js +5 -2
  73. package/src/components/site-hub/index.js +12 -170
  74. package/src/components/site-hub/style.scss +5 -82
  75. package/src/index.js +3 -1
  76. package/src/style.scss +16 -11
  77. package/build/components/site-icon/index.cjs +0 -73
  78. package/build/components/site-icon/index.cjs.map +0 -7
  79. package/build-module/components/site-icon/index.mjs +0 -42
  80. package/build-module/components/site-icon/index.mjs.map +0 -7
  81. package/build-style/experimental-omnibar-rtl.css +0 -103
  82. package/build-style/experimental-omnibar.css +0 -103
  83. package/src/components/site-icon/index.js +0 -51
  84. package/src/components/site-icon/style.scss +0 -41
  85. package/src/experimental-omnibar.scss +0 -75
@@ -1,4 +1,3 @@
1
- @charset "UTF-8";
2
1
  /**
3
2
  * Typography
4
3
  */
@@ -68,6 +67,12 @@
68
67
  /**
69
68
  * Focus styles.
70
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
+ */
71
76
  /**
72
77
  * Applies editor left position to the selector passed as argument
73
78
  */
@@ -176,6 +181,12 @@
176
181
  /**
177
182
  * Focus styles.
178
183
  */
184
+ /**
185
+ * Standard focus rings for the WordPress Design System.
186
+ *
187
+ * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
188
+ * e.g. `&:focus { @include outset-ring__focus(); }`.
189
+ */
179
190
  /**
180
191
  * Applies editor left position to the selector passed as argument
181
192
  */
@@ -203,7 +214,6 @@
203
214
  min-height: 0;
204
215
  box-sizing: border-box;
205
216
  scroll-padding-bottom: 64px;
206
- /* stylelint-disable-next-line property-no-unknown -- '@container' not globally permitted */
207
217
  container: dataviews-wrapper/inline-size;
208
218
  display: flex;
209
219
  flex-direction: column;
@@ -266,6 +276,10 @@
266
276
  text-align: center;
267
277
  }
268
278
 
279
+ .dataviews-loading-more[aria-hidden=true] {
280
+ visibility: hidden;
281
+ }
282
+
269
283
  @container (max-width: 430px) {
270
284
  .dataviews__view-actions,
271
285
  .dataviews-filters__container {
@@ -274,7 +288,7 @@
274
288
  }
275
289
  .dataviews-title-field {
276
290
  font-size: var(--wpds-typography-font-size-md, 13px);
277
- font-weight: var(--wpds-typography-font-weight-medium, 499);
291
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
278
292
  color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
279
293
  text-overflow: ellipsis;
280
294
  white-space: nowrap;
@@ -474,7 +488,7 @@
474
488
  }
475
489
 
476
490
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip .dataviews-filters-__summary-filter-text-name {
477
- font-weight: var(--wpds-typography-font-weight-medium, 499);
491
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
478
492
  }
479
493
 
480
494
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove {
@@ -527,7 +541,7 @@
527
541
  }
528
542
 
529
543
  .dataviews-filters__search-widget-filter-combobox-list .dataviews-filters__search-widget-filter-combobox-item-value [data-user-value] {
530
- font-weight: 600;
544
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
531
545
  }
532
546
 
533
547
  .dataviews-filters__search-widget-listbox {
@@ -544,8 +558,8 @@
544
558
  padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-md, 12px);
545
559
  cursor: default;
546
560
  min-height: var(--wpds-dimension-size-md, 32px);
547
- font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
548
- font-weight: 400;
561
+ font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
562
+ font-weight: var(--wpds-typography-font-weight-default, 400);
549
563
  font-size: 13px;
550
564
  line-height: 20px;
551
565
  }
@@ -686,7 +700,7 @@
686
700
  margin-left: 12px;
687
701
  transition: none;
688
702
  border-radius: 2px;
689
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
703
+ font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
690
704
  padding: 6px 8px;
691
705
  /* Fonts smaller than 16px causes mobile safari to zoom. */
692
706
  font-size: 16px;
@@ -821,7 +835,7 @@
821
835
  }
822
836
 
823
837
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
824
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
838
+ font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
825
839
  padding: 6px 8px;
826
840
  /* Fonts smaller than 16px causes mobile safari to zoom. */
827
841
  font-size: 16px;
@@ -996,14 +1010,14 @@
996
1010
  }
997
1011
  .dataviews-pagination__page-select {
998
1012
  font-size: 11px;
999
- font-weight: var(--wpds-typography-font-weight-medium, 499);
1013
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1000
1014
  text-transform: uppercase;
1001
1015
  }
1002
1016
 
1003
1017
  @media (min-width: 600px) {
1004
1018
  .dataviews-pagination__page-select .components-select-control__input {
1005
1019
  font-size: 11px !important;
1006
- font-weight: var(--wpds-typography-font-weight-medium, 499);
1020
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1007
1021
  }
1008
1022
  }
1009
1023
  .dataviews-action-modal {
@@ -1034,7 +1048,6 @@
1034
1048
 
1035
1049
  .dataviews-view-config {
1036
1050
  width: 320px;
1037
- /* stylelint-disable-next-line property-no-unknown -- the linter needs to be updated to accepted the container-type property */
1038
1051
  container-type: inline-size;
1039
1052
  font-size: var(--wpds-typography-font-size-md, 13px);
1040
1053
  line-height: var(--wpds-typography-line-height-sm, 20px);
@@ -1409,7 +1422,7 @@
1409
1422
 
1410
1423
  .dataviews-view-grid__group-header {
1411
1424
  font-size: var(--wpds-typography-font-size-lg, 15px);
1412
- font-weight: var(--wpds-typography-font-weight-medium, 499);
1425
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1413
1426
  color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1414
1427
  margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
1415
1428
  padding: 0 var(--wpds-dimension-padding-2xl, 24px);
@@ -1703,7 +1716,7 @@ div.dataviews-view-list {
1703
1716
  }
1704
1717
  .dataviews-view-list__group-header {
1705
1718
  font-size: var(--wpds-typography-font-size-lg, 15px);
1706
- font-weight: var(--wpds-typography-font-weight-medium, 499);
1719
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1707
1720
  color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1708
1721
  margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
1709
1722
  padding: 0 var(--wpds-dimension-padding-2xl, 24px);
@@ -1848,7 +1861,7 @@ div.dataviews-view-list {
1848
1861
  padding-bottom: var(--wpds-dimension-padding-sm, 8px);
1849
1862
  font-size: 11px;
1850
1863
  text-transform: uppercase;
1851
- font-weight: var(--wpds-typography-font-weight-medium, 499);
1864
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1852
1865
  }
1853
1866
 
1854
1867
  .dataviews-view-table thead th:has(.dataviews-view-table-header-button) {
@@ -1896,7 +1909,7 @@ div.dataviews-view-list {
1896
1909
  padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-sm, 8px);
1897
1910
  font-size: 11px;
1898
1911
  text-transform: uppercase;
1899
- font-weight: var(--wpds-typography-font-weight-medium, 499);
1912
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1900
1913
  }
1901
1914
 
1902
1915
  .dataviews-view-table .dataviews-view-table-header-button:not(:hover) {
@@ -1989,7 +2002,7 @@ div.dataviews-view-list {
1989
2002
  }
1990
2003
 
1991
2004
  .dataviews-view-table__group-header-row .dataviews-view-table__group-header-cell {
1992
- font-weight: var(--wpds-typography-font-weight-medium, 499);
2005
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
1993
2006
  padding: var(--wpds-dimension-padding-md, 12px) var(--wpds-dimension-padding-2xl, 24px);
1994
2007
  color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
1995
2008
  }
@@ -2170,7 +2183,7 @@ div.dataviews-view-list {
2170
2183
 
2171
2184
  .dataviews-view-picker-grid-group__header {
2172
2185
  font-size: var(--wpds-typography-font-size-lg, 15px);
2173
- font-weight: var(--wpds-typography-font-weight-medium, 499);
2186
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2174
2187
  color: var(--wpds-color-foreground-content-neutral, #1e1e1e);
2175
2188
  margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
2176
2189
  padding: 0 48px;
@@ -2220,7 +2233,7 @@ div.dataviews-view-list {
2220
2233
 
2221
2234
  .dataviews-view-activity .dataviews-view-activity__group-header {
2222
2235
  font-size: var(--wpds-typography-font-size-lg, 15px);
2223
- font-weight: var(--wpds-typography-font-weight-medium, 499);
2236
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2224
2237
  color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2225
2238
  margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
2226
2239
  padding: 0;
@@ -2591,7 +2604,7 @@ div.dataviews-view-list {
2591
2604
 
2592
2605
  .dataviews-view-picker-activity .dataviews-view-picker-activity-group__header {
2593
2606
  font-size: var(--wpds-typography-font-size-lg, 15px);
2594
- font-weight: var(--wpds-typography-font-weight-medium, 499);
2607
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2595
2608
  color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2596
2609
  margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
2597
2610
  padding: 0;
@@ -2635,6 +2648,11 @@ div.dataviews-view-list {
2635
2648
  align-self: flex-end;
2636
2649
  }
2637
2650
 
2651
+ .dataviews-controls__richtext [data-rich-text-placeholder]::after {
2652
+ content: attr(data-rich-text-placeholder);
2653
+ color: color-mix(in srgb, currentColor, transparent 38%);
2654
+ }
2655
+
2638
2656
  .dataviews-controls__datetime {
2639
2657
  border: none;
2640
2658
  padding: 0;
@@ -2711,7 +2729,7 @@ div.dataviews-view-list {
2711
2729
 
2712
2730
  .dataforms-layouts-panel__field-trigger.is-disabled .dataforms-layouts-panel__field-control {
2713
2731
  color: var(--wpds-color-foreground-content-neutral-weak, #707070);
2714
- font-weight: var(--wpds-typography-font-weight-regular, 400);
2732
+ font-weight: var(--wpds-typography-font-weight-default, 400);
2715
2733
  }
2716
2734
 
2717
2735
  .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon {
@@ -2787,7 +2805,7 @@ div.dataviews-view-list {
2787
2805
  padding-inline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px));
2788
2806
  margin-inline: calc(-1 * var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)));
2789
2807
  word-break: break-word;
2790
- font-weight: var(--wpds-typography-font-weight-medium, 499);
2808
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
2791
2809
  }
2792
2810
 
2793
2811
  .dataforms-layouts-panel__field-control > * {
@@ -2906,8 +2924,8 @@ div.dataviews-view-list {
2906
2924
  }
2907
2925
 
2908
2926
  .dataforms-layouts__wrapper {
2909
- font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2910
- font-weight: 400;
2927
+ font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
2928
+ font-weight: var(--wpds-typography-font-weight-default, 400);
2911
2929
  font-size: 13px;
2912
2930
  line-height: 20px;
2913
2931
  }
@@ -2981,6 +2999,12 @@ div.dataviews-view-list {
2981
2999
  /**
2982
3000
  * Focus styles.
2983
3001
  */
3002
+ /**
3003
+ * Standard focus rings for the WordPress Design System.
3004
+ *
3005
+ * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
3006
+ * e.g. `&:focus { @include outset-ring__focus(); }`.
3007
+ */
2984
3008
  /**
2985
3009
  * Applies editor left position to the selector passed as argument
2986
3010
  */
@@ -3120,7 +3144,6 @@ fieldset.fields__media-edit .fields__media-edit-description {
3120
3144
  }
3121
3145
 
3122
3146
  fieldset.fields__media-edit {
3123
- /* stylelint-disable-next-line property-no-unknown -- '@container' not globally permitted */
3124
3147
  container-type: inline-size;
3125
3148
  }
3126
3149
 
@@ -3360,7 +3383,6 @@ fieldset.fields__media-edit .fields__media-edit-expanded.is-empty .fields__media
3360
3383
 
3361
3384
  fieldset.fields__media-edit .fields__media-edit-expanded.is-multiple:not(.is-empty) {
3362
3385
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
3363
- /* stylelint-disable-next-line property-no-unknown -- '@container' not globally permitted */
3364
3386
  }
3365
3387
 
3366
3388
  @container (max-width: 500px) {
@@ -3448,7 +3470,7 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
3448
3470
  }
3449
3471
 
3450
3472
  .fields-controls__slug .fields-controls__slug-help .fields-controls__slug-help-slug {
3451
- font-weight: 600;
3473
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3452
3474
  }
3453
3475
 
3454
3476
  .fields-controls__featured-image-image,
@@ -3568,6 +3590,12 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
3568
3590
  /**
3569
3591
  * Focus styles.
3570
3592
  */
3593
+ /**
3594
+ * Standard focus rings for the WordPress Design System.
3595
+ *
3596
+ * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
3597
+ * e.g. `&:focus { @include outset-ring__focus(); }`.
3598
+ */
3571
3599
  /**
3572
3600
  * Applies editor left position to the selector passed as argument
3573
3601
  */
@@ -3604,7 +3632,7 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
3604
3632
 
3605
3633
  .font-library-modal .font-library__subtitle {
3606
3634
  text-transform: uppercase;
3607
- font-weight: 499;
3635
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3608
3636
  font-size: 11px;
3609
3637
  }
3610
3638
 
@@ -3655,20 +3683,20 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
3655
3683
 
3656
3684
  .font-library__page-selection {
3657
3685
  font-size: 11px;
3658
- font-weight: 499;
3686
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3659
3687
  text-transform: uppercase;
3660
3688
  }
3661
3689
 
3662
3690
  @media (min-width: 600px) {
3663
3691
  .font-library__page-selection .font-library__page-selection-trigger {
3664
3692
  font-size: 11px !important;
3665
- font-weight: 499;
3693
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3666
3694
  }
3667
3695
  }
3668
3696
  .font-library__fonts-title {
3669
3697
  text-transform: uppercase;
3670
3698
  font-size: 11px;
3671
- font-weight: 600;
3699
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3672
3700
  margin-top: 0;
3673
3701
  margin-bottom: 0;
3674
3702
  }
@@ -3905,7 +3933,7 @@ button.font-library__upload-area {
3905
3933
 
3906
3934
  .global-styles-ui-screen-revisions__description .global-styles-ui-screen-revisions__date {
3907
3935
  text-transform: uppercase;
3908
- font-weight: 600;
3936
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
3909
3937
  font-size: 12px;
3910
3938
  }
3911
3939
 
@@ -4090,13 +4118,13 @@ button.font-library__upload-area {
4090
4118
  .global-styles-ui-subtitle {
4091
4119
  margin-bottom: 0 !important;
4092
4120
  text-transform: uppercase;
4093
- font-weight: 499 !important;
4121
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600) !important;
4094
4122
  font-size: 11px !important;
4095
4123
  }
4096
4124
 
4097
4125
  .global-styles-ui-section-title {
4098
4126
  color: #2f2f2f;
4099
- font-weight: 600;
4127
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4100
4128
  line-height: 1.2;
4101
4129
  padding: 16px 16px 0;
4102
4130
  margin: 0;
@@ -4240,6 +4268,14 @@ button.font-library__upload-area {
4240
4268
  height: 100%;
4241
4269
  }
4242
4270
 
4271
+ .global-styles-ui-color-palette__tablist-container {
4272
+ border-bottom: 1px solid #ddd;
4273
+ }
4274
+
4275
+ .global-styles-ui-color-palette__tablist {
4276
+ margin-bottom: -1px;
4277
+ }
4278
+
4243
4279
  .global-styles-ui-sidebar__navigator-screen .single-column {
4244
4280
  grid-column: span 1;
4245
4281
  }
@@ -4509,7 +4545,7 @@ button.font-library__upload-area {
4509
4545
  top: 0;
4510
4546
  }
4511
4547
 
4512
- .edit-site-page-patterns-dataviews .dataviews-view-grid__badge-fields .dataviews-view-grid__field-value:has(.edit-site-patterns__field-sync-status-fully) {
4548
+ .edit-site-page-patterns-dataviews .dataviews-view-grid__badge-fields .dataviews-view-grid__field-value:has(.fields-field__pattern-sync-status-fully) {
4513
4549
  background: rgba(var(--wp-block-synced-color--rgb), 0.04);
4514
4550
  color: var(--wp-block-synced-color);
4515
4551
  }
@@ -4608,59 +4644,6 @@ button.font-library__upload-area {
4608
4644
  justify-content: center;
4609
4645
  }
4610
4646
 
4611
- .edit-site-editor__view-mode-toggle {
4612
- /* stylelint-disable -- Disable reason: View Transitions not supported properly by stylelint. */
4613
- view-transition-name: toggle;
4614
- /* stylelint-enable */
4615
- top: 0;
4616
- right: 0;
4617
- height: 64px;
4618
- width: 64px;
4619
- z-index: 100;
4620
- }
4621
- .edit-site-editor__view-mode-toggle .components-button {
4622
- color: #fff;
4623
- height: 100%;
4624
- width: 100%;
4625
- border-radius: 0;
4626
- overflow: hidden;
4627
- padding: 0;
4628
- display: flex;
4629
- align-items: center;
4630
- justify-content: center;
4631
- }
4632
- .edit-site-editor__view-mode-toggle .components-button:hover, .edit-site-editor__view-mode-toggle .components-button:active {
4633
- color: #fff;
4634
- }
4635
- .edit-site-editor__view-mode-toggle .components-button:focus {
4636
- box-shadow: none;
4637
- }
4638
- .edit-site-editor__view-mode-toggle .edit-site-editor__view-mode-toggle-icon svg,
4639
- .edit-site-editor__view-mode-toggle .edit-site-editor__view-mode-toggle-icon img {
4640
- background: #1e1e1e;
4641
- display: block;
4642
- }
4643
-
4644
- .edit-site-editor__back-icon {
4645
- position: absolute;
4646
- top: 0;
4647
- right: 0;
4648
- width: 64px;
4649
- height: 64px;
4650
- display: flex;
4651
- align-items: center;
4652
- justify-content: center;
4653
- background-color: hsl(0, 0%, 80%);
4654
- pointer-events: none;
4655
- }
4656
- .edit-site-editor__back-icon svg {
4657
- fill: currentColor;
4658
- }
4659
- .edit-site-editor__back-icon.has-site-icon {
4660
- background-color: hsla(0, 0%, 100%, 0.6);
4661
- backdrop-filter: saturate(180%) blur(15px);
4662
- }
4663
-
4664
4647
  .edit-site-welcome-guide {
4665
4648
  width: 312px;
4666
4649
  }
@@ -4685,7 +4668,7 @@ button.font-library__upload-area {
4685
4668
  object-fit: cover;
4686
4669
  }
4687
4670
  .edit-site-welcome-guide__heading {
4688
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4671
+ font-family: -apple-system, system-ui, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
4689
4672
  font-size: 24px;
4690
4673
  line-height: 1.4;
4691
4674
  margin: 16px 0 16px 0;
@@ -4721,6 +4704,7 @@ button.font-library__upload-area {
4721
4704
 
4722
4705
  .edit-site-layout__content {
4723
4706
  height: 100%;
4707
+ min-height: 0;
4724
4708
  flex-grow: 1;
4725
4709
  display: flex;
4726
4710
  }
@@ -4737,14 +4721,15 @@ button.font-library__upload-area {
4737
4721
  }
4738
4722
  .edit-site-layout.is-full-canvas .edit-site-layout__sidebar-region {
4739
4723
  position: fixed !important;
4740
- height: 100vh;
4724
+ height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
4741
4725
  right: 0;
4742
- top: 0;
4726
+ top: var(--wp-admin--admin-bar--height, 0);
4743
4727
  }
4744
4728
  .edit-site-layout__sidebar-region .edit-site-layout__sidebar {
4745
4729
  display: flex;
4746
4730
  flex-direction: column;
4747
4731
  height: 100%;
4732
+ min-height: 0;
4748
4733
  }
4749
4734
  .edit-site-layout__sidebar-region .resizable-editor__drag-handle {
4750
4735
  left: 0;
@@ -4853,7 +4838,6 @@ button.font-library__upload-area {
4853
4838
  height: 100%;
4854
4839
  }
4855
4840
 
4856
- /* stylelint-disable -- Disable reason: View Transitions not supported properly by stylelint. */
4857
4841
  html.canvas-mode-edit-transition::view-transition-group(toggle) {
4858
4842
  animation-delay: 255ms;
4859
4843
  }
@@ -4865,59 +4849,6 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
4865
4849
  animation: none !important;
4866
4850
  }
4867
4851
  }
4868
- /* stylelint-enable */
4869
- .edit-site-layout.is-full-canvas .edit-site-layout__sidebar-region .edit-site-layout__view-mode-toggle {
4870
- display: none;
4871
- }
4872
-
4873
- .edit-site-layout__view-mode-toggle.components-button {
4874
- /* stylelint-disable -- Disable reason: View Transitions not supported properly by stylelint. */
4875
- view-transition-name: toggle;
4876
- /* stylelint-enable */
4877
- position: relative;
4878
- color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
4879
- height: 64px;
4880
- width: 64px;
4881
- overflow: hidden;
4882
- padding: 0;
4883
- display: flex;
4884
- align-items: center;
4885
- justify-content: center;
4886
- background: var(--wpds-color-background-surface-neutral-weak, #f4f4f4);
4887
- border-radius: 0;
4888
- }
4889
- .edit-site-layout__view-mode-toggle.components-button:hover, .edit-site-layout__view-mode-toggle.components-button:active {
4890
- color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
4891
- }
4892
- .edit-site-layout__view-mode-toggle.components-button:focus-visible, .edit-site-layout__view-mode-toggle.components-button:focus {
4893
- box-shadow: 0 0 0 3px #1e1e1e, 0 0 0 6px var(--wp-admin-theme-color);
4894
- outline: 4px solid rgba(0, 0, 0, 0);
4895
- outline-offset: 4px;
4896
- }
4897
- .edit-site-layout__view-mode-toggle.components-button::before {
4898
- content: "";
4899
- display: block;
4900
- position: absolute;
4901
- top: 9px;
4902
- left: 9px;
4903
- bottom: 9px;
4904
- right: 17px;
4905
- border-radius: 4px;
4906
- box-shadow: none;
4907
- }
4908
- @media not (prefers-reduced-motion) {
4909
- .edit-site-layout__view-mode-toggle.components-button::before {
4910
- transition: box-shadow 0.1s ease;
4911
- }
4912
- }
4913
- .edit-site-layout__view-mode-toggle.components-button .edit-site-layout__view-mode-toggle-icon {
4914
- display: flex;
4915
- height: 64px;
4916
- width: 64px;
4917
- justify-content: center;
4918
- align-items: center;
4919
- }
4920
-
4921
4852
  .edit-site-layout__actions {
4922
4853
  z-index: 100000;
4923
4854
  position: fixed !important;
@@ -4934,7 +4865,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
4934
4865
  bottom: 0;
4935
4866
  }
4936
4867
  .edit-site-layout__actions.is-entity-save-view-open:focus, .edit-site-layout__actions.is-entity-save-view-open:focus-within {
4937
- top: 0;
4868
+ top: var(--wp-admin--admin-bar--height, 0);
4938
4869
  }
4939
4870
  @media (min-width: 782px) {
4940
4871
  .edit-site-layout__actions {
@@ -5001,6 +4932,8 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
5001
4932
 
5002
4933
  .edit-site-sidebar__content {
5003
4934
  flex-grow: 1;
4935
+ flex-basis: 0;
4936
+ min-height: 0;
5004
4937
  overflow-y: auto;
5005
4938
  overflow-x: hidden;
5006
4939
  contain: content;
@@ -5088,14 +5021,9 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
5088
5021
  color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
5089
5022
  flex-shrink: 0;
5090
5023
  }
5091
- .edit-site-sidebar-button:focus:not(:disabled) {
5092
- box-shadow: none;
5024
+ .edit-site-sidebar-button:focus:not(:focus-visible) {
5093
5025
  outline: none;
5094
5026
  }
5095
- .edit-site-sidebar-button:focus-visible:not(:disabled) {
5096
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
5097
- outline: 3px solid transparent;
5098
- }
5099
5027
  .edit-site-sidebar-button:hover:not(:disabled, [aria-disabled=true]), .edit-site-sidebar-button:focus-visible, .edit-site-sidebar-button:focus, .edit-site-sidebar-button:not(:disabled, [aria-disabled=true]):active, .edit-site-sidebar-button[aria-expanded=true] {
5100
5028
  color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
5101
5029
  }
@@ -5107,17 +5035,18 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
5107
5035
  min-height: 40px;
5108
5036
  }
5109
5037
  .edit-site-sidebar-navigation-item.components-item:hover, .edit-site-sidebar-navigation-item.components-item:focus, .edit-site-sidebar-navigation-item.components-item[aria-current=true] {
5110
- color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
5038
+ color: var(--wpds-color-foreground-interactive-neutral-weak-active, #1e1e1e);
5111
5039
  }
5112
5040
  .edit-site-sidebar-navigation-item.components-item:hover .edit-site-sidebar-navigation-item__drilldown-indicator, .edit-site-sidebar-navigation-item.components-item:focus .edit-site-sidebar-navigation-item__drilldown-indicator, .edit-site-sidebar-navigation-item.components-item[aria-current=true] .edit-site-sidebar-navigation-item__drilldown-indicator {
5113
- fill: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
5041
+ fill: var(--wpds-color-foreground-interactive-neutral-weak-active, #1e1e1e);
5114
5042
  }
5115
5043
  .edit-site-sidebar-navigation-item.components-item[aria-current=true] {
5116
5044
  background: var(--wpds-color-background-interactive-neutral-weak-active, #ededed);
5117
- color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
5118
- font-weight: 499;
5045
+ color: var(--wpds-color-foreground-interactive-neutral-weak-active, #1e1e1e);
5046
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
5119
5047
  }
5120
5048
  .edit-site-sidebar-navigation-item.components-item:focus-visible {
5049
+ --wp-components-color-accent: var(--wpds-color-stroke-focus, var(--wp-admin-theme-color, #3858e9));
5121
5050
  transform: translateZ(0);
5122
5051
  }
5123
5052
  .edit-site-sidebar-navigation-item.components-item .edit-site-sidebar-navigation-item__drilldown-indicator {
@@ -5161,7 +5090,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
5161
5090
  position: sticky;
5162
5091
  top: 0;
5163
5092
  background: var(--wpds-color-background-surface-neutral-weak, #f4f4f4);
5164
- padding-top: 48px;
5093
+ padding-top: 32px;
5165
5094
  margin-bottom: 8px;
5166
5095
  padding-bottom: 8px;
5167
5096
  z-index: 1;
@@ -5271,7 +5200,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
5271
5200
  }
5272
5201
  .edit-site-sidebar-navigation-screen-patterns__group-header h2 {
5273
5202
  font-size: 11px;
5274
- font-weight: 499;
5203
+ font-weight: var(--wpds-typography-font-weight-emphasis, 600);
5275
5204
  text-transform: uppercase;
5276
5205
  }
5277
5206
 
@@ -5302,13 +5231,13 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
5302
5231
  color: var(--wpds-color-foreground-interactive-neutral-weak, #707070);
5303
5232
  }
5304
5233
  .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block-select-button:hover, .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block-select-button:focus, .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block-select-button[aria-current] {
5305
- color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
5234
+ color: var(--wpds-color-foreground-interactive-neutral-weak-active, #1e1e1e);
5306
5235
  }
5307
5236
  .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block__menu {
5308
5237
  color: var(--wpds-color-foreground-interactive-neutral-weak, #707070);
5309
5238
  }
5310
5239
  .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block__menu:hover, .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-list-view-block__menu:focus {
5311
- color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
5240
+ color: var(--wpds-color-foreground-interactive-neutral-weak-active, #1e1e1e);
5312
5241
  }
5313
5242
  .edit-site-sidebar-navigation-screen-navigation-menus__content .block-editor-inserter__toggle {
5314
5243
  background: var(--wpds-color-background-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
@@ -5347,108 +5276,12 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
5347
5276
  .edit-site-site-hub {
5348
5277
  display: flex;
5349
5278
  align-items: center;
5350
- justify-content: space-between;
5351
- gap: 8px;
5352
- margin-left: 12px;
5353
- height: 64px;
5354
- }
5355
-
5356
- .edit-site-site-hub__actions {
5357
- flex-shrink: 0;
5358
- }
5359
-
5360
- .edit-site-site-hub__view-mode-toggle-container {
5279
+ padding-right: 16px;
5361
5280
  height: 64px;
5362
- width: 64px;
5363
- flex-shrink: 0;
5364
- }
5365
- .edit-site-site-hub__view-mode-toggle-container.has-transparent-background .edit-site-layout__view-mode-toggle-icon {
5366
- background: transparent;
5367
- }
5368
-
5369
- .edit-site-site-hub__title .components-button {
5370
- color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
5371
- display: block;
5372
- flex-grow: 1;
5373
- font-size: 15px;
5374
- font-weight: 499;
5375
- overflow: hidden;
5376
- padding-left: 16px;
5377
- margin-right: -4px;
5378
- position: relative;
5379
- text-decoration: none;
5380
- text-overflow: ellipsis;
5381
- white-space: nowrap;
5382
- }
5383
- .edit-site-site-hub__title .components-button:hover, .edit-site-site-hub__title .components-button:focus, .edit-site-site-hub__title .components-button:active {
5384
- color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
5385
- }
5386
- .edit-site-site-hub__title .components-button:focus {
5387
- box-shadow: none;
5388
- outline: none;
5389
- }
5390
- .edit-site-site-hub__title .components-button:focus-visible {
5391
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-background-surface-neutral-weak, #f4f4f4), 0 0 0 calc(2 * var(--wp-admin-border-width-focus)) var(--wp-admin-theme-color);
5392
- outline: 2px solid transparent;
5393
- outline-offset: 2px;
5394
- }
5395
- .edit-site-site-hub__title .components-button::after {
5396
- content: "↗";
5397
- font-weight: 400;
5398
- opacity: 0;
5399
- position: absolute;
5400
- left: 0;
5401
- }
5402
- @media not (prefers-reduced-motion) {
5403
- .edit-site-site-hub__title .components-button::after {
5404
- transition: opacity 0.1s linear;
5405
- }
5406
- }
5407
- .edit-site-site-hub__title .components-button:hover::after, .edit-site-site-hub__title .components-button:focus::after, .edit-site-site-hub__title .components-button:active::after {
5408
- opacity: 1;
5409
- }
5410
-
5411
- .edit-site-site-hub_toggle-command-center {
5412
- color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
5413
- }
5414
- .edit-site-site-hub_toggle-command-center:hover svg, .edit-site-site-hub_toggle-command-center:active svg {
5415
- fill: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
5416
- }
5417
-
5418
- .edit-site-site-icon__icon {
5419
- fill: currentColor;
5420
- width: 100%;
5421
- height: 100%;
5422
- }
5423
- .edit-site-layout.is-full-canvas .edit-site-site-icon__icon {
5424
- padding: 12px;
5425
- }
5426
-
5427
- .edit-site-site-icon__image {
5428
- width: 100%;
5429
- height: 100%;
5430
- -o-object-fit: cover;
5431
- object-fit: cover;
5432
- background: #333;
5433
- aspect-ratio: 1/1;
5434
- }
5435
- .edit-site-layout.is-full-canvas .edit-site-site-icon__image {
5436
- border-radius: 0;
5437
5281
  }
5438
5282
 
5439
- .edit-site-editor__view-mode-toggle button:focus {
5440
- position: relative;
5441
- }
5442
- .edit-site-editor__view-mode-toggle button:focus::before {
5443
- content: "";
5444
- display: block;
5445
- position: absolute;
5446
- z-index: 1;
5447
- top: 0;
5448
- left: 0;
5449
- bottom: 0;
5450
- right: 0;
5451
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 0 calc(1px + var(--wp-admin-border-width-focus)) #fff;
5283
+ .edit-site-site-hub__back-button:hover:not(:disabled, [aria-disabled=true]), .edit-site-site-hub__back-button:active:not(:disabled, [aria-disabled=true]) {
5284
+ color: var(--wpds-color-foreground-interactive-neutral-active, #1e1e1e);
5452
5285
  }
5453
5286
 
5454
5287
  .fields-controls__password {
@@ -5618,12 +5451,14 @@ body:has(.edit-site-resizable-frame__inner.is-resizing) {
5618
5451
  padding-left: 0;
5619
5452
  }
5620
5453
  .edit-site-styles .global-styles-ui-sidebar__navigator-provider .global-styles-ui-sidebar__navigator-screen {
5621
- padding-top: 12px;
5622
- padding-right: 12px;
5623
- padding-left: 12px;
5624
- padding-bottom: 12px;
5454
+ padding: 12px;
5625
5455
  outline: none;
5626
5456
  }
5457
+ .edit-site-styles .global-styles-ui-sidebar__navigator-provider .global-styles-ui-sidebar__navigator-screen .global-styles-ui-color-palette__tablist-container {
5458
+ margin-inline: -12px;
5459
+ width: calc(100% + 24px);
5460
+ padding-inline: 12px;
5461
+ }
5627
5462
  .edit-site-styles .edit-site-sidebar-button {
5628
5463
  color: var(--wpds-color-foreground-interactive-neutral, #1e1e1e);
5629
5464
  }
@@ -5640,66 +5475,6 @@ body:has(.edit-site-resizable-frame__inner.is-resizing) {
5640
5475
  font-size: var(--wpds-typography-font-size-sm, 12px);
5641
5476
  }
5642
5477
 
5643
- body.has-admin-bar-in-editor {
5644
- margin-top: 0;
5645
- height: 100%;
5646
- }
5647
- body.has-admin-bar-in-editor:has(.editor-editor-interface.is-distraction-free) {
5648
- --wp-admin--admin-bar--height: 0;
5649
- }
5650
- body.has-admin-bar-in-editor .edit-site-site-hub__title,
5651
- body.has-admin-bar-in-editor .edit-site-site-hub__actions {
5652
- display: none;
5653
- }
5654
- body.has-admin-bar-in-editor .edit-site-editor__view-mode-toggle .edit-site-editor__back-icon {
5655
- background: transparent;
5656
- }
5657
- body.has-admin-bar-in-editor .edit-site-editor__view-mode-toggle:hover .edit-site-editor__back-icon {
5658
- color: var(--wp-admin-theme-color);
5659
- }
5660
- body.has-admin-bar-in-editor .edit-site-sidebar-navigation-screen__title-icon {
5661
- padding-top: 32px;
5662
- }
5663
- body.has-admin-bar-in-editor .edit-site-layout__content,
5664
- body.has-admin-bar-in-editor .edit-site-layout__sidebar {
5665
- min-height: 0;
5666
- }
5667
- body.has-admin-bar-in-editor .edit-site-sidebar__content {
5668
- flex-basis: 0;
5669
- min-height: 0;
5670
- }
5671
- body.has-admin-bar-in-editor .edit-site {
5672
- box-sizing: border-box;
5673
- padding-top: var(--wp-admin--admin-bar--height, 0);
5674
- height: 100vh;
5675
- min-height: 100vh;
5676
- }
5677
- @media (min-width: 600px) {
5678
- body.has-admin-bar-in-editor .edit-site {
5679
- padding-top: 0;
5680
- top: var(--wp-admin--admin-bar--height, 0);
5681
- height: calc(100vh - var(--wp-admin--admin-bar--height, 0));
5682
- min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0));
5683
- }
5684
- }
5685
- body.has-admin-bar-in-editor .edit-site-layout.is-full-canvas .edit-site-layout__sidebar-region {
5686
- top: var(--wp-admin--admin-bar--height, 0);
5687
- height: calc(100vh - var(--wp-admin--admin-bar--height, 0));
5688
- }
5689
- body.has-admin-bar-in-editor.is-fullscreen-mode .is-entity-save-view-open .interface-interface-skeleton__actions:focus,
5690
- body.has-admin-bar-in-editor.is-fullscreen-mode .is-entity-save-view-open .interface-interface-skeleton__actions:focus-within,
5691
- body.has-admin-bar-in-editor.is-fullscreen-mode .edit-site-layout__actions.is-entity-save-view-open:focus,
5692
- body.has-admin-bar-in-editor.is-fullscreen-mode .edit-site-layout__actions.is-entity-save-view-open:focus-within {
5693
- top: var(--wp-admin--admin-bar--height, 0);
5694
- }
5695
- body.has-admin-bar-in-editor.is-fullscreen-mode #wpadminbar {
5696
- display: block;
5697
- }
5698
- body.has-admin-bar-in-editor.is-fullscreen-mode:has(.editor-editor-interface.is-distraction-free) #wpadminbar {
5699
- display: none;
5700
- }
5701
-
5702
- /* stylelint-disable -- Disable reason: View Transitions not supported properly by stylelint. */
5703
5478
  ::view-transition-image-pair(root) {
5704
5479
  isolation: auto;
5705
5480
  }
@@ -5711,11 +5486,6 @@ body.has-admin-bar-in-editor.is-fullscreen-mode:has(.editor-editor-interface.is-
5711
5486
  display: block;
5712
5487
  }
5713
5488
 
5714
- /* stylelint-enable */
5715
- body.js #wpadminbar {
5716
- display: none;
5717
- }
5718
-
5719
5489
  body.js #wpbody {
5720
5490
  padding-top: 0;
5721
5491
  }
@@ -5765,6 +5535,14 @@ body.js.site-editor-php .media-frame select.attachment-filters:last-of-type {
5765
5535
  body.js.site-editor-php {
5766
5536
  background: var(--wpds-color-background-surface-neutral-weak, #f4f4f4);
5767
5537
  }
5538
+ @media (min-width: 782px) {
5539
+ body.js.site-editor-php:has(.editor-editor-interface.is-distraction-free) {
5540
+ --wp-admin--admin-bar--height: 0px;
5541
+ }
5542
+ body.js.site-editor-php:has(.editor-editor-interface.is-distraction-free) #wpadminbar {
5543
+ display: none;
5544
+ }
5545
+ }
5768
5546
 
5769
5547
  .edit-site {
5770
5548
  box-sizing: border-box;
@@ -5775,16 +5553,18 @@ body.js.site-editor-php {
5775
5553
  box-sizing: inherit;
5776
5554
  }
5777
5555
  .edit-site {
5556
+ padding-top: var(--wp-admin--admin-bar--height, 0);
5778
5557
  height: 100vh;
5779
5558
  }
5780
5559
  @media (min-width: 600px) {
5781
5560
  .edit-site {
5782
5561
  bottom: 0;
5783
5562
  right: 0;
5784
- min-height: 100vh;
5563
+ height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
5564
+ padding-top: 0;
5785
5565
  position: fixed;
5786
5566
  left: 0;
5787
- top: 0;
5567
+ top: var(--wp-admin--admin-bar--height, 0);
5788
5568
  }
5789
5569
  }
5790
5570
  .no-js .edit-site {