@patternfly/patternfly 6.5.0-prerelease.5 → 6.5.0-prerelease.50

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 (376) 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.png +0 -0
  10. package/assets/images/compass--wallpaper-light.png +0 -0
  11. package/base/normalize.scss +7 -0
  12. package/base/patternfly-common.css +50 -0
  13. package/base/patternfly-common.scss +59 -0
  14. package/base/patternfly-svg-icons.css +11 -0
  15. package/base/patternfly-svg-icons.scss +14 -0
  16. package/base/patternfly-variables.css +345 -14
  17. package/base/patternfly-variables.scss +40 -0
  18. package/base/tokens/tokens-dark.scss +51 -3
  19. package/base/tokens/tokens-default.scss +67 -13
  20. package/base/tokens/tokens-glass-dark.scss +9 -0
  21. package/base/tokens/tokens-glass.scss +9 -0
  22. package/base/tokens/tokens-local.scss +16 -0
  23. package/base/tokens/tokens-palette.scss +3 -1
  24. package/base/tokens/tokens-redhat-dark.scss +14 -0
  25. package/base/tokens/tokens-redhat-glass-dark.scss +16 -0
  26. package/base/tokens/tokens-redhat-glass.scss +15 -0
  27. package/base/tokens/tokens-redhat-highcontrast-dark.scss +47 -0
  28. package/base/tokens/tokens-redhat-highcontrast.scss +127 -0
  29. package/base/tokens/tokens-redhat.scss +15 -0
  30. package/components/AboutModalBox/about-modal-box.css +36 -26
  31. package/components/Accordion/accordion.css +17 -14
  32. package/components/Accordion/accordion.scss +1 -2
  33. package/components/ActionList/action-list.css +2 -0
  34. package/components/ActionList/action-list.scss +2 -0
  35. package/components/Alert/alert.css +7 -5
  36. package/components/Alert/alert.scss +2 -1
  37. package/components/Avatar/avatar.css +12 -4
  38. package/components/BackgroundImage/background-image.css +6 -3
  39. package/components/Banner/banner.css +8 -6
  40. package/components/Brand/brand.css +3 -1
  41. package/components/Breadcrumb/breadcrumb.css +4 -3
  42. package/components/Button/button.css +117 -14
  43. package/components/Button/button.scss +127 -10
  44. package/components/CalendarMonth/calendar-month.css +4 -3
  45. package/components/Card/card.css +20 -7
  46. package/components/Card/card.scss +16 -2
  47. package/components/ClipboardCopy/clipboard-copy.css +7 -6
  48. package/components/ClipboardCopy/clipboard-copy.scss +3 -3
  49. package/components/CodeEditor/code-editor.css +1 -1
  50. package/components/CodeEditor/code-editor.scss +1 -1
  51. package/components/Compass/compass.css +320 -0
  52. package/components/Compass/compass.scss +350 -0
  53. package/components/DataList/data-list.css +34 -23
  54. package/components/DataList/data-list.scss +7 -2
  55. package/components/DescriptionList/description-list-order.scss +5 -1
  56. package/components/DescriptionList/description-list.css +7 -5
  57. package/components/DescriptionList/description-list.scss +5 -1
  58. package/components/Divider/divider.css +7 -5
  59. package/components/Drawer/drawer.css +110 -56
  60. package/components/Drawer/drawer.scss +69 -9
  61. package/components/DualListSelector/dual-list-selector.css +18 -12
  62. package/components/DualListSelector/dual-list-selector.scss +1 -1
  63. package/components/ExpandableSection/expandable-section.css +21 -16
  64. package/components/ExpandableSection/expandable-section.scss +6 -3
  65. package/components/Form/form.css +2 -2
  66. package/components/Form/form.scss +2 -2
  67. package/components/FormControl/form-control.css +3 -3
  68. package/components/FormControl/form-control.scss +3 -3
  69. package/components/Hero/hero.css +74 -0
  70. package/components/Hero/hero.scss +86 -0
  71. package/components/JumpLinks/jump-links.css +5 -4
  72. package/components/JumpLinks/jump-links.scss +6 -2
  73. package/components/Label/label-group.css +2 -2
  74. package/components/Label/label-group.scss +2 -2
  75. package/components/Label/label.css +4 -3
  76. package/components/Login/login.css +51 -37
  77. package/components/Masthead/masthead.css +70 -16
  78. package/components/Masthead/masthead.scss +54 -1
  79. package/components/Menu/menu.css +23 -14
  80. package/components/MenuToggle/menu-toggle.css +5 -1
  81. package/components/MenuToggle/menu-toggle.scss +6 -1
  82. package/components/ModalBox/modal-box.css +9 -7
  83. package/components/ModalBox/modal-box.scss +2 -2
  84. package/components/Nav/nav.css +74 -11
  85. package/components/Nav/nav.scss +77 -5
  86. package/components/NotificationDrawer/notification-drawer.css +19 -9
  87. package/components/NotificationDrawer/notification-drawer.scss +14 -5
  88. package/components/Page/page.css +55 -29
  89. package/components/Page/page.scss +44 -5
  90. package/components/Pagination/pagination.scss +5 -1
  91. package/components/ProgressStepper/progress-stepper.scss +5 -1
  92. package/components/Sidebar/sidebar.css +1 -1
  93. package/components/Sidebar/sidebar.scss +7 -3
  94. package/components/Skeleton/skeleton.css +16 -15
  95. package/components/Slider/slider.css +32 -18
  96. package/components/Switch/switch.css +4 -2
  97. package/components/Switch/switch.scss +1 -1
  98. package/components/Table/table-grid.css +28 -36
  99. package/components/Table/table-grid.scss +4 -4
  100. package/components/Table/table-tree-view.css +4 -2
  101. package/components/Table/table.css +33 -29
  102. package/components/Table/table.scss +2 -2
  103. package/components/Tabs/tabs.css +35 -18
  104. package/components/Tabs/tabs.scss +35 -7
  105. package/components/TextInputGroup/text-input-group.css +2 -2
  106. package/components/TextInputGroup/text-input-group.scss +2 -2
  107. package/components/ToggleGroup/toggle-group.css +34 -17
  108. package/components/ToggleGroup/toggle-group.scss +36 -20
  109. package/components/Toolbar/toolbar.css +47 -15
  110. package/components/Toolbar/toolbar.scss +34 -6
  111. package/components/TreeView/tree-view.css +45 -14
  112. package/components/TreeView/tree-view.scss +32 -1
  113. package/components/Wizard/wizard.css +21 -17
  114. package/components/Wizard/wizard.scss +4 -4
  115. package/components/_index.css +1602 -676
  116. package/components/_index.scss +3 -1
  117. package/docs/components/AboutModalBox/examples/AboutModalBox.md +13 -1
  118. package/docs/components/Accordion/examples/Accordion.md +390 -30
  119. package/docs/components/ActionList/examples/ActionList.md +143 -11
  120. package/docs/components/Alert/examples/Alert.md +678 -54
  121. package/docs/components/Avatar/examples/Avatar.md +4 -4
  122. package/docs/components/BackToTop/examples/BackToTop.md +13 -1
  123. package/docs/components/Banner/examples/Banner.md +65 -5
  124. package/docs/components/Brand/examples/Brand.md +2 -2
  125. package/docs/components/Breadcrumb/examples/Breadcrumb.md +299 -23
  126. package/docs/components/Button/examples/Button.md +2217 -241
  127. package/docs/components/CalendarMonth/examples/CalendarMonth.md +104 -8
  128. package/docs/components/Card/examples/Card.md +206 -4
  129. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +286 -22
  130. package/docs/components/CodeBlock/examples/CodeBlock.md +104 -8
  131. package/docs/components/CodeEditor/examples/CodeEditor.md +195 -15
  132. package/docs/components/Compass/examples/Compass.css +17 -0
  133. package/docs/components/Compass/examples/Compass.md +119 -0
  134. package/docs/components/DataList/examples/DataList.md +405 -205
  135. package/docs/components/DatePicker/examples/DatePicker.md +78 -6
  136. package/docs/components/DescriptionList/examples/DescriptionList.md +327 -27
  137. package/docs/components/Divider/examples/Divider.md +2 -2
  138. package/docs/components/Drawer/examples/Drawer.md +353 -35
  139. package/docs/components/DualListSelector/examples/DualListSelector.md +1013 -143
  140. package/docs/components/ExpandableSection/examples/ExpandableSection.md +91 -7
  141. package/docs/components/Form/examples/Form.md +78 -6
  142. package/docs/components/Hero/examples/Hero.md +25 -0
  143. package/docs/components/Icon/examples/Icon.md +92 -8
  144. package/docs/components/InlineEdit/examples/InlineEdit.md +312 -24
  145. package/docs/components/InputGroup/examples/InputGroup.md +27 -3
  146. package/docs/components/JumpLinks/examples/JumpLinks.md +54 -6
  147. package/docs/components/Label/examples/Label.md +2834 -218
  148. package/docs/components/Login/examples/Login.md +26 -2
  149. package/docs/components/Masthead/examples/masthead.md +80 -1
  150. package/docs/components/Menu/examples/Menu.md +1458 -114
  151. package/docs/components/MenuToggle/examples/MenuToggle.md +53 -1
  152. package/docs/components/ModalBox/examples/ModalBox.md +287 -23
  153. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +156 -12
  154. package/docs/components/Nav/examples/Navigation.md +798 -58
  155. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +598 -46
  156. package/docs/components/OverflowMenu/examples/overflow-menu.md +78 -6
  157. package/docs/components/Page/examples/Page.md +51 -2
  158. package/docs/components/Pagination/examples/Pagination.md +627 -51
  159. package/docs/components/Popover/examples/Popover.md +286 -22
  160. package/docs/components/ProgressStepper/examples/ProgressStepper.md +275 -23
  161. package/docs/components/Sidebar/examples/Sidebar.md +1 -1
  162. package/docs/components/Slider/examples/Slider.md +52 -4
  163. package/docs/components/Table/examples/Table.md +875 -70
  164. package/docs/components/Tabs/examples/Tabs.md +4127 -320
  165. package/docs/components/TextInputGroup/examples/TextInputGroup.md +600 -48
  166. package/docs/components/ToggleGroup/examples/toggle-group.md +195 -15
  167. package/docs/components/Toolbar/examples/Toolbar.md +490 -42
  168. package/docs/components/TreeView/examples/TreeView.md +1390 -130
  169. package/docs/components/Wizard/examples/Wizard.md +492 -72
  170. package/docs/demos/AboutModal/examples/AboutModal.md +57 -9
  171. package/docs/demos/Alert/examples/Alert.md +236 -32
  172. package/docs/demos/BackToTop/examples/BackToTop.md +57 -9
  173. package/docs/demos/Banner/examples/Banner.md +88 -16
  174. package/docs/demos/Button/examples/Button.md +13 -1
  175. package/docs/demos/Card/examples/Card.md +399 -42
  176. package/docs/demos/CardView/examples/CardView.md +161 -17
  177. package/docs/demos/Compass/examples/Compass.md +6836 -0
  178. package/docs/demos/Dashboard/examples/Dashboard.md +173 -26
  179. package/docs/demos/DataList/examples/DataList.md +566 -65
  180. package/docs/demos/DescriptionList/examples/DescriptionList.md +156 -27
  181. package/docs/demos/Drawer/examples/Drawer.md +216 -45
  182. package/docs/demos/Form/examples/BasicForms.md +273 -21
  183. package/docs/demos/JumpLinks/examples/JumpLinks.md +272 -59
  184. package/docs/demos/Masthead/examples/Masthead.md +458 -89
  185. package/docs/demos/Modal/examples/Modal.md +342 -57
  186. package/docs/demos/Nav/examples/Nav.md +660 -87
  187. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +1088 -140
  188. package/docs/demos/Page/examples/Page.md +618 -123
  189. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -1
  190. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +52 -4
  191. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +691 -113
  192. package/docs/demos/Skeleton/examples/Skeleton.md +44 -8
  193. package/docs/demos/Table/examples/Table.md +3924 -256
  194. package/docs/demos/Tabs/examples/Tabs.md +407 -65
  195. package/docs/demos/Toolbar/examples/Toolbar.md +502 -52
  196. package/docs/demos/Wizard/examples/Wizard.md +796 -130
  197. package/docs/layouts/Bullseye/examples/Bullseye.css +2 -2
  198. package/docs/layouts/Bullseye/examples/Bullseye.md +2 -1
  199. package/docs/layouts/Flex/examples/Flex.css +3 -3
  200. package/docs/layouts/Flex/examples/Flex.md +3 -2
  201. package/docs/layouts/Gallery/examples/Gallery.css +2 -2
  202. package/docs/layouts/Gallery/examples/Gallery.md +4 -3
  203. package/docs/layouts/Grid/examples/Grid.css +1 -1
  204. package/docs/layouts/Grid/examples/Grid.md +6 -5
  205. package/docs/layouts/Level/examples/Level.css +3 -3
  206. package/docs/layouts/Level/examples/Level.md +2 -1
  207. package/docs/layouts/Split/examples/Split.css +1 -1
  208. package/docs/layouts/Split/examples/Split.md +2 -1
  209. package/docs/layouts/Stack/examples/Stack.css +3 -3
  210. package/docs/layouts/Stack/examples/Stack.md +2 -1
  211. package/docs/utilities/Accessibility/examples/Accessibility.md +3 -2
  212. package/docs/utilities/Alignment/examples/Alignment.css +4 -4
  213. package/docs/utilities/Alignment/examples/Alignment.md +3 -2
  214. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +5 -4
  215. package/docs/utilities/BoxShadow/examples/box-shadow.css +2 -2
  216. package/docs/utilities/BoxShadow/examples/box-shadow.md +2 -1
  217. package/docs/utilities/Display/examples/Display.css +1 -1
  218. package/docs/utilities/Display/examples/Display.md +3 -2
  219. package/docs/utilities/Flex/examples/Flex.css +7 -7
  220. package/docs/utilities/Flex/examples/Flex.md +3 -2
  221. package/docs/utilities/Float/examples/Float.css +2 -2
  222. package/docs/utilities/Float/examples/Float.md +3 -2
  223. package/docs/utilities/Sizing/examples/Sizing.md +8 -7
  224. package/docs/utilities/Spacing/examples/Spacing.css +2 -2
  225. package/docs/utilities/Spacing/examples/Spacing.md +3 -2
  226. package/docs/utilities/Text/examples/Text.md +5 -4
  227. package/icons/PfIcons/add-circle-o.svg +4 -0
  228. package/icons/PfIcons/ansible-tower.svg +4 -0
  229. package/icons/PfIcons/applications.svg +4 -0
  230. package/icons/PfIcons/arrow.svg +4 -0
  231. package/icons/PfIcons/asleep.svg +4 -0
  232. package/icons/PfIcons/attention-bell.svg +4 -0
  233. package/icons/PfIcons/automation.svg +4 -0
  234. package/icons/PfIcons/bell.svg +4 -0
  235. package/icons/PfIcons/blueprint.svg +4 -0
  236. package/icons/PfIcons/build.svg +4 -0
  237. package/icons/PfIcons/builder-image.svg +4 -0
  238. package/icons/PfIcons/bundle.svg +4 -0
  239. package/icons/PfIcons/catalog.svg +4 -0
  240. package/icons/PfIcons/chat.svg +4 -0
  241. package/icons/PfIcons/close.svg +4 -0
  242. package/icons/PfIcons/cloud-security.svg +4 -0
  243. package/icons/PfIcons/cloud-tenant.svg +4 -0
  244. package/icons/PfIcons/cluster.svg +4 -0
  245. package/icons/PfIcons/connected.svg +4 -0
  246. package/icons/PfIcons/container-node.svg +4 -0
  247. package/icons/PfIcons/cpu.svg +4 -0
  248. package/icons/PfIcons/critical-risk.svg +4 -0
  249. package/icons/PfIcons/data-processor.svg +4 -0
  250. package/icons/PfIcons/data-sink.svg +4 -0
  251. package/icons/PfIcons/data-source.svg +4 -0
  252. package/icons/PfIcons/degraded.svg +4 -0
  253. package/icons/PfIcons/disconnected.svg +4 -0
  254. package/icons/PfIcons/domain.svg +4 -0
  255. package/icons/PfIcons/edit.svg +4 -0
  256. package/icons/PfIcons/enhancement.svg +4 -0
  257. package/icons/PfIcons/enterprise.svg +4 -0
  258. package/icons/PfIcons/equalizer.svg +4 -0
  259. package/icons/PfIcons/error-circle-o.svg +4 -0
  260. package/icons/PfIcons/export.svg +4 -0
  261. package/icons/PfIcons/filter.svg +4 -0
  262. package/icons/PfIcons/flavor.svg +4 -0
  263. package/icons/PfIcons/folder-close.svg +4 -0
  264. package/icons/PfIcons/folder-open.svg +4 -0
  265. package/icons/PfIcons/globe-route.svg +4 -0
  266. package/icons/PfIcons/help.svg +4 -0
  267. package/icons/PfIcons/history.svg +4 -0
  268. package/icons/PfIcons/home.svg +4 -0
  269. package/icons/PfIcons/import.svg +4 -0
  270. package/icons/PfIcons/in-progress.svg +4 -0
  271. package/icons/PfIcons/info.svg +4 -0
  272. package/icons/PfIcons/infrastructure.svg +4 -0
  273. package/icons/PfIcons/integration.svg +4 -0
  274. package/icons/PfIcons/key.svg +4 -0
  275. package/icons/PfIcons/locked.svg +4 -0
  276. package/icons/PfIcons/maintenance.svg +4 -0
  277. package/icons/PfIcons/memory.svg +4 -0
  278. package/icons/PfIcons/messages.svg +4 -0
  279. package/icons/PfIcons/middleware.svg +4 -0
  280. package/icons/PfIcons/migration.svg +4 -0
  281. package/icons/PfIcons/module.svg +4 -0
  282. package/icons/PfIcons/monitoring.svg +4 -0
  283. package/icons/PfIcons/multicluster.svg +4 -0
  284. package/icons/PfIcons/namespaces.svg +4 -0
  285. package/icons/PfIcons/network.svg +4 -0
  286. package/icons/PfIcons/new-process.svg +4 -0
  287. package/icons/PfIcons/not-started.svg +4 -0
  288. package/icons/PfIcons/off.svg +4 -0
  289. package/icons/PfIcons/ok.svg +4 -0
  290. package/icons/PfIcons/on-running.svg +4 -0
  291. package/icons/PfIcons/on.svg +4 -0
  292. package/icons/PfIcons/open-drawer-right.svg +4 -0
  293. package/icons/PfIcons/openshift.svg +4 -0
  294. package/icons/PfIcons/openstack.svg +4 -0
  295. package/icons/PfIcons/optimize.svg +4 -0
  296. package/icons/PfIcons/orders.svg +4 -0
  297. package/icons/PfIcons/os-image.svg +4 -0
  298. package/icons/PfIcons/package.svg +4 -0
  299. package/icons/PfIcons/panel-close.svg +4 -0
  300. package/icons/PfIcons/panel-open.svg +4 -0
  301. package/icons/PfIcons/paused.svg +4 -0
  302. package/icons/PfIcons/pending.svg +4 -0
  303. package/icons/PfIcons/pficon-dragdrop.svg +4 -0
  304. package/icons/PfIcons/pficon-history.svg +4 -0
  305. package/icons/PfIcons/pficon-network-range.svg +4 -0
  306. package/icons/PfIcons/pficon-satellite.svg +4 -0
  307. package/icons/PfIcons/pficon-sort-common-asc.svg +4 -0
  308. package/icons/PfIcons/pficon-sort-common-desc.svg +4 -0
  309. package/icons/PfIcons/pficon-template.svg +4 -0
  310. package/icons/PfIcons/pficon-vcenter.svg +4 -0
  311. package/icons/PfIcons/plugged.svg +4 -0
  312. package/icons/PfIcons/port.svg +4 -0
  313. package/icons/PfIcons/print.svg +4 -0
  314. package/icons/PfIcons/private.svg +4 -0
  315. package/icons/PfIcons/process-automation.svg +4 -0
  316. package/icons/PfIcons/project.svg +4 -0
  317. package/icons/PfIcons/rebalance.svg +4 -0
  318. package/icons/PfIcons/rebooting.svg +4 -0
  319. package/icons/PfIcons/regions.svg +4 -0
  320. package/icons/PfIcons/registry.svg +4 -0
  321. package/icons/PfIcons/remove2.svg +4 -0
  322. package/icons/PfIcons/replicator.svg +4 -0
  323. package/icons/PfIcons/repository.svg +4 -0
  324. package/icons/PfIcons/resource-pool.svg +4 -0
  325. package/icons/PfIcons/resources-almost-empty.svg +4 -0
  326. package/icons/PfIcons/resources-almost-full.svg +4 -0
  327. package/icons/PfIcons/resources-empty.svg +4 -0
  328. package/icons/PfIcons/resources-full.svg +4 -0
  329. package/icons/PfIcons/running.svg +4 -0
  330. package/icons/PfIcons/save.svg +4 -0
  331. package/icons/PfIcons/screen.svg +4 -0
  332. package/icons/PfIcons/security.svg +4 -0
  333. package/icons/PfIcons/server-group.svg +4 -0
  334. package/icons/PfIcons/server.svg +4 -0
  335. package/icons/PfIcons/service-catalog.svg +4 -0
  336. package/icons/PfIcons/service.svg +4 -0
  337. package/icons/PfIcons/services.svg +4 -0
  338. package/icons/PfIcons/severity-critical.svg +4 -0
  339. package/icons/PfIcons/severity-important.svg +4 -0
  340. package/icons/PfIcons/severity-minor.svg +4 -0
  341. package/icons/PfIcons/severity-moderate.svg +4 -0
  342. package/icons/PfIcons/severity-none.svg +4 -0
  343. package/icons/PfIcons/severity-undefined.svg +4 -0
  344. package/icons/PfIcons/spinner.svg +4 -0
  345. package/icons/PfIcons/spinner2.svg +4 -0
  346. package/icons/PfIcons/storage-domain.svg +4 -0
  347. package/icons/PfIcons/task.svg +4 -0
  348. package/icons/PfIcons/tenant.svg +4 -0
  349. package/icons/PfIcons/thumb-tack.svg +4 -0
  350. package/icons/PfIcons/topology.svg +4 -0
  351. package/icons/PfIcons/treeview.svg +4 -0
  352. package/icons/PfIcons/trend-down.svg +4 -0
  353. package/icons/PfIcons/trend-up.svg +4 -0
  354. package/icons/PfIcons/unknown.svg +4 -0
  355. package/icons/PfIcons/unlocked.svg +4 -0
  356. package/icons/PfIcons/unplugged.svg +4 -0
  357. package/icons/PfIcons/user.svg +4 -0
  358. package/icons/PfIcons/users.svg +4 -0
  359. package/icons/PfIcons/virtual-machine.svg +4 -0
  360. package/icons/PfIcons/volume.svg +4 -0
  361. package/icons/PfIcons/warning-triangle.svg +4 -0
  362. package/icons/PfIcons/zone.svg +4 -0
  363. package/layouts/Flex/flex.scss +83 -19
  364. package/layouts/Gallery/gallery.css +6 -2
  365. package/layouts/_index.css +6 -2
  366. package/package.json +34 -16
  367. package/patternfly-base-no-globals.css +406 -14
  368. package/patternfly-base.css +413 -14
  369. package/patternfly-charts.css +3 -3
  370. package/patternfly-no-globals.css +1947 -625
  371. package/patternfly.css +1954 -625
  372. package/patternfly.min.css +1 -1
  373. package/patternfly.min.css.map +1 -1
  374. package/sass-utilities/functions.scss +32 -25
  375. package/sass-utilities/mixins.scss +36 -20
  376. package/sass-utilities/namespaces-components.scss +6 -0
