@wordpress/edit-site 6.3.0 → 6.4.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 (221) hide show
  1. package/CHANGELOG.md +2 -0
  2. package/build/components/add-new-pattern/index.js +8 -2
  3. package/build/components/add-new-pattern/index.js.map +1 -1
  4. package/build/components/add-new-template/index.js +3 -1
  5. package/build/components/add-new-template/index.js.map +1 -1
  6. package/build/components/block-editor/use-site-editor-settings.js +1 -82
  7. package/build/components/block-editor/use-site-editor-settings.js.map +1 -1
  8. package/build/components/global-styles/block-preview-panel.js +14 -5
  9. package/build/components/global-styles/block-preview-panel.js.map +1 -1
  10. package/build/components/global-styles/font-families.js +42 -23
  11. package/build/components/global-styles/font-families.js.map +1 -1
  12. package/build/components/global-styles/font-library-modal/index.js +4 -4
  13. package/build/components/global-styles/font-library-modal/index.js.map +1 -1
  14. package/build/components/global-styles/font-library-modal/installed-fonts.js +58 -10
  15. package/build/components/global-styles/font-library-modal/installed-fonts.js.map +1 -1
  16. package/build/components/global-styles/font-sizes/confirm-delete-font-size-dialog.js +39 -0
  17. package/build/components/global-styles/font-sizes/confirm-delete-font-size-dialog.js.map +1 -0
  18. package/build/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js +39 -0
  19. package/build/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js.map +1 -0
  20. package/build/components/global-styles/font-sizes/font-size-preview.js +44 -0
  21. package/build/components/global-styles/font-sizes/font-size-preview.js.map +1 -0
  22. package/build/components/global-styles/font-sizes/font-size.js +213 -0
  23. package/build/components/global-styles/font-sizes/font-size.js.map +1 -0
  24. package/build/components/global-styles/font-sizes/font-sizes-count.js +50 -0
  25. package/build/components/global-styles/font-sizes/font-sizes-count.js.map +1 -0
  26. package/build/components/global-styles/font-sizes/font-sizes.js +163 -0
  27. package/build/components/global-styles/font-sizes/font-sizes.js.map +1 -0
  28. package/build/components/global-styles/font-sizes/rename-font-size-dialog.js +67 -0
  29. package/build/components/global-styles/font-sizes/rename-font-size-dialog.js.map +1 -0
  30. package/build/components/global-styles/screen-block.js +10 -8
  31. package/build/components/global-styles/screen-block.js.map +1 -1
  32. package/build/components/global-styles/screen-style-variations.js +2 -2
  33. package/build/components/global-styles/screen-style-variations.js.map +1 -1
  34. package/build/components/global-styles/screen-typography.js +3 -2
  35. package/build/components/global-styles/screen-typography.js.map +1 -1
  36. package/build/components/global-styles/size-control/index.js +85 -0
  37. package/build/components/global-styles/size-control/index.js.map +1 -0
  38. package/build/components/global-styles/style-variations-container.js +3 -0
  39. package/build/components/global-styles/style-variations-container.js.map +1 -1
  40. package/build/components/global-styles/ui.js +8 -0
  41. package/build/components/global-styles/ui.js.map +1 -1
  42. package/build/components/global-styles/variations/variations-color.js.map +1 -1
  43. package/build/components/global-styles/variations/variations-typography.js +1 -1
  44. package/build/components/global-styles/variations/variations-typography.js.map +1 -1
  45. package/build/components/layout/index.js +6 -0
  46. package/build/components/layout/index.js.map +1 -1
  47. package/build/components/layout/router.js +14 -6
  48. package/build/components/layout/router.js.map +1 -1
  49. package/build/components/page-patterns/header.js +1 -1
  50. package/build/components/page-patterns/header.js.map +1 -1
  51. package/build/components/page-patterns/index.js +23 -11
  52. package/build/components/page-patterns/index.js.map +1 -1
  53. package/build/components/page-templates/index.js +41 -34
  54. package/build/components/page-templates/index.js.map +1 -1
  55. package/build/components/post-edit/index.js +105 -0
  56. package/build/components/post-edit/index.js.map +1 -0
  57. package/build/components/post-fields/index.js +314 -0
  58. package/build/components/post-fields/index.js.map +1 -0
  59. package/build/components/post-list/index.js +281 -0
  60. package/build/components/post-list/index.js.map +1 -0
  61. package/build/components/posts-app/router.js +3 -3
  62. package/build/components/posts-app/router.js.map +1 -1
  63. package/build/components/sidebar-dataviews/default-views.js +22 -10
  64. package/build/components/sidebar-dataviews/default-views.js.map +1 -1
  65. package/build/components/sidebar-dataviews/index.js +40 -1
  66. package/build/components/sidebar-dataviews/index.js.map +1 -1
  67. package/build/components/sidebar-navigation-screen-global-styles/content.js +64 -0
  68. package/build/components/sidebar-navigation-screen-global-styles/content.js.map +1 -0
  69. package/build/components/sidebar-navigation-screen-global-styles/index.js +2 -47
  70. package/build/components/sidebar-navigation-screen-global-styles/index.js.map +1 -1
  71. package/build/hooks/push-changes-to-global-styles/index.js +1 -1
  72. package/build/hooks/push-changes-to-global-styles/index.js.map +1 -1
  73. package/build/index.js +5 -1
  74. package/build/index.js.map +1 -1
  75. package/build/store/selectors.js +34 -6
  76. package/build/store/selectors.js.map +1 -1
  77. package/build/utils/get-filtered-template-parts.js +64 -0
  78. package/build/utils/get-filtered-template-parts.js.map +1 -0
  79. package/build-module/components/add-new-pattern/index.js +8 -2
  80. package/build-module/components/add-new-pattern/index.js.map +1 -1
  81. package/build-module/components/add-new-template/index.js +3 -1
  82. package/build-module/components/add-new-template/index.js.map +1 -1
  83. package/build-module/components/block-editor/use-site-editor-settings.js +1 -82
  84. package/build-module/components/block-editor/use-site-editor-settings.js.map +1 -1
  85. package/build-module/components/global-styles/block-preview-panel.js +14 -5
  86. package/build-module/components/global-styles/block-preview-panel.js.map +1 -1
  87. package/build-module/components/global-styles/font-families.js +44 -25
  88. package/build-module/components/global-styles/font-families.js.map +1 -1
  89. package/build-module/components/global-styles/font-library-modal/index.js +4 -4
  90. package/build-module/components/global-styles/font-library-modal/index.js.map +1 -1
  91. package/build-module/components/global-styles/font-library-modal/installed-fonts.js +61 -13
  92. package/build-module/components/global-styles/font-library-modal/installed-fonts.js.map +1 -1
  93. package/build-module/components/global-styles/font-sizes/confirm-delete-font-size-dialog.js +32 -0
  94. package/build-module/components/global-styles/font-sizes/confirm-delete-font-size-dialog.js.map +1 -0
  95. package/build-module/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js +32 -0
  96. package/build-module/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js.map +1 -0
  97. package/build-module/components/global-styles/font-sizes/font-size-preview.js +37 -0
  98. package/build-module/components/global-styles/font-sizes/font-size-preview.js.map +1 -0
  99. package/build-module/components/global-styles/font-sizes/font-size.js +207 -0
  100. package/build-module/components/global-styles/font-sizes/font-size.js.map +1 -0
  101. package/build-module/components/global-styles/font-sizes/font-sizes-count.js +43 -0
  102. package/build-module/components/global-styles/font-sizes/font-sizes-count.js.map +1 -0
  103. package/build-module/components/global-styles/font-sizes/font-sizes.js +157 -0
  104. package/build-module/components/global-styles/font-sizes/font-sizes.js.map +1 -0
  105. package/build-module/components/global-styles/font-sizes/rename-font-size-dialog.js +61 -0
  106. package/build-module/components/global-styles/font-sizes/rename-font-size-dialog.js.map +1 -0
  107. package/build-module/components/global-styles/screen-block.js +10 -8
  108. package/build-module/components/global-styles/screen-block.js.map +1 -1
  109. package/build-module/components/global-styles/screen-style-variations.js +2 -2
  110. package/build-module/components/global-styles/screen-style-variations.js.map +1 -1
  111. package/build-module/components/global-styles/screen-typography.js +3 -2
  112. package/build-module/components/global-styles/screen-typography.js.map +1 -1
  113. package/build-module/components/global-styles/size-control/index.js +79 -0
  114. package/build-module/components/global-styles/size-control/index.js.map +1 -0
  115. package/build-module/components/global-styles/style-variations-container.js +3 -0
  116. package/build-module/components/global-styles/style-variations-container.js.map +1 -1
  117. package/build-module/components/global-styles/ui.js +8 -0
  118. package/build-module/components/global-styles/ui.js.map +1 -1
  119. package/build-module/components/global-styles/variations/variations-color.js +1 -1
  120. package/build-module/components/global-styles/variations/variations-color.js.map +1 -1
  121. package/build-module/components/global-styles/variations/variations-typography.js +1 -2
  122. package/build-module/components/global-styles/variations/variations-typography.js.map +1 -1
  123. package/build-module/components/layout/index.js +6 -0
  124. package/build-module/components/layout/index.js.map +1 -1
  125. package/build-module/components/layout/router.js +14 -6
  126. package/build-module/components/layout/router.js.map +1 -1
  127. package/build-module/components/page-patterns/header.js +1 -1
  128. package/build-module/components/page-patterns/header.js.map +1 -1
  129. package/build-module/components/page-patterns/index.js +23 -11
  130. package/build-module/components/page-patterns/index.js.map +1 -1
  131. package/build-module/components/page-templates/index.js +43 -37
  132. package/build-module/components/page-templates/index.js.map +1 -1
  133. package/build-module/components/post-edit/index.js +98 -0
  134. package/build-module/components/post-edit/index.js.map +1 -0
  135. package/build-module/components/post-fields/index.js +306 -0
  136. package/build-module/components/post-fields/index.js.map +1 -0
  137. package/build-module/components/post-list/index.js +275 -0
  138. package/build-module/components/post-list/index.js.map +1 -0
  139. package/build-module/components/posts-app/router.js +3 -3
  140. package/build-module/components/posts-app/router.js.map +1 -1
  141. package/build-module/components/sidebar-dataviews/default-views.js +21 -9
  142. package/build-module/components/sidebar-dataviews/default-views.js.map +1 -1
  143. package/build-module/components/sidebar-dataviews/index.js +42 -3
  144. package/build-module/components/sidebar-dataviews/index.js.map +1 -1
  145. package/build-module/components/sidebar-navigation-screen-global-styles/content.js +57 -0
  146. package/build-module/components/sidebar-navigation-screen-global-styles/content.js.map +1 -0
  147. package/build-module/components/sidebar-navigation-screen-global-styles/index.js +2 -47
  148. package/build-module/components/sidebar-navigation-screen-global-styles/index.js.map +1 -1
  149. package/build-module/hooks/push-changes-to-global-styles/index.js +1 -1
  150. package/build-module/hooks/push-changes-to-global-styles/index.js.map +1 -1
  151. package/build-module/index.js +5 -1
  152. package/build-module/index.js.map +1 -1
  153. package/build-module/store/selectors.js +35 -7
  154. package/build-module/store/selectors.js.map +1 -1
  155. package/build-module/utils/get-filtered-template-parts.js +57 -0
  156. package/build-module/utils/get-filtered-template-parts.js.map +1 -0
  157. package/build-style/posts-rtl.css +581 -503
  158. package/build-style/posts.css +581 -503
  159. package/build-style/style-rtl.css +621 -519
  160. package/build-style/style.css +621 -519
  161. package/package.json +41 -41
  162. package/src/components/add-new-pattern/index.js +8 -2
  163. package/src/components/add-new-template/index.js +4 -1
  164. package/src/components/add-new-template/style.scss +4 -6
  165. package/src/components/block-editor/use-site-editor-settings.js +15 -111
  166. package/src/components/global-styles/block-preview-panel.js +22 -9
  167. package/src/components/global-styles/font-families.js +66 -31
  168. package/src/components/global-styles/font-library-modal/index.js +4 -2
  169. package/src/components/global-styles/font-library-modal/installed-fonts.js +92 -11
  170. package/src/components/global-styles/font-library-modal/style.scss +9 -0
  171. package/src/components/global-styles/font-sizes/confirm-delete-font-size-dialog.js +43 -0
  172. package/src/components/global-styles/font-sizes/confirm-reset-font-sizes-dialog.js +37 -0
  173. package/src/components/global-styles/font-sizes/font-size-preview.js +43 -0
  174. package/src/components/global-styles/font-sizes/font-size.js +250 -0
  175. package/src/components/global-styles/font-sizes/font-sizes-count.js +40 -0
  176. package/src/components/global-styles/font-sizes/font-sizes.js +263 -0
  177. package/src/components/global-styles/font-sizes/rename-font-size-dialog.js +70 -0
  178. package/src/components/global-styles/screen-block.js +12 -14
  179. package/src/components/global-styles/screen-style-variations.js +2 -2
  180. package/src/components/global-styles/screen-typography.js +3 -2
  181. package/src/components/global-styles/size-control/index.js +86 -0
  182. package/src/components/global-styles/style-variations-container.js +4 -0
  183. package/src/components/global-styles/style.scss +13 -3
  184. package/src/components/global-styles/ui.js +10 -0
  185. package/src/components/global-styles/variations/variations-color.js +1 -1
  186. package/src/components/global-styles/variations/variations-typography.js +1 -2
  187. package/src/components/layout/index.js +11 -0
  188. package/src/components/layout/router.js +13 -5
  189. package/src/components/layout/style.scss +26 -8
  190. package/src/components/page-patterns/header.js +1 -1
  191. package/src/components/page-patterns/index.js +15 -8
  192. package/src/components/page-templates/index.js +51 -46
  193. package/src/components/page-templates/style.scss +5 -3
  194. package/src/components/post-edit/index.js +96 -0
  195. package/src/components/post-edit/style.scss +9 -0
  196. package/src/components/post-fields/index.js +345 -0
  197. package/src/components/post-list/index.js +326 -0
  198. package/src/components/{posts-app → post-list}/style.scss +12 -9
  199. package/src/components/posts-app/router.js +3 -3
  200. package/src/components/sidebar-dataviews/default-views.js +21 -9
  201. package/src/components/sidebar-dataviews/index.js +36 -1
  202. package/src/components/sidebar-navigation-screen-global-styles/content.js +55 -0
  203. package/src/components/sidebar-navigation-screen-global-styles/index.js +1 -55
  204. package/src/hooks/push-changes-to-global-styles/index.js +1 -1
  205. package/src/index.js +7 -1
  206. package/src/posts.scss +1 -1
  207. package/src/store/selectors.js +53 -14
  208. package/src/store/test/selectors.js +1 -26
  209. package/src/style.scss +2 -1
  210. package/src/utils/get-filtered-template-parts.js +61 -0
  211. package/src/utils/test/get-filtered-template-parts.js +127 -0
  212. package/build/components/global-styles/screen-background.js +0 -36
  213. package/build/components/global-styles/screen-background.js.map +0 -1
  214. package/build/components/posts-app/posts-list.js +0 -568
  215. package/build/components/posts-app/posts-list.js.map +0 -1
  216. package/build-module/components/global-styles/screen-background.js +0 -30
  217. package/build-module/components/global-styles/screen-background.js.map +0 -1
  218. package/build-module/components/posts-app/posts-list.js +0 -560
  219. package/build-module/components/posts-app/posts-list.js.map +0 -1
  220. package/src/components/global-styles/screen-background.js +0 -29
  221. package/src/components/posts-app/posts-list.js +0 -651
