@wordpress/editor 14.45.2-next.v.202605131032.0 → 14.47.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 (326) hide show
  1. package/CHANGELOG.md +12 -1
  2. package/build/components/collab-sidebar/add-note.cjs +6 -0
  3. package/build/components/collab-sidebar/add-note.cjs.map +2 -2
  4. package/build/components/collab-sidebar/hooks.cjs +36 -24
  5. package/build/components/collab-sidebar/hooks.cjs.map +2 -2
  6. package/build/components/collab-sidebar/index.cjs +19 -10
  7. package/build/components/collab-sidebar/index.cjs.map +2 -2
  8. package/build/components/collab-sidebar/note-byline.cjs +16 -9
  9. package/build/components/collab-sidebar/note-byline.cjs.map +2 -2
  10. package/build/components/collab-sidebar/notes.cjs +20 -11
  11. package/build/components/collab-sidebar/notes.cjs.map +2 -2
  12. package/build/components/collab-sidebar/utils.cjs +42 -2
  13. package/build/components/collab-sidebar/utils.cjs.map +2 -2
  14. package/build/components/collaborators-overlay/compute-selection.cjs +39 -15
  15. package/build/components/collaborators-overlay/compute-selection.cjs.map +3 -3
  16. package/build/components/collaborators-overlay/use-block-highlighting.cjs +10 -2
  17. package/build/components/collaborators-overlay/use-block-highlighting.cjs.map +3 -3
  18. package/build/components/collaborators-overlay/use-render-cursors.cjs +15 -7
  19. package/build/components/collaborators-overlay/use-render-cursors.cjs.map +3 -3
  20. package/build/components/collaborators-presence/avatar/component.cjs +5 -1
  21. package/build/components/collaborators-presence/avatar/component.cjs.map +3 -3
  22. package/build/components/collaborators-presence/use-collaborator-notifications.cjs +6 -3
  23. package/build/components/collaborators-presence/use-collaborator-notifications.cjs.map +2 -2
  24. package/build/components/editor-interface/index.cjs +17 -16
  25. package/build/components/editor-interface/index.cjs.map +3 -3
  26. package/build/components/editor-notices/index.cjs +6 -1
  27. package/build/components/editor-notices/index.cjs.map +3 -3
  28. package/build/components/global-styles/hooks.cjs +12 -1
  29. package/build/components/global-styles/hooks.cjs.map +2 -2
  30. package/build/components/header/index.cjs +11 -6
  31. package/build/components/header/index.cjs.map +2 -2
  32. package/build/components/media/media-editor-modal.cjs +14 -1
  33. package/build/components/media/media-editor-modal.cjs.map +2 -2
  34. package/build/components/post-card-panel/index.cjs +7 -1
  35. package/build/components/post-card-panel/index.cjs.map +3 -3
  36. package/build/components/post-last-revision/index.cjs +28 -8
  37. package/build/components/post-last-revision/index.cjs.map +2 -2
  38. package/build/components/post-locked-modal/index.cjs +9 -6
  39. package/build/components/post-locked-modal/index.cjs.map +2 -2
  40. package/build/components/post-publish-button/label.cjs +0 -7
  41. package/build/components/post-publish-button/label.cjs.map +2 -2
  42. package/build/components/post-publish-panel/prepublish.cjs +8 -1
  43. package/build/components/post-publish-panel/prepublish.cjs.map +3 -3
  44. package/build/components/post-revisions-panel/index.cjs +7 -0
  45. package/build/components/post-revisions-panel/index.cjs.map +2 -2
  46. package/build/components/post-revisions-preview/diff-markers.cjs +21 -13
  47. package/build/components/post-revisions-preview/diff-markers.cjs.map +2 -2
  48. package/build/components/post-revisions-preview/revisions-canvas.cjs +7 -1
  49. package/build/components/post-revisions-preview/revisions-canvas.cjs.map +2 -2
  50. package/build/components/post-taxonomies/check.cjs +1 -2
  51. package/build/components/post-taxonomies/check.cjs.map +2 -2
  52. package/build/components/post-taxonomies/index.cjs +1 -2
  53. package/build/components/post-taxonomies/index.cjs.map +2 -2
  54. package/build/components/preferences-modal/index.cjs +1 -1
  55. package/build/components/preferences-modal/index.cjs.map +2 -2
  56. package/build/components/preview-dropdown/index.cjs.map +3 -3
  57. package/build/components/provider/index.cjs +5 -21
  58. package/build/components/provider/index.cjs.map +3 -3
  59. package/build/components/provider/use-block-editor-settings.cjs +16 -9
  60. package/build/components/provider/use-block-editor-settings.cjs.map +3 -3
  61. package/build/components/resizable-editor/resize-handle.cjs +24 -16
  62. package/build/components/resizable-editor/resize-handle.cjs.map +2 -2
  63. package/build/components/sidebar/header.cjs +16 -21
  64. package/build/components/sidebar/header.cjs.map +3 -3
  65. package/build/components/sidebar/index.cjs +2 -6
  66. package/build/components/sidebar/index.cjs.map +2 -2
  67. package/build/components/start-page-options/index.cjs +14 -4
  68. package/build/components/start-page-options/index.cjs.map +2 -2
  69. package/build/components/start-template-options/index.cjs +8 -6
  70. package/build/components/start-template-options/index.cjs.map +2 -2
  71. package/build/components/styles-canvas/style-book.cjs +59 -2
  72. package/build/components/styles-canvas/style-book.cjs.map +2 -2
  73. package/build/components/sync-connection-error-modal/index.cjs +10 -7
  74. package/build/components/sync-connection-error-modal/index.cjs.map +3 -3
  75. package/build/components/template-actions-panel/block-theme-content.cjs +21 -12
  76. package/build/components/template-actions-panel/block-theme-content.cjs.map +2 -2
  77. package/build/dataviews/store/private-actions.cjs.map +2 -2
  78. package/build/store/private-actions.cjs +17 -1
  79. package/build/store/private-actions.cjs.map +3 -3
  80. package/build/store/private-selectors.cjs +18 -0
  81. package/build/store/private-selectors.cjs.map +2 -2
  82. package/build/store/selectors.cjs +0 -17
  83. package/build/store/selectors.cjs.map +2 -2
  84. package/build/{components/media → utils/media-delete}/index.cjs +12 -13
  85. package/build/utils/media-delete/index.cjs.map +7 -0
  86. package/build/utils/media-finalize/index.cjs +3 -1
  87. package/build/utils/media-finalize/index.cjs.map +2 -2
  88. package/build/utils/sync-error-messages.cjs +9 -0
  89. package/build/utils/sync-error-messages.cjs.map +2 -2
  90. package/build-module/components/collab-sidebar/add-note.mjs +6 -0
  91. package/build-module/components/collab-sidebar/add-note.mjs.map +2 -2
  92. package/build-module/components/collab-sidebar/hooks.mjs +42 -25
  93. package/build-module/components/collab-sidebar/hooks.mjs.map +2 -2
  94. package/build-module/components/collab-sidebar/index.mjs +19 -10
  95. package/build-module/components/collab-sidebar/index.mjs.map +2 -2
  96. package/build-module/components/collab-sidebar/note-byline.mjs +17 -10
  97. package/build-module/components/collab-sidebar/note-byline.mjs.map +2 -2
  98. package/build-module/components/collab-sidebar/notes.mjs +26 -13
  99. package/build-module/components/collab-sidebar/notes.mjs.map +2 -2
  100. package/build-module/components/collab-sidebar/utils.mjs +38 -2
  101. package/build-module/components/collab-sidebar/utils.mjs.map +2 -2
  102. package/build-module/components/collaborators-overlay/compute-selection.mjs +36 -12
  103. package/build-module/components/collaborators-overlay/compute-selection.mjs.map +2 -2
  104. package/build-module/components/collaborators-overlay/use-block-highlighting.mjs +10 -3
  105. package/build-module/components/collaborators-overlay/use-block-highlighting.mjs.map +2 -2
  106. package/build-module/components/collaborators-overlay/use-render-cursors.mjs +11 -6
  107. package/build-module/components/collaborators-overlay/use-render-cursors.mjs.map +2 -2
  108. package/build-module/components/collaborators-presence/avatar/component.mjs +7 -3
  109. package/build-module/components/collaborators-presence/avatar/component.mjs.map +2 -2
  110. package/build-module/components/collaborators-presence/use-collaborator-notifications.mjs +6 -3
  111. package/build-module/components/collaborators-presence/use-collaborator-notifications.mjs.map +2 -2
  112. package/build-module/components/editor-interface/index.mjs +22 -17
  113. package/build-module/components/editor-interface/index.mjs.map +2 -2
  114. package/build-module/components/editor-notices/index.mjs +6 -1
  115. package/build-module/components/editor-notices/index.mjs.map +2 -2
  116. package/build-module/components/global-styles/hooks.mjs +12 -1
  117. package/build-module/components/global-styles/hooks.mjs.map +2 -2
  118. package/build-module/components/header/index.mjs +11 -6
  119. package/build-module/components/header/index.mjs.map +2 -2
  120. package/build-module/components/media/media-editor-modal.mjs +14 -1
  121. package/build-module/components/media/media-editor-modal.mjs.map +2 -2
  122. package/build-module/components/post-card-panel/index.mjs +8 -2
  123. package/build-module/components/post-card-panel/index.mjs.map +2 -2
  124. package/build-module/components/post-last-revision/index.mjs +29 -9
  125. package/build-module/components/post-last-revision/index.mjs.map +2 -2
  126. package/build-module/components/post-locked-modal/index.mjs +9 -6
  127. package/build-module/components/post-locked-modal/index.mjs.map +2 -2
  128. package/build-module/components/post-publish-button/label.mjs +0 -7
  129. package/build-module/components/post-publish-button/label.mjs.map +2 -2
  130. package/build-module/components/post-publish-panel/prepublish.mjs +9 -2
  131. package/build-module/components/post-publish-panel/prepublish.mjs.map +2 -2
  132. package/build-module/components/post-revisions-panel/index.mjs +7 -0
  133. package/build-module/components/post-revisions-panel/index.mjs.map +2 -2
  134. package/build-module/components/post-revisions-preview/diff-markers.mjs +22 -14
  135. package/build-module/components/post-revisions-preview/diff-markers.mjs.map +2 -2
  136. package/build-module/components/post-revisions-preview/revisions-canvas.mjs +7 -1
  137. package/build-module/components/post-revisions-preview/revisions-canvas.mjs.map +2 -2
  138. package/build-module/components/post-taxonomies/check.mjs +1 -2
  139. package/build-module/components/post-taxonomies/check.mjs.map +2 -2
  140. package/build-module/components/post-taxonomies/index.mjs +1 -2
  141. package/build-module/components/post-taxonomies/index.mjs.map +2 -2
  142. package/build-module/components/preferences-modal/index.mjs +1 -1
  143. package/build-module/components/preferences-modal/index.mjs.map +2 -2
  144. package/build-module/components/preview-dropdown/index.mjs +2 -2
  145. package/build-module/components/preview-dropdown/index.mjs.map +2 -2
  146. package/build-module/components/provider/index.mjs +6 -22
  147. package/build-module/components/provider/index.mjs.map +2 -2
  148. package/build-module/components/provider/use-block-editor-settings.mjs +16 -9
  149. package/build-module/components/provider/use-block-editor-settings.mjs.map +2 -2
  150. package/build-module/components/resizable-editor/resize-handle.mjs +26 -18
  151. package/build-module/components/resizable-editor/resize-handle.mjs.map +2 -2
  152. package/build-module/components/sidebar/header.mjs +11 -16
  153. package/build-module/components/sidebar/header.mjs.map +2 -2
  154. package/build-module/components/sidebar/index.mjs +2 -7
  155. package/build-module/components/sidebar/index.mjs.map +2 -2
  156. package/build-module/components/start-page-options/index.mjs +14 -4
  157. package/build-module/components/start-page-options/index.mjs.map +2 -2
  158. package/build-module/components/start-template-options/index.mjs +8 -6
  159. package/build-module/components/start-template-options/index.mjs.map +2 -2
  160. package/build-module/components/styles-canvas/style-book.mjs +60 -3
  161. package/build-module/components/styles-canvas/style-book.mjs.map +2 -2
  162. package/build-module/components/sync-connection-error-modal/index.mjs +14 -8
  163. package/build-module/components/sync-connection-error-modal/index.mjs.map +2 -2
  164. package/build-module/components/template-actions-panel/block-theme-content.mjs +21 -13
  165. package/build-module/components/template-actions-panel/block-theme-content.mjs.map +2 -2
  166. package/build-module/dataviews/store/private-actions.mjs.map +2 -2
  167. package/build-module/store/private-actions.mjs +16 -1
  168. package/build-module/store/private-actions.mjs.map +2 -2
  169. package/build-module/store/private-selectors.mjs +18 -0
  170. package/build-module/store/private-selectors.mjs.map +2 -2
  171. package/build-module/store/selectors.mjs +0 -16
  172. package/build-module/store/selectors.mjs.map +2 -2
  173. package/build-module/utils/media-delete/index.mjs +12 -0
  174. package/build-module/utils/media-delete/index.mjs.map +7 -0
  175. package/build-module/utils/media-finalize/index.mjs +3 -1
  176. package/build-module/utils/media-finalize/index.mjs.map +2 -2
  177. package/build-module/utils/sync-error-messages.mjs +8 -0
  178. package/build-module/utils/sync-error-messages.mjs.map +2 -2
  179. package/build-style/style-rtl.css +462 -408
  180. package/build-style/style.css +462 -408
  181. package/build-types/components/collab-sidebar/add-note.d.ts.map +1 -1
  182. package/build-types/components/collab-sidebar/hooks.d.ts.map +1 -1
  183. package/build-types/components/collab-sidebar/index.d.ts.map +1 -1
  184. package/build-types/components/collab-sidebar/note-byline.d.ts +3 -0
  185. package/build-types/components/collab-sidebar/note-byline.d.ts.map +1 -1
  186. package/build-types/components/collab-sidebar/notes.d.ts.map +1 -1
  187. package/build-types/components/collab-sidebar/utils.d.ts +33 -0
  188. package/build-types/components/collab-sidebar/utils.d.ts.map +1 -1
  189. package/build-types/components/collaborators-overlay/compute-selection.d.ts.map +1 -1
  190. package/build-types/components/collaborators-overlay/use-block-highlighting.d.ts +3 -0
  191. package/build-types/components/collaborators-overlay/use-block-highlighting.d.ts.map +1 -1
  192. package/build-types/components/collaborators-overlay/use-render-cursors.d.ts.map +1 -1
  193. package/build-types/components/collaborators-presence/avatar/component.d.ts.map +1 -1
  194. package/build-types/components/collaborators-presence/use-collaborator-notifications.d.ts.map +1 -1
  195. package/build-types/components/editor-interface/index.d.ts.map +1 -1
  196. package/build-types/components/editor-notices/index.d.ts.map +1 -1
  197. package/build-types/components/global-styles/hooks.d.ts.map +1 -1
  198. package/build-types/components/media/media-editor-modal.d.ts +6 -2
  199. package/build-types/components/media/media-editor-modal.d.ts.map +1 -1
  200. package/build-types/components/post-card-panel/index.d.ts.map +1 -1
  201. package/build-types/components/post-last-revision/index.d.ts.map +1 -1
  202. package/build-types/components/post-locked-modal/index.d.ts +1 -6
  203. package/build-types/components/post-locked-modal/index.d.ts.map +1 -1
  204. package/build-types/components/post-publish-button/label.d.ts.map +1 -1
  205. package/build-types/components/post-publish-panel/prepublish.d.ts.map +1 -1
  206. package/build-types/components/post-revisions-panel/index.d.ts +1 -1
  207. package/build-types/components/post-revisions-panel/index.d.ts.map +1 -1
  208. package/build-types/components/post-revisions-preview/diff-markers.d.ts.map +1 -1
  209. package/build-types/components/post-revisions-preview/revisions-canvas.d.ts.map +1 -1
  210. package/build-types/components/post-taxonomies/check.d.ts.map +1 -1
  211. package/build-types/components/post-taxonomies/flat-term-selector.d.ts +1 -6
  212. package/build-types/components/post-taxonomies/hierarchical-term-selector.d.ts +1 -6
  213. package/build-types/components/post-taxonomies/index.d.ts.map +1 -1
  214. package/build-types/components/provider/index.d.ts.map +1 -1
  215. package/build-types/components/provider/use-block-editor-settings.d.ts.map +1 -1
  216. package/build-types/components/resizable-editor/resize-handle.d.ts.map +1 -1
  217. package/build-types/components/sidebar/index.d.ts.map +1 -1
  218. package/build-types/components/start-page-options/index.d.ts.map +1 -1
  219. package/build-types/components/start-template-options/index.d.ts.map +1 -1
  220. package/build-types/components/styles-canvas/style-book.d.ts.map +1 -1
  221. package/build-types/components/sync-connection-error-modal/index.d.ts.map +1 -1
  222. package/build-types/components/template-actions-panel/block-theme-content.d.ts.map +1 -1
  223. package/build-types/dataviews/store/private-actions.d.ts +0 -1
  224. package/build-types/dataviews/store/private-actions.d.ts.map +1 -1
  225. package/build-types/store/private-actions.d.ts +15 -0
  226. package/build-types/store/private-actions.d.ts.map +1 -1
  227. package/build-types/store/private-selectors.d.ts +10 -0
  228. package/build-types/store/private-selectors.d.ts.map +1 -1
  229. package/build-types/store/selectors.d.ts +0 -10
  230. package/build-types/store/selectors.d.ts.map +1 -1
  231. package/build-types/utils/get-template-part-icon.d.ts.map +1 -1
  232. package/build-types/utils/media-delete/index.d.ts +2 -0
  233. package/build-types/utils/media-delete/index.d.ts.map +1 -0
  234. package/build-types/utils/media-finalize/index.d.ts +1 -1
  235. package/build-types/utils/media-finalize/index.d.ts.map +1 -1
  236. package/build-types/utils/sync-error-messages.d.ts +1 -0
  237. package/build-types/utils/sync-error-messages.d.ts.map +1 -1
  238. package/package.json +48 -48
  239. package/src/components/collab-sidebar/add-note.js +9 -0
  240. package/src/components/collab-sidebar/hooks.js +53 -29
  241. package/src/components/collab-sidebar/index.js +28 -14
  242. package/src/components/collab-sidebar/note-byline.js +15 -10
  243. package/src/components/collab-sidebar/notes.js +36 -14
  244. package/src/components/collab-sidebar/test/utils.js +375 -1
  245. package/src/components/collab-sidebar/utils.js +70 -1
  246. package/src/components/collaborators-overlay/compute-selection.ts +67 -19
  247. package/src/components/collaborators-overlay/use-block-highlighting.ts +14 -1
  248. package/src/components/collaborators-overlay/use-render-cursors.ts +15 -4
  249. package/src/components/collaborators-presence/avatar/component.tsx +10 -3
  250. package/src/components/collaborators-presence/avatar/test/index.tsx +50 -18
  251. package/src/components/collaborators-presence/styles/collaborators-presence.scss +4 -1
  252. package/src/components/collaborators-presence/test/use-collaborator-notifications.ts +2 -1
  253. package/src/components/collaborators-presence/use-collaborator-notifications.ts +6 -4
  254. package/src/components/editor-help/help-topic-row.native.js +2 -2
  255. package/src/components/editor-interface/index.js +22 -23
  256. package/src/components/editor-interface/style.scss +4 -0
  257. package/src/components/editor-notices/index.js +7 -1
  258. package/src/components/error-boundary/index.native.js +2 -2
  259. package/src/components/global-styles/hooks.js +26 -0
  260. package/src/components/global-styles-sidebar/style.scss +0 -9
  261. package/src/components/header/index.js +12 -12
  262. package/src/components/media/media-editor-modal.js +20 -2
  263. package/src/components/offline-status/index.native.js +2 -2
  264. package/src/components/post-card-panel/index.js +5 -2
  265. package/src/components/post-last-revision/index.js +37 -9
  266. package/src/components/post-last-revision/style.scss +0 -3
  267. package/src/components/post-locked-modal/index.js +8 -5
  268. package/src/components/post-panel-row/style.scss +1 -0
  269. package/src/components/post-publish-button/label.js +0 -11
  270. package/src/components/post-publish-panel/prepublish.js +6 -2
  271. package/src/components/post-revisions-panel/index.js +8 -0
  272. package/src/components/post-revisions-preview/diff-markers.js +17 -11
  273. package/src/components/post-revisions-preview/revisions-canvas.js +7 -1
  274. package/src/components/post-revisions-preview/style.scss +4 -4
  275. package/src/components/post-taxonomies/check.js +1 -2
  276. package/src/components/post-taxonomies/index.js +1 -2
  277. package/src/components/preferences-modal/index.js +1 -1
  278. package/src/components/preview-dropdown/index.js +2 -2
  279. package/src/components/provider/index.js +10 -31
  280. package/src/components/provider/use-block-editor-settings.js +19 -12
  281. package/src/components/resizable-editor/resize-handle.js +22 -16
  282. package/src/components/sidebar/header.js +18 -28
  283. package/src/components/sidebar/index.js +5 -14
  284. package/src/components/start-page-options/index.js +19 -4
  285. package/src/components/start-template-options/index.js +13 -6
  286. package/src/components/styles-canvas/style-book.js +75 -13
  287. package/src/components/sync-connection-error-modal/index.tsx +25 -11
  288. package/src/components/template-actions-panel/block-theme-content.js +19 -13
  289. package/src/components/text-editor/style.scss +2 -2
  290. package/src/dataviews/store/private-actions.ts +0 -1
  291. package/src/store/private-actions.js +27 -0
  292. package/src/store/private-selectors.js +26 -0
  293. package/src/store/selectors.js +0 -24
  294. package/src/store/test/actions.js +34 -0
  295. package/src/utils/media-delete/index.js +11 -0
  296. package/src/utils/media-finalize/index.js +6 -1
  297. package/src/utils/media-finalize/test/index.js +32 -2
  298. package/src/utils/sync-error-messages.ts +8 -0
  299. package/src/utils/test/sync-error-messages.js +1 -0
  300. package/build/components/global-styles-provider/index.cjs +0 -181
  301. package/build/components/global-styles-provider/index.cjs.map +0 -7
  302. package/build/components/media/index.cjs.map +0 -7
  303. package/build/components/media/metadata-panel.cjs +0 -96
  304. package/build/components/media/metadata-panel.cjs.map +0 -7
  305. package/build/components/media/preview.cjs +0 -39
  306. package/build/components/media/preview.cjs.map +0 -7
  307. package/build-module/components/global-styles-provider/index.mjs +0 -156
  308. package/build-module/components/global-styles-provider/index.mjs.map +0 -7
  309. package/build-module/components/media/index.mjs +0 -8
  310. package/build-module/components/media/index.mjs.map +0 -7
  311. package/build-module/components/media/metadata-panel.mjs +0 -65
  312. package/build-module/components/media/metadata-panel.mjs.map +0 -7
  313. package/build-module/components/media/preview.mjs +0 -21
  314. package/build-module/components/media/preview.mjs.map +0 -7
  315. package/build-types/components/global-styles-provider/index.d.ts +0 -16
  316. package/build-types/components/global-styles-provider/index.d.ts.map +0 -1
  317. package/build-types/components/media/index.d.ts +0 -3
  318. package/build-types/components/media/index.d.ts.map +0 -1
  319. package/build-types/components/media/metadata-panel.d.ts +0 -12
  320. package/build-types/components/media/metadata-panel.d.ts.map +0 -1
  321. package/build-types/components/media/preview.d.ts +0 -9
  322. package/build-types/components/media/preview.d.ts.map +0 -1
  323. package/src/components/global-styles-provider/index.js +0 -207
  324. package/src/components/media/index.js +0 -2
  325. package/src/components/media/metadata-panel.js +0 -77
  326. package/src/components/media/preview.js +0 -35