package/docs/demos/JumpLinks/examples/JumpLinks.md CHANGED
@@ -17,7 +17,7 @@ section: components
17
17
  </div>
18
18
  <header
19
19
  class="pf-v6-c-masthead"
20
- id="jump-links-collapsed-mobile-example-masthead"
20
+ id="jump-links-collapsed-mobile-example-docked"
21
21
  >
22
22
  <div class="pf-v6-c-masthead__main">
23
23
  <span class="pf-v6-c-masthead__toggle">
@@ -60,7 +60,7 @@ section: components
60
60
  y1="2.25860997e-13%"
61
61
  x2="32%"
62
62
  y2="100%"
63
- id="linearGradient-jump-links-collapsed-mobile-example-masthead"
63
+ id="linearGradient-jump-links-collapsed-mobile-example-docked"
64
64
  >
65
65
  <stop stop-color="#2B9AF3" offset="0%" />
66
66
  <stop
@@ -114,11 +114,11 @@ section: components
114
114
  />
115
115
  <path
116
116
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
117
- fill="url(#linearGradient-jump-links-collapsed-mobile-example-masthead)"
117
+ fill="url(#linearGradient-jump-links-collapsed-mobile-example-docked)"
118
118
  />
119
119
  <path
120
120
  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"
121
- fill="url(#linearGradient-jump-links-collapsed-mobile-example-masthead)"
121
+ fill="url(#linearGradient-jump-links-collapsed-mobile-example-docked)"
122
122
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
123
123
  />
