@patternfly/patternfly 6.5.0-prerelease.6 → 6.5.0-prerelease.60

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 (392) hide show
  1. package/README.md +1 -1
  2. package/assets/fontawesome/_variables.scss +2 -1
  3. package/assets/images/RHAiExperienceIcon.svg +27 -0
  4. package/assets/images/RHAutomationsLogo.svg +96 -0
  5. package/assets/images/RHServerStackIcon.svg +16 -0
  6. package/assets/images/compass--hero-bg.png +0 -0
  7. package/assets/images/compass--rh-wallpaper-dark.png +0 -0
  8. package/assets/images/compass--rh-wallpaper-light.png +0 -0
  9. package/assets/images/compass--wallpaper-dark.jpg +0 -0
  10. package/assets/images/compass--wallpaper-dark.png +0 -0
  11. package/assets/images/compass--wallpaper-light.jpg +0 -0
  12. package/assets/images/compass--wallpaper-light.png +0 -0
  13. package/assets/images/glass-brand-dark.jpg +0 -0
  14. package/assets/images/glass-brand-dark.png +0 -0
  15. package/assets/images/glass-brand-light.jpg +0 -0
  16. package/assets/images/glass-brand-light.png +0 -0
  17. package/base/normalize.scss +7 -0
  18. package/base/patternfly-common.css +50 -0
  19. package/base/patternfly-common.scss +59 -0
  20. package/base/patternfly-svg-icons.css +11 -0
  21. package/base/patternfly-svg-icons.scss +14 -0
  22. package/base/patternfly-variables.css +926 -513
  23. package/base/patternfly-variables.scss +46 -4
  24. package/base/tokens/tokens-dark.scss +56 -8
  25. package/base/tokens/tokens-default.scss +69 -14
  26. package/base/tokens/tokens-glass-dark.scss +26 -0
  27. package/base/tokens/tokens-glass.scss +22 -0
  28. package/base/tokens/tokens-local.scss +17 -0
  29. package/base/tokens/tokens-palette.scss +3 -1
  30. package/base/tokens/tokens-redhat-dark.scss +21 -0
  31. package/base/tokens/tokens-redhat-glass-dark.scss +40 -0
  32. package/base/tokens/tokens-redhat-glass.scss +30 -0
  33. package/base/tokens/tokens-redhat-highcontrast-dark.scss +50 -0
  34. package/base/tokens/tokens-redhat-highcontrast.scss +128 -0
  35. package/base/tokens/tokens-redhat.scss +15 -0
  36. package/components/AboutModalBox/about-modal-box.css +36 -26
  37. package/components/Accordion/accordion.css +27 -14
  38. package/components/Accordion/accordion.scss +12 -2
  39. package/components/ActionList/action-list.css +2 -0
  40. package/components/ActionList/action-list.scss +2 -0
  41. package/components/Alert/alert.css +7 -5
  42. package/components/Alert/alert.scss +2 -1
  43. package/components/Avatar/avatar.css +12 -4
  44. package/components/BackgroundImage/background-image.css +6 -3
  45. package/components/Banner/banner.css +8 -6
  46. package/components/Brand/brand.css +3 -1
  47. package/components/Breadcrumb/breadcrumb.css +4 -3
  48. package/components/Button/button.css +121 -30
  49. package/components/Button/button.scss +131 -26
  50. package/components/CalendarMonth/calendar-month.css +4 -3
  51. package/components/Card/card.css +51 -13
  52. package/components/Card/card.scss +61 -8
  53. package/components/ClipboardCopy/clipboard-copy.css +7 -6
  54. package/components/ClipboardCopy/clipboard-copy.scss +3 -3
  55. package/components/CodeEditor/code-editor.css +1 -1
  56. package/components/CodeEditor/code-editor.scss +1 -1
  57. package/components/Compass/compass.css +320 -0
  58. package/components/Compass/compass.scss +350 -0
  59. package/components/DataList/data-list.css +34 -23
  60. package/components/DataList/data-list.scss +8 -2
  61. package/components/DescriptionList/description-list-order.scss +5 -1
  62. package/components/DescriptionList/description-list.css +7 -5
  63. package/components/DescriptionList/description-list.scss +5 -1
  64. package/components/Divider/divider.css +7 -5
  65. package/components/Drawer/drawer.css +115 -56
  66. package/components/Drawer/drawer.scss +82 -9
  67. package/components/DualListSelector/dual-list-selector.css +18 -12
  68. package/components/DualListSelector/dual-list-selector.scss +1 -1
  69. package/components/ExpandableSection/expandable-section.css +21 -16
  70. package/components/ExpandableSection/expandable-section.scss +6 -3
  71. package/components/Form/form.css +2 -2
  72. package/components/Form/form.scss +2 -2
  73. package/components/FormControl/form-control.css +3 -3
  74. package/components/FormControl/form-control.scss +3 -3
  75. package/components/Hero/hero.css +74 -0
  76. package/components/Hero/hero.scss +86 -0
  77. package/components/JumpLinks/jump-links.css +16 -5
  78. package/components/JumpLinks/jump-links.scss +17 -3
  79. package/components/Label/label-group.css +2 -2
  80. package/components/Label/label-group.scss +2 -2
  81. package/components/Label/label.css +4 -3
  82. package/components/Login/login.css +58 -40
  83. package/components/Login/login.scss +7 -3
  84. package/components/Masthead/masthead.css +112 -16
  85. package/components/Masthead/masthead.scss +112 -1
  86. package/components/Menu/menu.css +23 -14
  87. package/components/MenuToggle/menu-toggle.css +26 -3
  88. package/components/MenuToggle/menu-toggle.scss +30 -3
  89. package/components/ModalBox/modal-box.css +9 -7
  90. package/components/ModalBox/modal-box.scss +2 -2
  91. package/components/Nav/nav.css +82 -11
  92. package/components/Nav/nav.scss +85 -5
  93. package/components/NotificationDrawer/notification-drawer.css +19 -9
  94. package/components/NotificationDrawer/notification-drawer.scss +14 -5
  95. package/components/Page/page.css +214 -29
  96. package/components/Page/page.scss +228 -13
  97. package/components/Pagination/pagination.scss +5 -1
  98. package/components/Panel/panel.css +14 -0
  99. package/components/Panel/panel.scss +18 -0
  100. package/components/Progress/progress.css +3 -1
  101. package/components/Progress/progress.scss +3 -1
  102. package/components/ProgressStepper/progress-stepper.scss +5 -1
  103. package/components/Sidebar/sidebar.css +1 -1
  104. package/components/Sidebar/sidebar.scss +7 -3
  105. package/components/Skeleton/skeleton.css +16 -15
  106. package/components/Slider/slider.css +32 -18
  107. package/components/Switch/switch.css +4 -2
  108. package/components/Switch/switch.scss +1 -1
  109. package/components/Table/table-grid.css +28 -36
  110. package/components/Table/table-grid.scss +4 -4
  111. package/components/Table/table-tree-view.css +4 -2
  112. package/components/Table/table.css +45 -36
  113. package/components/Table/table.scss +15 -11
  114. package/components/Tabs/tabs.css +51 -33
  115. package/components/Tabs/tabs.scss +54 -26
  116. package/components/TextInputGroup/text-input-group.css +2 -2
  117. package/components/TextInputGroup/text-input-group.scss +2 -2
  118. package/components/ToggleGroup/toggle-group.css +34 -17
  119. package/components/ToggleGroup/toggle-group.scss +36 -20
  120. package/components/Toolbar/toolbar.css +47 -15
  121. package/components/Toolbar/toolbar.scss +34 -6
  122. package/components/TreeView/tree-view.css +45 -14
  123. package/components/TreeView/tree-view.scss +32 -1
  124. package/components/Wizard/wizard.css +41 -19
  125. package/components/Wizard/wizard.scss +26 -6
  126. package/components/_index.css +1936 -700
  127. package/components/_index.scss +3 -1
  128. package/docs/components/AboutModalBox/examples/AboutModalBox.md +13 -1
  129. package/docs/components/Accordion/examples/Accordion.md +392 -30
  130. package/docs/components/ActionList/examples/ActionList.md +143 -11
  131. package/docs/components/Alert/examples/Alert.md +678 -54
  132. package/docs/components/Avatar/examples/Avatar.md +4 -4
  133. package/docs/components/BackToTop/examples/BackToTop.md +13 -1
  134. package/docs/components/Banner/examples/Banner.md +65 -5
  135. package/docs/components/Brand/examples/Brand.md +2 -2
  136. package/docs/components/Breadcrumb/examples/Breadcrumb.md +299 -24
  137. package/docs/components/Button/examples/Button.md +2362 -163
  138. package/docs/components/CalendarMonth/examples/CalendarMonth.md +104 -8
  139. package/docs/components/Card/examples/Card.md +207 -4
  140. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +286 -22
  141. package/docs/components/CodeBlock/examples/CodeBlock.md +104 -8
  142. package/docs/components/CodeEditor/examples/CodeEditor.md +195 -15
  143. package/docs/components/Compass/examples/Compass.css +17 -0
  144. package/docs/components/Compass/examples/Compass.md +119 -0
  145. package/docs/components/DataList/examples/DataList.md +406 -205
  146. package/docs/components/DatePicker/examples/DatePicker.md +78 -6
  147. package/docs/components/DescriptionList/examples/DescriptionList.md +327 -27
  148. package/docs/components/Divider/examples/Divider.md +2 -2
  149. package/docs/components/DragDrop/examples/DragDrop.css +1 -1
  150. package/docs/components/Drawer/examples/Drawer.md +355 -35
  151. package/docs/components/DualListSelector/examples/DualListSelector.md +1013 -143
  152. package/docs/components/ExpandableSection/examples/ExpandableSection.md +91 -7
  153. package/docs/components/Form/examples/Form.md +78 -6
  154. package/docs/components/Hero/examples/Hero.md +25 -0
  155. package/docs/components/Icon/examples/Icon.md +92 -8
  156. package/docs/components/InlineEdit/examples/InlineEdit.md +312 -24
  157. package/docs/components/InputGroup/examples/InputGroup.md +27 -3
  158. package/docs/components/JumpLinks/examples/JumpLinks.md +54 -6
  159. package/docs/components/Label/examples/Label.md +2834 -218
  160. package/docs/components/Login/examples/Login.md +26 -2
  161. package/docs/components/Masthead/examples/masthead.md +80 -1
  162. package/docs/components/Menu/examples/Menu.md +1458 -116
  163. package/docs/components/MenuToggle/examples/MenuToggle.md +14 -5
  164. package/docs/components/ModalBox/examples/ModalBox.md +289 -25
  165. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +156 -12
  166. package/docs/components/Nav/examples/Navigation.md +798 -58
  167. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +598 -46
  168. package/docs/components/OverflowMenu/examples/overflow-menu.md +78 -6
  169. package/docs/components/Page/examples/Page.md +72 -11
  170. package/docs/components/Pagination/examples/Pagination.md +627 -64
  171. package/docs/components/Panel/examples/Panel.md +12 -0
  172. package/docs/components/Popover/examples/Popover.md +286 -22
  173. package/docs/components/Progress/examples/Progress.md +91 -7
  174. package/docs/components/ProgressStepper/examples/ProgressStepper.md +275 -23
  175. package/docs/components/Sidebar/examples/Sidebar.md +1 -1
  176. package/docs/components/Slider/examples/Slider.md +52 -4
  177. package/docs/components/Table/examples/Table.md +876 -70
  178. package/docs/components/Tabs/examples/Tabs.md +5908 -457
  179. package/docs/components/TextInputGroup/examples/TextInputGroup.md +600 -48
  180. package/docs/components/ToggleGroup/examples/toggle-group.md +195 -15
  181. package/docs/components/Toolbar/examples/Toolbar.md +490 -44
  182. package/docs/components/TreeView/examples/TreeView.md +1390 -130
  183. package/docs/components/Wizard/examples/Wizard.md +815 -72
  184. package/docs/demos/AboutModal/examples/AboutModal.md +98 -47
  185. package/docs/demos/Alert/examples/Alert.md +359 -146
  186. package/docs/demos/BackToTop/examples/BackToTop.md +98 -47
  187. package/docs/demos/Banner/examples/Banner.md +170 -92
  188. package/docs/demos/Button/examples/Button.md +13 -1
  189. package/docs/demos/Card/examples/Card.md +963 -128
  190. package/docs/demos/CardView/examples/CardView.md +435 -252
  191. package/docs/demos/Compass/examples/Compass.md +5930 -0
  192. package/docs/demos/Dashboard/examples/Dashboard.md +648 -164
  193. package/docs/demos/DataList/examples/DataList.md +730 -225
  194. package/docs/demos/DescriptionList/examples/DescriptionList.md +279 -141
  195. package/docs/demos/Drawer/examples/Drawer.md +421 -235
  196. package/docs/demos/Form/examples/BasicForms.md +273 -21
  197. package/docs/demos/JumpLinks/examples/JumpLinks.md +518 -287
  198. package/docs/demos/Masthead/examples/Masthead.md +787 -451
  199. package/docs/demos/Modal/examples/Modal.md +588 -285
  200. package/docs/demos/Nav/examples/Nav.md +2913 -493
  201. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +1273 -310
  202. package/docs/demos/Page/examples/Page.md +1236 -689
  203. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -1
  204. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +52 -4
  205. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +978 -385
  206. package/docs/demos/Skeleton/examples/Skeleton.md +85 -46
  207. package/docs/demos/Table/examples/Table.md +4531 -838
  208. package/docs/demos/Tabs/examples/Tabs.md +653 -293
  209. package/docs/demos/Toolbar/examples/Toolbar.md +584 -136
  210. package/docs/demos/Wizard/examples/Wizard.md +1165 -472
  211. package/docs/layouts/Bullseye/examples/Bullseye.css +2 -2
  212. package/docs/layouts/Bullseye/examples/Bullseye.md +2 -1
  213. package/docs/layouts/Flex/examples/Flex.css +3 -3
  214. package/docs/layouts/Flex/examples/Flex.md +3 -2
  215. package/docs/layouts/Gallery/examples/Gallery.css +2 -2
  216. package/docs/layouts/Gallery/examples/Gallery.md +4 -3
  217. package/docs/layouts/Grid/examples/Grid.css +1 -1
  218. package/docs/layouts/Grid/examples/Grid.md +6 -5
  219. package/docs/layouts/Level/examples/Level.css +3 -3
  220. package/docs/layouts/Level/examples/Level.md +2 -1
  221. package/docs/layouts/Split/examples/Split.css +1 -1
  222. package/docs/layouts/Split/examples/Split.md +2 -1
  223. package/docs/layouts/Stack/examples/Stack.css +3 -3
  224. package/docs/layouts/Stack/examples/Stack.md +2 -1
  225. package/docs/utilities/Accessibility/examples/Accessibility.md +3 -2
  226. package/docs/utilities/Alignment/examples/Alignment.css +4 -4
  227. package/docs/utilities/Alignment/examples/Alignment.md +3 -2
  228. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +5 -4
  229. package/docs/utilities/BoxShadow/examples/box-shadow.css +2 -2
  230. package/docs/utilities/BoxShadow/examples/box-shadow.md +2 -1
  231. package/docs/utilities/Display/examples/Display.css +1 -1
  232. package/docs/utilities/Display/examples/Display.md +3 -2
  233. package/docs/utilities/Flex/examples/Flex.css +7 -7
  234. package/docs/utilities/Flex/examples/Flex.md +3 -2
  235. package/docs/utilities/Float/examples/Float.css +2 -2
  236. package/docs/utilities/Float/examples/Float.md +3 -2
  237. package/docs/utilities/Sizing/examples/Sizing.md +8 -7
  238. package/docs/utilities/Spacing/examples/Spacing.css +2 -2
  239. package/docs/utilities/Spacing/examples/Spacing.md +3 -2
  240. package/docs/utilities/Text/examples/Text.md +5 -4
  241. package/icons/PfIcons/add-circle-o.svg +4 -0
  242. package/icons/PfIcons/ansible-tower.svg +4 -0
  243. package/icons/PfIcons/applications.svg +4 -0
  244. package/icons/PfIcons/arrow.svg +4 -0
  245. package/icons/PfIcons/asleep.svg +4 -0
  246. package/icons/PfIcons/attention-bell.svg +4 -0
  247. package/icons/PfIcons/automation.svg +4 -0
  248. package/icons/PfIcons/bell.svg +4 -0
  249. package/icons/PfIcons/blueprint.svg +4 -0
  250. package/icons/PfIcons/build.svg +4 -0
  251. package/icons/PfIcons/builder-image.svg +4 -0
  252. package/icons/PfIcons/bundle.svg +4 -0
  253. package/icons/PfIcons/catalog.svg +4 -0
  254. package/icons/PfIcons/chat.svg +4 -0
  255. package/icons/PfIcons/close.svg +4 -0
  256. package/icons/PfIcons/cloud-security.svg +4 -0
  257. package/icons/PfIcons/cloud-tenant.svg +4 -0
  258. package/icons/PfIcons/cluster.svg +4 -0
  259. package/icons/PfIcons/connected.svg +4 -0
  260. package/icons/PfIcons/container-node.svg +4 -0
  261. package/icons/PfIcons/cpu.svg +4 -0
  262. package/icons/PfIcons/critical-risk.svg +4 -0
  263. package/icons/PfIcons/data-processor.svg +4 -0
  264. package/icons/PfIcons/data-sink.svg +4 -0
  265. package/icons/PfIcons/data-source.svg +4 -0
  266. package/icons/PfIcons/degraded.svg +4 -0
  267. package/icons/PfIcons/disconnected.svg +4 -0
  268. package/icons/PfIcons/domain.svg +4 -0
  269. package/icons/PfIcons/edit.svg +4 -0
  270. package/icons/PfIcons/enhancement.svg +4 -0
  271. package/icons/PfIcons/enterprise.svg +4 -0
  272. package/icons/PfIcons/equalizer.svg +4 -0
  273. package/icons/PfIcons/error-circle-o.svg +4 -0
  274. package/icons/PfIcons/export.svg +4 -0
  275. package/icons/PfIcons/filter.svg +4 -0
  276. package/icons/PfIcons/flavor.svg +4 -0
  277. package/icons/PfIcons/folder-close.svg +4 -0
  278. package/icons/PfIcons/folder-open.svg +4 -0
  279. package/icons/PfIcons/globe-route.svg +4 -0
  280. package/icons/PfIcons/help.svg +4 -0
  281. package/icons/PfIcons/history.svg +4 -0
  282. package/icons/PfIcons/home.svg +4 -0
  283. package/icons/PfIcons/import.svg +4 -0
  284. package/icons/PfIcons/in-progress.svg +4 -0
  285. package/icons/PfIcons/info.svg +4 -0
  286. package/icons/PfIcons/infrastructure.svg +4 -0
  287. package/icons/PfIcons/integration.svg +4 -0
  288. package/icons/PfIcons/key.svg +4 -0
  289. package/icons/PfIcons/locked.svg +4 -0
  290. package/icons/PfIcons/maintenance.svg +4 -0
  291. package/icons/PfIcons/memory.svg +4 -0
  292. package/icons/PfIcons/messages.svg +4 -0
  293. package/icons/PfIcons/middleware.svg +4 -0
  294. package/icons/PfIcons/migration.svg +4 -0
  295. package/icons/PfIcons/module.svg +4 -0
  296. package/icons/PfIcons/monitoring.svg +4 -0
  297. package/icons/PfIcons/multicluster.svg +4 -0
  298. package/icons/PfIcons/namespaces.svg +4 -0
  299. package/icons/PfIcons/network.svg +4 -0
  300. package/icons/PfIcons/new-process.svg +4 -0
  301. package/icons/PfIcons/not-started.svg +4 -0
  302. package/icons/PfIcons/off.svg +4 -0
  303. package/icons/PfIcons/ok.svg +4 -0
  304. package/icons/PfIcons/on-running.svg +4 -0
  305. package/icons/PfIcons/on.svg +4 -0
  306. package/icons/PfIcons/open-drawer-right.svg +4 -0
  307. package/icons/PfIcons/openshift.svg +4 -0
  308. package/icons/PfIcons/openstack.svg +4 -0
  309. package/icons/PfIcons/optimize.svg +4 -0
  310. package/icons/PfIcons/orders.svg +4 -0
  311. package/icons/PfIcons/os-image.svg +4 -0
  312. package/icons/PfIcons/package.svg +4 -0
  313. package/icons/PfIcons/panel-close.svg +4 -0
  314. package/icons/PfIcons/panel-open.svg +4 -0
  315. package/icons/PfIcons/paused.svg +4 -0
  316. package/icons/PfIcons/pending.svg +4 -0
  317. package/icons/PfIcons/pficon-dragdrop.svg +4 -0
  318. package/icons/PfIcons/pficon-history.svg +4 -0
  319. package/icons/PfIcons/pficon-network-range.svg +4 -0
  320. package/icons/PfIcons/pficon-satellite.svg +4 -0
  321. package/icons/PfIcons/pficon-sort-common-asc.svg +4 -0
  322. package/icons/PfIcons/pficon-sort-common-desc.svg +4 -0
  323. package/icons/PfIcons/pficon-template.svg +4 -0
  324. package/icons/PfIcons/pficon-vcenter.svg +4 -0
  325. package/icons/PfIcons/plugged.svg +4 -0
  326. package/icons/PfIcons/port.svg +4 -0
  327. package/icons/PfIcons/print.svg +4 -0
  328. package/icons/PfIcons/private.svg +4 -0
  329. package/icons/PfIcons/process-automation.svg +4 -0
  330. package/icons/PfIcons/project.svg +4 -0
  331. package/icons/PfIcons/rebalance.svg +4 -0
  332. package/icons/PfIcons/rebooting.svg +4 -0
  333. package/icons/PfIcons/regions.svg +4 -0
  334. package/icons/PfIcons/registry.svg +4 -0
  335. package/icons/PfIcons/remove2.svg +4 -0
  336. package/icons/PfIcons/replicator.svg +4 -0
  337. package/icons/PfIcons/repository.svg +4 -0
  338. package/icons/PfIcons/resource-pool.svg +4 -0
  339. package/icons/PfIcons/resources-almost-empty.svg +4 -0
  340. package/icons/PfIcons/resources-almost-full.svg +4 -0
  341. package/icons/PfIcons/resources-empty.svg +4 -0
  342. package/icons/PfIcons/resources-full.svg +4 -0
  343. package/icons/PfIcons/running.svg +4 -0
  344. package/icons/PfIcons/save.svg +4 -0
  345. package/icons/PfIcons/screen.svg +4 -0
  346. package/icons/PfIcons/security.svg +4 -0
  347. package/icons/PfIcons/server-group.svg +4 -0
  348. package/icons/PfIcons/server.svg +4 -0
  349. package/icons/PfIcons/service-catalog.svg +4 -0
  350. package/icons/PfIcons/service.svg +4 -0
  351. package/icons/PfIcons/services.svg +4 -0
  352. package/icons/PfIcons/severity-critical.svg +4 -0
  353. package/icons/PfIcons/severity-important.svg +4 -0
  354. package/icons/PfIcons/severity-minor.svg +4 -0
  355. package/icons/PfIcons/severity-moderate.svg +4 -0
  356. package/icons/PfIcons/severity-none.svg +4 -0
  357. package/icons/PfIcons/severity-undefined.svg +4 -0
  358. package/icons/PfIcons/spinner.svg +4 -0
  359. package/icons/PfIcons/spinner2.svg +4 -0
  360. package/icons/PfIcons/storage-domain.svg +4 -0
  361. package/icons/PfIcons/task.svg +4 -0
  362. package/icons/PfIcons/tenant.svg +4 -0
  363. package/icons/PfIcons/thumb-tack.svg +4 -0
  364. package/icons/PfIcons/topology.svg +4 -0
  365. package/icons/PfIcons/treeview.svg +4 -0
  366. package/icons/PfIcons/trend-down.svg +4 -0
  367. package/icons/PfIcons/trend-up.svg +4 -0
  368. package/icons/PfIcons/unknown.svg +4 -0
  369. package/icons/PfIcons/unlocked.svg +4 -0
  370. package/icons/PfIcons/unplugged.svg +4 -0
  371. package/icons/PfIcons/user.svg +4 -0
  372. package/icons/PfIcons/users.svg +4 -0
  373. package/icons/PfIcons/virtual-machine.svg +4 -0
  374. package/icons/PfIcons/volume.svg +4 -0
  375. package/icons/PfIcons/warning-triangle.svg +4 -0
  376. package/icons/PfIcons/zone.svg +4 -0
  377. package/layouts/Flex/flex.scss +83 -19
  378. package/layouts/Gallery/gallery.css +6 -2
  379. package/layouts/_index.css +6 -2
  380. package/package.json +34 -16
  381. package/patternfly-base-no-globals.css +965 -491
  382. package/patternfly-base.css +972 -491
  383. package/patternfly-charts.css +3 -3
  384. package/patternfly-no-globals.css +2801 -1070
  385. package/patternfly.css +2808 -1070
  386. package/patternfly.min.css +1 -1
  387. package/patternfly.min.css.map +1 -1
  388. package/patternfly.scss +27 -0
  389. package/sass-utilities/functions.scss +32 -25
  390. package/sass-utilities/mixins.scss +36 -20
  391. package/sass-utilities/namespaces-components.scss +6 -0
  392. package/sass-utilities/scss-variables.scss +3 -0