@@ -1310,7 +1310,7 @@ button.font-library__upload-area {
1310
1310
  }
1311
1311
 
1312
1312
  /**
1313
- * Colors
1313
+ * Typography
1314
1314
  */
1315
1315
  /**
1316
1316
  * SCSS Variables.
@@ -1319,6 +1319,9 @@ button.font-library__upload-area {
1319
1319
  * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
1320
1320
  * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
1321
1321
  */
1322
+ /**
1323
+ * Colors
1324
+ */
1322
1325
  /**
1323
1326
  * Fonts & basic variables.
1324
1327
  */
@@ -1354,9 +1357,6 @@ button.font-library__upload-area {
1354
1357
  * React Native specific.
1355
1358
  * These variables do not appear to be used anywhere else.
1356
1359
  */
1357
- /**
1358
- * Typography
1359
- */
1360
1360
  /**
1361
1361
  * Breakpoints & Media Queries
1362
1362
  */
@@ -1401,21 +1401,23 @@ button.font-library__upload-area {
1401
1401
  .dataviews-wrapper,
1402
1402
  .dataviews-picker-wrapper {
1403
1403
  height: 100%;
1404
+ flex-grow: 1;
1405
+ min-height: 0;
1404
1406
  box-sizing: border-box;
1405
- scroll-padding-bottom: 64px;
1407
+ scroll-padding-bottom: calc(var(--wpds-dimension-base, 4px) * 16);
1406
1408
  /* stylelint-disable-next-line property-no-unknown -- '@container' not globally permitted */
1407
1409
  container: dataviews-wrapper/inline-size;
1408
1410
  display: flex;
1409
1411
  flex-direction: column;
1410
- font-size: 13px;
1411
- line-height: 1.4;
1412
- background-color: var(--wp-dataviews-color-background, #fff);
1412
+ font-size: var(--wpds-typography-font-size-md, 13px);
1413
+ line-height: var(--wpds-typography-line-height-sm, 20px);
1414
+ background-color: var(--wp-dataviews-color-background, var(--wpds-color-bg-surface-neutral-strong, #fff));
1413
1415
  }
1414
1416
 
1415
1417
  .dataviews__view-actions,
1416
1418
  .dataviews-filters__container {
1417
1419
  box-sizing: border-box;
1418
- padding: 16px 24px;
1420
+ padding: var(--wpds-dimension-padding-lg, 16px) var(--wpds-dimension-padding-2xl, 24px);
1419
1421
  flex-shrink: 0;
1420
1422
  position: sticky;
1421
1423
  left: 0;
@@ -1430,7 +1432,7 @@ button.font-library__upload-area {
1430
1432
  }
1431
1433
  .dataviews-no-results,
1432
1434
  .dataviews-loading {
1433
- padding: 0 24px;
1435
+ padding: 0 var(--wpds-dimension-padding-2xl, 24px);
1434
1436
  flex-grow: 1;
1435
1437
  display: flex;
1436
1438
  align-items: center;
@@ -1469,13 +1471,13 @@ button.font-library__upload-area {
1469
1471
  @container (max-width: 430px) {
1470
1472
  .dataviews__view-actions,
1471
1473
  .dataviews-filters__container {
1472
- padding: 12px 24px;
1474
+ padding: var(--wpds-dimension-padding-md, 12px) var(--wpds-dimension-padding-2xl, 24px);
1473
1475
  }
1474
1476
  }
1475
1477
  .dataviews-title-field {
1476
- font-size: 13px;
1477
- font-weight: 499;
1478
- color: #2f2f2f;
1478
+ font-size: var(--wpds-typography-font-size-md, 13px);
1479
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
1480
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1479
1481
  text-overflow: ellipsis;
1480
1482
  white-space: nowrap;
1481
1483
  width: 100%;
@@ -1488,11 +1490,11 @@ button.font-library__upload-area {
1488
1490
  overflow: hidden;
1489
1491
  display: block;
1490
1492
  flex-grow: 0;
1491
- color: #2f2f2f;
1493
+ color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
1492
1494
  }
1493
1495
 
1494
1496
  .dataviews-title-field a:hover {
1495
- color: var(--wp-admin-theme-color);
1497
+ color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1496
1498
  }
1497
1499
 
1498
1500
  .dataviews-title-field a:focus {
@@ -1509,20 +1511,20 @@ button.font-library__upload-area {
1509
1511
  overflow: hidden;
1510
1512
  display: block;
1511
1513
  width: 100%;
1512
- color: #1e1e1e;
1514
+ color: var(--wpds-color-fg-interactive-neutral-active, #1e1e1e);
1513
1515
  }
1514
1516
 
1515
1517
  .dataviews-title-field button.components-button.is-link:hover {
1516
- color: var(--wp-admin-theme-color);
1518
+ color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1517
1519
  }
1518
1520
 
1519
1521
  .dataviews-title-field--clickable {
1520
1522
  cursor: var(--wpds-cursor-control, pointer);
1521
- color: #2f2f2f;
1523
+ color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
1522
1524
  }
1523
1525
 
1524
1526
  .dataviews-title-field--clickable:hover {
1525
- color: var(--wp-admin-theme-color);
1527
+ color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1526
1528
  }
1527
1529
 
1528
1530
  .dataviews-title-field--clickable:focus {
@@ -1538,13 +1540,22 @@ button.font-library__upload-area {
1538
1540
  background-color: #fff;
1539
1541
  }
1540
1542
 
1543
+ /**
1544
+ * When DataViews are placed within cards, apply a consistent top padding.
1545
+ */
1546
+ .components-card__body:has(> .dataviews-wrapper),
1547
+ .components-card__body:has(> .dataviews-picker-wrapper) {
1548
+ padding: var(--wpds-dimension-padding-sm, 8px) 0 0;
1549
+ overflow: hidden;
1550
+ }
1551
+
1541
1552
  .dataviews-bulk-actions-footer__item-count {
1542
- color: #1e1e1e;
1553
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1543
1554
  }
1544
1555
 
1545
1556
  .dataviews-bulk-actions-footer__container {
1546
1557
  margin-right: auto;
1547
- min-height: 32px;
1558
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
1548
1559
  }
1549
1560
 
1550
1561
  .dataviews-layout__container {
@@ -1573,15 +1584,15 @@ button.font-library__upload-area {
1573
1584
  }
1574
1585
 
1575
1586
  .dataviews-filters__summary-popover {
1576
- font-size: 13px;
1577
- line-height: 1.4;
1587
+ font-size: var(--wpds-typography-font-size-md, 13px);
1588
+ line-height: var(--wpds-typography-line-height-sm, 20px);
1578
1589
  }
1579
1590
 
1580
1591
  .dataviews-filters__summary-popover .components-popover__content {
1581
1592
  width: 100%;
1582
1593
  min-width: 230px;
1583
1594
  max-width: 250px;
1584
- border-radius: 4px;
1595
+ border-radius: var(--wpds-border-radius-md, 4px);
1585
1596
  }
1586
1597
 
1587
1598
  .dataviews-filters__summary-popover.components-dropdown__content .components-popover__content {
@@ -1589,11 +1600,11 @@ button.font-library__upload-area {
1589
1600
  }
1590
1601
 
1591
1602
  .dataviews-filters__summary-operators-container {
1592
- padding: 8px 16px;
1603
+ padding: var(--wpds-dimension-padding-sm, 8px) var(--wpds-dimension-padding-lg, 16px);
1593
1604
  }
1594
1605
 
1595
1606
  .dataviews-filters__summary-operators-container:has(+ .dataviews-filters__search-widget-listbox), .dataviews-filters__summary-operators-container:has(+ .dataviews-filters__search-widget-no-elements), .dataviews-filters__summary-operators-container:has(+ .dataviews-filters__user-input-widget) {
1596
- border-bottom: 1px solid #e0e0e0;
1607
+ border-bottom: 1px solid var(--wpds-color-stroke-surface-neutral, #dbdbdb);
1597
1608
  }
1598
1609
 
1599
1610
  .dataviews-filters__summary-operators-container:empty {
@@ -1601,7 +1612,7 @@ button.font-library__upload-area {
1601
1612
  }
1602
1613
 
1603
1614
  .dataviews-filters__summary-operators-container .dataviews-filters__summary-operators-filter-name {
1604
- color: #757575;
1615
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
1605
1616
  white-space: nowrap;
1606
1617
  overflow: hidden;
1607
1618
  text-overflow: ellipsis;
@@ -1621,13 +1632,12 @@ button.font-library__upload-area {
1621
1632
  }
1622
1633
 
1623
1634
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip {
1624
- border-radius: 16px;
1625
- border: 1px solid transparent;
1635
+ border-radius: var(--wpds-border-radius-lg, 8px);
1636
+ border: var(--wpds-border-width-xs, 1px) solid var(--wpds-color-stroke-interactive-neutral, #8d8d8d);
1626
1637
  cursor: var(--wpds-cursor-control, pointer);
1627
- padding: 4px 12px;
1628
- min-height: 32px;
1629
- background: #f0f0f0;
1630
- color: #2f2f2f;
1638
+ padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-md, 12px);
1639
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
1640
+ color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
1631
1641
  position: relative;
1632
1642
  display: flex;
1633
1643
  align-items: center;
@@ -1639,40 +1649,44 @@ button.font-library__upload-area {
1639
1649
  }
1640
1650
 
1641
1651
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-reset {
1642
- padding-inline-end: 28px;
1652
+ padding-inline-end: calc(24px + var(--wpds-dimension-padding-xs, 4px));
1643
1653
  }
1644
1654
 
1645
1655
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.is-not-clickable), .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip[aria-expanded=true] {
1646
- background: #e0e0e0;
1647
- color: #1e1e1e;
1656
+ color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
1657
+ border-color: var(--wpds-color-stroke-interactive-neutral-active, #6e6e6e);
1658
+ background-color: var(--wpds-color-bg-interactive-neutral-weak-active, #ededed);
1648
1659
  }
1649
1660
 
1650
1661
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values {
1651
- color: var(--wp-admin-theme-color);
1652
- background: rgba(var(--wp-admin-theme-color--rgb), 0.04);
1662
+ color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1663
+ background: var(--wpds-color-bg-interactive-brand-weak, rgba(0, 0, 0, 0));
1664
+ border-color: var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1653
1665
  }
1654
1666
 
1655
- .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] {
1656
- background: rgba(var(--wp-admin-theme-color--rgb), 0.12);
1667
+ .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values:hover:not(.dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values.is-not-clickable), .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip.has-values[aria-expanded=true] {
1668
+ color: var(--wpds-color-fg-interactive-brand-active, var(--wp-admin-theme-color, #3858e9));
1669
+ background: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1670
+ border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
1657
1671
  }
1658
1672
 
1659
1673
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip:focus-visible {
1660
1674
  outline: none;
1661
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1675
+ box-shadow: 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
1662
1676
  }
1663
1677
 
1664
1678
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip .dataviews-filters-__summary-filter-text-name {
1665
- font-weight: 499;
1679
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
1666
1680
  }
1667
1681
 
1668
1682
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove {
1669
1683
  width: 24px;
1670
1684
  height: 24px;
1671
- border-radius: 50%;
1685
+ border-radius: var(--wpds-border-radius-md, 4px);
1672
1686
  border: 0;
1673
1687
  padding: 0;
1674
1688
  position: absolute;
1675
- right: 4px;
1689
+ right: var(--wpds-dimension-padding-xs, 4px);
1676
1690
  top: 50%;
1677
1691
  transform: translateY(-50%);
1678
1692
  display: flex;
@@ -1683,35 +1697,35 @@ button.font-library__upload-area {
1683
1697
  }
1684
1698
 
1685
1699
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove svg {
1686
- fill: #757575;
1700
+ fill: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
1687
1701
  }
1688
1702
 
1689
1703
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus {
1690
- background: #e0e0e0;
1704
+ background: var(--wpds-color-bg-interactive-neutral-weak-active, #ededed);
1691
1705
  }
1692
1706
 
1693
1707
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:hover svg, .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus svg {
1694
- fill: #1e1e1e;
1708
+ fill: var(--wpds-color-fg-interactive-neutral-active, #1e1e1e);
1695
1709
  }
1696
1710
 
1697
1711
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values svg {
1698
- fill: var(--wp-admin-theme-color);
1712
+ fill: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1699
1713
  }
1700
1714
 
1701
1715
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove.has-values:hover {
1702
- background: rgba(var(--wp-admin-theme-color--rgb), 0.08);
1716
+ background: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1703
1717
  }
1704
1718
 
1705
1719
  .dataviews-filters__summary-chip-container .dataviews-filters__summary-chip-remove:focus-visible {
1706
1720
  outline: none;
1707
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1721
+ box-shadow: 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
1708
1722
  }
1709
1723
 
1710
1724
  .dataviews-filters__search-widget-filter-combobox-list {
1711
- max-height: 184px;
1712
- padding: 4px;
1725
+ max-height: calc(var(--wpds-dimension-base, 4px) * 46);
1726
+ padding: var(--wpds-dimension-padding-xs, 4px);
1713
1727
  overflow: auto;
1714
- border-top: 1px solid #e0e0e0;
1728
+ border-top: 1px solid var(--wpds-color-stroke-surface-neutral, #dbdbdb);
1715
1729
  }
1716
1730
 
1717
1731
  .dataviews-filters__search-widget-filter-combobox-list .dataviews-filters__search-widget-filter-combobox-item-value [data-user-value] {
@@ -1719,19 +1733,19 @@ button.font-library__upload-area {
1719
1733
  }
1720
1734
 
1721
1735
  .dataviews-filters__search-widget-listbox {
1722
- padding: 4px;
1736
+ padding: var(--wpds-dimension-padding-xs, 4px);
1723
1737
  overflow: auto;
1724
1738
  }
1725
1739
 
1726
1740
  .dataviews-filters__search-widget-listitem {
1727
1741
  display: flex;
1728
1742
  align-items: center;
1729
- gap: 8px;
1730
- border-radius: 2px;
1743
+ gap: var(--wpds-dimension-gap-md, 12px);
1744
+ border-radius: var(--wpds-border-radius-sm, 2px);
1731
1745
  box-sizing: border-box;
1732
- padding: 4px 12px;
1746
+ padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-md, 12px);
1733
1747
  cursor: default;
1734
- min-height: 32px;
1748
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
1735
1749
  font-family: -apple-system, "system-ui", "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
1736
1750
  font-weight: 400;
1737
1751
  font-size: 13px;
@@ -1743,31 +1757,27 @@ button.font-library__upload-area {
1743
1757
  }
1744
1758
 
1745
1759
  .dataviews-filters__search-widget-listitem:hover, .dataviews-filters__search-widget-listitem[data-active-item], .dataviews-filters__search-widget-listitem:focus {
1746
- background-color: var(--wp-admin-theme-color);
1747
- color: #fff;
1748
- }
1749
-
1750
- .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 {
1751
- color: #fff;
1760
+ background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
1752
1761
  }
1753
1762
 
1754
1763
  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-single-selection, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-single-selection, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection {
1755
- border-color: var(--wp-admin-theme-color-darker-20, #183ad6);
1756
- background: #fff;
1764
+ border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
1765
+ background: var(--wpds-color-bg-surface-neutral-strong, #fff);
1757
1766
  }
1758
1767
 
1759
1768
  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-single-selection.is-selected, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-single-selection.is-selected, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-single-selection.is-selected {
1760
- border-color: var(--wp-admin-theme-color-darker-20, #183ad6);
1761
- background: var(--wp-admin-theme-color-darker-20, #183ad6);
1769
+ border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
1770
+ background: var(--wpds-color-bg-interactive-brand-strong-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 93%, black));
1762
1771
  }
1763
1772
 
1764
1773
  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection {
1765
- border-color: var(--wp-admin-theme-color-darker-20, #183ad6);
1774
+ border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
1775
+ background: var(--wpds-color-bg-surface-neutral-strong, #fff);
1766
1776
  }
1767
1777
 
1768
1778
  .dataviews-filters__search-widget-listitem:hover .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem[data-active-item] .dataviews-filters__search-widget-listitem-multi-selection.is-selected, .dataviews-filters__search-widget-listitem:focus .dataviews-filters__search-widget-listitem-multi-selection.is-selected {
1769
- border-color: var(--wp-admin-theme-color-darker-20, #183ad6);
1770
- background: var(--wp-admin-theme-color-darker-20, #183ad6);
1779
+ border-color: var(--wpds-color-stroke-interactive-brand-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 85%, black));
1780
+ background: var(--wpds-color-bg-interactive-brand-strong-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 93%, black));
1771
1781
  }
1772
1782
 
1773
1783
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-value {
@@ -1781,9 +1791,9 @@ button.font-library__upload-area {
1781
1791
  display: block;
1782
1792
  overflow: hidden;
1783
1793
  text-overflow: ellipsis;
1784
- font-size: 12px;
1794
+ font-size: var(--wpds-typography-font-size-sm, 12px);
1785
1795
  line-height: 16px;
1786
- color: #757575;
1796
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
1787
1797
  }
1788
1798
 
1789
1799
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection {
@@ -1846,8 +1856,8 @@ button.font-library__upload-area {
1846
1856
  }
1847
1857
 
1848
1858
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected {
1849
- background: var(--wp-admin-theme-color, #3858e9);
1850
- border-color: var(--wp-admin-theme-color, #3858e9);
1859
+ background: var(--wpds-color-bg-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
1860
+ border-color: var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1851
1861
  }
1852
1862
 
1853
1863
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-single-selection.is-selected::before {
@@ -1861,8 +1871,8 @@ button.font-library__upload-area {
1861
1871
  left: 50%;
1862
1872
  transform: translate(-50%, -50%);
1863
1873
  margin: 0;
1864
- background-color: #fff;
1865
- border: 4px solid #fff;
1874
+ background-color: var(--wpds-color-fg-interactive-brand-strong, #fff);
1875
+ border: 4px solid var(--wpds-color-fg-interactive-brand-strong, #fff);
1866
1876
  }
1867
1877
 
1868
1878
  @media (min-width: 600px) {
@@ -1964,8 +1974,8 @@ button.font-library__upload-area {
1964
1974
 
1965
1975
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection {
1966
1976
  position: relative;
1967
- background: #fff;
1968
- color: #1e1e1e;
1977
+ background: var(--wpds-color-bg-interactive-neutral-weak, rgba(0, 0, 0, 0));
1978
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
1969
1979
  margin: 0;
1970
1980
  padding: 0;
1971
1981
  width: var(--checkbox-size);
@@ -1983,13 +1993,13 @@ button.font-library__upload-area {
1983
1993
  }
1984
1994
  }
1985
1995
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected {
1986
- background: var(--wp-admin-theme-color, #3858e9);
1987
- border-color: var(--wp-admin-theme-color, #3858e9);
1996
+ background: var(--wpds-color-bg-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
1997
+ border-color: var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9));
1988
1998
  }
1989
1999
 
1990
2000
  .dataviews-filters__search-widget-listitem .dataviews-filters__search-widget-listitem-multi-selection.is-selected svg {
1991
2001
  --checkmark-size: var(--checkbox-size);
1992
- fill: #fff;
2002
+ fill: var(--wpds-color-fg-interactive-neutral-strong, #f0f0f0);
1993
2003
  position: absolute;
1994
2004
  left: 50%;
1995
2005
  top: 50%;
@@ -2005,7 +2015,7 @@ button.font-library__upload-area {
2005
2015
  }
2006
2016
  .dataviews-filters__search-widget-filter-combobox__wrapper {
2007
2017
  position: relative;
2008
- padding: 8px;
2018
+ padding: var(--wpds-dimension-padding-sm, 8px);
2009
2019
  }
2010
2020
 
2011
2021
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
@@ -2044,9 +2054,9 @@ button.font-library__upload-area {
2044
2054
 
2045
2055
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2046
2056
  display: block;
2047
- padding: 0 8px 0 32px;
2057
+ padding: 0 var(--wpds-dimension-padding-sm, 8px) 0 calc(var(--wpds-dimension-base, 4px) * 8);
2048
2058
  width: 100%;
2049
- height: 32px;
2059
+ height: calc(var(--wpds-dimension-base, 4px) * 8);
2050
2060
  margin-left: 0;
2051
2061
  margin-right: 0;
2052
2062
  /* Fonts smaller than 16px causes mobile safari to zoom. */
@@ -2055,16 +2065,16 @@ button.font-library__upload-area {
2055
2065
 
2056
2066
  @media (min-width: 600px) {
2057
2067
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input {
2058
- font-size: 13px;
2068
+ font-size: var(--wpds-typography-font-size-md, 13px);
2059
2069
  }
2060
2070
  }
2061
2071
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input:focus {
2062
- background: #fff;
2063
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2072
+ background: var(--wpds-color-bg-surface-neutral-strong, #fff);
2073
+ box-shadow: inset 0 0 0 var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
2064
2074
  }
2065
2075
 
2066
2076
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__input::placeholder {
2067
- color: #757575;
2077
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
2068
2078
  }
2069
2079
 
2070
2080
  .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 {
@@ -2073,7 +2083,7 @@ button.font-library__upload-area {
2073
2083
 
2074
2084
  .dataviews-filters__search-widget-filter-combobox__wrapper .dataviews-filters__search-widget-filter-combobox__icon {
2075
2085
  position: absolute;
2076
- inset-inline-start: 12px;
2086
+ inset-inline-start: var(--wpds-dimension-gap-md, 12px);
2077
2087
  top: 0;
2078
2088
  bottom: 0;
2079
2089
  display: flex;
@@ -2096,16 +2106,16 @@ button.font-library__upload-area {
2096
2106
  top: 0;
2097
2107
  right: 0;
2098
2108
  transform: translate(50%, -50%);
2099
- background: var(--wp-admin-theme-color, #3858e9);
2100
- height: 16px;
2101
- min-width: 16px;
2102
- line-height: 16px;
2103
- padding: 0 4px;
2109
+ background: var(--wpds-color-bg-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
2110
+ height: calc(var(--wpds-dimension-base, 4px) * 4);
2111
+ min-width: calc(var(--wpds-dimension-base, 4px) * 4);
2112
+ line-height: var(--wpds-typography-line-height-xs, 16px);
2113
+ padding: 0 var(--wpds-dimension-padding-xs, 4px);
2104
2114
  text-align: center;
2105
- border-radius: 8px;
2115
+ border-radius: var(--wpds-border-radius-lg, 8px);
2106
2116
  font-size: 11px;
2107
- outline: var(--wp-admin-border-width-focus) solid #fff;
2108
- color: #fff;
2117
+ outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wpds-color-bg-surface-neutral-strong, #fff);
2118
+ color: var(--wpds-color-fg-interactive-neutral-strong, #f0f0f0);
2109
2119
  box-sizing: border-box;
2110
2120
  }
2111
2121
 
@@ -2114,18 +2124,18 @@ button.font-library__upload-area {
2114
2124
  }
2115
2125
 
2116
2126
  .dataviews-filters__user-input-widget {
2117
- padding: 16px;
2127
+ padding: var(--wpds-dimension-padding-lg, 16px);
2118
2128
  }
2119
2129
 
2120
2130
  .dataviews-filters__user-input-widget .components-input-control__prefix {
2121
- padding-left: 8px;
2131
+ padding-left: var(--wpds-dimension-padding-sm, 8px);
2122
2132
  }
2123
2133
 
2124
2134
  .dataviews-filters__search-widget-no-elements {
2125
2135
  display: flex;
2126
2136
  align-items: center;
2127
2137
  justify-content: center;
2128
- padding: 16px;
2138
+ padding: var(--wpds-dimension-padding-lg, 16px);
2129
2139
  }
2130
2140
 
2131
2141
  .dataviews-footer {
@@ -2133,8 +2143,8 @@ button.font-library__upload-area {
2133
2143
  bottom: 0;
2134
2144
  left: 0;
2135
2145
  background-color: inherit;
2136
- padding: 12px 24px;
2137
- border-top: 1px solid #f0f0f0;
2146
+ padding: var(--wpds-dimension-padding-md, 12px) var(--wpds-dimension-padding-2xl, 24px);
2147
+ border-top: var(--wpds-border-width-xs, 1px) solid var(--wpds-color-stroke-surface-neutral-weak, #e4e4e4);
2138
2148
  flex-shrink: 0;
2139
2149
  }
2140
2150
 
@@ -2144,7 +2154,7 @@ button.font-library__upload-area {
2144
2154
  }
2145
2155
  }
2146
2156
  .dataviews-footer {
2147
- z-index: 2;
2157
+ z-index: 1;
2148
2158
  }
2149
2159
 
2150
2160
  .dataviews-footer .is-refreshing {
@@ -2175,14 +2185,14 @@ button.font-library__upload-area {
2175
2185
  }
2176
2186
  .dataviews-pagination__page-select {
2177
2187
  font-size: 11px;
2178
- font-weight: 499;
2188
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
2179
2189
  text-transform: uppercase;
2180
2190
  }
2181
2191
 
2182
2192
  @media (min-width: 600px) {
2183
2193
  .dataviews-pagination__page-select .components-select-control__input {
2184
2194
  font-size: 11px !important;
2185
- font-weight: 499;
2195
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
2186
2196
  }
2187
2197
  }
2188
2198
  .dataviews-action-modal {
@@ -2190,7 +2200,7 @@ button.font-library__upload-area {
2190
2200
  }
2191
2201
 
2192
2202
  .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
2193
- padding: 0 4px;
2203
+ padding: 0 var(--wpds-dimension-padding-xs, 4px);
2194
2204
  }
2195
2205
 
2196
2206
  .dataviews-selection-checkbox {
@@ -2215,8 +2225,8 @@ button.font-library__upload-area {
2215
2225
  width: 320px;
2216
2226
  /* stylelint-disable-next-line property-no-unknown -- the linter needs to be updated to accepted the container-type property */
2217
2227
  container-type: inline-size;
2218
- font-size: 13px;
2219
- line-height: 1.4;
2228
+ font-size: var(--wpds-typography-font-size-md, 13px);
2229
+ line-height: var(--wpds-typography-line-height-sm, 20px);
2220
2230
  }
2221
2231
 
2222
2232
  .dataviews-config__popover.is-expanded .dataviews-config__popover-content-wrapper {
@@ -2233,7 +2243,7 @@ button.font-library__upload-area {
2233
2243
  }
2234
2244
 
2235
2245
  .dataviews-settings-section__title.dataviews-settings-section__title {
2236
- line-height: 24px;
2246
+ line-height: var(--wpds-typography-line-height-md, 24px);
2237
2247
  font-size: 15px;
2238
2248
  }
2239
2249
 
@@ -2284,11 +2294,11 @@ button.font-library__upload-area {
2284
2294
 
2285
2295
  .dataviews-view-config__modified-indicator {
2286
2296
  position: absolute;
2287
- top: 4px;
2288
- right: 4px;
2289
- width: 4px;
2290
- height: 4px;
2291
- background: var(--wp-admin-theme-color, #3858e9);
2297
+ top: var(--wpds-dimension-gap-xs, 4px);
2298
+ right: var(--wpds-dimension-gap-xs, 4px);
2299
+ width: var(--wpds-dimension-gap-xs, 4px);
2300
+ height: var(--wpds-dimension-gap-xs, 4px);
2301
+ background: var(--wpds-color-bg-interactive-brand-strong, var(--wp-admin-theme-color, #3858e9));
2292
2302
  border-radius: 50%;
2293
2303
  pointer-events: none;
2294
2304
  }
@@ -2296,10 +2306,10 @@ button.font-library__upload-area {
2296
2306
  .dataviews-view-grid-items {
2297
2307
  margin-bottom: auto;
2298
2308
  display: grid;
2299
- gap: 24px;
2309
+ gap: var(--wpds-dimension-gap-xl, 24px);
2300
2310
  grid-template-rows: max-content;
2301
2311
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
2302
- padding: 0 24px 24px;
2312
+ padding: 0 var(--wpds-dimension-padding-2xl, 24px) var(--wpds-dimension-padding-2xl, 24px);
2303
2313
  container-type: inline-size;
2304
2314
  }
2305
2315
 
@@ -2309,18 +2319,18 @@ button.font-library__upload-area {
2309
2319
  }
2310
2320
  }
2311
2321
  .dataviews-view-grid-items.has-compact-density {
2312
- gap: 16px;
2322
+ gap: var(--wpds-dimension-gap-lg, 16px);
2313
2323
  }
2314
2324
 
2315
2325
  .dataviews-view-grid-items.has-comfortable-density {
2316
- gap: 32px;
2326
+ gap: var(--wpds-dimension-gap-2xl, 32px);
2317
2327
  }
2318
2328
 
2319
2329
  .dataviews-view-grid {
2320
- padding: 0 24px 24px;
2330
+ padding: 0 var(--wpds-dimension-padding-2xl, 24px) var(--wpds-dimension-padding-2xl, 24px);
2321
2331
  display: flex;
2322
2332
  flex-direction: column;
2323
- gap: 24px;
2333
+ gap: var(--wpds-dimension-gap-xl, 24px);
2324
2334
  container-type: inline-size;
2325
2335
  margin-bottom: auto;
2326
2336
  }
@@ -2331,28 +2341,28 @@ button.font-library__upload-area {
2331
2341
  }
2332
2342
  }
2333
2343
  .dataviews-view-grid.has-compact-density {
2334
- gap: 16px;
2344
+ gap: var(--wpds-dimension-gap-lg, 16px);
2335
2345
  }
2336
2346
 
2337
2347
  .dataviews-view-grid.has-compact-density .dataviews-view-grid__row {
2338
- gap: 16px;
2348
+ gap: var(--wpds-dimension-gap-lg, 16px);
2339
2349
  }
2340
2350
 
2341
2351
  .dataviews-view-grid.has-comfortable-density {
2342
- gap: 32px;
2352
+ gap: var(--wpds-dimension-gap-2xl, 32px);
2343
2353
  }
2344
2354
 
2345
2355
  .dataviews-view-grid.has-comfortable-density .dataviews-view-grid__row {
2346
- gap: 32px;
2356
+ gap: var(--wpds-dimension-gap-2xl, 32px);
2347
2357
  }
2348
2358
 
2349
2359
  .dataviews-view-grid .dataviews-view-grid__row {
2350
2360
  display: grid;
2351
- gap: 24px;
2361
+ gap: var(--wpds-dimension-gap-xl, 24px);
2352
2362
  }
2353
2363
 
2354
2364
  .dataviews-view-grid .dataviews-view-grid__row .dataviews-view-grid__row__gridcell {
2355
- border-radius: 4px;
2365
+ border-radius: var(--wpds-border-radius-md, 4px);
2356
2366
  position: relative;
2357
2367
  }
2358
2368
 
@@ -2363,8 +2373,8 @@ button.font-library__upload-area {
2363
2373
  left: 0;
2364
2374
  width: 100%;
2365
2375
  height: 100%;
2366
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2367
- border-radius: 4px;
2376
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
2377
+ border-radius: var(--wpds-border-radius-md, 4px);
2368
2378
  pointer-events: none;
2369
2379
  outline: 2px solid transparent;
2370
2380
  }
@@ -2374,16 +2384,17 @@ button.font-library__upload-area {
2374
2384
  height: 100%;
2375
2385
  justify-content: flex-start;
2376
2386
  position: relative;
2387
+ isolation: isolate;
2377
2388
  }
2378
2389
 
2379
- .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title,
2380
- .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__title {
2381
- padding: 8px 0 4px;
2390
+ .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-actions,
2391
+ .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__title-actions {
2392
+ padding: var(--wpds-dimension-padding-sm, 8px) 0 var(--wpds-dimension-padding-xs, 4px);
2382
2393
  }
2383
2394
 
2384
2395
  .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__title-field,
2385
2396
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__title-field {
2386
- min-height: 24px;
2397
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
2387
2398
  overflow: hidden;
2388
2399
  align-content: center;
2389
2400
  text-align: start;
@@ -2396,32 +2407,25 @@ button.font-library__upload-area {
2396
2407
 
2397
2408
  .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value,
2398
2409
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value {
2399
- color: #1e1e1e;
2400
- }
2401
-
2402
- .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__media::after,
2403
- .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__media:focus::after,
2404
- .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__media::after,
2405
- .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__media:focus::after {
2406
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
2410
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
2407
2411
  }
2408
2412
 
2409
2413
  .dataviews-view-grid .dataviews-view-grid__card.is-selected .dataviews-view-grid__media::after,
2410
2414
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card.is-selected .dataviews-view-grid__media::after {
2411
- box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color);
2415
+ box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9)), inset 0 0 0 var(--wpds-border-width-sm, 2px) var(--wpds-color-bg-surface-neutral-strong, #fff);
2412
2416
  }
2413
2417
 
2414
2418
  .dataviews-view-grid .dataviews-view-grid__card .dataviews-view-grid__media:focus::after,
2415
2419
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__card .dataviews-view-grid__media:focus::after {
2416
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2420
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
2417
2421
  }
2418
2422
 
2419
2423
  .dataviews-view-grid .dataviews-view-grid__media,
2420
2424
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__media {
2421
2425
  width: 100%;
2422
2426
  aspect-ratio: 1/1;
2423
- background-color: #fff;
2424
- border-radius: 4px;
2427
+ background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
2428
+ border-radius: var(--wpds-border-radius-md, 4px);
2425
2429
  overflow: hidden;
2426
2430
  position: relative;
2427
2431
  }
@@ -2446,8 +2450,8 @@ button.font-library__upload-area {
2446
2450
  left: 0;
2447
2451
  width: 100%;
2448
2452
  height: 100%;
2449
- box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
2450
- border-radius: 4px;
2453
+ box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) rgba(0, 0, 0, 0.1);
2454
+ border-radius: var(--wpds-border-radius-md, 4px);
2451
2455
  pointer-events: none;
2452
2456
  }
2453
2457
 
@@ -2456,9 +2460,9 @@ button.font-library__upload-area {
2456
2460
  width: 100%;
2457
2461
  height: 100%;
2458
2462
  display: block;
2459
- border-radius: 4px;
2463
+ border-radius: var(--wpds-border-radius-md, 4px);
2460
2464
  box-shadow: none;
2461
- background: #f0f0f0;
2465
+ background: var(--wpds-color-bg-surface-neutral, #fcfcfc);
2462
2466
  }
2463
2467
 
2464
2468
  .dataviews-view-grid .dataviews-view-grid__fields,
@@ -2470,26 +2474,26 @@ button.font-library__upload-area {
2470
2474
 
2471
2475
  .dataviews-view-grid .dataviews-view-grid__fields:not(:empty),
2472
2476
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields:not(:empty) {
2473
- padding: 0 0 12px;
2477
+ padding: 0 0 var(--wpds-dimension-padding-md, 12px);
2474
2478
  }
2475
2479
 
2476
2480
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field-value:not(:empty),
2477
2481
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field-value:not(:empty) {
2478
- min-height: 24px;
2479
- line-height: 20px;
2480
- padding-top: 2px;
2482
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
2483
+ line-height: var(--wpds-typography-line-height-sm, 20px);
2484
+ padding-top: calc(var(--wpds-dimension-base, 4px) / 2);
2481
2485
  }
2482
2486
 
2483
2487
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field,
2484
2488
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field {
2485
- min-height: 24px;
2489
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
2486
2490
  align-items: center;
2487
2491
  }
2488
2492
 
2489
2493
  .dataviews-view-grid .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name,
2490
2494
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-name {
2491
2495
  width: 35%;
2492
- color: #757575;
2496
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
2493
2497
  overflow: hidden;
2494
2498
  text-overflow: ellipsis;
2495
2499
  white-space: nowrap;
@@ -2510,7 +2514,7 @@ button.font-library__upload-area {
2510
2514
 
2511
2515
  .dataviews-view-grid .dataviews-view-grid__badge-fields:not(:empty),
2512
2516
  .dataviews-view-grid-infinite-scroll .dataviews-view-grid__badge-fields:not(:empty) {
2513
- padding-bottom: 12px;
2517
+ padding-bottom: var(--wpds-dimension-padding-md, 12px);
2514
2518
  }
2515
2519
 
2516
2520
  .dataviews-view-grid.is-refreshing,
@@ -2534,7 +2538,7 @@ button.font-library__upload-area {
2534
2538
  .dataviews-view-grid__card .dataviews-selection-checkbox {
2535
2539
  position: absolute;
2536
2540
  top: -9999em;
2537
- left: 8px;
2541
+ left: var(--wpds-dimension-padding-sm, 8px);
2538
2542
  z-index: 1;
2539
2543
  opacity: 0;
2540
2544
  }
@@ -2547,26 +2551,26 @@ button.font-library__upload-area {
2547
2551
  @media (hover: none) {
2548
2552
  .dataviews-view-grid__card .dataviews-selection-checkbox {
2549
2553
  opacity: 1;
2550
- top: 8px;
2554
+ top: var(--wpds-dimension-padding-sm, 8px);
2551
2555
  }
2552
2556
  }
2553
2557
  .dataviews-view-grid__card:hover .dataviews-selection-checkbox,
2554
2558
  .dataviews-view-grid__card:focus-within .dataviews-selection-checkbox,
2555
2559
  .dataviews-view-grid__card.is-selected .dataviews-selection-checkbox {
2556
2560
  opacity: 1;
2557
- top: 8px;
2561
+ top: var(--wpds-dimension-padding-sm, 8px);
2558
2562
  }
2559
2563
 
2560
2564
  .dataviews-view-grid__card .dataviews-view-grid__media-actions {
2561
2565
  position: absolute;
2562
2566
  z-index: 1;
2563
- top: 4px;
2567
+ top: var(--wpds-dimension-padding-xs, 4px);
2564
2568
  opacity: 0;
2565
- right: 4px;
2569
+ right: var(--wpds-dimension-padding-xs, 4px);
2566
2570
  }
2567
2571
 
2568
2572
  .dataviews-view-grid__card .dataviews-view-grid__media-actions .dataviews-all-actions-button {
2569
- background-color: #fff;
2573
+ background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
2570
2574
  }
2571
2575
 
2572
2576
  @media not (prefers-reduced-motion) {
@@ -2577,7 +2581,7 @@ button.font-library__upload-area {
2577
2581
  @media (hover: none) {
2578
2582
  .dataviews-view-grid__card .dataviews-view-grid__media-actions {
2579
2583
  opacity: 1;
2580
- top: 4px;
2584
+ top: var(--wpds-dimension-padding-xs, 4px);
2581
2585
  }
2582
2586
  }
2583
2587
  .dataviews-view-grid__card:hover .dataviews-view-grid__media-actions,
@@ -2591,11 +2595,11 @@ button.font-library__upload-area {
2591
2595
  }
2592
2596
 
2593
2597
  .dataviews-view-grid__group-header {
2594
- font-size: 15px;
2595
- font-weight: 499;
2596
- color: #1e1e1e;
2597
- margin: 0 0 8px 0;
2598
- padding: 0 24px;
2598
+ font-size: var(--wpds-typography-font-size-lg, 15px);
2599
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
2600
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
2601
+ margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
2602
+ padding: 0 var(--wpds-dimension-padding-2xl, 24px);
2599
2603
  container-type: inline-size;
2600
2604
  }
2601
2605
 
@@ -2610,13 +2614,13 @@ div.dataviews-view-list {
2610
2614
  .dataviews-view-list div[role=row],
2611
2615
  .dataviews-view-list div[role=article] {
2612
2616
  margin: 0;
2613
- border-top: 1px solid #f0f0f0;
2617
+ border-top: 1px solid var(--wpds-color-stroke-surface-neutral-weak, #e4e4e4);
2614
2618
  }
2615
2619
 
2616
2620
  .dataviews-view-list div[role=row] .dataviews-view-list__item-wrapper,
2617
2621
  .dataviews-view-list div[role=article] .dataviews-view-list__item-wrapper {
2618
2622
  position: relative;
2619
- padding: 16px 24px;
2623
+ padding: var(--wpds-dimension-padding-lg, 16px) var(--wpds-dimension-padding-2xl, 24px);
2620
2624
  box-sizing: border-box;
2621
2625
  }
2622
2626
 
@@ -2625,7 +2629,7 @@ div.dataviews-view-list {
2625
2629
  display: flex;
2626
2630
  width: max-content;
2627
2631
  flex: 0 0 auto;
2628
- gap: 4px;
2632
+ gap: var(--wpds-dimension-gap-xs, 4px);
2629
2633
  white-space: nowrap;
2630
2634
  }
2631
2635
 
@@ -2664,32 +2668,21 @@ div.dataviews-view-list {
2664
2668
  }
2665
2669
  .dataviews-view-list div[role=row].is-selected.is-selected,
2666
2670
  .dataviews-view-list div[role=article].is-selected.is-selected {
2667
- border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
2671
+ border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 46%, white));
2668
2672
  }
2669
2673
 
2670
2674
  .dataviews-view-list div[role=row].is-selected.is-selected + div[role=row], .dataviews-view-list div[role=row].is-selected.is-selected + div[role=article],
2671
2675
  .dataviews-view-list div[role=article].is-selected.is-selected + div[role=row],
2672
2676
  .dataviews-view-list div[role=article].is-selected.is-selected + div[role=article] {
2673
- border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
2677
+ border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 46%, white));
2674
2678
  }
2675
2679
 
2676
2680
  .dataviews-view-list div[role=row]:not(.is-selected):hover, .dataviews-view-list div[role=row]:not(.is-selected).is-hovered, .dataviews-view-list div[role=row]:not(.is-selected):focus-within,
2677
2681
  .dataviews-view-list div[role=article]:not(.is-selected):hover,
2678
2682
  .dataviews-view-list div[role=article]:not(.is-selected).is-hovered,
2679
2683
  .dataviews-view-list div[role=article]:not(.is-selected):focus-within {
2680
- color: var(--wp-admin-theme-color);
2681
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
2682
- border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
2683
- }
2684
-
2685
- .dataviews-view-list div[role=row]:not(.is-selected):hover + div[role=row], .dataviews-view-list div[role=row]:not(.is-selected):hover + div[role=article], .dataviews-view-list div[role=row]:not(.is-selected).is-hovered + div[role=row], .dataviews-view-list div[role=row]:not(.is-selected).is-hovered + div[role=article], .dataviews-view-list div[role=row]:not(.is-selected):focus-within + div[role=row], .dataviews-view-list div[role=row]:not(.is-selected):focus-within + div[role=article],
2686
- .dataviews-view-list div[role=article]:not(.is-selected):hover + div[role=row],
2687
- .dataviews-view-list div[role=article]:not(.is-selected):hover + div[role=article],
2688
- .dataviews-view-list div[role=article]:not(.is-selected).is-hovered + div[role=row],
2689
- .dataviews-view-list div[role=article]:not(.is-selected).is-hovered + div[role=article],
2690
- .dataviews-view-list div[role=article]:not(.is-selected):focus-within + div[role=row],
2691
- .dataviews-view-list div[role=article]:not(.is-selected):focus-within + div[role=article] {
2692
- border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
2684
+ color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2685
+ background-color: var(--wpds-color-bg-interactive-brand-weak, rgba(0, 0, 0, 0));
2693
2686
  }
2694
2687
 
2695
2688
  .dataviews-view-list div[role=row]:not(.is-selected):hover .dataviews-title-field,
@@ -2702,15 +2695,15 @@ div.dataviews-view-list {
2702
2695
  .dataviews-view-list div[role=article]:not(.is-selected).is-hovered .dataviews-view-list__field,
2703
2696
  .dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-title-field,
2704
2697
  .dataviews-view-list div[role=article]:not(.is-selected):focus-within .dataviews-view-list__field {
2705
- color: var(--wp-admin-theme-color);
2698
+ color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
2706
2699
  }
2707
2700
 
2708
2701
  .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper,
2709
2702
  .dataviews-view-list div[role=row].is-selected:focus-within .dataviews-view-list__item-wrapper,
2710
2703
  .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper,
2711
2704
  .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper {
2712
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
2713
- color: #1e1e1e;
2705
+ background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
2706
+ color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
2714
2707
  }
2715
2708
 
2716
2709
  .dataviews-view-list div[role=row].is-selected .dataviews-view-list__item-wrapper .dataviews-title-field,
@@ -2721,14 +2714,14 @@ div.dataviews-view-list {
2721
2714
  .dataviews-view-list div[role=article].is-selected .dataviews-view-list__item-wrapper .dataviews-view-list__field,
2722
2715
  .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-title-field,
2723
2716
  .dataviews-view-list div[role=article].is-selected:focus-within .dataviews-view-list__item-wrapper .dataviews-view-list__field {
2724
- color: #1e1e1e;
2717
+ color: var(--wpds-color-fg-interactive-neutral-active, #1e1e1e);
2725
2718
  }
2726
2719
 
2727
2720
  .dataviews-view-list .dataviews-view-list__item {
2728
2721
  position: absolute;
2729
2722
  z-index: 1;
2730
2723
  inset: 0;
2731
- scroll-margin: 8px 0;
2724
+ scroll-margin: var(--wpds-dimension-gap-sm, 8px) 0;
2732
2725
  appearance: none;
2733
2726
  border: none;
2734
2727
  background: none;
@@ -2744,15 +2737,15 @@ div.dataviews-view-list {
2744
2737
  position: absolute;
2745
2738
  content: "";
2746
2739
  inset: var(--wp-admin-border-width-focus);
2747
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
2748
- border-radius: 2px;
2740
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
2741
+ border-radius: var(--wpds-border-radius-sm, 2px);
2749
2742
  outline: 2px solid transparent;
2750
2743
  }
2751
2744
 
2752
2745
  .dataviews-view-list .dataviews-view-list__title-field {
2753
2746
  flex: 1;
2754
- min-height: 24px;
2755
- line-height: 24px;
2747
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
2748
+ line-height: var(--wpds-typography-line-height-md, 24px);
2756
2749
  overflow: hidden;
2757
2750
  }
2758
2751
 
@@ -2761,13 +2754,13 @@ div.dataviews-view-list {
2761
2754
  }
2762
2755
 
2763
2756
  .dataviews-view-list .dataviews-view-list__media-wrapper {
2764
- width: 52px;
2765
- height: 52px;
2757
+ width: calc(var(--wpds-dimension-base, 4px) * 13);
2758
+ height: calc(var(--wpds-dimension-base, 4px) * 13);
2766
2759
  overflow: hidden;
2767
2760
  position: relative;
2768
2761
  flex-shrink: 0;
2769
- background-color: #fff;
2770
- border-radius: 4px;
2762
+ background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
2763
+ border-radius: var(--wpds-border-radius-md, 4px);
2771
2764
  }
2772
2765
 
2773
2766
  .dataviews-view-list .dataviews-view-list__media-wrapper img {
@@ -2783,23 +2776,24 @@ div.dataviews-view-list {
2783
2776
  left: 0;
2784
2777
  width: 100%;
2785
2778
  height: 100%;
2786
- box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
2787
- border-radius: 4px;
2779
+ box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) rgba(0, 0, 0, 0.1);
2780
+ border-radius: var(--wpds-border-radius-md, 4px);
2788
2781
  }
2789
2782
 
2790
2783
  .dataviews-view-list .dataviews-view-list__field-wrapper {
2784
+ min-height: calc(var(--wpds-dimension-base, 4px) * 13);
2791
2785
  flex-grow: 1;
2792
2786
  min-width: 0;
2793
2787
  }
2794
2788
 
2795
2789
  .dataviews-view-list .dataviews-view-list__field {
2796
- color: #757575;
2790
+ color: var(--wpds-color-fg-interactive-neutral-weak, #707070);
2797
2791
  }
2798
2792
 
2799
2793
  .dataviews-view-list .dataviews-view-list__fields {
2800
2794
  display: flex;
2801
- gap: 12px;
2802
- row-gap: 4px;
2795
+ gap: var(--wpds-dimension-gap-md, 12px);
2796
+ row-gap: var(--wpds-dimension-gap-xs, 4px);
2803
2797
  flex-wrap: wrap;
2804
2798
  font-size: 12px;
2805
2799
  }
@@ -2813,8 +2807,8 @@ div.dataviews-view-list {
2813
2807
  }
2814
2808
 
2815
2809
  .dataviews-view-list .dataviews-view-list__fields .dataviews-view-list__field-value {
2816
- min-height: 24px;
2817
- line-height: 20px;
2810
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
2811
+ line-height: var(--wpds-typography-line-height-sm, 20px);
2818
2812
  display: flex;
2819
2813
  align-items: center;
2820
2814
  }
@@ -2824,51 +2818,59 @@ div.dataviews-view-list {
2824
2818
  }
2825
2819
 
2826
2820
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__item-wrapper {
2827
- padding: 8px 24px;
2821
+ padding: var(--wpds-dimension-padding-sm, 8px) var(--wpds-dimension-padding-2xl, 24px);
2828
2822
  }
2829
2823
 
2830
2824
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__title-field {
2831
- min-height: 16px;
2832
- line-height: 16px;
2825
+ min-height: calc(var(--wpds-dimension-base, 4px) * 4);
2826
+ line-height: var(--wpds-typography-line-height-xs, 16px);
2833
2827
  }
2834
2828
 
2835
2829
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__media-wrapper {
2836
- width: 32px;
2837
- height: 32px;
2830
+ width: calc(var(--wpds-dimension-base, 4px) * 8);
2831
+ height: calc(var(--wpds-dimension-base, 4px) * 8);
2832
+ }
2833
+
2834
+ .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__field-wrapper {
2835
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
2838
2836
  }
2839
2837
 
2840
2838
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields {
2841
- gap: 8px;
2842
- row-gap: 4px;
2839
+ gap: var(--wpds-dimension-gap-sm, 8px);
2840
+ row-gap: var(--wpds-dimension-gap-xs, 4px);
2843
2841
  }
2844
2842
 
2845
2843
  .dataviews-view-list.has-compact-density div[role=row] .dataviews-view-list__fields .dataviews-view-list__field-value {
2846
- min-height: 16px;
2847
- line-height: 16px;
2844
+ min-height: calc(var(--wpds-dimension-base, 4px) * 4);
2845
+ line-height: var(--wpds-typography-line-height-xs, 16px);
2848
2846
  }
2849
2847
 
2850
2848
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__item-wrapper {
2851
- padding: 24px 24px;
2849
+ padding: var(--wpds-dimension-padding-2xl, 24px) var(--wpds-dimension-padding-2xl, 24px);
2852
2850
  }
2853
2851
 
2854
2852
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__title-field {
2855
- min-height: 32px;
2856
- line-height: 32px;
2853
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
2854
+ line-height: var(--wpds-typography-line-height-xl, 32px);
2857
2855
  }
2858
2856
 
2859
2857
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__media-wrapper {
2860
- width: 64px;
2861
- height: 64px;
2858
+ width: calc(var(--wpds-dimension-base, 4px) * 16);
2859
+ height: calc(var(--wpds-dimension-base, 4px) * 16);
2860
+ }
2861
+
2862
+ .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__field-wrapper {
2863
+ min-height: calc(var(--wpds-dimension-base, 4px) * 16);
2862
2864
  }
2863
2865
 
2864
2866
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields {
2865
- gap: 16px;
2866
- row-gap: 8px;
2867
+ gap: var(--wpds-dimension-gap-lg, 16px);
2868
+ row-gap: var(--wpds-dimension-gap-sm, 8px);
2867
2869
  }
2868
2870
 
2869
2871
  .dataviews-view-list.has-comfortable-density div[role=row] .dataviews-view-list__fields .dataviews-view-list__field-value {
2870
- min-height: 32px;
2871
- line-height: 24px;
2872
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
2873
+ line-height: var(--wpds-typography-line-height-md, 24px);
2872
2874
  }
2873
2875
 
2874
2876
  .dataviews-view-list.is-refreshing {
@@ -2883,11 +2885,11 @@ div.dataviews-view-list {
2883
2885
  }
2884
2886
  }
2885
2887
  .dataviews-view-list__group-header {
2886
- font-size: 15px;
2887
- font-weight: 499;
2888
- color: #1e1e1e;
2889
- margin: 0 0 8px 0;
2890
- padding: 0 24px;
2888
+ font-size: var(--wpds-typography-font-size-lg, 15px);
2889
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
2890
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
2891
+ margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
2892
+ padding: 0 var(--wpds-dimension-padding-2xl, 24px);
2891
2893
  }
2892
2894
 
2893
2895
  .dataviews-view-table {
@@ -2896,21 +2898,21 @@ div.dataviews-view-list {
2896
2898
  border-color: inherit;
2897
2899
  border-collapse: collapse;
2898
2900
  position: relative;
2899
- color: #757575;
2901
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
2900
2902
  margin-bottom: auto;
2901
2903
  background-color: inherit;
2902
2904
  }
2903
2905
 
2904
2906
  .dataviews-view-table th {
2905
2907
  text-align: left;
2906
- color: #1e1e1e;
2908
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
2907
2909
  font-weight: normal;
2908
- font-size: 13px;
2910
+ font-size: var(--wpds-typography-font-size-md, 13px);
2909
2911
  }
2910
2912
 
2911
2913
  .dataviews-view-table td,
2912
2914
  .dataviews-view-table th {
2913
- padding: 12px;
2915
+ padding: var(--wpds-dimension-padding-md, 12px);
2914
2916
  }
2915
2917
 
2916
2918
  .dataviews-view-table td.dataviews-view-table__actions-column,
@@ -2922,7 +2924,7 @@ div.dataviews-view-list {
2922
2924
  .dataviews-view-table th.dataviews-view-table__actions-column--sticky {
2923
2925
  position: sticky;
2924
2926
  right: 0;
2925
- background-color: var(--wp-dataviews-color-background, #fff);
2927
+ background-color: var(--wp-dataviews-color-background, var(--wpds-color-bg-surface-neutral-strong, #fff));
2926
2928
  }
2927
2929
 
2928
2930
  .dataviews-view-table td.dataviews-view-table__actions-column--stuck::after,
@@ -2934,7 +2936,7 @@ div.dataviews-view-list {
2934
2936
  bottom: 0;
2935
2937
  left: 0;
2936
2938
  width: 1px;
2937
- background-color: #f0f0f0;
2939
+ background-color: var(--wpds-color-bg-surface-neutral, #fcfcfc);
2938
2940
  }
2939
2941
 
2940
2942
  .dataviews-view-table td.dataviews-view-table__checkbox-column,
@@ -2949,18 +2951,18 @@ div.dataviews-view-list {
2949
2951
  }
2950
2952
 
2951
2953
  .dataviews-view-table tr {
2952
- border-top: 1px solid #f0f0f0;
2954
+ border-top: 1px solid var(--wpds-color-stroke-surface-neutral-weak, #e4e4e4);
2953
2955
  background-color: inherit;
2954
2956
  }
2955
2957
 
2956
2958
  .dataviews-view-table tr td:first-child,
2957
2959
  .dataviews-view-table tr th:first-child {
2958
- padding-left: 24px;
2960
+ padding-left: var(--wpds-dimension-padding-2xl, 24px);
2959
2961
  }
2960
2962
 
2961
2963
  .dataviews-view-table tr td:last-child,
2962
2964
  .dataviews-view-table tr th:last-child {
2963
- padding-right: 24px;
2965
+ padding-right: var(--wpds-dimension-padding-2xl, 24px);
2964
2966
  }
2965
2967
 
2966
2968
  .dataviews-view-table tr:last-child {
@@ -2977,16 +2979,16 @@ div.dataviews-view-list {
2977
2979
  }
2978
2980
  }
2979
2981
  .dataviews-view-table tr.is-selected {
2980
- background-color: color-mix(in srgb, rgb(var(--wp-admin-theme-color--rgb)) 4%, #fff);
2981
- color: #757575;
2982
+ background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
2983
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
2982
2984
  }
2983
2985
 
2984
2986
  .dataviews-view-table tr.is-selected, .dataviews-view-table tr.is-selected + tr {
2985
- border-top: 1px solid rgba(var(--wp-admin-theme-color--rgb), 0.12);
2987
+ border-top: 1px solid var(--wpds-color-stroke-surface-brand, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 46%, white));
2986
2988
  }
2987
2989
 
2988
2990
  .dataviews-view-table tr.is-selected .dataviews-view-table__actions-column--sticky {
2989
- background-color: color-mix(in srgb, rgb(var(--wp-admin-theme-color--rgb)) 4%, #fff);
2991
+ background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
2990
2992
  }
2991
2993
 
2992
2994
  .dataviews-view-table tr:focus-within .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr.is-hovered .dataviews-item-actions .components-button:not(.dataviews-all-actions-button), .dataviews-view-table tr:hover .dataviews-item-actions .components-button:not(.dataviews-all-actions-button) {
@@ -2994,11 +2996,11 @@ div.dataviews-view-list {
2994
2996
  }
2995
2997
 
2996
2998
  .dataviews-view-table.has-bulk-actions tr:focus-within .dataviews-view-table__actions-column--sticky, .dataviews-view-table.has-bulk-actions tr:hover .dataviews-view-table__actions-column--sticky {
2997
- background-color: var(--wp-dataviews-color-background, #fff);
2999
+ background-color: var(--wp-dataviews-color-background, var(--wpds-color-bg-surface-neutral-strong, #fff));
2998
3000
  }
2999
3001
 
3000
3002
  .dataviews-view-table.has-bulk-actions tr.is-selected .dataviews-view-table__actions-column--sticky, .dataviews-view-table.has-bulk-actions tr.is-selected:hover .dataviews-view-table__actions-column--sticky {
3001
- background-color: color-mix(in srgb, rgb(var(--wp-admin-theme-color--rgb)) 4%, #fff);
3003
+ background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3002
3004
  }
3003
3005
 
3004
3006
  .dataviews-view-table thead {
@@ -3016,7 +3018,7 @@ div.dataviews-view-list {
3016
3018
  left: 0;
3017
3019
  right: 0;
3018
3020
  height: 1px;
3019
- background-color: #f0f0f0;
3021
+ background-color: var(--wpds-color-stroke-surface-neutral-weak, #e4e4e4);
3020
3022
  }
3021
3023
 
3022
3024
  .dataviews-view-table thead tr {
@@ -3025,28 +3027,28 @@ div.dataviews-view-list {
3025
3027
 
3026
3028
  .dataviews-view-table thead th {
3027
3029
  background-color: inherit;
3028
- padding-top: 8px;
3029
- padding-bottom: 8px;
3030
+ padding-top: var(--wpds-dimension-padding-sm, 8px);
3031
+ padding-bottom: var(--wpds-dimension-padding-sm, 8px);
3030
3032
  font-size: 11px;
3031
3033
  text-transform: uppercase;
3032
- font-weight: 499;
3034
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
3033
3035
  }
3034
3036
 
3035
3037
  .dataviews-view-table thead th:has(.dataviews-view-table-header-button) {
3036
- padding-left: 4px;
3037
- padding-right: 4px;
3038
+ padding-left: var(--wpds-dimension-padding-xs, 4px);
3039
+ padding-right: var(--wpds-dimension-padding-xs, 4px);
3038
3040
  }
3039
3041
 
3040
3042
  .dataviews-view-table thead th:has(.dataviews-view-table-header-button) .dataviews-view-table-header-button {
3041
- gap: 4px;
3043
+ gap: var(--wpds-dimension-gap-xs, 4px);
3042
3044
  }
3043
3045
 
3044
3046
  .dataviews-view-table thead th:has(.dataviews-view-table-header-button):first-child {
3045
- padding-left: 16px;
3047
+ padding-left: var(--wpds-dimension-padding-lg, 16px);
3046
3048
  }
3047
3049
 
3048
3050
  .dataviews-view-table thead th:has(.dataviews-view-table-header-button):last-child {
3049
- padding-right: 16px;
3051
+ padding-right: var(--wpds-dimension-padding-lg, 16px);
3050
3052
  }
3051
3053
 
3052
3054
  .dataviews-view-table tbody td {
@@ -3054,7 +3056,7 @@ div.dataviews-view-list {
3054
3056
  }
3055
3057
 
3056
3058
  .dataviews-view-table tbody .dataviews-view-table__cell-content-wrapper {
3057
- min-height: 32px;
3059
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
3058
3060
  display: flex;
3059
3061
  align-items: center;
3060
3062
  white-space: nowrap;
@@ -3074,14 +3076,14 @@ div.dataviews-view-list {
3074
3076
  }
3075
3077
 
3076
3078
  .dataviews-view-table .dataviews-view-table-header-button {
3077
- padding: 4px 8px;
3079
+ padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-sm, 8px);
3078
3080
  font-size: 11px;
3079
3081
  text-transform: uppercase;
3080
- font-weight: 499;
3082
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
3081
3083
  }
3082
3084
 
3083
3085
  .dataviews-view-table .dataviews-view-table-header-button:not(:hover) {
3084
- color: #1e1e1e;
3086
+ color: var(--wpds-color-fg-interactive-neutral, #1e1e1e);
3085
3087
  }
3086
3088
 
3087
3089
  .dataviews-view-table .dataviews-view-table-header-button span {
@@ -3093,7 +3095,7 @@ div.dataviews-view-list {
3093
3095
  }
3094
3096
 
3095
3097
  .dataviews-view-table .dataviews-view-table-header {
3096
- padding-left: 4px;
3098
+ padding-left: var(--wpds-dimension-padding-xs, 4px);
3097
3099
  }
3098
3100
 
3099
3101
  .dataviews-view-table .dataviews-view-table__actions-column {
@@ -3111,12 +3113,12 @@ div.dataviews-view-list {
3111
3113
 
3112
3114
  .dataviews-view-table.has-compact-density td,
3113
3115
  .dataviews-view-table.has-compact-density th {
3114
- padding: 4px 8px;
3116
+ padding: var(--wpds-dimension-padding-xs, 4px) var(--wpds-dimension-padding-sm, 8px);
3115
3117
  }
3116
3118
 
3117
3119
  .dataviews-view-table.has-comfortable-density td,
3118
3120
  .dataviews-view-table.has-comfortable-density th {
3119
- padding: 16px 12px;
3121
+ padding: var(--wpds-dimension-padding-lg, 16px) var(--wpds-dimension-padding-md, 12px);
3120
3122
  }
3121
3123
 
3122
3124
  .dataviews-view-table.has-compact-density td.dataviews-view-table__checkbox-column,
@@ -3136,18 +3138,18 @@ div.dataviews-view-list {
3136
3138
  }
3137
3139
  .dataviews-column-primary__media {
3138
3140
  max-width: 60px;
3139
- min-width: 32px;
3140
- min-height: 32px;
3141
+ min-width: calc(var(--wpds-dimension-base, 4px) * 8);
3142
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
3141
3143
  overflow: hidden;
3142
3144
  position: relative;
3143
3145
  flex-shrink: 0;
3144
- background-color: #fff;
3145
- border-radius: 4px;
3146
+ background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
3147
+ border-radius: var(--wpds-border-radius-md, 4px);
3146
3148
  }
3147
3149
 
3148
3150
  .dataviews-column-primary__media img {
3149
- width: 32px;
3150
- height: 32px;
3151
+ width: calc(var(--wpds-dimension-base, 4px) * 8);
3152
+ height: calc(var(--wpds-dimension-base, 4px) * 8);
3151
3153
  object-fit: cover;
3152
3154
  }
3153
3155
 
@@ -3158,8 +3160,8 @@ div.dataviews-view-list {
3158
3160
  left: 0;
3159
3161
  width: 100%;
3160
3162
  height: 100%;
3161
- box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
3162
- border-radius: 4px;
3163
+ box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) rgba(0, 0, 0, 0.1);
3164
+ border-radius: var(--wpds-border-radius-md, 4px);
3163
3165
  }
3164
3166
 
3165
3167
  .dataviews-view-table__cell-content-wrapper:not(.dataviews-column-primary__media),
@@ -3169,9 +3171,9 @@ div.dataviews-view-list {
3169
3171
  }
3170
3172
 
3171
3173
  .dataviews-view-table__group-header-row .dataviews-view-table__group-header-cell {
3172
- font-weight: 499;
3173
- padding: 12px 24px;
3174
- color: #1e1e1e;
3174
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
3175
+ padding: var(--wpds-dimension-padding-md, 12px) var(--wpds-dimension-padding-2xl, 24px);
3176
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
3175
3177
  }
3176
3178
 
3177
3179
  /* Column width intents via colgroup: make non-primary columns shrink-to-fit */
@@ -3191,25 +3193,26 @@ div.dataviews-view-list {
3191
3193
  }
3192
3194
  }
3193
3195
  .dataviews-view-picker-grid.has-compact-density .dataviews-view-grid-items {
3194
- gap: 16px;
3196
+ gap: var(--wpds-dimension-gap-lg, 16px);
3195
3197
  }
3196
3198
 
3197
3199
  .dataviews-view-picker-grid.has-comfortable-density .dataviews-view-grid-items {
3198
- gap: 32px;
3200
+ gap: var(--wpds-dimension-gap-2xl, 32px);
3199
3201
  }
3200
3202
 
3201
3203
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card {
3202
3204
  height: 100%;
3203
3205
  justify-content: flex-start;
3204
3206
  position: relative;
3207
+ isolation: isolate;
3205
3208
  }
3206
3209
 
3207
3210
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-actions {
3208
- padding: 8px 0 4px;
3211
+ padding: var(--wpds-dimension-padding-sm, 8px) 0 var(--wpds-dimension-padding-xs, 4px);
3209
3212
  }
3210
3213
 
3211
3214
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__title-field {
3212
- min-height: 24px;
3215
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
3213
3216
  overflow: hidden;
3214
3217
  align-content: center;
3215
3218
  text-align: start;
@@ -3220,20 +3223,15 @@ div.dataviews-view-list {
3220
3223
  }
3221
3224
 
3222
3225
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-value {
3223
- color: #1e1e1e;
3224
- }
3225
-
3226
- .dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__media::after,
3227
- .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__media:focus::after {
3228
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
3226
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
3229
3227
  }
3230
3228
 
3231
3229
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card.is-selected .dataviews-view-picker-grid__media::after {
3232
- box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color);
3230
+ box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-interactive-brand, var(--wp-admin-theme-color, #3858e9)), inset 0 0 0 var(--wpds-border-width-sm, 2px) var(--wpds-color-bg-surface-neutral-strong, #fff);
3233
3231
  }
3234
3232
 
3235
3233
  .dataviews-view-picker-grid .dataviews-view-picker-grid__card .dataviews-view-picker-grid__media:focus::after {
3236
- box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
3234
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
3237
3235
  }
3238
3236
 
3239
3237
  .dataviews-view-picker-grid:focus-visible[aria-activedescendant] {
@@ -3241,11 +3239,11 @@ div.dataviews-view-list {
3241
3239
  }
3242
3240
 
3243
3241
  .dataviews-view-picker-grid:focus-visible [data-active-item=true] {
3244
- outline: 2px solid var(--wp-admin-theme-color);
3242
+ outline: 2px solid var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
3245
3243
  }
3246
3244
 
3247
3245
  .dataviews-view-picker-grid .dataviews-selection-checkbox {
3248
- top: 8px !important;
3246
+ top: var(--wpds-dimension-padding-sm, 8px) !important;
3249
3247
  }
3250
3248
 
3251
3249
  .dataviews-view-picker-grid .dataviews-selection-checkbox input {
@@ -3256,8 +3254,8 @@ div.dataviews-view-list {
3256
3254
  width: 100%;
3257
3255
  aspect-ratio: 1/1;
3258
3256
  min-height: 0;
3259
- background-color: #fff;
3260
- border-radius: 4px;
3257
+ background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
3258
+ border-radius: var(--wpds-border-radius-md, 4px);
3261
3259
  position: relative;
3262
3260
  }
3263
3261
 
@@ -3274,8 +3272,8 @@ div.dataviews-view-list {
3274
3272
  left: 0;
3275
3273
  width: 100%;
3276
3274
  height: 100%;
3277
- box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
3278
- border-radius: 4px;
3275
+ box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) rgba(0, 0, 0, 0.1);
3276
+ border-radius: var(--wpds-border-radius-md, 4px);
3279
3277
  pointer-events: none;
3280
3278
  }
3281
3279
 
@@ -3286,23 +3284,23 @@ div.dataviews-view-list {
3286
3284
  }
3287
3285
 
3288
3286
  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields:not(:empty) {
3289
- padding: 0 0 12px;
3287
+ padding: 0 0 var(--wpds-dimension-padding-md, 12px);
3290
3288
  }
3291
3289
 
3292
3290
  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field-value:not(:empty) {
3293
- min-height: 24px;
3294
- line-height: 20px;
3295
- padding-top: 2px;
3291
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
3292
+ line-height: var(--wpds-typography-line-height-sm, 20px);
3293
+ padding-top: calc(var(--wpds-dimension-base, 4px) / 2);
3296
3294
  }
3297
3295
 
3298
3296
  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field {
3299
- min-height: 24px;
3297
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
3300
3298
  align-items: center;
3301
3299
  }
3302
3300
 
3303
3301
  .dataviews-view-picker-grid .dataviews-view-picker-grid__fields .dataviews-view-picker-grid__field .dataviews-view-picker-grid__field-name {
3304
3302
  width: 35%;
3305
- color: #757575;
3303
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
3306
3304
  overflow: hidden;
3307
3305
  text-overflow: ellipsis;
3308
3306
  white-space: nowrap;
@@ -3320,7 +3318,7 @@ div.dataviews-view-list {
3320
3318
  }
3321
3319
 
3322
3320
  .dataviews-view-picker-grid .dataviews-view-picker-grid__badge-fields:not(:empty) {
3323
- padding-bottom: 12px;
3321
+ padding-bottom: var(--wpds-dimension-padding-md, 12px);
3324
3322
  }
3325
3323
 
3326
3324
  .dataviews-view-picker-grid__field-value:empty,
@@ -3331,19 +3329,19 @@ div.dataviews-view-list {
3331
3329
  .dataviews-view-picker-grid__card .dataviews-selection-checkbox {
3332
3330
  position: absolute;
3333
3331
  top: -9999em;
3334
- left: 8px;
3332
+ left: var(--wpds-dimension-padding-sm, 8px);
3335
3333
  z-index: 1;
3336
3334
  }
3337
3335
 
3338
3336
  @media (hover: none) {
3339
3337
  .dataviews-view-picker-grid__card .dataviews-selection-checkbox {
3340
- top: 8px;
3338
+ top: var(--wpds-dimension-padding-sm, 8px);
3341
3339
  }
3342
3340
  }
3343
3341
  .dataviews-view-picker-grid__card:hover .dataviews-selection-checkbox,
3344
3342
  .dataviews-view-picker-grid__card:focus-within .dataviews-selection-checkbox,
3345
3343
  .dataviews-view-picker-grid__card.is-selected .dataviews-selection-checkbox {
3346
- top: 8px;
3344
+ top: var(--wpds-dimension-padding-sm, 8px);
3347
3345
  }
3348
3346
 
3349
3347
  .dataviews-view-picker-grid__media--clickable {
@@ -3351,11 +3349,11 @@ div.dataviews-view-list {
3351
3349
  }
3352
3350
 
3353
3351
  .dataviews-view-picker-grid-group__header {
3354
- font-size: 15px;
3355
- font-weight: 499;
3356
- color: #1e1e1e;
3357
- margin: 0 0 8px 0;
3358
- padding: 0 48px;
3352
+ font-size: var(--wpds-typography-font-size-lg, 15px);
3353
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
3354
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
3355
+ margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
3356
+ padding: 0 calc(var(--wpds-dimension-base, 4px) * 12);
3359
3357
  }
3360
3358
 
3361
3359
  .dataviews-view-picker-table {
@@ -3363,7 +3361,7 @@ div.dataviews-view-list {
3363
3361
  }
3364
3362
 
3365
3363
  .dataviews-view-picker-table .dataviews-view-table__checkbox-column {
3366
- width: 48px;
3364
+ width: calc(var(--wpds-dimension-base, 4px) * 12);
3367
3365
  }
3368
3366
 
3369
3367
  .dataviews-view-picker-table tbody:focus-visible[aria-activedescendant] {
@@ -3371,7 +3369,7 @@ div.dataviews-view-list {
3371
3369
  }
3372
3370
 
3373
3371
  .dataviews-view-picker-table tbody:focus-visible [data-active-item=true] {
3374
- outline: 2px solid var(--wp-admin-theme-color);
3372
+ outline: 2px solid var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
3375
3373
  }
3376
3374
 
3377
3375
  .dataviews-view-picker-table .dataviews-selection-checkbox .components-checkbox-control__input.components-checkbox-control__input {
@@ -3384,32 +3382,32 @@ div.dataviews-view-list {
3384
3382
  }
3385
3383
 
3386
3384
  .dataviews-view-picker-table .dataviews-view-table__row.is-selected {
3387
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.04);
3385
+ background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3388
3386
  }
3389
3387
 
3390
3388
  .dataviews-view-picker-table .dataviews-view-table__row.is-hovered {
3391
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08);
3389
+ background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3392
3390
  }
3393
3391
 
3394
3392
  .dataviews-view-picker-table .dataviews-view-table__row.is-selected.is-hovered {
3395
- background-color: rgba(var(--wp-admin-theme-color--rgb), 0.12);
3393
+ background-color: var(--wpds-color-bg-interactive-brand-weak-active, color-mix(in oklch, var(--wp-admin-theme-color, #3858e9) 12%, white));
3396
3394
  }
3397
3395
 
3398
3396
  .dataviews-view-activity {
3399
3397
  margin: 0 0 auto;
3400
- padding: 0 24px;
3398
+ padding: 0 var(--wpds-dimension-padding-2xl, 24px);
3401
3399
  }
3402
3400
 
3403
3401
  .dataviews-view-activity .dataviews-view-activity__group-header {
3404
- font-size: 15px;
3405
- font-weight: 499;
3406
- color: #949494;
3407
- margin: 0 0 8px 0;
3402
+ font-size: var(--wpds-typography-font-size-lg, 15px);
3403
+ font-weight: var(--wpds-typography-font-weight-medium, 499);
3404
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
3405
+ margin: 0 0 var(--wpds-dimension-gap-sm, 8px) 0;
3408
3406
  padding: 0;
3409
3407
  }
3410
3408
 
3411
3409
  .dataviews-view-activity .dataviews-view-activity__item-actions {
3412
- min-width: 24px;
3410
+ min-width: calc(var(--wpds-dimension-base, 4px) * 6);
3413
3411
  }
3414
3412
 
3415
3413
  .dataviews-view-activity .dataviews-view-activity__item-content {
@@ -3419,7 +3417,7 @@ div.dataviews-view-list {
3419
3417
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title,
3420
3418
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-description,
3421
3419
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields {
3422
- min-height: 16px;
3420
+ min-height: calc(var(--wpds-dimension-base, 4px) * 4);
3423
3421
  }
3424
3422
 
3425
3423
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title {
@@ -3435,9 +3433,9 @@ div.dataviews-view-list {
3435
3433
  }
3436
3434
 
3437
3435
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-title--clickable:focus-visible {
3438
- outline: var(--wp-admin-border-width-focus) solid var(--wp-admin-theme-color);
3436
+ outline: var(--wp-admin-border-width-focus) solid var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
3439
3437
  outline-offset: var(--wp-admin-border-width-focus);
3440
- border-radius: 2px;
3438
+ border-radius: var(--wpds-border-radius-sm, 2px);
3441
3439
  }
3442
3440
 
3443
3441
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__primary-actions {
@@ -3452,10 +3450,10 @@ div.dataviews-view-list {
3452
3450
  }
3453
3451
 
3454
3452
  .dataviews-view-activity .dataviews-view-activity__item-content .dataviews-view-activity__item-fields {
3455
- color: #757575;
3453
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
3456
3454
  display: flex;
3457
- gap: 12px;
3458
- row-gap: 4px;
3455
+ gap: var(--wpds-dimension-gap-md, 12px);
3456
+ row-gap: var(--wpds-dimension-gap-xs, 4px);
3459
3457
  flex-wrap: wrap;
3460
3458
  }
3461
3459
 
@@ -3482,7 +3480,7 @@ div.dataviews-view-list {
3482
3480
  flex: 1 1 auto;
3483
3481
  width: 1px;
3484
3482
  margin: 0 auto;
3485
- background-color: #ddd;
3483
+ background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3486
3484
  }
3487
3485
 
3488
3486
  .dataviews-view-activity .dataviews-view-activity__item-type::before {
@@ -3490,65 +3488,65 @@ div.dataviews-view-list {
3490
3488
  flex: 0 0 auto;
3491
3489
  width: 1px;
3492
3490
  margin: 0 auto;
3493
- background-color: #ddd;
3491
+ background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3494
3492
  }
3495
3493
 
3496
3494
  .dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type {
3497
- width: 12px;
3495
+ width: var(--wpds-dimension-padding-md, 12px);
3498
3496
  }
3499
3497
 
3500
3498
  .dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type::before {
3501
- height: 12px;
3499
+ height: calc(var(--wpds-dimension-base, 4px) * 3);
3502
3500
  }
3503
3501
 
3504
3502
  .dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-type-icon {
3505
- width: 11px;
3506
- height: 11px;
3503
+ width: calc(var(--wpds-dimension-base, 4px) * 3 - 1px);
3504
+ height: calc(var(--wpds-dimension-base, 4px) * 3 - 1px);
3507
3505
  }
3508
3506
 
3509
3507
  .dataviews-view-activity .dataviews-view-activity__item.is-compact .dataviews-view-activity__item-content {
3510
- margin: 12px 0;
3508
+ margin: var(--wpds-dimension-gap-md, 12px) 0;
3511
3509
  }
3512
3510
 
3513
3511
  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type {
3514
- width: 24px;
3512
+ width: calc(var(--wpds-dimension-base, 4px) * 6);
3515
3513
  }
3516
3514
 
3517
3515
  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type::before {
3518
- height: 12px;
3516
+ height: calc(var(--wpds-dimension-base, 4px) * 3);
3519
3517
  }
3520
3518
 
3521
3519
  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-type-icon {
3522
- width: 25px;
3523
- height: 25px;
3520
+ width: calc(var(--wpds-dimension-base, 4px) * 6 + 1px);
3521
+ height: calc(var(--wpds-dimension-base, 4px) * 6 + 1px);
3524
3522
  }
3525
3523
 
3526
3524
  .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-content {
3527
- margin: 12px 0;
3528
- padding-top: 8px;
3525
+ margin: var(--wpds-dimension-gap-md, 12px) 0;
3526
+ padding-top: var(--wpds-dimension-padding-sm, 8px);
3529
3527
  }
3530
3528
 
3531
3529
  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type {
3532
- width: 32px;
3530
+ width: calc(var(--wpds-dimension-base, 4px) * 8);
3533
3531
  }
3534
3532
 
3535
3533
  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type::before {
3536
- height: 8px;
3534
+ height: calc(var(--wpds-dimension-base, 4px) * 2);
3537
3535
  }
3538
3536
 
3539
3537
  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-type-icon {
3540
- width: 33px;
3541
- height: 33px;
3538
+ width: calc(var(--wpds-dimension-base, 4px) * 8 + 1px);
3539
+ height: calc(var(--wpds-dimension-base, 4px) * 8 + 1px);
3542
3540
  }
3543
3541
 
3544
3542
  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-content {
3545
- margin: 8px 0 16px;
3546
- padding-top: 12px;
3543
+ margin: var(--wpds-dimension-gap-sm, 8px) 0 var(--wpds-dimension-gap-lg, 16px);
3544
+ padding-top: var(--wpds-dimension-padding-md, 12px);
3547
3545
  }
3548
3546
 
3549
3547
  .dataviews-view-activity .dataviews-view-activity__item.is-comfortable .dataviews-view-activity__item-bullet, .dataviews-view-activity .dataviews-view-activity__item.is-balanced .dataviews-view-activity__item-bullet {
3550
- width: 9px;
3551
- height: 9px;
3548
+ width: calc(var(--wpds-dimension-base, 4px) * 2 + 1px);
3549
+ height: calc(var(--wpds-dimension-base, 4px) * 2 + 1px);
3552
3550
  position: relative;
3553
3551
  top: 50%;
3554
3552
  transform: translateY(-50%);
@@ -3559,13 +3557,13 @@ div.dataviews-view-list {
3559
3557
  }
3560
3558
 
3561
3559
  .dataviews-view-activity .dataviews-view-activity__group:last-of-type > .dataviews-view-activity__item:last-of-type .dataviews-view-activity__item-type::after, .dataviews-view-activity > .dataviews-view-activity__item:last-child .dataviews-view-activity__item-type::after {
3562
- background: linear-gradient(to bottom, #ddd 0%, rgba(221, 221, 221, 0.2) 60%, rgba(221, 221, 221, 0) 100%);
3560
+ background: linear-gradient(to bottom, var(--wpds-color-stroke-surface-neutral, #dbdbdb) 0%, color-mix(in srgb, var(--wpds-color-stroke-surface-neutral, #dbdbdb) 20%, transparent) 60%, transparent 100%);
3563
3561
  }
3564
3562
 
3565
3563
  .dataviews-view-activity .dataviews-view-activity__item-type-icon {
3566
3564
  overflow: hidden;
3567
3565
  flex-shrink: 0;
3568
- background-color: #fff;
3566
+ background-color: var(--wpds-color-bg-surface-neutral-strong, #fff);
3569
3567
  }
3570
3568
 
3571
3569
  .dataviews-view-activity .dataviews-view-activity__item-type-icon img,
@@ -3578,16 +3576,16 @@ div.dataviews-view-list {
3578
3576
  object-fit: cover;
3579
3577
  border-radius: 50%;
3580
3578
  box-sizing: border-box;
3581
- box-shadow: inset 0 0 0 1px #ddd;
3579
+ box-shadow: inset 0 0 0 var(--wpds-border-width-xs, 1px) var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3582
3580
  }
3583
3581
 
3584
3582
  .dataviews-view-activity .dataviews-view-activity__item-type-icon svg {
3585
- padding: 4px;
3583
+ padding: var(--wpds-dimension-padding-xs, 4px);
3586
3584
  }
3587
3585
 
3588
3586
  .dataviews-view-activity .dataviews-view-activity__item-type-icon .dataviews-view-activity__item-bullet {
3589
3587
  content: "";
3590
- background-color: #ddd;
3588
+ background-color: var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3591
3589
  }
3592
3590
 
3593
3591
  .dataviews-view-activity.is-refreshing {
@@ -3607,7 +3605,7 @@ div.dataviews-view-list {
3607
3605
 
3608
3606
  .dataviews-picker-footer__bulk-selection {
3609
3607
  align-self: flex-start;
3610
- height: 32px;
3608
+ height: calc(var(--wpds-dimension-base, 4px) * 8);
3611
3609
  }
3612
3610
 
3613
3611
  .dataviews-picker-footer__actions {
@@ -3639,11 +3637,11 @@ div.dataviews-view-list {
3639
3637
  }
3640
3638
 
3641
3639
  .dataviews-controls__date-preset {
3642
- border: 1px solid #ddd;
3640
+ border: 1px solid var(--wpds-color-stroke-surface-neutral, #dbdbdb);
3643
3641
  }
3644
3642
 
3645
3643
  .dataviews-controls__date-preset:active {
3646
- background-color: #000;
3644
+ background-color: var(--wpds-color-bg-interactive-neutral-strong-active, #1e1e1e);
3647
3645
  }
3648
3646
 
3649
3647
  .dataforms-layouts-panel__field-trigger {
@@ -3651,10 +3649,10 @@ div.dataviews-view-list {
3651
3649
  color: inherit;
3652
3650
  display: flex;
3653
3651
  width: 100%;
3654
- min-height: 24px;
3652
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
3655
3653
  cursor: var(--wpds-cursor-control, pointer);
3656
3654
  align-items: flex-start;
3657
- border-radius: 2px;
3655
+ border-radius: var(--wpds-border-radius-sm, 2px);
3658
3656
  isolation: isolate;
3659
3657
  }
3660
3658
 
@@ -3673,7 +3671,7 @@ div.dataviews-view-list {
3673
3671
  }
3674
3672
 
3675
3673
  .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover {
3676
- color: var(--wp-admin-theme-color);
3674
+ color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
3677
3675
  }
3678
3676
 
3679
3677
  .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover .dataforms-layouts-panel__field-trigger-icon {
@@ -3681,7 +3679,7 @@ div.dataviews-view-list {
3681
3679
  }
3682
3680
 
3683
3681
  .dataforms-layouts-panel__field-trigger:not(.is-disabled):hover .dataforms-layouts-panel__field-label {
3684
- color: var(--wp-admin-theme-color);
3682
+ color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
3685
3683
  }
3686
3684
 
3687
3685
  .dataforms-layouts-panel__field-trigger.is-disabled {
@@ -3689,7 +3687,7 @@ div.dataviews-view-list {
3689
3687
  }
3690
3688
 
3691
3689
  .dataforms-layouts-panel__field-trigger.is-disabled .dataforms-layouts-panel__field-control {
3692
- color: #757575;
3690
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
3693
3691
  font-weight: var(--wpds-typography-font-weight-regular, 400);
3694
3692
  }
3695
3693
 
@@ -3699,12 +3697,12 @@ div.dataviews-view-list {
3699
3697
  }
3700
3698
 
3701
3699
  .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon:hover, .dataforms-layouts-panel__field-trigger--edit-always .dataforms-layouts-panel__field-trigger-icon:focus-visible {
3702
- fill: var(--wp-admin-theme-color);
3700
+ fill: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
3703
3701
  }
3704
3702
 
3705
3703
  .dataforms-layouts-panel__field-trigger-icon {
3706
3704
  padding: 0;
3707
- color: var(--wp-admin-theme-color);
3705
+ color: var(--wpds-color-fg-interactive-brand, var(--wp-admin-theme-color, #3858e9));
3708
3706
  flex: 0 0 auto;
3709
3707
  opacity: 0;
3710
3708
  border-radius: var(--wpds-border-radius-xs, 1px);
@@ -3712,7 +3710,7 @@ div.dataviews-view-list {
3712
3710
 
3713
3711
  .dataforms-layouts-panel__field-trigger-icon:focus-visible {
3714
3712
  opacity: 1;
3715
- outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wp-admin-theme-color);
3713
+ outline: var(--wpds-border-width-focus, var(--wp-admin-border-width-focus, 2px)) solid var(--wpds-color-stroke-focus-brand, var(--wp-admin-theme-color, #3858e9));
3716
3714
  }
3717
3715
 
3718
3716
  .dataforms-layouts-panel__field-dropdown-anchor {
@@ -3726,12 +3724,12 @@ div.dataviews-view-list {
3726
3724
  .dataforms-layouts-panel__field-label {
3727
3725
  width: 38%;
3728
3726
  flex-shrink: 0;
3729
- min-height: 24px;
3727
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
3730
3728
  display: flex;
3731
3729
  align-items: center;
3732
- line-height: 20px;
3730
+ line-height: var(--wpds-typography-line-height-sm, 20px);
3733
3731
  hyphens: auto;
3734
- color: #757575;
3732
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
3735
3733
  }
3736
3734
 
3737
3735
  .dataforms-layouts-panel__field-label .components-base-control__label {
@@ -3741,18 +3739,18 @@ div.dataviews-view-list {
3741
3739
  }
3742
3740
 
3743
3741
  .dataforms-layouts-panel__field-label.has-error {
3744
- color: #cc1818;
3742
+ color: var(--wpds-color-fg-content-error-weak, #cc1818);
3745
3743
  }
3746
3744
 
3747
3745
  .dataforms-layouts-panel__field-label-error-content {
3748
3746
  position: relative;
3749
3747
  z-index: 1;
3750
3748
  cursor: help;
3751
- fill: #cc1818;
3749
+ fill: var(--wpds-color-fg-content-error-weak, #cc1818);
3752
3750
  display: inline-flex;
3753
3751
  flex-direction: row;
3754
3752
  align-items: center;
3755
- gap: 4px;
3753
+ gap: var(--wpds-dimension-gap-xs, 4px);
3756
3754
  }
3757
3755
 
3758
3756
  .dataforms-layouts-panel__field-label-error-content svg {
@@ -3762,7 +3760,7 @@ div.dataviews-view-list {
3762
3760
  .dataforms-layouts-panel__field-control {
3763
3761
  flex-grow: 1;
3764
3762
  min-width: 0;
3765
- min-height: 24px;
3763
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
3766
3764
  line-height: var(--wpds-typography-line-height-md, 24px);
3767
3765
  display: flex;
3768
3766
  align-items: center;
@@ -3775,6 +3773,23 @@ div.dataviews-view-list {
3775
3773
  min-width: 0;
3776
3774
  }
3777
3775
 
3776
+ .dataforms-layouts-panel__field-control .components-button {
3777
+ max-width: 100%;
3778
+ text-align: left;
3779
+ white-space: normal;
3780
+ text-wrap: balance;
3781
+ text-wrap: pretty;
3782
+ min-height: 32px;
3783
+ }
3784
+
3785
+ .dataforms-layouts-panel__field-control.components-button.is-link[aria-disabled=true] {
3786
+ text-decoration: none;
3787
+ }
3788
+
3789
+ .dataforms-layouts-panel__field-control .components-dropdown {
3790
+ max-width: 100%;
3791
+ }
3792
+
3778
3793
  .dataforms-layouts-panel__field-trigger--label-top .dataforms-layouts-panel__field-label {
3779
3794
  width: 100%;
3780
3795
  }
@@ -3789,25 +3804,29 @@ div.dataviews-view-list {
3789
3804
  }
3790
3805
 
3791
3806
  .dataforms-layouts-panel__field-dropdown .components-popover__content {
3792
- min-width: 256px;
3793
- padding: 16px;
3807
+ min-width: 320px;
3808
+ padding: var(--wpds-dimension-padding-lg, 16px);
3794
3809
  }
3795
3810
 
3796
3811
  .dataforms-layouts-panel__dropdown-header {
3797
- margin-bottom: 16px;
3812
+ margin-bottom: var(--wpds-dimension-gap-lg, 16px);
3798
3813
  }
3799
3814
 
3800
3815
  .dataforms-layouts-panel__modal-footer {
3801
- margin-top: 16px;
3816
+ margin-top: var(--wpds-dimension-gap-lg, 16px);
3802
3817
  }
3803
3818
 
3804
3819
  .components-popover.components-dropdown__content.dataforms-layouts-panel__field-dropdown {
3805
3820
  z-index: 159990;
3806
3821
  }
3807
3822
 
3823
+ .dataforms-layouts-panel__summary-button:empty {
3824
+ min-width: 160px;
3825
+ }
3826
+
3808
3827
  .dataforms-layouts-regular__field {
3809
3828
  width: 100%;
3810
- min-height: 32px;
3829
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
3811
3830
  justify-content: flex-start !important;
3812
3831
  align-items: flex-start !important;
3813
3832
  }
@@ -3815,16 +3834,16 @@ div.dataviews-view-list {
3815
3834
  .dataforms-layouts-regular__field .components-base-control__label,
3816
3835
  .dataforms-layouts-regular__field .components-input-control__label,
3817
3836
  .dataforms-layouts-regular__field .components-form-token-field__label {
3818
- color: #1e1e1e;
3837
+ color: var(--wpds-color-fg-content-neutral, #1e1e1e);
3819
3838
  }
3820
3839
 
3821
3840
  .dataforms-layouts-regular__field-label {
3822
3841
  width: 38%;
3823
3842
  flex-shrink: 0;
3824
- min-height: 32px;
3843
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
3825
3844
  display: flex;
3826
3845
  align-items: center;
3827
- line-height: 20px;
3846
+ line-height: var(--wpds-typography-line-height-sm, 20px);
3828
3847
  hyphens: auto;
3829
3848
  }
3830
3849
 
@@ -3838,7 +3857,7 @@ div.dataviews-view-list {
3838
3857
 
3839
3858
  .dataforms-layouts-regular__field-control {
3840
3859
  flex-grow: 1;
3841
- min-height: 32px;
3860
+ min-height: calc(var(--wpds-dimension-base, 4px) * 8);
3842
3861
  display: flex;
3843
3862
  align-items: center;
3844
3863
  }
@@ -3856,26 +3875,26 @@ div.dataviews-view-list {
3856
3875
  }
3857
3876
 
3858
3877
  .dataforms-layouts-card__field-description {
3859
- color: #757575;
3878
+ color: var(--wpds-color-fg-content-neutral-weak, #707070);
3860
3879
  display: block;
3861
- font-size: 13px;
3862
- margin-bottom: 16px;
3880
+ font-size: var(--wpds-typography-font-size-md, 13px);
3881
+ margin-bottom: var(--wpds-dimension-gap-lg, 16px);
3863
3882
  }
3864
3883
 
3865
3884
  .dataforms-layouts-card__field-summary {
3866
3885
  display: flex;
3867
3886
  flex-direction: row;
3868
- gap: 16px;
3887
+ gap: var(--wpds-dimension-gap-lg, 16px);
3869
3888
  align-items: center;
3870
3889
  }
3871
3890
 
3872
3891
  .dataforms-layouts-details__summary-content {
3873
3892
  display: inline-flex;
3874
- min-height: 24px;
3893
+ min-height: calc(var(--wpds-dimension-base, 4px) * 6);
3875
3894
  }
3876
3895
 
3877
3896
  .dataforms-layouts-details__content {
3878
- padding-top: 12px;
3897
+ padding-top: var(--wpds-dimension-padding-md, 12px);
3879
3898
  }
3880
3899
 
3881
3900
  .dataforms-layouts-row__field-control {
@@ -4708,6 +4727,20 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
4708
4727
  width: 1px;
4709
4728
  }
4710
4729
 
4730
+ .wp-media-editor-image-editor__dimensions-tooltip {
4731
+ position: absolute;
4732
+ padding: 2px 6px;
4733
+ background: #fff;
4734
+ color: #1e1e1e;
4735
+ font-size: 11px;
4736
+ line-height: 1.4;
4737
+ font-variant-numeric: tabular-nums;
4738
+ box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.08);
4739
+ pointer-events: none;
4740
+ white-space: nowrap;
4741
+ z-index: 2;
4742
+ }
4743
+
4711
4744
  .wp-media-editor-image-editor__stencil-rect {
4712
4745
  position: absolute;
4713
4746
  border: 1px solid rgba(255, 255, 255, 0.7);
@@ -4716,7 +4749,7 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
4716
4749
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
4717
4750
  }
4718
4751
 
4719
- .wp-media-editor-image-editor__canvas--focus-visible .wp-media-editor-image-editor__stencil-rect {
4752
+ .wp-media-editor-image-editor__canvas--focus-visible:focus .wp-media-editor-image-editor__stencil-rect {
4720
4753
  border-color: var(--wp-image-editor-focus-color, var(--wp-admin-theme-color, #007cba));
4721
4754
  box-shadow: 0 0 0 1px var(--wp-image-editor-focus-color, var(--wp-admin-theme-color, #007cba));
4722
4755
  }
@@ -4742,7 +4775,7 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
4742
4775
  outline: none;
4743
4776
  }
4744
4777
 
4745
- .wp-media-editor-image-editor__handle:focus-visible {
4778
+ .wp-media-editor-image-editor__canvas--focus-visible .wp-media-editor-image-editor__handle:focus {
4746
4779
  background: var(--wp-image-editor-focus-color, var(--wp-admin-theme-color, #007cba));
4747
4780
  border-color: transparent;
4748
4781
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--wp-image-editor-focus-color, var(--wp-admin-theme-color, #007cba));
@@ -5137,11 +5170,10 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
5137
5170
  position: absolute;
5138
5171
  bottom: 0;
5139
5172
  left: 50%;
5140
- width: 0;
5141
- height: 0;
5142
- border-left: 6px solid transparent;
5143
- border-right: 6px solid transparent;
5144
- border-bottom: 9px solid var(--wp-admin-theme-color, #3858e9);
5173
+ width: 2px;
5174
+ height: 18px;
5175
+ background: var(--wp-admin-theme-color, #3858e9);
5176
+ border-radius: 1px;
5145
5177
  transform: translateX(-50%);
5146
5178
  pointer-events: none;
5147
5179
  }
@@ -5192,15 +5224,41 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
5192
5224
  left: 50%;
5193
5225
  height: 14px;
5194
5226
  transform: translateX(-50%);
5195
- padding: 0 12px;
5196
5227
  font-size: 12px;
5197
5228
  font-weight: 600;
5198
5229
  line-height: 14px;
5199
5230
  color: #1e1e1e;
5200
- background: linear-gradient(to right, transparent 0, #fff 12px, #fff calc(100% - 12px), transparent 100%);
5201
5231
  pointer-events: none;
5202
5232
  }
5203
5233
 
5234
+ .rotation-ruler__active-label::before {
5235
+ content: "";
5236
+ position: absolute;
5237
+ top: 0;
5238
+ left: 50%;
5239
+ width: 60px;
5240
+ height: 100%;
5241
+ transform: translateX(-50%);
5242
+ background: linear-gradient(to right, transparent 0, #fff 12px, #fff calc(100% - 12px), transparent 100%);
5243
+ }
5244
+
5245
+ .rotation-ruler__active-label-number {
5246
+ position: relative;
5247
+ display: inline-block;
5248
+ }
5249
+
5250
+ .rotation-ruler__active-label-sign {
5251
+ position: absolute;
5252
+ top: 0;
5253
+ right: 100%;
5254
+ }
5255
+
5256
+ .rotation-ruler__active-label-unit {
5257
+ position: absolute;
5258
+ top: 0;
5259
+ left: 100%;
5260
+ }
5261
+
5204
5262
  @container (max-width: 220px) {
5205
5263
  .rotation-ruler__tick--minor {
5206
5264
  opacity: 0;
@@ -5741,7 +5799,6 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
5741
5799
  height: 32px;
5742
5800
  background: #f0f0f0;
5743
5801
  border-radius: 4px;
5744
- margin-right: 8px;
5745
5802
  }
5746
5803
  .editor-collaborators-presence:hover {
5747
5804
  background-color: #e0e0e0;
@@ -5750,6 +5807,10 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
5750
5807
  background-color: #e0e0e0;
5751
5808
  }
5752
5809
 
5810
+ .editor-header__center .editor-collaborators-presence {
5811
+ margin-right: 8px;
5812
+ }
5813
+
5753
5814
  .editor-collaborators-presence__button.editor-collaborators-presence__button.components-button {
5754
5815
  display: flex;
5755
5816
  align-items: center;
@@ -6130,6 +6191,10 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
6130
6191
  isolation: isolate;
6131
6192
  }
6132
6193
 
6194
+ .editor-editor-interface .editor-notices {
6195
+ padding: var(--wpds-dimension-padding-md, 12px);
6196
+ }
6197
+
6133
6198
  .editor-visual-editor {
6134
6199
  flex: 1 0 auto;
6135
6200
  }
@@ -6238,15 +6303,6 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
6238
6303
  flex: 1;
6239
6304
  }
6240
6305
 
6241
- .editor-global-styles-sidebar .components-navigation__menu-title-heading {
6242
- font-size: 15.6px;
6243
- font-weight: 499;
6244
- }
6245
-
6246
- .editor-global-styles-sidebar .components-navigation__item > button span {
6247
- font-weight: 499;
6248
- }
6249
-
6250
6306
  .editor-global-styles-sidebar .block-editor-panel-color-gradient-settings {
6251
6307
  border: 0;
6252
6308
  }
@@ -6988,10 +7044,6 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
6988
7044
  padding: 16px;
6989
7045
  }
6990
7046
 
6991
- .editor-private-post-last-revision__button {
6992
- display: inline-block;
6993
- }
6994
-
6995
7047
  .editor-post-locked-modal__buttons {
6996
7048
  margin-top: 24px;
6997
7049
  }
@@ -7018,6 +7070,7 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
7018
7070
  padding: 6px 0;
7019
7071
  line-height: 20px;
7020
7072
  hyphens: auto;
7073
+ word-break: break-word;
7021
7074
  }
7022
7075
 
7023
7076
  .editor-post-panel__row-control {
@@ -7315,7 +7368,7 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
7315
7368
  .revision-diff-markers {
7316
7369
  position: relative;
7317
7370
  flex-shrink: 0;
7318
- width: 24px;
7371
+ width: max(16px, 1rem);
7319
7372
  background: rgba(0, 0, 0, 0.05);
7320
7373
  }
7321
7374
  .revision-diff-markers .revision-diff-marker {
@@ -7328,13 +7381,13 @@ fieldset.fields__media-edit .fields__media-edit-expanded:not(.is-empty) .fields_
7328
7381
  transition: opacity 0.1s ease;
7329
7382
  }
7330
7383
  .revision-diff-markers .revision-diff-marker.is-added {
7331
- background: #00a32a;
7384
+ background: #008a20;
7332
7385
  }
7333
7386
  .revision-diff-markers .revision-diff-marker.is-removed {
7334
- background: repeating-linear-gradient(45deg, #d63638, #d63638 3px, rgba(214, 54, 56, 0.45) 3px, rgba(214, 54, 56, 0.45) 6px);
7387
+ background: repeating-linear-gradient(45deg, #d63638, #d63638 6px, rgba(214, 54, 56, 0.45) 6px, rgba(214, 54, 56, 0.45) 8px);
7335
7388
  }
7336
7389
  .revision-diff-markers .revision-diff-marker.is-modified {
7337
- background: repeating-linear-gradient(-45deg, #dba617, #dba617 3px, rgba(219, 166, 23, 0.45) 3px, rgba(219, 166, 23, 0.45) 6px);
7390
+ background: repeating-linear-gradient(-45deg, #9a7000, #9a7000 6px, rgba(154, 112, 0, 0.45) 6px, rgba(154, 112, 0, 0.45) 8px);
7338
7391
  }
7339
7392
  .revision-diff-markers .revision-diff-marker:hover {
7340
7393
  opacity: 0.7;
@@ -8037,6 +8090,7 @@ textarea.editor-post-text-editor::placeholder {
8037
8090
  }
8038
8091
  .editor-text-editor {
8039
8092
  position: relative;
8093
+ isolation: isolate;
8040
8094
  width: 100%;
8041
8095
  background-color: #fff;
8042
8096
  flex-grow: 1;