124
124
  </g>
@@ -130,7 +130,7 @@ section: components
130
130
  <div class="pf-v6-c-masthead__content">
131
131
  <div
132
132
  class="pf-v6-c-toolbar pf-m-static"
133
- id="jump-links-collapsed-mobile-example-masthead-toolbar"
133
+ id="jump-links-collapsed-mobile-example-docked-toolbar"
134
134
  >
135
135
  <div class="pf-v6-c-toolbar__content">
136
136
  <div class="pf-v6-c-toolbar__content-section">
@@ -252,21 +252,57 @@ section: components
252
252
  </li>
253
253
  <li class="pf-v6-c-breadcrumb__item">
254
254
  <span class="pf-v6-c-breadcrumb__item-divider">
255
- <i class="fas fa-angle-right" aria-hidden="true"></i>
255
+ <svg
256
+ class="pf-v6-svg"
257
+ viewBox="0 0 20 20"
258
+ fill="currentColor"
259
+ aria-hidden="true"
260
+ role="img"
261
+ width="1em"
262
+ height="1em"
263
+ >
264
+ <path
265
+ 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"
266
+ />
267
+ </svg>
256
268
  </span>
257
269
 
258
270
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
259
271
  </li>
260
272
  <li class="pf-v6-c-breadcrumb__item">