package/docs/demos/DataList/examples/DataList.md CHANGED
@@ -16,7 +16,8 @@ wrapperTag: div
16
16
  <span class="pf-v6-c-button__text">Skip to content</span>
17
17
  </a>
18
18
  </div>
19
- <header class="pf-v6-c-masthead" id="data-list-basic-example-masthead">
19
+
20
+ <header class="pf-v6-c-masthead" id="data-list-basic-example-docked">
20
21
  <div class="pf-v6-c-masthead__main">
21
22
  <span class="pf-v6-c-masthead__toggle">
22
23
  <button
@@ -58,7 +59,7 @@ wrapperTag: div
58
59
  y1="2.25860997e-13%"
59
60
  x2="32%"
60
61
  y2="100%"
61
- id="linearGradient-data-list-basic-example-masthead"
62
+ id="linearGradient-data-list-basic-example-docked"
62
63
  >
63
64
  <stop stop-color="#2B9AF3" offset="0%" />
64
65
  <stop
@@ -112,11 +113,11 @@ wrapperTag: div
112
113
  />
113
114
  <path
114
115
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
115
- fill="url(#linearGradient-data-list-basic-example-masthead)"
116
+ fill="url(#linearGradient-data-list-basic-example-docked)"
116
117
  />
117
118
  <path