@@ -116,7 +116,7 @@
116
116
  flex-direction: column;
117
117
  }
118
118
 
119
- .dataviews-filters__view-actions {
119
+ .dataviews__view-actions {
120
120
  box-sizing: border-box;
121
121
  padding: 16px 48px;
122
122
  flex-shrink: 0;
@@ -125,256 +125,436 @@
125
125
  transition: padding ease-out 0.1s;
126
126
  }
127
127
  @media (prefers-reduced-motion: reduce) {
128
- .dataviews-filters__view-actions {
128
+ .dataviews__view-actions {
129
129
  transition-duration: 0s;
130
130
  transition-delay: 0s;
131
131
  }
132
132
  }
133
- .dataviews-filters__view-actions .components-search-control .components-base-control__field {
133
+ .dataviews__view-actions .components-search-control .components-base-control__field {
134
134
  max-width: 240px;
135
135
  }
136
136
 
137
- .dataviews-filters__container .dataviews-filters__reset-button[aria-disabled=true], .dataviews-filters__container .dataviews-filters__reset-button[aria-disabled=true]:hover {
138
- opacity: 0;
137
+ .dataviews-view-list__primary-field,
138
+ .dataviews-view-grid__primary-field,
139
+ .dataviews-view-table__primary-field {
140
+ font-size: 13px;
141
+ font-weight: 500;
142
+ color: #757575;
143
+ text-overflow: ellipsis;
144
+ white-space: nowrap;
145
+ width: 100%;
139
146
  }
140
- .dataviews-filters__container .dataviews-filters__reset-button[aria-disabled=true]:focus {
141
- opacity: 1;
147
+ .dataviews-view-list__primary-field a,
148
+ .dataviews-view-grid__primary-field a,
149
+ .dataviews-view-table__primary-field a {
150
+ text-decoration: none;
151
+ text-overflow: ellipsis;
152
+ white-space: nowrap;
153
+ overflow: hidden;
154
+ display: block;
155
+ flex-grow: 0;
156
+ color: #1e1e1e;
142
157
  }
143
-
144
- .dataviews-filters-button {
145
- position: relative;
158
+ .dataviews-view-list__primary-field a:hover,
159
+ .dataviews-view-grid__primary-field a:hover,
160
+ .dataviews-view-table__primary-field a:hover {
161
+ color: var(--wp-admin-theme-color);
162
+ }
163
+ .dataviews-view-list__primary-field a:focus,
164
+ .dataviews-view-grid__primary-field a:focus,
165
+ .dataviews-view-table__primary-field a:focus {
166
+ color: var(--wp-admin-theme-color--rgb);
167
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #007cba);
168
+ border-radius: 2px;
169
+ }
170
+ .dataviews-view-list__primary-field button.components-button.is-link,
171
+ .dataviews-view-grid__primary-field button.components-button.is-link,
172
+ .dataviews-view-table__primary-field button.components-button.is-link {
173
+ text-decoration: none;
174
+ font-weight: inherit;
175
+ text-overflow: ellipsis;
176
+ white-space: nowrap;
177
+ overflow: hidden;
178
+ display: block;
179
+ width: 100%;
180
+ color: #1e1e1e;
181
+ }
182
+ .dataviews-view-list__primary-field button.components-button.is-link:hover,
183
+ .dataviews-view-grid__primary-field button.components-button.is-link:hover,
184
+ .dataviews-view-table__primary-field button.components-button.is-link:hover {
185
+ color: var(--wp-admin-theme-color);
146
186
  }
147
187
 
148
- .dataviews-pagination {
149
- position: sticky;
150
- bottom: 0;
151
- right: 0;
152
- background-color: #fff;
153
- padding: 12px 48px;
154
- border-top: 1px solid #f0f0f0;
155
- color: #757575;
156
- flex-shrink: 0;
188
+ .dataviews-no-results,
189
+ .dataviews-loading {
190
+ padding: 0 48px;
191
+ flex-grow: 1;
192
+ display: flex;
193
+ align-items: center;
194
+ justify-content: center;
157
195
  transition: padding ease-out 0.1s;
158
196
  }
159
197
  @media (prefers-reduced-motion: reduce) {
160
- .dataviews-pagination {
198
+ .dataviews-no-results,
199
+ .dataviews-loading {
161
200
  transition-duration: 0s;
162
201
  transition-delay: 0s;
163
202
  }
164
203
  }
165
204
 
166
- .dataviews-pagination__page-selection {
167
- font-size: 11px;
168
- text-transform: uppercase;
169
- font-weight: 500;
170
- color: #1e1e1e;
205
+ /* stylelint-disable-next-line scss/at-rule-no-unknown -- '@container' not globally permitted */
206
+ @container (max-width: 430px) {
207
+ .dataviews__view-actions {
208
+ padding: 12px 24px;
209
+ }
210
+ .dataviews__view-actions .components-search-control .components-base-control__field {
211
+ max-width: 112px;
212
+ }
213
+
214
+ .dataviews-view-grid,
215
+ .dataviews-no-results,
216
+ .dataviews-loading {
217
+ padding-right: 24px;
218
+ padding-left: 24px;
219
+ }
220
+ }
221
+ .dataviews-bulk-actions__modal {
222
+ z-index: 1000001;
171
223
  }
172
224
 
173
- .dataviews-filters-options {
174
- margin: 32px 0 16px;
225
+ .dataviews-bulk-actions__edit-button.components-button {
226
+ flex-shrink: 0;
175
227
  }
176
228
 
177
- .dataviews-view-table {
229
+ .dataviews-bulk-actions-toolbar {
230
+ position: sticky;
231
+ display: flex;
232
+ flex-direction: column;
233
+ align-content: center;
234
+ flex-wrap: wrap;
235
+ width: -moz-fit-content;
236
+ width: fit-content;
237
+ margin-right: auto;
238
+ margin-left: auto;
239
+ bottom: 24px;
240
+ z-index: 2;
241
+ }
242
+ .dataviews-bulk-actions-toolbar .components-accessible-toolbar {
243
+ border-color: #ddd;
244
+ box-shadow: 0 0.7px 1px rgba(0, 0, 0, 0.1), 0 1.2px 1.7px -0.2px rgba(0, 0, 0, 0.1), 0 2.3px 3.3px -0.5px rgba(0, 0, 0, 0.1);
245
+ }
246
+ .dataviews-bulk-actions-toolbar .components-accessible-toolbar .components-toolbar-group {
247
+ border-color: #e0e0e0;
248
+ }
249
+ .dataviews-bulk-actions-toolbar .components-accessible-toolbar .components-toolbar-group:last-child {
250
+ border: 0;
251
+ }
252
+ .dataviews-bulk-actions-toolbar .dataviews-bulk-actions-toolbar__selection-count {
253
+ display: flex;
254
+ align-items: center;
255
+ margin: 0 8px 0 8px;
256
+ }
257
+
258
+ .dataviews-bulk-actions-toolbar__wrapper {
259
+ display: flex;
260
+ flex-grow: 1;
178
261
  width: 100%;
179
- text-indent: 0;
180
- border-color: inherit;
181
- border-collapse: collapse;
262
+ }
263
+ .dataviews-bulk-actions-toolbar__wrapper .components-toolbar-group {
264
+ align-items: center;
265
+ }
266
+ .dataviews-bulk-actions-toolbar__wrapper .components-button.is-busy {
267
+ max-height: 36px;
268
+ }
269
+
270
+ .dataviews-filters__button {
182
271
  position: relative;
272
+ }
273
+
274
+ .dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true], .dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true]:hover {
275
+ opacity: 0;
276
+ }
277
+ .dataviews-filters__reset-button.dataviews-filters__reset-button[aria-disabled=true]:focus {
278
+ opacity: 1;
279
+ }
280
+
281
+ .dataviews-filters__summary-popover .components-popover__content {
282
+ width: 230px;
283
+ padding: 0;
284
+ border-radius: 4px;
285
+ }
286
+
287
+ .dataviews-filters__summary-operators-container {
288
+ padding: 8px 8px 0;
289
+ }
290
+ .dataviews-filters__summary-operators-container:has(+ .dataviews-filters__search-widget-listbox) {
291
+ border-bottom: 1px solid #e0e0e0;
292
+ padding-bottom: 8px;
293
+ }
294
+ .dataviews-filters__summary-operators-container:empty {
295
+ display: none;
296
+ }
297
+ .dataviews-filters__summary-operators-container .dataviews-filters__summary-operators-filter-name {
183
298
  color: #757575;
184
- margin-bottom: auto;
185
299
  }
186
- .dataviews-view-table a {
187
- text-decoration: none;
300
+
301
+ .dataviews-filters__summary-chip-container {
302
+ position: relative;
303
+ white-space: pre-wrap;
304
+ }
305
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip {
306
+ border-radius: 16px;
307
+ border: 1px solid transparent;
308
+ cursor: pointer;
309
+ padding: 4px 12px;
310
+ min-height: 32px;
311
+ background: #f0f0f0;
312
+ color: #2f2f2f;
313
+ position: relative;
314
+ display: flex;
315
+ align-items: center;
316
+ }
317
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-reset {
318
+ padding-inline-end: 28px;
319
+ }
320
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip[aria-expanded=true] {
321
+ background: #e0e0e0;
188
322
  color: #1e1e1e;
323
+ }
324
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values {
325
+ color: var(--wp-admin-theme-color);
326
+ background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
327
+ }
328
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values[aria-expanded=true] {
329
+ background: rgba(var(--wp-admin-theme-color--rgb), 0.12);
330
+ }
331
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible {
332
+ outline: none;
333
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
334
+ }
335
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip .dataviews-filters-__summary-filter-text-name {
189
336
  font-weight: 500;
190
337
  }
191
- .dataviews-view-table th {
192
- text-align: right;
193
- color: #1e1e1e;
194
- font-weight: normal;
195
- font-size: 13px;
338
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove {
339
+ width: 24px;
340
+ height: 24px;
341
+ border-radius: 50%;
342
+ border: 0;
343
+ padding: 0;
344
+ position: absolute;
345
+ left: 4px;
346
+ top: 50%;
347
+ transform: translateY(-50%);
348
+ display: flex;
349
+ align-items: center;
350
+ justify-content: center;
351
+ background: transparent;
352
+ cursor: pointer;
196
353
  }
197
- .dataviews-view-table td,
198
- .dataviews-view-table th {
199
- padding: 12px;
200
- white-space: nowrap;
354
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove svg {
355
+ fill: #757575;
201
356
  }
202
- .dataviews-view-table td[data-field-id=actions],
203
- .dataviews-view-table th[data-field-id=actions] {
204
- text-align: left;
357
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus {
358
+ background: #e0e0e0;
205
359
  }
206
- .dataviews-view-table td.dataviews-view-table__checkbox-column,
207
- .dataviews-view-table th.dataviews-view-table__checkbox-column {
208
- padding-left: 0;
360
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover svg, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus svg {
361
+ fill: #1e1e1e;
209
362
  }
210
- .dataviews-view-table tr {
211
- border-bottom: 1px solid #f0f0f0;
363
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values svg {
364
+ fill: var(--wp-admin-theme-color);
212
365
  }
213
- .dataviews-view-table tr .dataviews-view-table-header-button {
214
- gap: 4px;
366
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values:hover {
367
+ background: rgba(var(--wp-admin-theme-color--rgb), 0.08);
215
368
  }
216
- .dataviews-view-table tr td:first-child,
217
- .dataviews-view-table tr th:first-child {
218
- padding-right: 48px;
369
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus-visible {
370
+ outline: none;
371
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
219
372
  }
220
- .dataviews-view-table tr td:first-child .dataviews-view-table-header-button,
221
- .dataviews-view-table tr td:first-child .dataviews-view-table-header,
222
- .dataviews-view-table tr th:first-child .dataviews-view-table-header-button,
223
- .dataviews-view-table tr th:first-child .dataviews-view-table-header {
224
- margin-right: -8px;
373
+
374
+ .dataviews-filters__search-widget-filter-combobox-list {
375
+ max-height: 184px;
376
+ padding: 4px;
377
+ overflow: auto;
378
+ border-top: 1px solid #e0e0e0;
225
379
  }
226
- .dataviews-view-table tr td:last-child,
227
- .dataviews-view-table tr th:last-child {
228
- padding-left: 48px;
380
+ .dataviews-filters__search-widget-filter-combobox-list .dataviews-filters__search-widget-filter-combobox-item-value [data-user-value] {
381
+ font-weight: 600;
229
382
  }
230
- .dataviews-view-table tr:last-child {
231
- border-bottom: 0;
383
+
384
+ .dataviews-filters__search-widget-listbox {
385
+ max-height: 184px;
386
+ padding: 4px;
387
+ overflow: auto;
232
388
  }
233
- .dataviews-view-table tr.is-hovered {
234
- background-color: #f8f8f8;
389
+
390
+ .dataviews-filters__search-widget-listitem {
391
+ display: flex;
392
+ align-items: center;
393
+ gap: 8px;
394
+ border-radius: 2px;
395
+ box-sizing: border-box;
396
+ padding: 8px 12px;
397
+ cursor: default;
398
+ margin-block-end: 2px;
235
399
  }
236
- .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input {
237
- opacity: 0;
400
+ .dataviews-filters__search-widget-listitem:last-child {
401
+ margin-block-end: 0;
238
402
  }
239
- .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:checked, .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:indeterminate, .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:focus {
240
- opacity: 1;
403
+ .dataviews-filters__search-widget-listitem:hover, .dataviews-filters__search-widget-listitem[data-active-item], .dataviews-filters__search-widget-listitem:focus {
404
+ background-color: var(--wp-admin-theme-color);
405
+ color: #fff;
241
406
  }
242
- .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
243
- opacity: 0;
407
+ .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-check, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-check, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-check {
408
+ fill: #fff;
244
409
  }
245
- .dataviews-view-table tr:focus-within .components-checkbox-control__input,
246
- .dataviews-view-table tr:focus-within .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr.is-hovered .components-checkbox-control__input,
247
- .dataviews-view-table tr.is-hovered .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr:hover .components-checkbox-control__input,
248
- .dataviews-view-table tr:hover .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
249
- opacity: 1;
410
+ .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-description, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-description, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-description {
411
+ color: #fff;
250
412
  }
251
- @media (hover: none) {
252
- .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input,
253
- .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
254
- opacity: 1;
255
- }
413
+ .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-check {
414
+ width: 24px;
415
+ height: 24px;
416
+ flex-shrink: 0;
256
417
  }
257
- .dataviews-view-table tr.is-selected {
258
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
418
+ .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-description {
419
+ display: block;
420
+ overflow: hidden;
421
+ text-overflow: ellipsis;
422
+ font-size: 12px;
423
+ line-height: 16px;
259
424
  color: #757575;
260
425
  }
261
- .dataviews-view-table tr.is-selected:hover {
262
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
426
+
427
+ .dataviews-filters__search-widget-filter-combobox__wrapper {
428
+ position: relative;
429
+ padding: 8px;
263
430
  }
264
- .dataviews-view-table thead {
265
- position: sticky;
266
- inset-block-start: 0;
267
- z-index: 1;
431
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
432
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
433
+ padding: 6px 8px;
434
+ box-shadow: 0 0 0 transparent;
435
+ transition: box-shadow 0.1s linear;
436
+ border-radius: 2px;
437
+ border: 1px solid #949494;
438
+ /* Fonts smaller than 16px causes mobile safari to zoom. */
439
+ font-size: 16px;
440
+ /* Override core line-height. To be reviewed. */
441
+ line-height: normal;
442
+ display: block;
443
+ padding: 0 8px 0 32px;
444
+ background: #f0f0f0;
445
+ border: none;
446
+ width: 100%;
447
+ height: 32px;
448
+ margin-right: 0;
449
+ margin-left: 0;
450
+ /* Fonts smaller than 16px causes mobile safari to zoom. */
451
+ font-size: 16px;
268
452
  }
269
- .dataviews-view-table thead tr {
270
- border: 0;
453
+ @media (prefers-reduced-motion: reduce) {
454
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
455
+ transition-duration: 0s;
456
+ transition-delay: 0s;
457
+ }
271
458
  }
272
- .dataviews-view-table thead th {
273
- background-color: #fff;
274
- box-shadow: inset 0 -1px 0 #f0f0f0;
275
- padding-top: 8px;
276
- padding-bottom: 8px;
277
- padding-right: 12px;
278
- font-size: 11px;
279
- text-transform: uppercase;
280
- font-weight: 500;
459
+ @media (min-width: 600px) {
460
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
461
+ font-size: 13px;
462
+ /* Override core line-height. To be reviewed. */
463
+ line-height: normal;
464
+ }
281
465
  }
282
- .dataviews-view-table thead th:has(.dataviews-view-table-header-button):not(:first-child) {
283
- padding-right: 4px;
466
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
467
+ border-color: var(--wp-admin-theme-color);
468
+ box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
469
+ outline: 2px solid transparent;
284
470
  }
285
- .dataviews-view-table tbody td {
286
- vertical-align: top;
471
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-input-placeholder {
472
+ color: rgba(30, 30, 30, 0.62);
287
473
  }
288
- .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper {
289
- min-height: 32px;
474
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-moz-placeholder {
475
+ opacity: 1;
476
+ color: rgba(30, 30, 30, 0.62);
477
+ }
478
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:-ms-input-placeholder {
479
+ color: rgba(30, 30, 30, 0.62);
480
+ }
481
+ @media (min-width: 600px) {
482
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
483
+ font-size: 13px;
484
+ }
485
+ }
486
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
487
+ background: #fff;
488
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
489
+ }
490
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
491
+ color: #757575;
492
+ }
493
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-decoration, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-cancel-button, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-results-button, .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::-webkit-search-results-decoration {
494
+ -webkit-appearance: none;
495
+ }
496
+ .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__icon {
497
+ position: absolute;
498
+ left: 12px;
499
+ top: 50%;
500
+ transform: translateY(-50%);
290
501
  display: flex;
291
502
  align-items: center;
503
+ justify-content: center;
504
+ width: 24px;
292
505
  }
293
- .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper > * {
294
- flex-grow: 1;
506
+
507
+ .dataviews-pagination {
508
+ position: sticky;
509
+ bottom: 0;
510
+ right: 0;
511
+ background-color: #fff;
512
+ padding: 12px 48px;
513
+ border-top: 1px solid #f0f0f0;
514
+ color: #757575;
515
+ flex-shrink: 0;
516
+ transition: padding ease-out 0.1s;
295
517
  }
296
- .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper.dataviews-view-table__primary-field a {
297
- flex-grow: 0;
518
+ @media (prefers-reduced-motion: reduce) {
519
+ .dataviews-pagination {
520
+ transition-duration: 0s;
521
+ transition-delay: 0s;
522
+ }
298
523
  }
299
- .dataviews-view-table .dataviews-view-table-header-button {
300
- padding: 4px 8px;
524
+
525
+ .dataviews-pagination__page-selection {
301
526
  font-size: 11px;
302
527
  text-transform: uppercase;
303
528
  font-weight: 500;
304
- }
305
- .dataviews-view-table .dataviews-view-table-header-button:not(:hover) {
306
529
  color: #1e1e1e;
307
530
  }
308
- .dataviews-view-table .dataviews-view-table-header-button span {
309
- speak: none;
310
- }
311
- .dataviews-view-table .dataviews-view-table-header-button span:empty {
312
- display: none;
313
- }
314
- .dataviews-view-table .dataviews-view-table-header {
315
- padding-right: 4px;
316
- }
317
- .dataviews-view-table .dataviews-view-table__actions-column {
318
- width: 1%;
319
- }
320
- .dataviews-view-table:has(tr.is-selected) .components-checkbox-control__input {
321
- opacity: 1;
322
- }
323
531
 
324
- .dataviews-view-list__primary-field,
325
- .dataviews-view-grid__primary-field,
326
- .dataviews-view-table__primary-field {
327
- font-size: 13px;
328
- font-weight: 500;
329
- color: #757575;
330
- text-overflow: ellipsis;
331
- white-space: nowrap;
332
- width: 100%;
333
- }
334
- .dataviews-view-list__primary-field a,
335
- .dataviews-view-grid__primary-field a,
336
- .dataviews-view-table__primary-field a {
337
- text-decoration: none;
338
- text-overflow: ellipsis;
339
- white-space: nowrap;
340
- overflow: hidden;
341
- display: block;
342
- flex-grow: 0;
343
- color: #1e1e1e;
532
+ /* stylelint-disable-next-line scss/at-rule-no-unknown -- '@container' not globally permitted */
533
+ @container (max-width: 430px) {
534
+ .dataviews-pagination {
535
+ padding: 12px 24px;
536
+ }
344
537
  }
345
- .dataviews-view-list__primary-field a:hover,
346
- .dataviews-view-grid__primary-field a:hover,
347
- .dataviews-view-table__primary-field a:hover {
348
- color: var(--wp-admin-theme-color);
538
+ .dataviews-action-modal {
539
+ z-index: 1000001;
349
540
  }
350
- .dataviews-view-list__primary-field a:focus,
351
- .dataviews-view-grid__primary-field a:focus,
352
- .dataviews-view-table__primary-field a:focus {
353
- color: var(--wp-admin-theme-color--rgb);
354
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #007cba);
355
- border-radius: 2px;
541
+
542
+ .dataviews-selection-checkbox {
543
+ --checkbox-input-size: 24px;
544
+ line-height: 0;
545
+ flex-shrink: 0;
356
546
  }
357
- .dataviews-view-list__primary-field button.components-button.is-link,
358
- .dataviews-view-grid__primary-field button.components-button.is-link,
359
- .dataviews-view-table__primary-field button.components-button.is-link {
360
- text-decoration: none;
361
- font-weight: inherit;
362
- text-overflow: ellipsis;
363
- white-space: nowrap;
364
- overflow: hidden;
365
- display: block;
366
- width: 100%;
367
- color: #1e1e1e;
547
+ @media (min-width: 600px) {
548
+ .dataviews-selection-checkbox {
549
+ --checkbox-input-size: 16px;
550
+ }
368
551
  }
369
- .dataviews-view-list__primary-field button.components-button.is-link:hover,
370
- .dataviews-view-grid__primary-field button.components-button.is-link:hover,
371
- .dataviews-view-table__primary-field button.components-button.is-link:hover {
372
- color: var(--wp-admin-theme-color);
552
+ .dataviews-selection-checkbox .components-checkbox-control__input-container {
553
+ margin: 0;
373
554
  }
374
555
 
375
556
  .dataviews-view-grid {
376
557
  margin-bottom: auto;
377
- grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
378
558
  grid-template-rows: max-content;
379
559
  padding: 0 48px 24px;
380
560
  transition: padding ease-out 0.1s;
@@ -385,21 +565,6 @@
385
565
  transition-delay: 0s;
386
566
  }
387
567
  }
388
- @media (min-width: 480px) {
389
- .dataviews-view-grid {
390
- grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
391
- }
392
- }
393
- @media (min-width: 1080px) {
394
- .dataviews-view-grid {
395
- grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
396
- }
397
- }
398
- @media (min-width: 1440px) {
399
- .dataviews-view-grid {
400
- grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
401
- }
402
- }
403
568
  .dataviews-view-grid .dataviews-view-grid__card {
404
569
  height: 100%;
405
570
  justify-content: flex-start;
@@ -447,6 +612,7 @@
447
612
  }
448
613
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field {
449
614
  align-items: flex-start;
615
+ min-height: 24px;
450
616
  }
451
617
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field:not(.is-column) {
452
618
  align-items: center;
@@ -460,6 +626,9 @@
460
626
  text-overflow: ellipsis;
461
627
  white-space: nowrap;
462
628
  }
629
+ .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field.is-column + .is-row {
630
+ margin-top: 4px;
631
+ }
463
632
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name {
464
633
  color: #757575;
465
634
  }
@@ -478,6 +647,39 @@
478
647
  font-size: 12px;
479
648
  }
480
649
 
650
+ .dataviews-view-grid.dataviews-view-grid {
651
+ grid-template-columns: repeat(1, minmax(0, 1fr));
652
+ }
653
+ @media (min-width: 480px) {
654
+ .dataviews-view-grid.dataviews-view-grid {
655
+ grid-template-columns: repeat(2, minmax(0, 1fr));
656
+ }
657
+ }
658
+ @media (min-width: 1080px) {
659
+ .dataviews-view-grid.dataviews-view-grid {
660
+ grid-template-columns: repeat(3, minmax(0, 1fr));
661
+ }
662
+ }
663
+ @media (min-width: 1440px) {
664
+ .dataviews-view-grid.dataviews-view-grid {
665
+ grid-template-columns: repeat(4, minmax(0, 1fr));
666
+ }
667
+ }
668
+ @media (min-width: 1920px) {
669
+ .dataviews-view-grid.dataviews-view-grid {
670
+ grid-template-columns: repeat(5, minmax(0, 1fr));
671
+ }
672
+ }
673
+
674
+ .dataviews-density-picker__range-control {
675
+ width: 200px;
676
+ }
677
+
678
+ .dataviews-view-grid__field-value:empty,
679
+ .dataviews-view-grid__field:empty {
680
+ display: none;
681
+ }
682
+
481
683
  .dataviews-view-list {
482
684
  margin: 0 0 auto;
483
685
  }
@@ -493,20 +695,40 @@
493
695
  .dataviews-view-list li .dataviews-view-list__item-wrapper > * {
494
696
  width: 100%;
495
697
  }
698
+ .dataviews-view-list li .dataviews-view-list__item-actions {
699
+ position: absolute;
700
+ top: 16px;
701
+ left: 0;
702
+ }
703
+ .dataviews-view-list li .dataviews-view-list__item-actions > div {
704
+ height: 24px;
705
+ }
496
706
  .dataviews-view-list li .dataviews-view-list__item-actions .components-button {
497
707
  opacity: 0;
498
- position: fixed;
499
- left: 0;
708
+ }
709
+ .dataviews-view-list li:has(.dataviews-view-list__fields:empty) .dataviews-view-list__item-actions {
710
+ top: 50%;
711
+ transform: translateY(-50%);
500
712
  }
501
713
  .dataviews-view-list li.is-selected .dataviews-view-list__item-actions, .dataviews-view-list li.is-hovered .dataviews-view-list__item-actions, .dataviews-view-list li:focus-within .dataviews-view-list__item-actions {
502
- padding-left: 24px;
714
+ background: #f8f8f8;
715
+ padding-right: 8px;
716
+ margin-left: 24px;
717
+ box-shadow: 12px 0 8px 0 #f8f8f8;
503
718
  }
504
719
  .dataviews-view-list li.is-selected .dataviews-view-list__item-actions .components-button, .dataviews-view-list li.is-hovered .dataviews-view-list__item-actions .components-button, .dataviews-view-list li:focus-within .dataviews-view-list__item-actions .components-button {
505
720
  opacity: 1;
506
721
  position: static;
507
722
  }
508
- .dataviews-view-list li.is-selected .dataviews-view-list__item, .dataviews-view-list li.is-hovered .dataviews-view-list__item, .dataviews-view-list li:focus-within .dataviews-view-list__item {
509
- padding-left: 0;
723
+ .dataviews-view-list li.is-selected .dataviews-view-list__item-actions {
724
+ background-color: #f7f8ff;
725
+ box-shadow: 12px 0 8px 0 #f7f8ff;
726
+ }
727
+ .dataviews-view-list li.is-selected.is-selected {
728
+ border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
729
+ }
730
+ .dataviews-view-list li.is-selected.is-selected + li {
731
+ border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
510
732
  }
511
733
  .dataviews-view-list li:not(.is-selected) .dataviews-view-list__primary-field {
512
734
  color: #1e1e1e;
@@ -532,7 +754,7 @@
532
754
  color: var(--wp-admin-theme-color);
533
755
  }
534
756
  .dataviews-view-list .dataviews-view-list__item {
535
- padding: 16px 24px 16px 0;
757
+ padding: 16px 24px;
536
758
  width: 100%;
537
759
  scroll-margin: 8px 0;
538
760
  }
@@ -547,13 +769,13 @@
547
769
  border-radius: 2px;
548
770
  }
549
771
  .dataviews-view-list .dataviews-view-list__item .dataviews-view-list__primary-field {
550
- min-height: 20px;
551
- line-height: 20px;
772
+ min-height: 24px;
773
+ line-height: 24px;
552
774
  overflow: hidden;
553
775
  }
554
776
  .dataviews-view-list .dataviews-view-list__media-wrapper {
555
- width: 40px;
556
- height: 40px;
777
+ width: 52px;
778
+ height: 52px;
557
779
  overflow: hidden;
558
780
  position: relative;
559
781
  flex-shrink: 0;
@@ -580,303 +802,182 @@
580
802
  height: 32px;
581
803
  background-color: #e0e0e0;
582
804
  }
805
+ .dataviews-view-list .dataviews-view-list__field-wrapper {
806
+ min-height: 52px;
807
+ }
583
808
  .dataviews-view-list .dataviews-view-list__fields {
584
809
  color: #757575;
585
810
  display: flex;
586
- gap: 8px;
811
+ gap: 12px;
812
+ row-gap: 4px;
587
813
  flex-wrap: wrap;
588
814
  font-size: 12px;
589
815
  }
816
+ .dataviews-view-list .dataviews-view-list__fields:empty {
817
+ display: none;
818
+ }
590
819
  .dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field:has(.dataviews-view-list__field-value:empty) {
591
820
  display: none;
592
821
  }
593
822
  .dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field-value {
594
823
  line-height: 24px;
595
- display: inline-flex;
596
- }
597
- .dataviews-view-list .dataviews-view-list__item-actions {
598
- padding-left: 24px;
599
824
  }
600
825
  .dataviews-view-list + .dataviews-pagination {
601
826
  justify-content: space-between;
602
827
  }
603
828
 
604
- .dataviews-action-modal {
605
- z-index: 1000001;
606
- }
607
-
608
- .dataviews-no-results,
609
- .dataviews-loading {
610
- padding: 0 48px;
611
- flex-grow: 1;
612
- display: flex;
613
- align-items: center;
614
- justify-content: center;
615
- transition: padding ease-out 0.1s;
616
- }
617
- @media (prefers-reduced-motion: reduce) {
618
- .dataviews-no-results,
619
- .dataviews-loading {
620
- transition-duration: 0s;
621
- transition-delay: 0s;
622
- }
623
- }
624
-
625
- .dataviews-view-table-selection-checkbox {
626
- --checkbox-input-size: 24px;
627
- line-height: 0;
628
- flex-shrink: 0;
629
- }
630
- @media (min-width: 600px) {
631
- .dataviews-view-table-selection-checkbox {
632
- --checkbox-input-size: 16px;
633
- }
634
- }
635
- .dataviews-view-table-selection-checkbox .components-checkbox-control__input-container {
636
- margin: 0;
637
- }
638
-
639
- .dataviews-bulk-edit-button.components-button {
640
- flex-shrink: 0;
641
- }
642
-
643
- .dataviews-filter-summary__popover .components-popover__content {
644
- width: 230px;
645
- padding: 0;
646
- border-radius: 4px;
647
- }
648
-
649
- .dataviews-search-widget-filter-combobox-list {
650
- max-height: 184px;
651
- padding: 4px;
652
- overflow: auto;
653
- border-top: 1px solid #e0e0e0;
654
- }
655
- .dataviews-search-widget-filter-combobox-list .dataviews-search-widget-filter-combobox-item-value [data-user-value] {
656
- font-weight: 600;
657
- }
658
-
659
- .dataviews-search-widget-listbox {
660
- max-height: 184px;
661
- padding: 4px;
662
- overflow: auto;
829
+ .dataviews-view-table {
830
+ width: 100%;
831
+ text-indent: 0;
832
+ border-color: inherit;
833
+ border-collapse: collapse;
834
+ position: relative;
835
+ color: #757575;
836
+ margin-bottom: auto;
663
837
  }
664
-
665
- .dataviews-search-widget-listitem {
666
- display: flex;
667
- align-items: center;
668
- gap: 8px;
669
- border-radius: 2px;
670
- box-sizing: border-box;
671
- padding: 8px 12px;
672
- cursor: default;
673
- margin-block-end: 2px;
838
+ .dataviews-view-table a {
839
+ text-decoration: none;
840
+ color: #1e1e1e;
841
+ font-weight: 500;
674
842
  }
675
- .dataviews-search-widget-listitem:last-child {
676
- margin-block-end: 0;
843
+ .dataviews-view-table th {
844
+ text-align: right;
845
+ color: #1e1e1e;
846
+ font-weight: normal;
847
+ font-size: 13px;
677
848
  }
678
- .dataviews-search-widget-listitem:hover, .dataviews-search-widget-listitem[data-active-item], .dataviews-search-widget-listitem:focus {
679
- background-color: var(--wp-admin-theme-color);
680
- color: #fff;
849
+ .dataviews-view-table td,
850
+ .dataviews-view-table th {
851
+ padding: 12px;
852
+ white-space: nowrap;
681
853
  }
682
- .dataviews-search-widget-listitem:hover .dataviews-search-widget-listitem-check, .dataviews-search-widget-listitem[data-active-item] .dataviews-search-widget-listitem-check, .dataviews-search-widget-listitem:focus .dataviews-search-widget-listitem-check {
683
- fill: #fff;
854
+ .dataviews-view-table td.dataviews-view-table__actions-column,
855
+ .dataviews-view-table th.dataviews-view-table__actions-column {
856
+ text-align: left;
684
857
  }
685
- .dataviews-search-widget-listitem:hover .dataviews-search-widget-listitem-description, .dataviews-search-widget-listitem[data-active-item] .dataviews-search-widget-listitem-description, .dataviews-search-widget-listitem:focus .dataviews-search-widget-listitem-description {
686
- color: #fff;
858
+ .dataviews-view-table td.dataviews-view-table__checkbox-column,
859
+ .dataviews-view-table th.dataviews-view-table__checkbox-column {
860
+ padding-left: 0;
687
861
  }
688
- .dataviews-search-widget-listitem .dataviews-search-widget-listitem-check {
689
- width: 24px;
690
- height: 24px;
691
- flex-shrink: 0;
862
+ .dataviews-view-table tr {
863
+ border-top: 1px solid #f0f0f0;
692
864
  }
693
- .dataviews-search-widget-listitem .dataviews-search-widget-listitem-description {
694
- display: block;
695
- overflow: hidden;
696
- text-overflow: ellipsis;
697
- font-size: 12px;
698
- line-height: 16px;
699
- color: #757575;
865
+ .dataviews-view-table tr .dataviews-view-table-header-button {
866
+ gap: 4px;
700
867
  }
701
-
702
- .dataviews-search-widget-filter-combobox__wrapper {
703
- position: relative;
704
- padding: 8px;
868
+ .dataviews-view-table tr td:first-child,
869
+ .dataviews-view-table tr th:first-child {
870
+ padding-right: 48px;
705
871
  }
706
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input {
707
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
708
- padding: 6px 8px;
709
- box-shadow: 0 0 0 transparent;
710
- transition: box-shadow 0.1s linear;
711
- border-radius: 2px;
712
- border: 1px solid #949494;
713
- /* Fonts smaller than 16px causes mobile safari to zoom. */
714
- font-size: 16px;
715
- /* Override core line-height. To be reviewed. */
716
- line-height: normal;
717
- display: block;
718
- padding: 0 8px 0 32px;
719
- background: #f0f0f0;
720
- border: none;
721
- width: 100%;
722
- height: 32px;
723
- margin-right: 0;
724
- margin-left: 0;
725
- /* Fonts smaller than 16px causes mobile safari to zoom. */
726
- font-size: 16px;
872
+ .dataviews-view-table tr td:first-child .dataviews-view-table-header-button,
873
+ .dataviews-view-table tr td:first-child .dataviews-view-table-header,
874
+ .dataviews-view-table tr th:first-child .dataviews-view-table-header-button,
875
+ .dataviews-view-table tr th:first-child .dataviews-view-table-header {
876
+ margin-right: -8px;
727
877
  }
728
- @media (prefers-reduced-motion: reduce) {
729
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input {
730
- transition-duration: 0s;
731
- transition-delay: 0s;
732
- }
878
+ .dataviews-view-table tr td:last-child,
879
+ .dataviews-view-table tr th:last-child {
880
+ padding-left: 48px;
733
881
  }
734
- @media (min-width: 600px) {
735
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input {
736
- font-size: 13px;
737
- /* Override core line-height. To be reviewed. */
738
- line-height: normal;
739
- }
882
+ .dataviews-view-table tr:last-child {
883
+ border-bottom: 0;
740
884
  }
741
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input:focus {
742
- border-color: var(--wp-admin-theme-color);
743
- box-shadow: 0 0 0 0.5px var(--wp-admin-theme-color);
744
- outline: 2px solid transparent;
885
+ .dataviews-view-table tr.is-hovered {
886
+ background-color: #f8f8f8;
745
887
  }
746
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-input-placeholder {
747
- color: rgba(30, 30, 30, 0.62);
888
+ .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input {
889
+ opacity: 0;
748
890
  }
749
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-moz-placeholder {
891
+ .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:checked, .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:indeterminate, .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input:focus {
750
892
  opacity: 1;
751
- color: rgba(30, 30, 30, 0.62);
752
893
  }
753
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input:-ms-input-placeholder {
754
- color: rgba(30, 30, 30, 0.62);
894
+ .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
895
+ opacity: 0;
755
896
  }
756
- @media (min-width: 600px) {
757
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input {
758
- font-size: 13px;
759
- }
897
+ .dataviews-view-table tr:focus-within .components-checkbox-control__input,
898
+ .dataviews-view-table tr:focus-within .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr.is-hovered .components-checkbox-control__input,
899
+ .dataviews-view-table tr.is-hovered .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr:hover .components-checkbox-control__input,
900
+ .dataviews-view-table tr:hover .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
901
+ opacity: 1;
760
902
  }
761
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input:focus {
762
- background: #fff;
763
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
903
+ @media (hover: none) {
904
+ .dataviews-view-table tr .components-checkbox-control__input.components-checkbox-control__input,
905
+ .dataviews-view-table tr .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
906
+ opacity: 1;
907
+ }
764
908
  }
765
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::placeholder {
909
+ .dataviews-view-table tr.is-selected {
910
+ background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
766
911
  color: #757575;
767
912
  }
768
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-decoration, .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-cancel-button, .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-results-button, .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__input::-webkit-search-results-decoration {
769
- -webkit-appearance: none;
913
+ .dataviews-view-table tr.is-selected, .dataviews-view-table tr.is-selected + tr {
914
+ border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
770
915
  }
771
- .dataviews-search-widget-filter-combobox__wrapper .dataviews-search-widget-filter-combobox__icon {
772
- position: absolute;
773
- left: 12px;
774
- top: 50%;
775
- transform: translateY(-50%);
776
- display: flex;
777
- align-items: center;
778
- justify-content: center;
779
- width: 24px;
916
+ .dataviews-view-table tr.is-selected:hover {
917
+ background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
780
918
  }
781
-
782
- .dataviews-filter-summary__operators-container {
783
- padding: 8px 8px 0;
919
+ .dataviews-view-table thead {
920
+ position: sticky;
921
+ inset-block-start: 0;
922
+ z-index: 1;
784
923
  }
785
- .dataviews-filter-summary__operators-container:has(+ .dataviews-search-widget-listbox) {
786
- border-bottom: 1px solid #e0e0e0;
787
- padding-bottom: 8px;
924
+ .dataviews-view-table thead tr {
925
+ border: 0;
788
926
  }
789
- .dataviews-filter-summary__operators-container:empty {
790
- display: none;
927
+ .dataviews-view-table thead th {
928
+ background-color: #fff;
929
+ padding-top: 8px;
930
+ padding-bottom: 8px;
931
+ padding-right: 12px;
932
+ font-size: 11px;
933
+ text-transform: uppercase;
934
+ font-weight: 500;
791
935
  }
792
- .dataviews-filter-summary__operators-container .dataviews-filter-summary__operators-filter-name {
793
- color: #757575;
936
+ .dataviews-view-table thead th:has(.dataviews-view-table-header-button):not(:first-child) {
937
+ padding-right: 4px;
794
938
  }
795
-
796
- .dataviews-filter-summary__chip-container {
797
- position: relative;
798
- white-space: pre-wrap;
939
+ .dataviews-view-table tbody td {
940
+ vertical-align: top;
799
941
  }
800
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip {
801
- border-radius: 16px;
802
- border: 1px solid transparent;
803
- cursor: pointer;
804
- padding: 4px 12px;
942
+ .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper {
805
943
  min-height: 32px;
806
- background: #f0f0f0;
807
- color: #2f2f2f;
808
- position: relative;
809
944
  display: flex;
810
945
  align-items: center;
811
946
  }
812
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-reset {
813
- padding-inline-end: 28px;
814
- }
815
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip:hover, .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip:focus-visible, .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip[aria-expanded=true] {
816
- background: #e0e0e0;
817
- color: #1e1e1e;
818
- }
819
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-values {
820
- color: var(--wp-admin-theme-color);
821
- background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
822
- }
823
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-values:hover, .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip.has-values[aria-expanded=true] {
824
- background: rgba(var(--wp-admin-theme-color--rgb), 0.12);
825
- }
826
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip:focus-visible {
827
- outline: none;
828
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
947
+ .dataviews-view-table tbody .components-v-stack > .dataviews-view-table__cell-content-wrapper:not(:first-child) {
948
+ min-height: 0;
829
949
  }
830
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip .dataviews-filter-summary__filter-text-name {
950
+ .dataviews-view-table .dataviews-view-table-header-button {
951
+ padding: 4px 8px;
952
+ font-size: 11px;
953
+ text-transform: uppercase;
831
954
  font-weight: 500;
832
955
  }
833
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove {
834
- width: 24px;
835
- height: 24px;
836
- border-radius: 50%;
837
- border: 0;
838
- padding: 0;
839
- position: absolute;
840
- left: 4px;
841
- top: 50%;
842
- transform: translateY(-50%);
843
- display: flex;
844
- align-items: center;
845
- justify-content: center;
846
- background: transparent;
847
- cursor: pointer;
956
+ .dataviews-view-table .dataviews-view-table-header-button:not(:hover) {
957
+ color: #1e1e1e;
848
958
  }
849
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove svg {
850
- fill: #757575;
959
+ .dataviews-view-table .dataviews-view-table-header-button span {
960
+ speak: none;
851
961
  }
852
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:hover, .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:focus {
853
- background: #e0e0e0;
962
+ .dataviews-view-table .dataviews-view-table-header-button span:empty {
963
+ display: none;
854
964
  }
855
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:hover svg, .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:focus svg {
856
- fill: #1e1e1e;
965
+ .dataviews-view-table .dataviews-view-table-header {
966
+ padding-right: 4px;
857
967
  }
858
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove.has-values svg {
859
- fill: var(--wp-admin-theme-color);
968
+ .dataviews-view-table .dataviews-view-table__actions-column {
969
+ width: 1%;
860
970
  }
861
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove.has-values:hover {
862
- background: rgba(var(--wp-admin-theme-color--rgb), 0.08);
971
+ .dataviews-view-table:has(tr.is-selected) .components-checkbox-control__input {
972
+ opacity: 1;
863
973
  }
864
- .dataviews-filter-summary__chip-container .dataviews-filter-summary__chip-remove:focus-visible {
865
- outline: none;
866
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
974
+
975
+ .dataviews-view-table__cell-content-wrapper:empty {
976
+ display: none;
867
977
  }
868
978
 
869
979
  /* stylelint-disable-next-line scss/at-rule-no-unknown -- '@container' not globally permitted */
870
980
  @container (max-width: 430px) {
871
- .dataviews-pagination,
872
- .dataviews-filters__view-actions {
873
- padding: 12px 24px;
874
- }
875
-
876
- .dataviews-filters__view-actions .components-search-control .components-base-control__field {
877
- max-width: 112px;
878
- }
879
-
880
981
  .dataviews-view-table tr td:first-child,
881
982
  .dataviews-view-table tr th:first-child {
882
983
  padding-right: 24px;
@@ -886,53 +987,14 @@
886
987
  .dataviews-view-table tr th:last-child {
887
988
  padding-left: 24px;
888
989
  }
889
-
890
- .dataviews-view-grid,
891
- .dataviews-no-results,
892
- .dataviews-loading {
893
- padding-right: 24px;
894
- padding-left: 24px;
895
- }
896
- }
897
- .dataviews-bulk-actions-toolbar-wrapper {
898
- display: flex;
899
- flex-grow: 1;
900
- width: 100%;
901
- }
902
- .dataviews-bulk-actions-toolbar-wrapper .components-toolbar-group {
903
- align-items: center;
904
- }
905
- .dataviews-bulk-actions-toolbar-wrapper .components-button.is-busy {
906
- max-height: 36px;
907
- }
908
-
909
- .dataviews-bulk-actions {
910
- position: sticky;
911
- display: flex;
912
- flex-direction: column;
913
- align-content: center;
914
- flex-wrap: wrap;
915
- width: -moz-fit-content;
916
- width: fit-content;
917
- margin-right: auto;
918
- margin-left: auto;
919
- bottom: 24px;
920
- z-index: 2;
921
- }
922
- .dataviews-bulk-actions .components-accessible-toolbar {
923
- border-color: #ddd;
924
- box-shadow: 0 0.7px 1px rgba(0, 0, 0, 0.1), 0 1.2px 1.7px -0.2px rgba(0, 0, 0, 0.1), 0 2.3px 3.3px -0.5px rgba(0, 0, 0, 0.1);
925
990
  }
926
- .dataviews-bulk-actions .components-accessible-toolbar .components-toolbar-group {
927
- border-color: #e0e0e0;
928
- }
929
- .dataviews-bulk-actions .components-accessible-toolbar .components-toolbar-group:last-child {
930
- border: 0;
991
+ .dataviews-view-table-selection-checkbox {
992
+ --checkbox-input-size: 24px;
931
993
  }
932
- .dataviews-bulk-actions .dataviews-bulk-actions__selection-count {
933
- display: flex;
934
- align-items: center;
935
- margin: 0 8px 0 8px;
994
+ @media (min-width: 600px) {
995
+ .dataviews-view-table-selection-checkbox {
996
+ --checkbox-input-size: 16px;
997
+ }
936
998
  }
937
999
 
938
1000
  .edit-site-custom-template-modal__contents-wrapper {
@@ -1013,15 +1075,12 @@
1013
1075
  margin-bottom: 4px;
1014
1076
  }
1015
1077
 
1016
- .edit-site-add-new-template__modal {
1017
- max-width: 832px;
1018
- width: calc(100% - 64px);
1019
- margin-top: 64px;
1020
- max-height: calc(100% - 128px);
1021
- }
1022
1078
  @media (min-width: 960px) {
1023
1079
  .edit-site-add-new-template__modal {
1080
+ max-width: 832px;
1081
+ margin-top: 64px;
1024
1082
  width: calc(100% - 128px);
1083
+ max-height: calc(100% - 128px);
1025
1084
  }
1026
1085
  }
1027
1086
  .edit-site-add-new-template__modal .edit-site-add-new-template__template-button svg,
@@ -1082,8 +1141,7 @@
1082
1141
  .edit-site-custom-template-modal__contents .edit-site-add-new-template__template-list__prompt,
1083
1142
  .edit-site-add-new-template__template-list__contents .edit-site-add-new-template__custom-template-button,
1084
1143
  .edit-site-add-new-template__template-list__contents .edit-site-add-new-template__template-list__prompt {
1085
- grid-column-start: 1;
1086
- grid-column-end: 4;
1144
+ grid-column: 1/-1;
1087
1145
  }
1088
1146
 
1089
1147
  .edit-site-add-new-template__template-list__contents > .components-button {
@@ -1153,6 +1211,17 @@
1153
1211
  overflow: hidden;
1154
1212
  }
1155
1213
 
1214
+ .edit-site-font-size__item {
1215
+ white-space: nowrap;
1216
+ text-overflow: ellipsis;
1217
+ overflow: hidden;
1218
+ line-break: anywhere;
1219
+ }
1220
+
1221
+ .edit-site-font-size__item-value {
1222
+ color: #757575;
1223
+ }
1224
+
1156
1225
  .edit-site-global-styles-screen {
1157
1226
  margin: 12px 16px 16px;
1158
1227
  }
@@ -1171,7 +1240,6 @@
1171
1240
  color: #757575;
1172
1241
  }
1173
1242
 
1174
- .edit-site-global-styles-font-families__add-fonts,
1175
1243
  .edit-site-global-styles-font-families__manage-fonts {
1176
1244
  justify-content: center;
1177
1245
  }
@@ -1229,13 +1297,13 @@
1229
1297
  .edit-site-global-styles__block-preview-panel {
1230
1298
  position: relative;
1231
1299
  width: 100%;
1232
- overflow: auto;
1233
1300
  border: #e0e0e0 1px solid;
1234
1301
  border-radius: 2px;
1302
+ overflow: hidden;
1235
1303
  }
1236
1304
 
1237
1305
  .edit-site-global-styles__shadow-preview-panel {
1238
- height: 150px;
1306
+ height: 144px;
1239
1307
  border: #e0e0e0 1px solid;
1240
1308
  border-radius: 2px;
1241
1309
  overflow: auto;
@@ -1782,6 +1850,7 @@
1782
1850
  display: flex;
1783
1851
  flex-direction: column;
1784
1852
  height: 100%;
1853
+ width: 100%;
1785
1854
  }
1786
1855
  .page-templates-preview-field .page-templates-preview-field__button {
1787
1856
  box-shadow: none;
@@ -1833,12 +1902,12 @@
1833
1902
  width: 24px;
1834
1903
  height: 24px;
1835
1904
  align-items: center;
1836
- justify-content: center;
1905
+ justify-content: right;
1837
1906
  display: flex;
1838
1907
  }
1839
1908
  .page-templates-author-field__avatar img {
1840
- width: 20px;
1841
- height: 20px;
1909
+ width: 16px;
1910
+ height: 16px;
1842
1911
  object-fit: cover;
1843
1912
  opacity: 0;
1844
1913
  transition: opacity 0.1s linear;
@@ -1861,6 +1930,7 @@
1861
1930
  height: 24px;
1862
1931
  }
1863
1932
  .page-templates-author-field__icon svg {
1933
+ margin-right: -4px;
1864
1934
  fill: currentColor;
1865
1935
  }
1866
1936
 
@@ -1969,7 +2039,7 @@
1969
2039
  }
1970
2040
  @media (min-width: 782px) {
1971
2041
  .edit-site-layout__sidebar-region {
1972
- width: 360px;
2042
+ width: 300px;
1973
2043
  }
1974
2044
  }
1975
2045
  .edit-site-layout.is-full-canvas .edit-site-layout__sidebar-region {
@@ -2104,8 +2174,10 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2104
2174
  .edit-site-layout__view-mode-toggle.components-button:hover, .edit-site-layout__view-mode-toggle.components-button:active {
2105
2175
  color: #fff;
2106
2176
  }
2107
- .edit-site-layout__view-mode-toggle.components-button:focus {
2108
- box-shadow: none;
2177
+ .edit-site-layout__view-mode-toggle.components-button:focus-visible, .edit-site-layout__view-mode-toggle.components-button:focus {
2178
+ box-shadow: 0 0 0 3px #1e1e1e, 0 0 0 6px var(--wp-admin-theme-color);
2179
+ outline: 4px solid #0000;
2180
+ outline-offset: 4px;
2109
2181
  }
2110
2182
  .edit-site-layout__view-mode-toggle.components-button::before {
2111
2183
  transition: box-shadow 0.1s ease;
@@ -2125,9 +2197,6 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2125
2197
  transition-delay: 0s;
2126
2198
  }
2127
2199
  }
2128
- .edit-site-layout__view-mode-toggle.components-button:focus::before {
2129
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) rgba(255, 255, 255, 0.1), inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2130
- }
2131
2200
  .edit-site-layout__view-mode-toggle.components-button .edit-site-layout__view-mode-toggle-icon {
2132
2201
  display: flex;
2133
2202
  height: 64px;
@@ -2180,6 +2249,20 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2180
2249
  padding-left: 16px;
2181
2250
  }
2182
2251
 
2252
+ .edit-site-layout.is-full-canvas .edit-site-layout__view-mode-toggle.components-button:focus-visible, .edit-site-layout.is-full-canvas .edit-site-layout__view-mode-toggle.components-button:focus {
2253
+ box-shadow: none;
2254
+ outline: none;
2255
+ outline-offset: 0;
2256
+ }
2257
+ .edit-site-layout.is-full-canvas .edit-site-layout__view-mode-toggle.components-button:focus-visible .edit-site-site-icon svg, .edit-site-layout.is-full-canvas .edit-site-layout__view-mode-toggle.components-button:focus .edit-site-site-icon svg {
2258
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color, #3858e9);
2259
+ outline: 3px solid #0000;
2260
+ height: 40px;
2261
+ width: 40px;
2262
+ padding: 2px;
2263
+ border-radius: 2px;
2264
+ }
2265
+
2183
2266
  .edit-site-save-hub {
2184
2267
  color: #949494;
2185
2268
  border-top: 1px solid #2f2f2f;
@@ -2216,7 +2299,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2216
2299
  contain: content;
2217
2300
  }
2218
2301
 
2219
- @keyframes _ld46o_slide-from-right {
2302
+ @keyframes _jrymq_slide-from-right {
2220
2303
  from {
2221
2304
  transform: translateX(-50px);
2222
2305
  opacity: 0;
@@ -2226,7 +2309,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2226
2309
  opacity: 1;
2227
2310
  }
2228
2311
  }
2229
- @keyframes _ld46o_slide-from-left {
2312
+ @keyframes _jrymq_slide-from-left {
2230
2313
  from {
2231
2314
  transform: translateX(50px);
2232
2315
  opacity: 0;
@@ -2282,10 +2365,10 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2282
2365
  }
2283
2366
  }
2284
2367
  .edit-site-sidebar__screen-wrapper.slide-from-left {
2285
- animation-name: _ld46o_slide-from-left;
2368
+ animation-name: _jrymq_slide-from-left;
2286
2369
  }
2287
2370
  .edit-site-sidebar__screen-wrapper.slide-from-right {
2288
- animation-name: _ld46o_slide-from-right;
2371
+ animation-name: _jrymq_slide-from-right;
2289
2372
  }
2290
2373
 
2291
2374
  .edit-site-sidebar-button {
@@ -2743,18 +2826,27 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2743
2826
  background: #fff;
2744
2827
  }
2745
2828
 
2746
- .posts-list-page__featured-image {
2829
+ .edit-site-post-edit {
2830
+ padding: 24px;
2831
+ }
2832
+ .edit-site-post-edit.is-empty .edit-site-page-content {
2833
+ display: flex;
2834
+ align-items: center;
2835
+ justify-content: center;
2836
+ }
2837
+
2838
+ .edit-site-post-list__featured-image {
2747
2839
  height: 100%;
2748
2840
  object-fit: cover;
2749
2841
  width: 100%;
2750
2842
  }
2751
2843
 
2752
- .posts-list-page__featured-image-wrapper {
2844
+ .edit-site-post-list__featured-image-wrapper {
2753
2845
  height: 100%;
2754
2846
  width: 100%;
2755
2847
  border-radius: 4px;
2756
2848
  }
2757
- .posts-list-page__featured-image-wrapper.is-layout-table:not(:has(.posts-list-page-preview-field__button)), .posts-list-page__featured-image-wrapper.is-layout-table .posts-list-page-preview-field__button {
2849
+ .edit-site-post-list__featured-image-wrapper.is-layout-table:not(:has(.edit-site-post-list__featured-image-button)), .edit-site-post-list__featured-image-wrapper.is-layout-table .edit-site-post-list__featured-image-button {
2758
2850
  width: 32px;
2759
2851
  height: 32px;
2760
2852
  display: block;
@@ -2764,7 +2856,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2764
2856
  background-color: #f0f0f0;
2765
2857
  flex-grow: 0 !important;
2766
2858
  }
2767
- .posts-list-page__featured-image-wrapper.is-layout-table:not(:has(.posts-list-page-preview-field__button))::after, .posts-list-page__featured-image-wrapper.is-layout-table .posts-list-page-preview-field__button::after {
2859
+ .edit-site-post-list__featured-image-wrapper.is-layout-table:not(:has(.edit-site-post-list__featured-image-button))::after, .edit-site-post-list__featured-image-wrapper.is-layout-table .edit-site-post-list__featured-image-button::after {
2768
2860
  border-radius: 4px;
2769
2861
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
2770
2862
  content: "";
@@ -2775,7 +2867,7 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2775
2867
  width: 100%;
2776
2868
  }
2777
2869
 
2778
- .posts-list-page-preview-field__button {
2870
+ .edit-site-post-list__featured-image-button {
2779
2871
  box-shadow: none;
2780
2872
  border: none;
2781
2873
  padding: 0;
@@ -2787,22 +2879,22 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2787
2879
  width: 100%;
2788
2880
  border-radius: 4px;
2789
2881
  }
2790
- .posts-list-page-preview-field__button:focus-visible {
2882
+ .edit-site-post-list__featured-image-button:focus-visible {
2791
2883
  box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2792
2884
  outline: 2px solid transparent;
2793
2885
  }
2794
2886
 
2795
- .dataviews-view-grid__card.is-selected .posts-list-page-preview-field__button::after {
2887
+ .dataviews-view-grid__card.is-selected .edit-site-post-list__featured-image-button::after {
2796
2888
  box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2797
2889
  background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
2798
2890
  }
2799
2891
 
2800
- .posts-list-page-title span {
2892
+ .edit-site-post-list__title span {
2801
2893
  text-overflow: ellipsis;
2802
2894
  overflow: hidden;
2803
2895
  }
2804
2896
 
2805
- .posts-list-page-title-badge {
2897
+ .edit-site-post-list__title-badge {
2806
2898
  background: #f0f0f0;
2807
2899
  color: #757575;
2808
2900
  padding: 0 4px;
@@ -2810,13 +2902,16 @@ html.canvas-mode-edit-transition::view-transition-group(toggle) {
2810
2902
  font-size: 12px;
2811
2903
  font-weight: 400;
2812
2904
  flex-shrink: 0;
2905
+ line-height: 20px;
2813
2906
  }
2814
2907
 
2815
- .posts-list-page-post-author-field__icon-container {
2908
+ .edit-site-post-list__status-icon {
2816
2909
  height: 24px;
2910
+ width: 24px;
2817
2911
  }
2818
- .posts-list-page-post-author-field__icon-container svg {
2912
+ .edit-site-post-list__status-icon svg {
2819
2913
  fill: currentColor;
2914
+ margin-right: -4px;
2820
2915
  }
2821
2916
 
2822
2917
  .edit-site-resizable-frame__inner {
@@ -3048,6 +3143,13 @@ button.font-library-modal__upload-area {
3048
3143
  justify-content: center;
3049
3144
  }
3050
3145
 
3146
+ .font-library-modal__select-all {
3147
+ padding: 16px 17px 16px 16px;
3148
+ }
3149
+ .font-library-modal__select-all .components-checkbox-control__label {
3150
+ padding-right: 16px;
3151
+ }
3152
+
3051
3153
  .edit-site-pagination .components-button.is-tertiary {
3052
3154
  width: 32px;
3053
3155
  height: 32px;