261
273
  <span class="pf-v6-c-breadcrumb__item-divider">
262
- <i class="fas fa-angle-right" aria-hidden="true"></i>
274
+ <svg
275
+ class="pf-v6-svg"
276
+ viewBox="0 0 20 20"
277
+ fill="currentColor"
278
+ aria-hidden="true"
279
+ role="img"
280
+ width="1em"
281
+ height="1em"
282
+ >
283
+ <path
284
+ 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"
285
+ />
286
+ </svg>
263
287
  </span>
264
288
 
265
289
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
266
290
  </li>
267
291
  <li class="pf-v6-c-breadcrumb__item">
268
292
  <span class="pf-v6-c-breadcrumb__item-divider">
269
- <i class="fas fa-angle-right" aria-hidden="true"></i>
293
+ <svg
294
+ class="pf-v6-svg"
295
+ viewBox="0 0 20 20"
296
+ fill="currentColor"
297
+ aria-hidden="true"
298
+ role="img"
299
+ width="1em"
300
+ height="1em"
301
+ >
302
+ <path
303
+ 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"
304
+ />
305
+ </svg>
270
306
  </span>
271
307
 
272
308
  <a
@@ -304,10 +340,19 @@ section: components
304
340
  >
305
341
  <span class="pf-v6-c-button__icon pf-m-start">