118
119
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
119
- fill="url(#linearGradient-data-list-basic-example-masthead)"
120
+ fill="url(#linearGradient-data-list-basic-example-docked)"
120
121
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
121
122
  />
122
123
  </g>
@@ -128,7 +129,7 @@ wrapperTag: div
128
129
  <div class="pf-v6-c-masthead__content">
129
130
  <div
130
131
  class="pf-v6-c-toolbar pf-m-static"
131
- id="data-list-basic-example-masthead-toolbar"
132
+ id="data-list-basic-example-docked-toolbar"
132
133
  >
133
134
  <div class="pf-v6-c-toolbar__content">
134
135
  <div class="pf-v6-c-toolbar__content-section">
@@ -195,44 +196,46 @@ wrapperTag: div
195
196
  </div>
196
197
  </header>
197
198
  <div class="pf-v6-c-page__sidebar">
198
- <div class="pf-v6-c-page__sidebar-body">
199
- <nav
200
- class="pf-v6-c-nav"
201
- id="data-list-basic-example-primary-nav"
202
- aria-label="Global"
203
- >
204
- <ul class="pf-v6-c-nav__list" role="list">
205
- <li class="pf-v6-c-nav__item">
206
- <a href="#" class="pf-v6-c-nav__link">
207
- <span class="pf-v6-c-nav__link-text">System panel</span>
208
- </a>
209
- </li>
210
- <li class="pf-v6-c-nav__item">
211
- <a
212
- href="#"
213
- class="pf-v6-c-nav__link pf-m-current"
214
- aria-current="page"
215
- >
216
- <span class="pf-v6-c-nav__link-text">Policy</span>
217
- </a>
218
- </li>
219
- <li class="pf-v6-c-nav__item">
220
- <a href="#" class="pf-v6-c-nav__link">
221
- <span class="pf-v6-c-nav__link-text">Authentication</span>
222
- </a>
223
- </li>
224
- <li class="pf-v6-c-nav__item">
225
- <a href="#" class="pf-v6-c-nav__link">
226
- <span class="pf-v6-c-nav__link-text">Network services</span>
227
- </a>
228
- </li>
229
- <li class="pf-v6-c-nav__item">
230
- <a href="#" class="pf-v6-c-nav__link">
231
- <span class="pf-v6-c-nav__link-text">Server</span>
232
- </a>
233
- </li>
234
- </ul>
235
- </nav>
199
+ <div class="pf-v6-c-page__sidebar-main">
200
+ <div class="pf-v6-c-page__sidebar-body">
201
+ <nav
202
+ class="pf-v6-c-nav"
203
+ id="data-list-basic-example-primary-nav"
204
+ aria-label="Global"
205
+ >
206
+ <ul class="pf-v6-c-nav__list" role="list">
207
+ <li class="pf-v6-c-nav__item">
208
+ <a href="#" class="pf-v6-c-nav__link">
209
+ <span class="pf-v6-c-nav__link-text">System panel</span>
210
+ </a>
211
+ </li>
212
+ <li class="pf-v6-c-nav__item">
213
+ <a
214
+ href="#"
215
+ class="pf-v6-c-nav__link pf-m-current"
216
+ aria-current="page"
217
+ >
218
+ <span class="pf-v6-c-nav__link-text">Policy</span>
219
+ </a>
220
+ </li>
221
+ <li class="pf-v6-c-nav__item">
222
+ <a href="#" class="pf-v6-c-nav__link">
223
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
224
+ </a>
225
+ </li>
226
+ <li class="pf-v6-c-nav__item">
227
+ <a href="#" class="pf-v6-c-nav__link">
228
+ <span class="pf-v6-c-nav__link-text">Network services</span>
229
+ </a>
230
+ </li>
231
+ <li class="pf-v6-c-nav__item">
232
+ <a href="#" class="pf-v6-c-nav__link">
233
+ <span class="pf-v6-c-nav__link-text">Server</span>
234
+ </a>
235
+ </li>
236
+ </ul>
237
+ </nav>
238
+ </div>
236
239
  </div>
