@wordpress/base-styles 6.20.1-next.v.202604201441.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.
- package/CHANGELOG.md +37 -0
- package/_z-index.scss +2 -57
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,43 @@
|
|
|
2
2
|
|
|
3
3
|
## Unreleased
|
|
4
4
|
|
|
5
|
+
## 7.0.0 (2026-04-29)
|
|
6
|
+
|
|
7
|
+
### Breaking Changes
|
|
8
|
+
|
|
9
|
+
- Remove the following entries from the `z-index()` helper ([#77619](https://github.com/WordPress/gutenberg/pull/77619), [#77620](https://github.com/WordPress/gutenberg/pull/77620), [#77621](https://github.com/WordPress/gutenberg/pull/77621), [#77714](https://github.com/WordPress/gutenberg/pull/77714), [#77715](https://github.com/WordPress/gutenberg/pull/77715), [#77717](https://github.com/WordPress/gutenberg/pull/77717), [#77774](https://github.com/WordPress/gutenberg/pull/77774)):
|
|
10
|
+
- `.block-editor-block-contextual-toolbar`
|
|
11
|
+
- `.block-editor-block-list__block {core/image aligned wide or fullwide}`
|
|
12
|
+
- `.block-editor-block-list__block::before`
|
|
13
|
+
- `.block-editor-block-list__block.has-block-overlay`
|
|
14
|
+
- `.block-editor-block-list__block .reusable-block-edit-panel *`
|
|
15
|
+
- `.block-editor-block-list__insertion-point`
|
|
16
|
+
- `.block-editor-block-switcher__arrow`
|
|
17
|
+
- `.block-editor-url-input__suggestions`
|
|
18
|
+
- `.block-editor-warning`
|
|
19
|
+
- `.block-library-classic__toolbar`
|
|
20
|
+
- `.components-autocomplete__results`
|
|
21
|
+
- `.components-button {:focus or .is-primary}`
|
|
22
|
+
- `.components-circular-option-picker__option-wrapper::before`
|
|
23
|
+
- `.components-circular-option-picker__option.is-pressed`
|
|
24
|
+
- `.components-circular-option-picker__option.is-pressed + svg`
|
|
25
|
+
- `.components-circular-option-picker__swatches`
|
|
26
|
+
- `> *:not(.components-circular-option-picker__swatches)`
|
|
27
|
+
- `.components-form-toggle__input`
|
|
28
|
+
- `.components-popover.block-editor-inspector-list-view-content-popover`
|
|
29
|
+
- `.components-popover.interface-more-menu__content`
|
|
30
|
+
- `.components-resizable-box__handle`
|
|
31
|
+
- `.components-resizable-box__side-handle`
|
|
32
|
+
- `.components-resizable-box__corner-handle`
|
|
33
|
+
- `.dataviews-action-modal__quick-edit`
|
|
34
|
+
- `.edit-site-editor__toggle-save-panel`
|
|
35
|
+
- `.edit-site-template-panel__replace-template-modal`
|
|
36
|
+
- `.edit-widgets-header`
|
|
37
|
+
- `.edit-widgets-sidebar {greater than small}`
|
|
38
|
+
- `.interface-complementary-area .components-panel`
|
|
39
|
+
- `.interface-complementary-area .components-panel__header`
|
|
40
|
+
- `.wp-block-template-part__placeholder-preview-filter-input`
|
|
41
|
+
|
|
5
42
|
## 6.20.0 (2026-04-15)
|
|
6
43
|
|
|
7
44
|
## 6.19.0 (2026-04-01)
|
package/_z-index.scss
CHANGED
|
@@ -5,12 +5,7 @@
|
|
|
5
5
|
// value is designed to work with).
|
|
6
6
|
|
|
7
7
|
$z-layers: (
|
|
8
|
-
".block-editor-block-list__block::before": 0,
|
|
9
8
|
".block-editor-block-list__block.is-selected": 20,
|
|
10
|
-
".block-editor-block-switcher__arrow": 1,
|
|
11
|
-
".block-editor-block-list__block {core/image aligned wide or fullwide}": 20,
|
|
12
|
-
".block-library-classic__toolbar": 31, // When scrolled to top this toolbar needs to sit over block-editor-block-toolbar
|
|
13
|
-
".components-form-toggle__input": 1,
|
|
14
9
|
".editor-text-editor__toolbar": 1,
|
|
15
10
|
|
|
16
11
|
// These next three share a stacking context
|
|
@@ -18,21 +13,13 @@ $z-layers: (
|
|
|
18
13
|
".block-library-query-pattern__selection-search": 2, // higher sticky element
|
|
19
14
|
".editor-post-template__swap-template-search": 2, // higher sticky element
|
|
20
15
|
|
|
21
|
-
// These next two share a stacking context
|
|
22
|
-
".interface-complementary-area .components-panel" : 0, // lower scrolling content
|
|
23
|
-
".interface-complementary-area .components-panel__header": 1, // higher sticky element
|
|
24
|
-
|
|
25
16
|
".components-modal__header": 10,
|
|
26
17
|
".edit-post-meta-boxes-area.is-loading::before": 1,
|
|
27
18
|
".edit-post-meta-boxes-area .spinner": 5,
|
|
28
19
|
".components-popover__close": 5,
|
|
29
|
-
".block-editor-block-list__insertion-point": 6,
|
|
30
|
-
".block-editor-warning": 5,
|
|
31
|
-
".block-editor-url-input__suggestions": 30,
|
|
32
20
|
".edit-post-layout__footer": 30,
|
|
33
21
|
".interface-interface-skeleton__header": 30,
|
|
34
22
|
".interface-interface-skeleton__content": 20,
|
|
35
|
-
".edit-widgets-header": 30,
|
|
36
23
|
|
|
37
24
|
".wp-block-cover.is-placeholder .components-placeholder.is-large": 1, // Cover block resizer component inside a large placeholder.
|
|
38
25
|
// These z-index are now used only for a deprecated version of the cover block.
|
|
@@ -41,8 +28,6 @@ $z-layers: (
|
|
|
41
28
|
".wp-block-cover__image-background": 0, // Image background inside cover block.
|
|
42
29
|
".wp-block-cover__video-background": 0, // Video background inside cover block.
|
|
43
30
|
|
|
44
|
-
".wp-block-template-part__placeholder-preview-filter-input": 1,
|
|
45
|
-
|
|
46
31
|
// Fixed position appender:
|
|
47
32
|
".block-editor-block-list__block .block-list-appender": 2,
|
|
48
33
|
|
|
@@ -50,14 +35,9 @@ $z-layers: (
|
|
|
50
35
|
".has-child .wp-block-navigation__submenu-container": 28,
|
|
51
36
|
".has-child:hover .wp-block-navigation__submenu-container": 29,
|
|
52
37
|
|
|
53
|
-
// Active pill button
|
|
54
|
-
".components-button {:focus or .is-primary}": 1,
|
|
55
|
-
|
|
56
38
|
// The draggable element should show up above the entire UI
|
|
57
39
|
".components-draggable__clone": 1000000000,
|
|
58
40
|
|
|
59
|
-
".block-editor-block-list__block .reusable-block-edit-panel *": 1,
|
|
60
|
-
|
|
61
41
|
// Show drop zone above most standard content, but below any overlays
|
|
62
42
|
".components-drop-zone": 40,
|
|
63
43
|
".components-drop-zone__content": 50,
|
|
@@ -73,12 +53,6 @@ $z-layers: (
|
|
|
73
53
|
// Below the media library backdrop (.media-modal-backdrop), which has a z-index of 159900.
|
|
74
54
|
".block-editor-global-styles-background-panel__popover": 159900 - 10,
|
|
75
55
|
|
|
76
|
-
// The toolbar, when contextual, should be above any adjacent nested block click overlays.
|
|
77
|
-
".block-editor-block-contextual-toolbar": 61,
|
|
78
|
-
|
|
79
|
-
// Ensures content overlay appears higher than resize containers used for image/video/etc.
|
|
80
|
-
".block-editor-block-list__block.has-block-overlay": 10,
|
|
81
|
-
|
|
82
56
|
// Query block setup state.
|
|
83
57
|
".block-editor-block-pattern-setup .pattern-slide": 100,
|
|
84
58
|
".block-editor-block-pattern-setup .{next,previous}-slide": 101,
|
|
@@ -94,14 +68,9 @@ $z-layers: (
|
|
|
94
68
|
// the Publish Post sidebar.
|
|
95
69
|
".editor-post-publish-panel {greater than small}": 99998,
|
|
96
70
|
|
|
97
|
-
// For larger views, the wp-admin navbar dropdown should be on top of
|
|
98
|
-
// the multi-entity saving sidebar.
|
|
99
|
-
".edit-site-editor__toggle-save-panel": 100000,
|
|
100
|
-
|
|
101
71
|
// Show sidebar in greater than small viewports above editor related elements
|
|
102
72
|
// but below #adminmenuback { z-index: 100 }
|
|
103
73
|
".interface-interface-skeleton__sidebar {greater than small}": 90,
|
|
104
|
-
".edit-widgets-sidebar {greater than small}": 90,
|
|
105
74
|
|
|
106
75
|
// Show interface skeleton footer above interface skeleton drawer
|
|
107
76
|
".interface-interface-skeleton__footer": 90,
|
|
@@ -136,26 +105,23 @@ $z-layers: (
|
|
|
136
105
|
".editor-action-modal": 1000001,
|
|
137
106
|
".editor-post-template__swap-template-modal": 1000001,
|
|
138
107
|
".editor-post-template__create-template-modal": 1000001,
|
|
139
|
-
".edit-site-template-panel__replace-template-modal": 1000001,
|
|
140
108
|
".editor-sync-connection-error-modal": 1000001,
|
|
109
|
+
".components-snackbar-list.media-editor-modal__snackbar": 1000001,
|
|
141
110
|
|
|
142
111
|
// Note: The ConfirmDialog component's z-index is being set to 1000001 in packages/components/src/confirm-dialog/styles.ts
|
|
143
112
|
// because it uses emotion and not sass. We need it to render on top its parent popover.
|
|
144
113
|
|
|
145
114
|
// Show media replace flow and similar popovers beneath the media modal when its open.
|
|
146
115
|
".components-popover.block-editor-media-replace-flow__options": 99999,
|
|
147
|
-
".components-popover.block-
|
|
116
|
+
".components-popover.block-library-video-tracks-editor": 99999,
|
|
148
117
|
|
|
149
118
|
// ...Except for popovers immediately beneath wp-admin menu on large breakpoints
|
|
150
119
|
".components-popover.block-editor-inserter__popover": 99999,
|
|
151
120
|
".components-popover.table-of-contents__popover": 99998,
|
|
152
|
-
".components-popover.interface-more-menu__content": 99998,
|
|
153
121
|
".components-popover.more-menu__content": 99998,
|
|
154
122
|
".components-popover.block-editor-rich-text__inline-format-toolbar": 99998,
|
|
155
123
|
".components-popover.block-editor-warning__dropdown": 99998,
|
|
156
124
|
|
|
157
|
-
".components-autocomplete__results": 1000000,
|
|
158
|
-
|
|
159
125
|
".skip-to-selected-block": 100000,
|
|
160
126
|
".interface-interface-skeleton__actions": 100000,
|
|
161
127
|
".edit-site-layout__actions": 100000,
|
|
@@ -169,28 +135,11 @@ $z-layers: (
|
|
|
169
135
|
// Show tooltips above NUX tips, wp-admin menus, submenus, and sidebar:
|
|
170
136
|
".components-tooltip": 1000002,
|
|
171
137
|
|
|
172
|
-
// Make sure corner handles are above side handles for ResizableBox component
|
|
173
|
-
".components-resizable-box__handle": 2,
|
|
174
|
-
".components-resizable-box__side-handle": 2,
|
|
175
|
-
".components-resizable-box__corner-handle": 2,
|
|
176
|
-
|
|
177
138
|
// Make sure block manager sticky category titles appear above the options
|
|
178
139
|
".block-editor-block-manager__category-title": 1,
|
|
179
140
|
// And block manager sticky disabled block count is higher still
|
|
180
141
|
".block-editor-block-manager__disabled-blocks-count": 2,
|
|
181
142
|
|
|
182
|
-
// Needs to appear below other color circular picker related UI elements.
|
|
183
|
-
".components-circular-option-picker__option-wrapper::before": -1,
|
|
184
|
-
|
|
185
|
-
".components-circular-option-picker__option.is-pressed": 1,
|
|
186
|
-
// Needs to be higher than .components-circular-option-picker__option.is-pressed.
|
|
187
|
-
".components-circular-option-picker__option.is-pressed + svg": 2,
|
|
188
|
-
|
|
189
|
-
// The following two indexes are needed so that the swatches (and their tooltips)
|
|
190
|
-
// always render on top of the rest of the component's UI.
|
|
191
|
-
".components-circular-option-picker__swatches": 1,
|
|
192
|
-
"> *:not(.components-circular-option-picker__swatches)": 0,
|
|
193
|
-
|
|
194
143
|
// Appear under the customizer heading UI, but over anything else.
|
|
195
144
|
".customize-widgets__topbar": 8,
|
|
196
145
|
|
|
@@ -220,10 +169,6 @@ $z-layers: (
|
|
|
220
169
|
|
|
221
170
|
// Needs to be below media library (.media-model) that has a z-index of 160000.
|
|
222
171
|
".components-popover.components-dropdown__content.dataforms-layouts-panel__field-dropdown": 160000 - 10,
|
|
223
|
-
|
|
224
|
-
// Needs to be below the media library (.media-modal) that has a z-index of 160000.
|
|
225
|
-
// And the new experimental media modal that has a z-index of 100000.
|
|
226
|
-
".dataviews-action-modal__quick-edit": 100000 - 10,
|
|
227
172
|
);
|
|
228
173
|
|
|
229
174
|
@function z-index( $key ) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/base-styles",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "7.0.0",
|
|
4
4
|
"description": "Base SCSS utilities and variables for WordPress.",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -45,5 +45,5 @@
|
|
|
45
45
|
"publishConfig": {
|
|
46
46
|
"access": "public"
|
|
47
47
|
},
|
|
48
|
-
"gitHead": "
|
|
48
|
+
"gitHead": "8c229eaed0e88c9827e2da3d73a78f9ddd77714b"
|
|
49
49
|
}
|