306
342
  <span class="pf-v6-c-jump-links__toggle-icon">
307
- <i
308
- class="fas fa-angle-right"
343
+ <svg
344
+ class="pf-v6-svg"
345
+ viewBox="0 0 20 20"
346
+ fill="currentColor"
309
347
  aria-hidden="true"
310
- ></i>
348
+ role="img"
349
+ width="1em"
350
+ height="1em"
351
+ >
352
+ <path
353
+ 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"
354
+ />
355
+ </svg>
311
356
  </span>
312
357
  </span>
313
358
  <span class="pf-v6-c-button__text">Jump to section</span>
@@ -451,7 +496,7 @@ section: components
451
496
  </div>
452
497
  <header
453
498
  class="pf-v6-c-masthead"
454
- id="jump-links-vertical-expanded-mobile-example-masthead"
499
+ id="jump-links-vertical-expanded-mobile-example-docked"
455
500
  >
456
501
  <div class="pf-v6-c-masthead__main">
457
502
  <span class="pf-v6-c-masthead__toggle">
@@ -494,7 +539,7 @@ section: components
494
539
  y1="2.25860997e-13%"
495
540
  x2="32%"
496
541
  y2="100%"
497
- id="linearGradient-jump-links-vertical-expanded-mobile-example-masthead"
542
+ id="linearGradient-jump-links-vertical-expanded-mobile-example-docked"
498
543
  >
499
544
  <stop stop-color="#2B9AF3" offset="0%" />
500
545
  <stop
@@ -548,11 +593,11 @@ section: components
548
593
  />
549
594
  <path
550
595
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
551
- fill="url(#linearGradient-jump-links-vertical-expanded-mobile-example-masthead)"
596
+ fill="url(#linearGradient-jump-links-vertical-expanded-mobile-example-docked)"
552
597
  />
553
598
  <path
554
599
  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"
555
- fill="url(#linearGradient-jump-links-vertical-expanded-mobile-example-masthead)"
600
+ fill="url(#linearGradient-jump-links-vertical-expanded-mobile-example-docked)"
556
601
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
557
602
  />
558
603
  </g>
@@ -564,7 +609,7 @@ section: components
564
609
  <div class="pf-v6-c-masthead__content">
565
610
  <div
566
611
  class="pf-v6-c-toolbar pf-m-static"
567
- id="jump-links-vertical-expanded-mobile-example-masthead-toolbar"
612
+ id="jump-links-vertical-expanded-mobile-example-docked-toolbar"
568
613
  >
569
614
  <div class="pf-v6-c-toolbar__content">
570
615
  <div class="pf-v6-c-toolbar__content-section">
@@ -686,21 +731,57 @@ section: components
686
731
  </li>