237
240
  </div>
238
241
  <div class="pf-v6-c-page__main-container" tabindex="-1">
@@ -250,21 +253,57 @@ wrapperTag: div
250
253
  </li>
251
254
  <li class="pf-v6-c-breadcrumb__item">
252
255
  <span class="pf-v6-c-breadcrumb__item-divider">
253
- <i class="fas fa-angle-right" aria-hidden="true"></i>
256
+ <svg
257
+ class="pf-v6-svg"
258
+ viewBox="0 0 20 20"
259
+ fill="currentColor"
260
+ aria-hidden="true"
261
+ role="img"
262
+ width="1em"
263
+ height="1em"
264
+ >
265
+ <path
266
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
267
+ />
268
+ </svg>
254
269
  </span>
255
270
 
256
271
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
257
272
  </li>
258
273
  <li class="pf-v6-c-breadcrumb__item">
259
274
  <span class="pf-v6-c-breadcrumb__item-divider">
260
- <i class="fas fa-angle-right" aria-hidden="true"></i>
275
+ <svg
276
+ class="pf-v6-svg"
277
+ viewBox="0 0 20 20"
278
+ fill="currentColor"
279
+ aria-hidden="true"
280
+ role="img"
281
+ width="1em"
282
+ height="1em"
283
+ >
284
+ <path
285
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
286
+ />
287
+ </svg>
261
288
  </span>
262
289
 
263
290
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
264
291
  </li>
265
292
  <li class="pf-v6-c-breadcrumb__item">
266
293
  <span class="pf-v6-c-breadcrumb__item-divider">
267
- <i class="fas fa-angle-right" aria-hidden="true"></i>
294
+ <svg
295
+ class="pf-v6-svg"
296
+ viewBox="0 0 20 20"
297
+ fill="currentColor"
298
+ aria-hidden="true"
299
+ role="img"
300
+ width="1em"
301
+ height="1em"
302
+ >
303
+ <path
304
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
305
+ />
306
+ </svg>
268
307
  </span>
269
308
 
270
309
  <a
@@ -361,7 +400,6 @@ wrapperTag: div
361
400
  class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
362
401
  type="button"
363
402
  aria-expanded="false"
364
- aria-label="Menu toggle"
365
403
  id="data-list-basic-example-toolbar-top-pagination"
366
404
  >
367
405
  <span class="pf-v6-c-menu-toggle__text">
@@ -390,7 +428,19 @@ wrapperTag: div
390
428
  aria-label="Go to previous page"
391
429
  >
392
430
  <span class="pf-v6-c-button__icon">
393
- <i class="fas fa-angle-left" aria-hidden="true"></i>
431
+ <svg
432
+ class="pf-v6-svg"
433
+ viewBox="0 0 256 512"
434
+ fill="currentColor"
435
+ aria-hidden="true"
436
+ role="img"
437
+ width="1em"
438
+ height="1em"
439
+ >
440
+ <path
441
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
442
+ />
443
+ </svg>
394
444
  </span>
395
445
  </button>
396
446
  </div>
@@ -401,7 +451,19 @@ wrapperTag: div
401
451
  aria-label="Go to next page"
402
452
  >
403
453
  <span class="pf-v6-c-button__icon">
404
- <i class="fas fa-angle-right" aria-hidden="true"></i>
454
+ <svg
455
+ class="pf-v6-svg"
456
+ viewBox="0 0 256 512"
457
+ fill="currentColor"
458
+ aria-hidden="true"
459
+ role="img"
460
+ width="1em"
461
+ height="1em"
462
+ >
463
+ <path
464
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
465
+ />
466
+ </svg>
405
467
  </span>
406
468
  </button>
407
469
  </div>
@@ -865,7 +927,6 @@ wrapperTag: div
865
927
  class="pf-v6-c-menu-toggle pf-m-top pf-m-text pf-m-plain"
866
928
  type="button"
867
929
  aria-expanded="false"
868
- aria-label="Menu toggle"
869
930
  id="{{page--id}}-pagination-menu-toggle-bottom-example"
870
931
  >
871
932
  <span class="pf-v6-c-menu-toggle__text">
@@ -888,7 +949,19 @@ wrapperTag: div
888
949
  aria-label="Go to first page"
889
950
  >
890
951
  <span class="pf-v6-c-button__icon">
891
- <i class="fas fa-angle-double-left" aria-hidden="true"></i>
952
+ <svg
953
+ class="pf-v6-svg"
954
+ viewBox="0 0 448 512"
955
+ fill="currentColor"
956
+ aria-hidden="true"
957
+ role="img"
958
+ width="1em"
959
+ height="1em"
960
+ >
961
+ <path
962
+ d="M223.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L319.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L393.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34zm-192 34l136 136c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9L127.9 256l96.4-96.4c9.4-9.4 9.4-24.6 0-33.9L201.7 103c-9.4-9.4-24.6-9.4-33.9 0l-136 136c-9.5 9.4-9.5 24.6-.1 34z"
963
+ />
964
+ </svg>
892
965
  </span>
893
966
  </button>
894
967
  </div>
@@ -900,7 +973,19 @@ wrapperTag: div
900
973
  aria-label="Go to previous page"
901
974
  >
902
975
  <span class="pf-v6-c-button__icon">
903
- <i class="fas fa-angle-left" aria-hidden="true"></i>
976
+ <svg
977
+ class="pf-v6-svg"
978
+ viewBox="0 0 256 512"
979
+ fill="currentColor"
980
+ aria-hidden="true"
981
+ role="img"
982
+ width="1em"
983
+ height="1em"
984
+ >
985
+ <path
986
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
987
+ />
988
+ </svg>
904
989
  </span>
905
990
  </button>
906
991
  </div>
@@ -923,7 +1008,19 @@ wrapperTag: div
923
1008
  aria-label="Go to next page"
924
1009
  >
925
1010
  <span class="pf-v6-c-button__icon">
926
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1011
+ <svg
1012
+ class="pf-v6-svg"
1013
+ viewBox="0 0 256 512"
1014
+ fill="currentColor"
1015
+ aria-hidden="true"
1016
+ role="img"
1017
+ width="1em"
1018
+ height="1em"
1019
+ >
1020
+ <path
1021
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
1022
+ />
1023
+ </svg>
927
1024
  </span>
928
1025
  </button>
929
1026
  </div>
@@ -935,7 +1032,19 @@ wrapperTag: div
935
1032
  aria-label="Go to last page"
936
1033
  >
937
1034
  <span class="pf-v6-c-button__icon">
938
- <i class="fas fa-angle-double-right" aria-hidden="true"></i>
1035
+ <svg
1036
+ class="pf-v6-svg"
1037
+ viewBox="0 0 448 512"
1038
+ fill="currentColor"
1039
+ aria-hidden="true"
1040
+ role="img"
1041
+ width="1em"
1042
+ height="1em"
1043
+ >
1044
+ <path
1045
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34zm192-34l-136-136c-9.4-9.4-24.6-9.4-33.9 0l-22.6 22.6c-9.4 9.4-9.4 24.6 0 33.9l96.4 96.4-96.4 96.4c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l136-136c9.4-9.2 9.4-24.4 0-33.8z"
1046
+ />
1047
+ </svg>
939
1048
  </span>
940
1049
  </button>
941
1050
  </div>
@@ -961,7 +1070,8 @@ wrapperTag: div
961
1070
  <span class="pf-v6-c-button__text">Skip to content</span>
962
1071
  </a>
963
1072
  </div>
964
- <header class="pf-v6-c-masthead" id="data-list-actionable-example-masthead">
1073
+
1074
+ <header class="pf-v6-c-masthead" id="data-list-actionable-example-docked">
965
1075
  <div class="pf-v6-c-masthead__main">
966
1076
  <span class="pf-v6-c-masthead__toggle">
967
1077
  <button
@@ -1003,7 +1113,7 @@ wrapperTag: div
1003
1113
  y1="2.25860997e-13%"
1004
1114
  x2="32%"
1005
1115
  y2="100%"
1006
- id="linearGradient-data-list-actionable-example-masthead"
1116
+ id="linearGradient-data-list-actionable-example-docked"
1007
1117
  >
1008
1118
  <stop stop-color="#2B9AF3" offset="0%" />
1009
1119
  <stop
@@ -1057,11 +1167,11 @@ wrapperTag: div
1057
1167
  />
1058
1168
  <path
1059
1169
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
1060
- fill="url(#linearGradient-data-list-actionable-example-masthead)"
1170
+ fill="url(#linearGradient-data-list-actionable-example-docked)"
1061
1171
  />
1062
1172
  <path
1063
1173
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
1064
- fill="url(#linearGradient-data-list-actionable-example-masthead)"
1174
+ fill="url(#linearGradient-data-list-actionable-example-docked)"
1065
1175
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
1066
1176
  />
1067
1177
  </g>
@@ -1073,7 +1183,7 @@ wrapperTag: div
1073
1183
  <div class="pf-v6-c-masthead__content">
1074
1184
  <div
1075
1185
  class="pf-v6-c-toolbar pf-m-static"
1076
- id="data-list-actionable-example-masthead-toolbar"
1186
+ id="data-list-actionable-example-docked-toolbar"
1077
1187
  >
1078
1188
  <div class="pf-v6-c-toolbar__content">
1079
1189
  <div class="pf-v6-c-toolbar__content-section">
@@ -1140,44 +1250,46 @@ wrapperTag: div
1140
1250
  </div>
1141
1251
  </header>
1142
1252
  <div class="pf-v6-c-page__sidebar">