687
732
  <li class="pf-v6-c-breadcrumb__item">
688
733
  <span class="pf-v6-c-breadcrumb__item-divider">
689
- <i class="fas fa-angle-right" aria-hidden="true"></i>
734
+ <svg
735
+ class="pf-v6-svg"
736
+ viewBox="0 0 20 20"
737
+ fill="currentColor"
738
+ aria-hidden="true"
739
+ role="img"
740
+ width="1em"
741
+ height="1em"
742
+ >
743
+ <path
744
+ 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"
745
+ />
746
+ </svg>
690
747
  </span>
691
748
 
692
749
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
693
750
  </li>
694
751
  <li class="pf-v6-c-breadcrumb__item">
695
752
  <span class="pf-v6-c-breadcrumb__item-divider">
696
- <i class="fas fa-angle-right" aria-hidden="true"></i>
753
+ <svg
754
+ class="pf-v6-svg"
755
+ viewBox="0 0 20 20"
756
+ fill="currentColor"
757
+ aria-hidden="true"
758
+ role="img"
759
+ width="1em"
760
+ height="1em"
761
+ >
762
+ <path
763
+ 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"
764
+ />
765
+ </svg>
697
766
  </span>
698
767
 
699
768
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
700
769
  </li>
701
770
  <li class="pf-v6-c-breadcrumb__item">
702
771
  <span class="pf-v6-c-breadcrumb__item-divider">
703
- <i class="fas fa-angle-right" aria-hidden="true"></i>
772
+ <svg
773
+ class="pf-v6-svg"
774
+ viewBox="0 0 20 20"
775
+ fill="currentColor"
776
+ aria-hidden="true"
777
+ role="img"
778
+ width="1em"
779
+ height="1em"
780
+ >
781
+ <path
782
+ 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"
783
+ />
784
+ </svg>
704
785
  </span>
705
786
 
706
787
  <a
@@ -738,10 +819,19 @@ section: components
738
819
  >
739
820
  <span class="pf-v6-c-button__icon pf-m-start">
740
821
  <span class="pf-v6-c-jump-links__toggle-icon">
741
- <i
742
- class="fas fa-angle-right"
822
+ <svg
823
+ class="pf-v6-svg"
824
+ viewBox="0 0 20 20"
825
+ fill="currentColor"
743
826
  aria-hidden="true"
744
- ></i>
827
+ role="img"
828
+ width="1em"
829
+ height="1em"
830
+ >
831
+ <path
832
+ 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"
833
+ />
834
+ </svg>
745
835
  </span>
746
836
  </span>
747
837
  <span class="pf-v6-c-button__text">Jump to section</span>
@@ -885,7 +975,7 @@ section: components
885
975
  </div>
886
976
  <header
887
977
  class="pf-v6-c-masthead"
888
- id="jump-links-vertical-toggle-text-mobile-example-masthead"
978
+ id="jump-links-vertical-toggle-text-mobile-example-docked"
889
979
  >
890
980
  <div class="pf-v6-c-masthead__main">
891
981
  <span class="pf-v6-c-masthead__toggle">
@@ -928,7 +1018,7 @@ section: components
928
1018
  y1="2.25860997e-13%"
929
1019
  x2="32%"
930
1020
  y2="100%"
931
- id="linearGradient-jump-links-vertical-toggle-text-mobile-example-masthead"
1021
+ id="linearGradient-jump-links-vertical-toggle-text-mobile-example-docked"
932
1022
  >
933
1023
  <stop stop-color="#2B9AF3" offset="0%" />
934
1024
  <stop
@@ -982,11 +1072,11 @@ section: components
982
1072
  />
983
1073
  <path
984
1074
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
985
- fill="url(#linearGradient-jump-links-vertical-toggle-text-mobile-example-masthead)"
1075
+ fill="url(#linearGradient-jump-links-vertical-toggle-text-mobile-example-docked)"
986
1076
  />
987
1077
  <path
988
1078
  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"
989
- fill="url(#linearGradient-jump-links-vertical-toggle-text-mobile-example-masthead)"
1079
+ fill="url(#linearGradient-jump-links-vertical-toggle-text-mobile-example-docked)"
990
1080
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
991
1081
  />
992
1082
  </g>
@@ -998,7 +1088,7 @@ section: components
998
1088
  <div class="pf-v6-c-masthead__content">
999
1089
  <div
1000
1090
  class="pf-v6-c-toolbar pf-m-static"
1001
- id="jump-links-vertical-toggle-text-mobile-example-masthead-toolbar"
1091
+ id="jump-links-vertical-toggle-text-mobile-example-docked-toolbar"
1002
1092
  >
1003
1093
  <div class="pf-v6-c-toolbar__content">
1004
1094
  <div class="pf-v6-c-toolbar__content-section">
@@ -1120,21 +1210,57 @@ section: components
1120
1210
  </li>
1121
1211
  <li class="pf-v6-c-breadcrumb__item">
1122
1212
  <span class="pf-v6-c-breadcrumb__item-divider">
1123
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1213
+ <svg
1214
+ class="pf-v6-svg"
1215
+ viewBox="0 0 20 20"
1216
+ fill="currentColor"
1217
+ aria-hidden="true"
1218
+ role="img"
1219
+ width="1em"
1220
+ height="1em"
1221
+ >
1222
+ <path
1223
+ 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"
1224
+ />
1225
+ </svg>
1124
1226
  </span>
1125
1227
 
1126
1228
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
1127
1229
  </li>
1128
1230
  <li class="pf-v6-c-breadcrumb__item">
1129
1231
  <span class="pf-v6-c-breadcrumb__item-divider">
1130
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1232
+ <svg
1233
+ class="pf-v6-svg"
1234
+ viewBox="0 0 20 20"
1235
+ fill="currentColor"
1236
+ aria-hidden="true"
1237
+ role="img"
1238
+ width="1em"
1239
+ height="1em"
1240
+ >
1241
+ <path
1242
+ 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"
1243
+ />
1244
+ </svg>
1131
1245
  </span>
1132
1246
 
1133
1247
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
1134
1248
  </li>
1135
1249
  <li class="pf-v6-c-breadcrumb__item">
1136
1250
  <span class="pf-v6-c-breadcrumb__item-divider">