1143
- <div class="pf-v6-c-page__sidebar-body">
1144
- <nav
1145
- class="pf-v6-c-nav"
1146
- id="data-list-actionable-example-primary-nav"
1147
- aria-label="Global"
1148
- >
1149
- <ul class="pf-v6-c-nav__list" role="list">
1150
- <li class="pf-v6-c-nav__item">
1151
- <a href="#" class="pf-v6-c-nav__link">
1152
- <span class="pf-v6-c-nav__link-text">System panel</span>
1153
- </a>
1154
- </li>
1155
- <li class="pf-v6-c-nav__item">
1156
- <a
1157
- href="#"
1158
- class="pf-v6-c-nav__link pf-m-current"
1159
- aria-current="page"
1160
- >
1161
- <span class="pf-v6-c-nav__link-text">Policy</span>
1162
- </a>
1163
- </li>
1164
- <li class="pf-v6-c-nav__item">
1165
- <a href="#" class="pf-v6-c-nav__link">
1166
- <span class="pf-v6-c-nav__link-text">Authentication</span>
1167
- </a>
1168
- </li>
1169
- <li class="pf-v6-c-nav__item">
1170
- <a href="#" class="pf-v6-c-nav__link">
1171
- <span class="pf-v6-c-nav__link-text">Network services</span>
1172
- </a>
1173
- </li>
1174
- <li class="pf-v6-c-nav__item">
1175
- <a href="#" class="pf-v6-c-nav__link">
1176
- <span class="pf-v6-c-nav__link-text">Server</span>
1177
- </a>
1178
- </li>
1179
- </ul>
1180
- </nav>
1253
+ <div class="pf-v6-c-page__sidebar-main">
1254
+ <div class="pf-v6-c-page__sidebar-body">
1255
+ <nav
1256
+ class="pf-v6-c-nav"
1257
+ id="data-list-actionable-example-primary-nav"
1258
+ aria-label="Global"
1259
+ >
1260
+ <ul class="pf-v6-c-nav__list" role="list">
1261
+ <li class="pf-v6-c-nav__item">
1262
+ <a href="#" class="pf-v6-c-nav__link">
1263
+ <span class="pf-v6-c-nav__link-text">System panel</span>
1264
+ </a>
1265
+ </li>
1266
+ <li class="pf-v6-c-nav__item">
1267
+ <a
1268
+ href="#"
1269
+ class="pf-v6-c-nav__link pf-m-current"
1270
+ aria-current="page"
1271
+ >
1272
+ <span class="pf-v6-c-nav__link-text">Policy</span>
1273
+ </a>
1274
+ </li>
1275
+ <li class="pf-v6-c-nav__item">
1276
+ <a href="#" class="pf-v6-c-nav__link">
1277
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
1278
+ </a>
1279
+ </li>
1280
+ <li class="pf-v6-c-nav__item">
1281
+ <a href="#" class="pf-v6-c-nav__link">
1282
+ <span class="pf-v6-c-nav__link-text">Network services</span>
1283
+ </a>
1284
+ </li>
1285
+ <li class="pf-v6-c-nav__item">
1286
+ <a href="#" class="pf-v6-c-nav__link">
1287
+ <span class="pf-v6-c-nav__link-text">Server</span>
1288
+ </a>
1289
+ </li>
1290
+ </ul>
1291
+ </nav>
1292
+ </div>
1181
1293
  </div>
1182
1294
  </div>
1183
1295
  <div class="pf-v6-c-page__main-container" tabindex="-1">
@@ -1195,21 +1307,57 @@ wrapperTag: div
1195
1307
  </li>
1196
1308
  <li class="pf-v6-c-breadcrumb__item">
1197
1309
  <span class="pf-v6-c-breadcrumb__item-divider">
1198
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1310
+ <svg
1311
+ class="pf-v6-svg"
1312
+ viewBox="0 0 20 20"
1313
+ fill="currentColor"
1314
+ aria-hidden="true"
1315
+ role="img"
1316
+ width="1em"
1317
+ height="1em"
1318
+ >
1319
+ <path
1320
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
1321
+ />
1322
+ </svg>
1199
1323
  </span>
1200
1324
 
1201
1325
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
1202
1326
  </li>
1203
1327
  <li class="pf-v6-c-breadcrumb__item">
1204
1328
  <span class="pf-v6-c-breadcrumb__item-divider">
1205
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1329
+ <svg
1330
+ class="pf-v6-svg"
1331
+ viewBox="0 0 20 20"
1332
+ fill="currentColor"
1333
+ aria-hidden="true"
1334
+ role="img"
1335
+ width="1em"
1336
+ height="1em"
1337
+ >
1338
+ <path
1339
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
1340
+ />
1341
+ </svg>
1206
1342
  </span>
1207
1343
 
1208
1344
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
1209
1345
  </li>
1210
1346
  <li class="pf-v6-c-breadcrumb__item">
1211
1347
  <span class="pf-v6-c-breadcrumb__item-divider">
1212
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1348
+ <svg
1349
+ class="pf-v6-svg"
1350
+ viewBox="0 0 20 20"
1351
+ fill="currentColor"
1352
+ aria-hidden="true"
1353
+ role="img"
1354
+ width="1em"
1355
+ height="1em"
1356
+ >
1357
+ <path
1358
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
1359
+ />
1360
+ </svg>
1213
1361
  </span>
1214
1362
 
1215
1363
  <a
@@ -1338,7 +1486,6 @@ wrapperTag: div
1338
1486
  class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
1339
1487
  type="button"
1340
1488
  aria-expanded="false"
1341
- aria-label="Menu toggle"
1342
1489
  id="data-list-actionable-example-toolbar-top-pagination"
1343
1490
  >
1344
1491
  <span class="pf-v6-c-menu-toggle__text">
@@ -1367,7 +1514,19 @@ wrapperTag: div
1367
1514
  aria-label="Go to previous page"
1368
1515
  >
1369
1516
  <span class="pf-v6-c-button__icon">
1370
- <i class="fas fa-angle-left" aria-hidden="true"></i>
1517
+ <svg
1518
+ class="pf-v6-svg"
1519
+ viewBox="0 0 256 512"
1520
+ fill="currentColor"
1521
+ aria-hidden="true"
1522
+ role="img"
1523
+ width="1em"
1524
+ height="1em"
1525
+ >
1526
+ <path
1527
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
1528
+ />
1529
+ </svg>
1371
1530
  </span>
1372
1531
  </button>
1373
1532
  </div>
@@ -1378,7 +1537,19 @@ wrapperTag: div
1378
1537
  aria-label="Go to next page"
1379
1538
  >
1380
1539
  <span class="pf-v6-c-button__icon">
1381
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1540
+ <svg
1541
+ class="pf-v6-svg"
1542
+ viewBox="0 0 256 512"
1543
+ fill="currentColor"
1544
+ aria-hidden="true"
1545
+ role="img"
1546
+ width="1em"
1547
+ height="1em"
1548
+ >
1549
+ <path
1550
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
1551
+ />
1552
+ </svg>
1382
1553
  </span>
1383
1554
  </button>
1384
1555
  </div>
@@ -1784,7 +1955,6 @@ wrapperTag: div
1784
1955
  class="pf-v6-c-menu-toggle pf-m-top pf-m-text pf-m-plain"
1785
1956
  type="button"
1786
1957
  aria-expanded="false"
1787
- aria-label="Menu toggle"
1788
1958
  id="{{page--id}}-pagination-menu-toggle-bottom-example"
1789
1959
  >
1790
1960
  <span class="pf-v6-c-menu-toggle__text">
@@ -1807,7 +1977,19 @@ wrapperTag: div
1807
1977
  aria-label="Go to first page"
1808
1978
  >
1809
1979
  <span class="pf-v6-c-button__icon">
1810
- <i class="fas fa-angle-double-left" aria-hidden="true"></i>
1980
+ <svg
1981
+ class="pf-v6-svg"
1982
+ viewBox="0 0 448 512"
1983
+ fill="currentColor"
1984
+ aria-hidden="true"
1985
+ role="img"
1986
+ width="1em"
1987
+ height="1em"
1988
+ >
1989
+ <path
1990
+ d="M223.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L319.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L393.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34zm-192 34l136 136c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9L127.9 256l96.4-96.4c9.4-9.4 9.4-24.6 0-33.9L201.7 103c-9.4-9.4-24.6-9.4-33.9 0l-136 136c-9.5 9.4-9.5 24.6-.1 34z"
1991
+ />
1992
+ </svg>
1811
1993
  </span>
1812
1994
  </button>
1813
1995
  </div>
@@ -1819,7 +2001,19 @@ wrapperTag: div
1819
2001
  aria-label="Go to previous page"
1820
2002
  >
1821
2003
  <span class="pf-v6-c-button__icon">
1822
- <i class="fas fa-angle-left" aria-hidden="true"></i>
2004
+ <svg
2005
+ class="pf-v6-svg"
2006
+ viewBox="0 0 256 512"
2007
+ fill="currentColor"
2008
+ aria-hidden="true"
2009
+ role="img"
2010
+ width="1em"
2011
+ height="1em"
2012
+ >
2013
+ <path
2014
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
2015
+ />
2016
+ </svg>
1823
2017
  </span>
1824
2018
  </button>
1825
2019
  </div>
@@ -1842,7 +2036,19 @@ wrapperTag: div
1842
2036
  aria-label="Go to next page"
1843
2037
  >
1844
2038
  <span class="pf-v6-c-button__icon">
1845
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2039
+ <svg
2040
+ class="pf-v6-svg"
2041
+ viewBox="0 0 256 512"
2042
+ fill="currentColor"
2043
+ aria-hidden="true"
2044
+ role="img"
2045
+ width="1em"
2046
+ height="1em"
2047
+ >
2048
+ <path
2049
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
2050
+ />
2051
+ </svg>
1846
2052
  </span>
1847
2053
  </button>
1848
2054
  </div>
@@ -1854,7 +2060,19 @@ wrapperTag: div
1854
2060
  aria-label="Go to last page"
1855
2061
  >
1856
2062
  <span class="pf-v6-c-button__icon">
1857
- <i class="fas fa-angle-double-right" aria-hidden="true"></i>
2063
+ <svg
2064
+ class="pf-v6-svg"
2065
+ viewBox="0 0 448 512"
2066
+ fill="currentColor"
2067
+ aria-hidden="true"
2068
+ role="img"
2069
+ width="1em"
2070
+ height="1em"
2071
+ >
2072
+ <path
2073
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34zm192-34l-136-136c-9.4-9.4-24.6-9.4-33.9 0l-22.6 22.6c-9.4 9.4-9.4 24.6 0 33.9l96.4 96.4-96.4 96.4c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l136-136c9.4-9.2 9.4-24.4 0-33.8z"
2074
+ />
2075
+ </svg>
1858
2076
  </span>
1859
2077
  </button>
1860
2078
  </div>
@@ -1880,7 +2098,8 @@ wrapperTag: div
1880
2098
  <span class="pf-v6-c-button__text">Skip to content</span>
1881
2099
  </a>
1882
2100
  </div>
1883
- <header class="pf-v6-c-masthead" id="data-list-expandable-example-masthead">
2101
+
2102
+ <header class="pf-v6-c-masthead" id="data-list-expandable-example-docked">
1884
2103
  <div class="pf-v6-c-masthead__main">
1885
2104
  <span class="pf-v6-c-masthead__toggle">
1886
2105
  <button
@@ -1922,7 +2141,7 @@ wrapperTag: div
1922
2141
  y1="2.25860997e-13%"
1923
2142
  x2="32%"
1924
2143
  y2="100%"
1925
- id="linearGradient-data-list-expandable-example-masthead"
2144
+ id="linearGradient-data-list-expandable-example-docked"
1926
2145
  >
1927
2146
  <stop stop-color="#2B9AF3" offset="0%" />
1928
2147
  <stop
@@ -1976,11 +2195,11 @@ wrapperTag: div
1976
2195
  />
1977
2196
  <path
1978
2197
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
1979
- fill="url(#linearGradient-data-list-expandable-example-masthead)"
2198
+ fill="url(#linearGradient-data-list-expandable-example-docked)"
1980
2199
  />
1981
2200
  <path
1982
2201
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
1983
- fill="url(#linearGradient-data-list-expandable-example-masthead)"
2202
+ fill="url(#linearGradient-data-list-expandable-example-docked)"
1984
2203
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
1985
2204
  />
1986
2205
  </g>
@@ -1992,7 +2211,7 @@ wrapperTag: div
1992
2211
  <div class="pf-v6-c-masthead__content">
1993
2212
  <div
1994
2213
  class="pf-v6-c-toolbar pf-m-static"
1995
- id="data-list-expandable-example-masthead-toolbar"
2214
+ id="data-list-expandable-example-docked-toolbar"
1996
2215
  >
1997
2216
  <div class="pf-v6-c-toolbar__content">
1998
2217
  <div class="pf-v6-c-toolbar__content-section">
@@ -2059,44 +2278,46 @@ wrapperTag: div
2059
2278
  </div>
2060
2279
  </header>
2061
2280
  <div class="pf-v6-c-page__sidebar">
2062
- <div class="pf-v6-c-page__sidebar-body">
2063
- <nav
2064
- class="pf-v6-c-nav"
2065
- id="data-list-expandable-example-primary-nav"
2066
- aria-label="Global"
2067
- >
2068
- <ul class="pf-v6-c-nav__list" role="list">
2069
- <li class="pf-v6-c-nav__item">
2070
- <a href="#" class="pf-v6-c-nav__link">
2071
- <span class="pf-v6-c-nav__link-text">System panel</span>
2072
- </a>
2073
- </li>
2074
- <li class="pf-v6-c-nav__item">
2075
- <a
2076
- href="#"
2077
- class="pf-v6-c-nav__link pf-m-current"
2078
- aria-current="page"
2079
- >
2080
- <span class="pf-v6-c-nav__link-text">Policy</span>
2081
- </a>
2082
- </li>
2083
- <li class="pf-v6-c-nav__item">
2084
- <a href="#" class="pf-v6-c-nav__link">
2085
- <span class="pf-v6-c-nav__link-text">Authentication</span>
2086
- </a>
2087
- </li>
2088
- <li class="pf-v6-c-nav__item">
2089
- <a href="#" class="pf-v6-c-nav__link">
2090
- <span class="pf-v6-c-nav__link-text">Network services</span>
2091
- </a>
2092
- </li>
2093
- <li class="pf-v6-c-nav__item">
2094
- <a href="#" class="pf-v6-c-nav__link">
2095
- <span class="pf-v6-c-nav__link-text">Server</span>
2096
- </a>
2097
- </li>
2098
- </ul>
2099
- </nav>
2281
+ <div class="pf-v6-c-page__sidebar-main">
2282
+ <div class="pf-v6-c-page__sidebar-body">
2283
+ <nav
2284
+ class="pf-v6-c-nav"
2285
+ id="data-list-expandable-example-primary-nav"
2286
+ aria-label="Global"
2287
+ >
2288
+ <ul class="pf-v6-c-nav__list" role="list">
2289
+ <li class="pf-v6-c-nav__item">
2290
+ <a href="#" class="pf-v6-c-nav__link">
2291
+ <span class="pf-v6-c-nav__link-text">System panel</span>
2292
+ </a>
2293
+ </li>
2294
+ <li class="pf-v6-c-nav__item">
2295
+ <a
2296
+ href="#"
2297
+ class="pf-v6-c-nav__link pf-m-current"
2298
+ aria-current="page"
2299
+ >
2300
+ <span class="pf-v6-c-nav__link-text">Policy</span>
2301
+ </a>
2302
+ </li>
2303
+ <li class="pf-v6-c-nav__item">
2304
+ <a href="#" class="pf-v6-c-nav__link">
2305
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
2306
+ </a>
2307
+ </li>
2308
+ <li class="pf-v6-c-nav__item">
2309
+ <a href="#" class="pf-v6-c-nav__link">
2310
+ <span class="pf-v6-c-nav__link-text">Network services</span>
2311
+ </a>
2312
+ </li>
2313
+ <li class="pf-v6-c-nav__item">
2314
+ <a href="#" class="pf-v6-c-nav__link">
2315
+ <span class="pf-v6-c-nav__link-text">Server</span>
2316
+ </a>
2317
+ </li>
2318
+ </ul>
2319
+ </nav>
2320
+ </div>
2100
2321
  </div>
2101
2322
  </div>
2102
2323
  <div class="pf-v6-c-page__main-container" tabindex="-1">
@@ -2114,21 +2335,57 @@ wrapperTag: div
2114
2335
  </li>
2115
2336
  <li class="pf-v6-c-breadcrumb__item">
2116
2337
  <span class="pf-v6-c-breadcrumb__item-divider">
2117
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2338
+ <svg
2339
+ class="pf-v6-svg"
2340
+ viewBox="0 0 20 20"
2341
+ fill="currentColor"
2342
+ aria-hidden="true"
2343
+ role="img"
2344
+ width="1em"
2345
+ height="1em"
2346
+ >
2347
+ <path
2348
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
2349
+ />
2350
+ </svg>
2118
2351
  </span>
2119
2352
 
2120
2353
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
2121
2354
  </li>
2122
2355
  <li class="pf-v6-c-breadcrumb__item">
2123
2356
  <span class="pf-v6-c-breadcrumb__item-divider">
2124
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2357
+ <svg
2358
+ class="pf-v6-svg"
2359
+ viewBox="0 0 20 20"
2360
+ fill="currentColor"
2361
+ aria-hidden="true"
2362
+ role="img"
2363
+ width="1em"
2364
+ height="1em"
2365
+ >
2366
+ <path
2367
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
2368
+ />
2369
+ </svg>
2125
2370
  </span>
2126
2371
 
2127
2372
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
2128
2373
  </li>
2129
2374
  <li class="pf-v6-c-breadcrumb__item">
2130
2375
  <span class="pf-v6-c-breadcrumb__item-divider">
2131
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2376
+ <svg
2377
+ class="pf-v6-svg"
2378
+ viewBox="0 0 20 20"
2379
+ fill="currentColor"
2380
+ aria-hidden="true"
2381
+ role="img"
2382
+ width="1em"
2383
+ height="1em"
2384
+ >
2385
+ <path
2386
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
2387
+ />
2388
+ </svg>
2132
2389
  </span>
2133
2390
 
2134
2391
  <a
@@ -2167,7 +2424,19 @@ wrapperTag: div
2167
2424
  class="pf-v6-c-icon__content pf-v6-m-mirror-inline-rtl"
2168
2425
  >
2169
2426
  <span class="pf-v6-c-toolbar__expand-all-icon">
2170
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2427
+ <svg
2428
+ class="pf-v6-svg"
2429
+ viewBox="0 0 20 20"
2430
+ fill="currentColor"
2431
+ aria-hidden="true"
2432
+ role="img"
2433
+ width="1em"
2434
+ height="1em"
2435
+ >
2436
+ <path
2437
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2438
+ />
2439
+ </svg>
2171
2440
  </span>
2172
2441
  </span>
2173
2442
  </span>
@@ -2316,7 +2585,6 @@ wrapperTag: div
2316
2585
  class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
2317
2586
  type="button"
2318
2587
  aria-expanded="false"
2319
- aria-label="Menu toggle"
2320
2588
  id="data-list-expandable-example-toolbar-top-pagination"
2321
2589
  >
2322
2590
  <span class="pf-v6-c-menu-toggle__text">
@@ -2345,7 +2613,19 @@ wrapperTag: div
2345
2613
  aria-label="Go to previous page"
2346
2614
  >
2347
2615
  <span class="pf-v6-c-button__icon">
2348
- <i class="fas fa-angle-left" aria-hidden="true"></i>
2616
+ <svg
2617
+ class="pf-v6-svg"
2618
+ viewBox="0 0 256 512"
2619
+ fill="currentColor"
2620
+ aria-hidden="true"
2621
+ role="img"
2622
+ width="1em"
2623
+ height="1em"
2624
+ >
2625
+ <path
2626
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
2627
+ />
2628
+ </svg>
2349
2629
  </span>
2350
2630
  </button>
2351
2631
  </div>
@@ -2356,7 +2636,19 @@ wrapperTag: div
2356
2636
  aria-label="Go to next page"
2357
2637
  >
2358
2638
  <span class="pf-v6-c-button__icon">
2359
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2639
+ <svg
2640
+ class="pf-v6-svg"
2641
+ viewBox="0 0 256 512"
2642
+ fill="currentColor"
2643
+ aria-hidden="true"
2644
+ role="img"
2645
+ width="1em"
2646
+ height="1em"
2647
+ >
2648
+ <path
2649
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
2650
+ />
2651
+ </svg>
2360
2652
  </span>
2361
2653
  </button>
2362
2654
  </div>
@@ -2393,7 +2685,19 @@ wrapperTag: div
2393
2685
  >
2394
2686
  <span class="pf-v6-c-button__icon pf-m-start">
2395
2687
  <div class="pf-v6-c-data-list__toggle-icon">