1137
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1251
+ <svg
1252
+ class="pf-v6-svg"
1253
+ viewBox="0 0 20 20"
1254
+ fill="currentColor"
1255
+ aria-hidden="true"
1256
+ role="img"
1257
+ width="1em"
1258
+ height="1em"
1259
+ >
1260
+ <path
1261
+ 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"
1262
+ />
1263
+ </svg>
1138
1264
  </span>
1139
1265
 
1140
1266
  <a
@@ -1172,10 +1298,19 @@ section: components
1172
1298
  >
1173
1299
  <span class="pf-v6-c-button__icon pf-m-start">
1174
1300
  <span class="pf-v6-c-jump-links__toggle-icon">
1175
- <i
1176
- class="fas fa-angle-right"
1301
+ <svg
1302
+ class="pf-v6-svg"
1303
+ viewBox="0 0 20 20"
1304
+ fill="currentColor"
1177
1305
  aria-hidden="true"
1178
- ></i>
1306
+ role="img"
1307
+ width="1em"
1308
+ height="1em"
1309
+ >
1310
+ <path
1311
+ 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"
1312
+ />
1313
+ </svg>
1179
1314
  </span>
1180
1315
  </span>
1181
1316
  <span class="pf-v6-c-button__text">Jump to section</span>
@@ -1317,7 +1452,7 @@ section: components
1317
1452
  <span class="pf-v6-c-button__text">Skip to content</span>
1318
1453
  </a>
1319
1454
  </div>
1320
- <header class="pf-v6-c-masthead" id="jump-links-horizontal-example-masthead">
1455
+ <header class="pf-v6-c-masthead" id="jump-links-horizontal-example-docked">
1321
1456
  <div class="pf-v6-c-masthead__main">
1322
1457
  <span class="pf-v6-c-masthead__toggle">
1323
1458
  <button
@@ -1359,7 +1494,7 @@ section: components
1359
1494
  y1="2.25860997e-13%"
1360
1495
  x2="32%"
1361
1496
  y2="100%"
1362
- id="linearGradient-jump-links-horizontal-example-masthead"
1497
+ id="linearGradient-jump-links-horizontal-example-docked"
1363
1498
  >
1364
1499
  <stop stop-color="#2B9AF3" offset="0%" />
1365
1500
  <stop
@@ -1413,11 +1548,11 @@ section: components
1413
1548
  />
1414
1549
  <path
1415
1550
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
1416
- fill="url(#linearGradient-jump-links-horizontal-example-masthead)"
1551
+ fill="url(#linearGradient-jump-links-horizontal-example-docked)"
1417
1552
  />
1418
1553
  <path
1419
1554
  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"
1420
- fill="url(#linearGradient-jump-links-horizontal-example-masthead)"
1555
+ fill="url(#linearGradient-jump-links-horizontal-example-docked)"
1421
1556
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
1422
1557
  />
1423
1558
  </g>
@@ -1429,7 +1564,7 @@ section: components
1429
1564
  <div class="pf-v6-c-masthead__content">
1430
1565
  <div
1431
1566
  class="pf-v6-c-toolbar pf-m-static"
1432
- id="jump-links-horizontal-example-masthead-toolbar"
1567
+ id="jump-links-horizontal-example-docked-toolbar"
1433
1568
  >
1434
1569
  <div class="pf-v6-c-toolbar__content">
1435
1570
  <div class="pf-v6-c-toolbar__content-section">
@@ -1551,21 +1686,57 @@ section: components
1551
1686
  </li>
1552
1687
  <li class="pf-v6-c-breadcrumb__item">
1553
1688
  <span class="pf-v6-c-breadcrumb__item-divider">
1554
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1689
+ <svg
1690
+ class="pf-v6-svg"
1691
+ viewBox="0 0 20 20"
1692
+ fill="currentColor"
1693
+ aria-hidden="true"
1694
+ role="img"
1695
+ width="1em"
1696
+ height="1em"
1697
+ >
1698
+ <path
1699
+ 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"
1700
+ />
1701
+ </svg>
1555
1702
  </span>
1556
1703
 
1557
1704
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
1558
1705
  </li>
1559
1706
  <li class="pf-v6-c-breadcrumb__item">
1560
1707
  <span class="pf-v6-c-breadcrumb__item-divider">
1561
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1708
+ <svg
1709
+ class="pf-v6-svg"
1710
+ viewBox="0 0 20 20"
1711
+ fill="currentColor"
1712
+ aria-hidden="true"
1713
+ role="img"
1714
+ width="1em"
1715
+ height="1em"
1716
+ >
1717
+ <path
1718
+ 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"
1719
+ />
1720
+ </svg>
1562
1721
  </span>
1563
1722
 
1564
1723
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
1565
1724
  </li>
1566
1725
  <li class="pf-v6-c-breadcrumb__item">
1567
1726
  <span class="pf-v6-c-breadcrumb__item-divider">
1568
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1727
+ <svg
1728
+ class="pf-v6-svg"
1729
+ viewBox="0 0 20 20"
1730
+ fill="currentColor"
1731
+ aria-hidden="true"
1732
+ role="img"
1733
+ width="1em"
1734
+ height="1em"
1735
+ >
1736
+ <path
1737
+ 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"
1738
+ />
1739
+ </svg>
1569
1740
  </span>
1570
1741
 
1571
1742
  <a
@@ -1694,7 +1865,7 @@ section: components
1694
1865
  <span class="pf-v6-c-button__text">Skip to content</span>
1695
1866
  </a>
1696
1867
  </div>
1697
- <header class="pf-v6-c-masthead" id="jump-links-drawer-masthead">
1868
+ <header class="pf-v6-c-masthead" id="jump-links-drawer-docked">
1698
1869
  <div class="pf-v6-c-masthead__main">
1699
1870
  <span class="pf-v6-c-masthead__toggle">
1700
1871
  <button
@@ -1736,7 +1907,7 @@ section: components
1736
1907
  y1="2.25860997e-13%"
1737
1908
  x2="32%"
1738
1909
  y2="100%"
1739
- id="linearGradient-jump-links-drawer-masthead"
1910
+ id="linearGradient-jump-links-drawer-docked"
1740
1911
  >
1741
1912
  <stop stop-color="#2B9AF3" offset="0%" />