2396
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2688
+ <svg
2689
+ class="pf-v6-svg"
2690
+ viewBox="0 0 20 20"
2691
+ fill="currentColor"
2692
+ aria-hidden="true"
2693
+ role="img"
2694
+ width="1em"
2695
+ height="1em"
2696
+ >
2697
+ <path
2698
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2699
+ />
2700
+ </svg>
2397
2701
  </div>
2398
2702
  </span>
2399
2703
  </button>
@@ -2909,7 +3213,19 @@ wrapperTag: div
2909
3213
  >
2910
3214
  <span class="pf-v6-c-button__icon pf-m-start">
2911
3215
  <div class="pf-v6-c-data-list__toggle-icon">
2912
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3216
+ <svg
3217
+ class="pf-v6-svg"
3218
+ viewBox="0 0 20 20"
3219
+ fill="currentColor"
3220
+ aria-hidden="true"
3221
+ role="img"
3222
+ width="1em"
3223
+ height="1em"
3224
+ >
3225
+ <path
3226
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
3227
+ />
3228
+ </svg>
2913
3229
  </div>
2914
3230
  </span>
2915
3231
  </button>
@@ -3079,7 +3395,19 @@ wrapperTag: div
3079
3395
  >
3080
3396
  <span class="pf-v6-c-button__icon pf-m-start">
3081
3397
  <div class="pf-v6-c-data-list__toggle-icon">
3082
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3398
+ <svg
3399
+ class="pf-v6-svg"
3400
+ viewBox="0 0 20 20"
3401
+ fill="currentColor"
3402
+ aria-hidden="true"
3403
+ role="img"
3404
+ width="1em"
3405
+ height="1em"
3406
+ >
3407
+ <path
3408
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
3409
+ />
3410
+ </svg>
3083
3411
  </div>
3084
3412
  </span>
3085
3413
  </button>
@@ -3135,7 +3463,19 @@ wrapperTag: div
3135
3463
  >
3136
3464
  <span class="pf-v6-c-button__icon pf-m-start">
3137
3465
  <div class="pf-v6-c-data-list__toggle-icon">
3138
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3466
+ <svg
3467
+ class="pf-v6-svg"
3468
+ viewBox="0 0 20 20"
3469
+ fill="currentColor"
3470
+ aria-hidden="true"
3471
+ role="img"
3472
+ width="1em"
3473
+ height="1em"
3474
+ >
3475
+ <path
3476
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
3477
+ />
3478
+ </svg>
3139
3479
  </div>
3140
3480
  </span>
3141
3481
  </button>
@@ -3260,7 +3600,19 @@ wrapperTag: div
3260
3600
  >
3261
3601
  <span class="pf-v6-c-button__icon pf-m-start">
3262
3602
  <div class="pf-v6-c-data-list__toggle-icon">
3263
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3603
+ <svg
3604
+ class="pf-v6-svg"
3605
+ viewBox="0 0 20 20"
3606
+ fill="currentColor"
3607
+ aria-hidden="true"
3608
+ role="img"
3609
+ width="1em"
3610
+ height="1em"
3611
+ >
3612
+ <path
3613
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
3614
+ />
3615
+ </svg>
3264
3616
  </div>
3265
3617
  </span>
3266
3618
  </button>
@@ -3421,7 +3773,6 @@ wrapperTag: div
3421
3773
  class="pf-v6-c-menu-toggle pf-m-top pf-m-text pf-m-plain"
3422
3774
  type="button"
3423
3775
  aria-expanded="false"
3424
- aria-label="Menu toggle"
3425
3776
  id="{{page--id}}-pagination-menu-toggle-bottom-example"
3426
3777
  >
3427
3778
  <span class="pf-v6-c-menu-toggle__text">
@@ -3444,7 +3795,19 @@ wrapperTag: div
3444
3795
  aria-label="Go to first page"
3445
3796
  >
3446
3797
  <span class="pf-v6-c-button__icon">
3447
- <i class="fas fa-angle-double-left" aria-hidden="true"></i>
3798
+ <svg
3799
+ class="pf-v6-svg"
3800
+ viewBox="0 0 448 512"
3801
+ fill="currentColor"
3802
+ aria-hidden="true"
3803
+ role="img"
3804
+ width="1em"
3805
+ height="1em"
3806
+ >
3807
+ <path
3808
+ d="M223.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L319.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L393.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34zm-192 34l136 136c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9L127.9 256l96.4-96.4c9.4-9.4 9.4-24.6 0-33.9L201.7 103c-9.4-9.4-24.6-9.4-33.9 0l-136 136c-9.5 9.4-9.5 24.6-.1 34z"
3809
+ />
3810
+ </svg>
3448
3811
  </span>
3449
3812
  </button>
3450
3813
  </div>
@@ -3456,7 +3819,19 @@ wrapperTag: div
3456
3819
  aria-label="Go to previous page"
3457
3820
  >
3458
3821
  <span class="pf-v6-c-button__icon">
3459
- <i class="fas fa-angle-left" aria-hidden="true"></i>
3822
+ <svg
3823
+ class="pf-v6-svg"
3824
+ viewBox="0 0 256 512"
3825
+ fill="currentColor"
3826
+ aria-hidden="true"
3827
+ role="img"
3828
+ width="1em"
3829
+ height="1em"
3830
+ >
3831
+ <path
3832
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
3833
+ />
3834
+ </svg>
3460
3835
  </span>
3461
3836
  </button>
3462
3837
  </div>
@@ -3479,7 +3854,19 @@ wrapperTag: div
3479
3854
  aria-label="Go to next page"
3480
3855
  >
3481
3856
  <span class="pf-v6-c-button__icon">
3482
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3857
+ <svg
3858
+ class="pf-v6-svg"
3859
+ viewBox="0 0 256 512"
3860
+ fill="currentColor"
3861
+ aria-hidden="true"
3862
+ role="img"
3863
+ width="1em"
3864
+ height="1em"
3865
+ >
3866
+ <path
3867
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
3868
+ />
3869
+ </svg>
3483
3870
  </span>
3484
3871
  </button>
3485
3872
  </div>
@@ -3491,7 +3878,19 @@ wrapperTag: div
3491
3878
  aria-label="Go to last page"
3492
3879
  >
3493
3880
  <span class="pf-v6-c-button__icon">
3494
- <i class="fas fa-angle-double-right" aria-hidden="true"></i>
3881
+ <svg
3882
+ class="pf-v6-svg"
3883
+ viewBox="0 0 448 512"
3884
+ fill="currentColor"
3885
+ aria-hidden="true"
3886
+ role="img"
3887
+ width="1em"
3888
+ height="1em"
3889
+ >
3890
+ <path
3891
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34zm192-34l-136-136c-9.4-9.4-24.6-9.4-33.9 0l-22.6 22.6c-9.4 9.4-9.4 24.6 0 33.9l96.4 96.4-96.4 96.4c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l136-136c9.4-9.2 9.4-24.4 0-33.8z"
3892
+ />
3893
+ </svg>
3495
3894
  </span>
3496
3895
  </button>
3497
3896
  </div>
@@ -3517,10 +3916,8 @@ wrapperTag: div
3517
3916
  <span class="pf-v6-c-button__text">Skip to content</span>
3518
3917
  </a>
3519
3918
  </div>
3520
- <header
3521
- class="pf-v6-c-masthead"
3522
- id="data-list-static-bottom-example-masthead"
3523
- >
3919
+
3920
+ <header class="pf-v6-c-masthead" id="data-list-static-bottom-example-docked">
3524
3921
  <div class="pf-v6-c-masthead__main">
3525
3922
  <span class="pf-v6-c-masthead__toggle">
3526
3923
  <button
@@ -3562,7 +3959,7 @@ wrapperTag: div
3562
3959
  y1="2.25860997e-13%"
3563
3960
  x2="32%"
3564
3961
  y2="100%"
3565
- id="linearGradient-data-list-static-bottom-example-masthead"
3962
+ id="linearGradient-data-list-static-bottom-example-docked"
3566
3963
  >
3567
3964
  <stop stop-color="#2B9AF3" offset="0%" />
3568
3965
  <stop
@@ -3616,11 +4013,11 @@ wrapperTag: div
3616
4013
  />
3617
4014
  <path
3618
4015
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
3619
- fill="url(#linearGradient-data-list-static-bottom-example-masthead)"
4016
+ fill="url(#linearGradient-data-list-static-bottom-example-docked)"
3620
4017
  />
3621
4018
  <path
3622
4019
  d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
3623
- fill="url(#linearGradient-data-list-static-bottom-example-masthead)"
4020
+ fill="url(#linearGradient-data-list-static-bottom-example-docked)"
3624
4021
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
3625
4022
  />
3626
4023
  </g>
@@ -3632,7 +4029,7 @@ wrapperTag: div
3632
4029
  <div class="pf-v6-c-masthead__content">
3633
4030
  <div
3634
4031
  class="pf-v6-c-toolbar pf-m-static"
3635
- id="data-list-static-bottom-example-masthead-toolbar"
4032
+ id="data-list-static-bottom-example-docked-toolbar"
3636
4033
  >
3637
4034
  <div class="pf-v6-c-toolbar__content">
3638
4035
  <div class="pf-v6-c-toolbar__content-section">
@@ -3699,44 +4096,46 @@ wrapperTag: div
3699
4096
  </div>
3700
4097
  </header>
3701
4098
  <div class="pf-v6-c-page__sidebar">