1742
1913
  <stop
@@ -1790,11 +1961,11 @@ section: components
1790
1961
  />
1791
1962
  <path
1792
1963
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
1793
- fill="url(#linearGradient-jump-links-drawer-masthead)"
1964
+ fill="url(#linearGradient-jump-links-drawer-docked)"
1794
1965
  />
1795
1966
  <path
1796
1967
  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"
1797
- fill="url(#linearGradient-jump-links-drawer-masthead)"
1968
+ fill="url(#linearGradient-jump-links-drawer-docked)"
1798
1969
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
1799
1970
  />
1800
1971
  </g>
@@ -1806,7 +1977,7 @@ section: components
1806
1977
  <div class="pf-v6-c-masthead__content">
1807
1978
  <div
1808
1979
  class="pf-v6-c-toolbar pf-m-static"
1809
- id="jump-links-drawer-masthead-toolbar"
1980
+ id="jump-links-drawer-docked-toolbar"
1810
1981
  >
1811
1982
  <div class="pf-v6-c-toolbar__content">
1812
1983
  <div class="pf-v6-c-toolbar__content-section">
@@ -1943,10 +2114,19 @@ section: components
1943
2114
  >
1944
2115
  <span class="pf-v6-c-button__icon pf-m-start">
1945
2116
  <span class="pf-v6-c-jump-links__toggle-icon">
1946
- <i
1947
- class="fas fa-angle-right"
2117
+ <svg
2118
+ class="pf-v6-svg"
2119
+ viewBox="0 0 20 20"
2120
+ fill="currentColor"
1948
2121
  aria-hidden="true"
1949
- ></i>
2122
+ role="img"
2123
+ width="1em"
2124
+ height="1em"
2125
+ >
2126
+ <path
2127
+ 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"
2128
+ />
2129
+ </svg>
1950
2130
  </span>
1951
2131
  </span>
1952
2132
  <span
@@ -2085,7 +2265,19 @@ section: components
2085
2265
  aria-label="Close drawer panel"
2086
2266
  >
2087
2267
  <span class="pf-v6-c-button__icon">
2088
- <i class="fas fa-times" aria-hidden="true"></i>
2268
+ <svg
2269
+ class="pf-v6-svg"
2270
+ viewBox="0 0 20 20"
2271
+ fill="currentColor"
2272
+ aria-hidden="true"
2273
+ role="img"
2274
+ width="1em"
2275
+ height="1em"
2276
+ >
2277
+ <path
2278
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
2279
+ />
2280
+ </svg>
2089
2281
  </span>
2090
2282
  </button>
2091
2283
  </div>
@@ -2116,7 +2308,7 @@ section: components
2116
2308
  <span class="pf-v6-c-button__text">Skip to content</span>
2117
2309
  </a>
2118
2310
  </div>
2119
- <header class="pf-v6-c-masthead" id="jump-links-drawer-expanded-masthead">
2311
+ <header class="pf-v6-c-masthead" id="jump-links-drawer-expanded-docked">
2120
2312
  <div class="pf-v6-c-masthead__main">
2121
2313
  <span class="pf-v6-c-masthead__toggle">
2122
2314
  <button
@@ -2158,7 +2350,7 @@ section: components
2158
2350
  y1="2.25860997e-13%"
2159
2351
  x2="32%"
2160
2352
  y2="100%"
2161
- id="linearGradient-jump-links-drawer-expanded-masthead"
2353
+ id="linearGradient-jump-links-drawer-expanded-docked"
2162
2354
  >
2163
2355
  <stop stop-color="#2B9AF3" offset="0%" />
2164
2356
  <stop
@@ -2212,11 +2404,11 @@ section: components
2212
2404
  />
2213
2405
  <path
2214
2406
  d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
2215
- fill="url(#linearGradient-jump-links-drawer-expanded-masthead)"
2407
+ fill="url(#linearGradient-jump-links-drawer-expanded-docked)"
2216
2408
  />
2217
2409
  <path
2218
2410
  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"
2219
- fill="url(#linearGradient-jump-links-drawer-expanded-masthead)"
2411
+ fill="url(#linearGradient-jump-links-drawer-expanded-docked)"
2220
2412
  transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
2221
2413
  />
2222
2414
  </g>
@@ -2228,7 +2420,7 @@ section: components
2228
2420
  <div class="pf-v6-c-masthead__content">
2229
2421
  <div
2230
2422
  class="pf-v6-c-toolbar pf-m-static"
2231
- id="jump-links-drawer-expanded-masthead-toolbar"
2423
+ id="jump-links-drawer-expanded-docked-toolbar"
2232
2424
  >
2233
2425
  <div class="pf-v6-c-toolbar__content">
2234
2426
  <div class="pf-v6-c-toolbar__content-section">
@@ -2365,10 +2557,19 @@ section: components
2365
2557
  >
2366
2558
  <span class="pf-v6-c-button__icon pf-m-start">
2367
2559
  <span class="pf-v6-c-jump-links__toggle-icon">
2368
- <i
2369
- class="fas fa-angle-right"
2560
+ <svg
2561
+ class="pf-v6-svg"
2562
+ viewBox="0 0 20 20"
2563
+ fill="currentColor"
2370
2564
  aria-hidden="true"
2371
- ></i>
2565
+ role="img"
2566
+ width="1em"
2567
+ height="1em"
2568
+ >
2569
+ <path
2570
+ 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"
2571
+ />
2572
+ </svg>
2372
2573
  </span>
2373
2574
  </span>
2374
2575
  <span
@@ -2507,7 +2708,19 @@ section: components
2507
2708
  aria-label="Close drawer panel"
2508
2709
  >
2509
2710
  <span class="pf-v6-c-button__icon">
2510
- <i class="fas fa-times" aria-hidden="true"></i>
2711
+ <svg
2712
+ class="pf-v6-svg"
2713
+ viewBox="0 0 20 20"
2714
+ fill="currentColor"
2715
+ aria-hidden="true"
2716
+ role="img"
2717
+ width="1em"
2718
+ height="1em"
2719
+ >
2720
+ <path
2721
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
2722
+ />
2723
+ </svg>
2511
2724
  </span>
2512
2725
  </button>
2513
2726
  </div>