3702
- <div class="pf-v6-c-page__sidebar-body">
3703
- <nav
3704
- class="pf-v6-c-nav"
3705
- id="data-list-static-bottom-example-primary-nav"
3706
- aria-label="Global"
3707
- >
3708
- <ul class="pf-v6-c-nav__list" role="list">
3709
- <li class="pf-v6-c-nav__item">
3710
- <a href="#" class="pf-v6-c-nav__link">
3711
- <span class="pf-v6-c-nav__link-text">System panel</span>
3712
- </a>
3713
- </li>
3714
- <li class="pf-v6-c-nav__item">
3715
- <a
3716
- href="#"
3717
- class="pf-v6-c-nav__link pf-m-current"
3718
- aria-current="page"
3719
- >
3720
- <span class="pf-v6-c-nav__link-text">Policy</span>
3721
- </a>
3722
- </li>
3723
- <li class="pf-v6-c-nav__item">
3724
- <a href="#" class="pf-v6-c-nav__link">
3725
- <span class="pf-v6-c-nav__link-text">Authentication</span>
3726
- </a>
3727
- </li>
3728
- <li class="pf-v6-c-nav__item">
3729
- <a href="#" class="pf-v6-c-nav__link">
3730
- <span class="pf-v6-c-nav__link-text">Network services</span>
3731
- </a>
3732
- </li>
3733
- <li class="pf-v6-c-nav__item">
3734
- <a href="#" class="pf-v6-c-nav__link">
3735
- <span class="pf-v6-c-nav__link-text">Server</span>
3736
- </a>
3737
- </li>
3738
- </ul>
3739
- </nav>
4099
+ <div class="pf-v6-c-page__sidebar-main">
4100
+ <div class="pf-v6-c-page__sidebar-body">
4101
+ <nav
4102
+ class="pf-v6-c-nav"
4103
+ id="data-list-static-bottom-example-primary-nav"
4104
+ aria-label="Global"
4105
+ >
4106
+ <ul class="pf-v6-c-nav__list" role="list">
4107
+ <li class="pf-v6-c-nav__item">
4108
+ <a href="#" class="pf-v6-c-nav__link">
4109
+ <span class="pf-v6-c-nav__link-text">System panel</span>
4110
+ </a>
4111
+ </li>
4112
+ <li class="pf-v6-c-nav__item">
4113
+ <a
4114
+ href="#"
4115
+ class="pf-v6-c-nav__link pf-m-current"
4116
+ aria-current="page"
4117
+ >
4118
+ <span class="pf-v6-c-nav__link-text">Policy</span>
4119
+ </a>
4120
+ </li>
4121
+ <li class="pf-v6-c-nav__item">
4122
+ <a href="#" class="pf-v6-c-nav__link">
4123
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
4124
+ </a>
4125
+ </li>
4126
+ <li class="pf-v6-c-nav__item">
4127
+ <a href="#" class="pf-v6-c-nav__link">
4128
+ <span class="pf-v6-c-nav__link-text">Network services</span>
4129
+ </a>
4130
+ </li>
4131
+ <li class="pf-v6-c-nav__item">
4132
+ <a href="#" class="pf-v6-c-nav__link">
4133
+ <span class="pf-v6-c-nav__link-text">Server</span>
4134
+ </a>
4135
+ </li>
4136
+ </ul>
4137
+ </nav>
4138
+ </div>
3740
4139
  </div>
3741
4140
  </div>
3742
4141
  <div class="pf-v6-c-page__main-container" tabindex="-1">
@@ -3754,21 +4153,57 @@ wrapperTag: div
3754
4153
  </li>
3755
4154
  <li class="pf-v6-c-breadcrumb__item">
3756
4155
  <span class="pf-v6-c-breadcrumb__item-divider">
3757
- <i class="fas fa-angle-right" aria-hidden="true"></i>
4156
+ <svg
4157
+ class="pf-v6-svg"
4158
+ viewBox="0 0 20 20"
4159
+ fill="currentColor"
4160
+ aria-hidden="true"
4161
+ role="img"
4162
+ width="1em"
4163
+ height="1em"
4164
+ >
4165
+ <path
4166
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
4167
+ />
4168
+ </svg>
3758
4169
  </span>
3759
4170
 
3760
4171
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
3761
4172
  </li>
3762
4173
  <li class="pf-v6-c-breadcrumb__item">
3763
4174
  <span class="pf-v6-c-breadcrumb__item-divider">
3764
- <i class="fas fa-angle-right" aria-hidden="true"></i>
4175
+ <svg
4176
+ class="pf-v6-svg"
4177
+ viewBox="0 0 20 20"
4178
+ fill="currentColor"
4179
+ aria-hidden="true"
4180
+ role="img"
4181
+ width="1em"
4182
+ height="1em"
4183
+ >
4184
+ <path
4185
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
4186
+ />
4187
+ </svg>
3765
4188
  </span>
3766
4189
 
3767
4190
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
3768
4191
  </li>
3769
4192
  <li class="pf-v6-c-breadcrumb__item">
3770
4193
  <span class="pf-v6-c-breadcrumb__item-divider">
3771
- <i class="fas fa-angle-right" aria-hidden="true"></i>
4194
+ <svg
4195
+ class="pf-v6-svg"
4196
+ viewBox="0 0 20 20"
4197
+ fill="currentColor"
4198
+ aria-hidden="true"
4199
+ role="img"
4200
+ width="1em"
4201
+ height="1em"
4202
+ >
4203
+ <path
4204
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
4205
+ />
4206
+ </svg>
3772
4207
  </span>
3773
4208
 
3774
4209
  <a
@@ -3910,7 +4345,6 @@ wrapperTag: div
3910
4345
  class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
3911
4346
  type="button"
3912
4347
  aria-expanded="false"
3913
- aria-label="Menu toggle"
3914
4348
  id="data-list-static-bottom-example-toolbar-top-pagination"
3915
4349
  >
3916
4350
  <span class="pf-v6-c-menu-toggle__text">
@@ -3939,7 +4373,19 @@ wrapperTag: div
3939
4373
  aria-label="Go to previous page"
3940
4374
  >
3941
4375
  <span class="pf-v6-c-button__icon">
3942
- <i class="fas fa-angle-left" aria-hidden="true"></i>
4376
+ <svg
4377
+ class="pf-v6-svg"
4378
+ viewBox="0 0 256 512"
4379
+ fill="currentColor"
4380
+ aria-hidden="true"
4381
+ role="img"
4382
+ width="1em"
4383
+ height="1em"
4384
+ >
4385
+ <path
4386
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
4387
+ />
4388
+ </svg>
3943
4389
  </span>
3944
4390
  </button>
3945
4391
  </div>
@@ -3950,7 +4396,19 @@ wrapperTag: div
3950
4396
  aria-label="Go to next page"
3951
4397
  >
3952
4398
  <span class="pf-v6-c-button__icon">
3953
- <i class="fas fa-angle-right" aria-hidden="true"></i>
4399
+ <svg
4400
+ class="pf-v6-svg"
4401
+ viewBox="0 0 256 512"
4402
+ fill="currentColor"
4403
+ aria-hidden="true"
4404
+ role="img"
4405
+ width="1em"
4406
+ height="1em"
4407
+ >
4408
+ <path
4409
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
4410
+ />
4411
+ </svg>
3954
4412
  </span>
3955
4413
  </button>
3956
4414
  </div>
@@ -4414,7 +4872,6 @@ wrapperTag: div
4414
4872
  class="pf-v6-c-menu-toggle pf-m-top pf-m-text pf-m-plain"
4415
4873
  type="button"
4416
4874
  aria-expanded="false"
4417
- aria-label="Menu toggle"
4418
4875
  id="{{page--id}}pagination-menu-toggle-bottom-example-static"
4419
4876
  >
4420
4877
  <span class="pf-v6-c-menu-toggle__text">
@@ -4437,7 +4894,19 @@ wrapperTag: div
4437
4894
  aria-label="Go to first page"
4438
4895
  >
4439
4896
  <span class="pf-v6-c-button__icon">
4440
- <i class="fas fa-angle-double-left" aria-hidden="true"></i>
4897
+ <svg
4898
+ class="pf-v6-svg"
4899
+ viewBox="0 0 448 512"
4900
+ fill="currentColor"
4901
+ aria-hidden="true"
4902
+ role="img"
4903
+ width="1em"
4904
+ height="1em"
4905
+ >
4906
+ <path
4907
+ d="M223.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L319.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L393.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34zm-192 34l136 136c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9L127.9 256l96.4-96.4c9.4-9.4 9.4-24.6 0-33.9L201.7 103c-9.4-9.4-24.6-9.4-33.9 0l-136 136c-9.5 9.4-9.5 24.6-.1 34z"
4908
+ />
4909
+ </svg>
4441
4910
  </span>
4442
4911
  </button>
4443
4912
  </div>
@@ -4449,7 +4918,19 @@ wrapperTag: div
4449
4918
  aria-label="Go to previous page"
4450
4919
  >
4451
4920
  <span class="pf-v6-c-button__icon">
4452
- <i class="fas fa-angle-left" aria-hidden="true"></i>
4921
+ <svg
4922
+ class="pf-v6-svg"
4923
+ viewBox="0 0 256 512"
4924
+ fill="currentColor"
4925
+ aria-hidden="true"
4926
+ role="img"
4927
+ width="1em"
4928
+ height="1em"
4929
+ >
4930
+ <path
4931
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
4932
+ />
4933
+ </svg>
4453
4934
  </span>
4454
4935
  </button>
4455
4936
  </div>
@@ -4472,7 +4953,19 @@ wrapperTag: div
4472
4953
  aria-label="Go to next page"
4473
4954
  >
4474
4955
  <span class="pf-v6-c-button__icon">
4475
- <i class="fas fa-angle-right" aria-hidden="true"></i>
4956
+ <svg
4957
+ class="pf-v6-svg"
4958
+ viewBox="0 0 256 512"
4959
+ fill="currentColor"
4960
+ aria-hidden="true"
4961
+ role="img"
4962
+ width="1em"
4963
+ height="1em"
4964
+ >
4965
+ <path
4966
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
4967
+ />
4968
+ </svg>
4476
4969
  </span>
4477
4970
  </button>
4478
4971
  </div>
@@ -4484,7 +4977,19 @@ wrapperTag: div
4484
4977
  aria-label="Go to last page"
4485
4978
  >
4486
4979
  <span class="pf-v6-c-button__icon">
4487
- <i class="fas fa-angle-double-right" aria-hidden="true"></i>
4980
+ <svg
4981
+ class="pf-v6-svg"
4982
+ viewBox="0 0 448 512"
4983
+ fill="currentColor"
4984
+ aria-hidden="true"
4985
+ role="img"
4986
+ width="1em"
4987
+ height="1em"
4988
+ >
4989
+ <path
4990
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34zm192-34l-136-136c-9.4-9.4-24.6-9.4-33.9 0l-22.6 22.6c-9.4 9.4-9.4 24.6 0 33.9l96.4 96.4-96.4 96.4c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l136-136c9.4-9.2 9.4-24.4 0-33.8z"
4991
+ />
4992
+ </svg>
4488
4993
  </span>
4489
4994
  </button>
4490
4995
  </div>