@patternfly/patternfly 6.0.0-alpha.8 → 6.0.0-alpha.81

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 (334) hide show
  1. package/CODE_OF_CONDUCT.md +1 -2
  2. package/assets/images/PF-Backdrop.svg +1 -0
  3. package/assets/images/PF-HorizontalLogo-Color.svg +29 -0
  4. package/assets/images/PF-HorizontalLogo-Reverse.svg +28 -0
  5. package/assets/images/PF-IconLogo-Reverse.svg +14 -0
  6. package/assets/images/PF-IconLogo-color.svg +17 -0
  7. package/assets/images/PF-IconLogo.svg +17 -0
  8. package/assets/images/logo__pf--reverse-on-md.svg +1 -1
  9. package/assets/images/pf-background.svg +22 -0
  10. package/assets/images/pf-c-brand__logo-on-lg-white.svg +32 -0
  11. package/assets/images/pf-c-brand__logo-on-md-white.svg +42 -0
  12. package/assets/images/pf-c-brand__logo-on-sm-white.svg +17 -0
  13. package/assets/images/pf-c-brand__logo-on-sm.svg +1 -1
  14. package/assets/images/pf-c-brand__logo-on-xl-white.svg +39 -0
  15. package/assets/images/pf_logo_white.hbs +35 -0
  16. package/assets/images/pf_logo_white.svg +38 -0
  17. package/base/_common.scss +8 -4
  18. package/base/_globals.scss +4 -6
  19. package/base/_variables.scss +2 -7
  20. package/base/patternfly-common.css +8 -4
  21. package/base/patternfly-globals.css +4 -3
  22. package/base/patternfly-variables.css +884 -871
  23. package/base/tokens/_tokens-charts.scss +159 -0
  24. package/base/tokens/_tokens-dark.scss +311 -287
  25. package/base/tokens/_tokens-default.scss +425 -329
  26. package/base/tokens/_tokens-font.scss +29 -36
  27. package/base/tokens/_tokens-palette.scss +71 -71
  28. package/base/tokens/_workspace-overrides.scss +7 -0
  29. package/components/AboutModalBox/about-modal-box.css +57 -94
  30. package/components/AboutModalBox/about-modal-box.scss +37 -62
  31. package/components/Accordion/accordion.css +85 -177
  32. package/components/Accordion/accordion.scss +96 -195
  33. package/components/ActionList/action-list.css +18 -17
  34. package/components/ActionList/action-list.scss +26 -16
  35. package/components/Alert/alert-group.css +20 -16
  36. package/components/Alert/alert-group.scss +20 -16
  37. package/components/Alert/alert.css +59 -84
  38. package/components/Alert/alert.scss +62 -78
  39. package/components/Avatar/avatar.css +10 -13
  40. package/components/Avatar/avatar.scss +10 -17
  41. package/components/BackToTop/back-to-top.css +17 -16
  42. package/components/BackToTop/back-to-top.scss +12 -12
  43. package/components/Backdrop/backdrop.css +6 -2
  44. package/components/Backdrop/backdrop.scss +5 -2
  45. package/components/BackgroundImage/background-image.css +5 -1
  46. package/components/BackgroundImage/background-image.scss +5 -1
  47. package/components/Badge/badge.css +23 -15
  48. package/components/Badge/badge.scss +25 -17
  49. package/components/Banner/banner.css +90 -64
  50. package/components/Banner/banner.scss +95 -32
  51. package/components/Breadcrumb/breadcrumb.css +19 -16
  52. package/components/Breadcrumb/breadcrumb.scss +18 -16
  53. package/components/Button/button.css +419 -353
  54. package/components/Button/button.scss +476 -476
  55. package/components/CalendarMonth/calendar-month.css +61 -92
  56. package/components/CalendarMonth/calendar-month.scss +68 -63
  57. package/components/Card/card.css +100 -194
  58. package/components/Card/card.scss +121 -237
  59. package/components/Check/check.css +24 -21
  60. package/components/Check/check.scss +25 -23
  61. package/components/ClipboardCopy/clipboard-copy.css +30 -33
  62. package/components/ClipboardCopy/clipboard-copy.scss +34 -26
  63. package/components/CodeBlock/code-block.css +22 -9
  64. package/components/CodeBlock/code-block.scss +22 -10
  65. package/components/CodeEditor/code-editor.css +94 -72
  66. package/components/CodeEditor/code-editor.scss +104 -82
  67. package/components/Content/content.css +7 -7
  68. package/components/Content/content.scss +7 -7
  69. package/components/DataList/data-list.css +101 -158
  70. package/components/DataList/data-list.scss +95 -154
  71. package/components/DatePicker/date-picker.css +13 -14
  72. package/components/DatePicker/date-picker.scss +12 -16
  73. package/components/DescriptionList/description-list.css +39 -34
  74. package/components/DescriptionList/description-list.scss +25 -25
  75. package/components/Divider/divider.css +91 -169
  76. package/components/Divider/divider.scss +60 -77
  77. package/components/DragDrop/drag-drop.css +18 -14
  78. package/components/DragDrop/drag-drop.scss +18 -17
  79. package/components/Drawer/drawer.css +112 -113
  80. package/components/Drawer/drawer.scss +134 -134
  81. package/components/Dropdown/dropdown.css +1 -3
  82. package/components/Dropdown/dropdown.scss +2 -6
  83. package/components/DualListSelector/dual-list-selector.css +56 -48
  84. package/components/DualListSelector/dual-list-selector.scss +57 -50
  85. package/components/EmptyState/empty-state.css +57 -34
  86. package/components/EmptyState/empty-state.scss +63 -34
  87. package/components/ExpandableSection/expandable-section.css +64 -62
  88. package/components/ExpandableSection/expandable-section.scss +73 -76
  89. package/components/FileUpload/file-upload.css +28 -34
  90. package/components/FileUpload/file-upload.scss +30 -42
  91. package/components/Form/form.css +68 -114
  92. package/components/Form/form.scss +65 -126
  93. package/components/FormControl/form-control.css +86 -111
  94. package/components/FormControl/form-control.scss +88 -92
  95. package/components/HelperText/helper-text.css +28 -34
  96. package/components/HelperText/helper-text.scss +30 -40
  97. package/components/Hint/hint.css +28 -21
  98. package/components/Hint/hint.scss +28 -24
  99. package/components/Icon/icon.css +154 -18
  100. package/components/Icon/icon.scss +187 -20
  101. package/components/InlineEdit/inline-edit.css +8 -7
  102. package/components/InlineEdit/inline-edit.scss +8 -7
  103. package/components/InputGroup/input-group.css +22 -38
  104. package/components/InputGroup/input-group.scss +21 -29
  105. package/components/JumpLinks/jump-links.css +34 -34
  106. package/components/JumpLinks/jump-links.scss +35 -36
  107. package/components/Label/label-group.css +39 -44
  108. package/components/Label/label-group.scss +39 -45
  109. package/components/Label/label.css +380 -355
  110. package/components/Label/label.scss +434 -348
  111. package/components/List/list.css +16 -16
  112. package/components/List/list.scss +17 -17
  113. package/components/Login/login.css +70 -97
  114. package/components/Login/login.scss +56 -64
  115. package/components/Masthead/masthead.css +261 -502
  116. package/components/Masthead/masthead.scss +123 -286
  117. package/components/Menu/menu.css +3 -0
  118. package/components/Menu/menu.scss +7 -3
  119. package/components/MenuToggle/menu-toggle.css +8 -8
  120. package/components/MenuToggle/menu-toggle.scss +8 -10
  121. package/components/ModalBox/modal-box.css +59 -52
  122. package/components/ModalBox/modal-box.scss +57 -53
  123. package/components/MultipleFileUpload/multiple-file-upload.css +77 -50
  124. package/components/MultipleFileUpload/multiple-file-upload.scss +82 -53
  125. package/components/Nav/nav.css +240 -918
  126. package/components/Nav/nav.scss +300 -1082
  127. package/components/NotificationBadge/notification-badge.css +56 -81
  128. package/components/NotificationBadge/notification-badge.scss +60 -97
  129. package/components/NotificationDrawer/notification-drawer.css +104 -115
  130. package/components/NotificationDrawer/notification-drawer.scss +106 -116
  131. package/components/NumberInput/number-input.css +8 -8
  132. package/components/NumberInput/number-input.scss +7 -12
  133. package/components/OverflowMenu/overflow-menu.css +17 -47
  134. package/components/OverflowMenu/overflow-menu.scss +27 -65
  135. package/components/Page/page.css +56 -164
  136. package/components/Page/page.scss +60 -154
  137. package/components/Pagination/pagination.css +57 -124
  138. package/components/Pagination/pagination.scss +40 -128
  139. package/components/Panel/panel.css +27 -23
  140. package/components/Panel/panel.scss +29 -26
  141. package/components/Popover/popover.css +42 -53
  142. package/components/Popover/popover.scss +46 -55
  143. package/components/Progress/progress.css +31 -45
  144. package/components/Progress/progress.scss +36 -55
  145. package/components/ProgressStepper/progress-stepper.css +72 -69
  146. package/components/ProgressStepper/progress-stepper.scss +65 -65
  147. package/components/Radio/radio.css +27 -20
  148. package/components/Radio/radio.scss +28 -22
  149. package/components/Sidebar/sidebar.css +20 -9
  150. package/components/Sidebar/sidebar.scss +23 -11
  151. package/components/SimpleList/simple-list.css +35 -52
  152. package/components/SimpleList/simple-list.scss +41 -51
  153. package/components/Skeleton/skeleton.css +18 -20
  154. package/components/Skeleton/skeleton.scss +17 -21
  155. package/components/SkipToContent/skip-to-content.css +6 -3
  156. package/components/SkipToContent/skip-to-content.scss +8 -6
  157. package/components/Slider/slider.css +34 -30
  158. package/components/Slider/slider.scss +46 -43
  159. package/components/Spinner/spinner.css +17 -34
  160. package/components/Spinner/spinner.scss +19 -47
  161. package/components/Switch/switch.css +42 -38
  162. package/components/Switch/switch.scss +48 -43
  163. package/components/TabContent/tab-content.css +17 -11
  164. package/components/TabContent/tab-content.scss +18 -14
  165. package/components/Table/table-grid.css +29 -45
  166. package/components/Table/table-grid.scss +40 -53
  167. package/components/Table/table-scrollable.css +6 -6
  168. package/components/Table/table-scrollable.scss +8 -8
  169. package/components/Table/table-tree-view.css +76 -74
  170. package/components/Table/table-tree-view.scss +44 -39
  171. package/components/Table/table.css +67 -93
  172. package/components/Table/table.scss +83 -105
  173. package/components/Tabs/tabs.css +143 -175
  174. package/components/Tabs/tabs.scss +159 -217
  175. package/components/Tile/tile.css +40 -81
  176. package/components/Tile/tile.scss +38 -84
  177. package/components/Timestamp/timestamp.css +12 -9
  178. package/components/Timestamp/timestamp.scss +11 -10
  179. package/components/Title/title.css +70 -19
  180. package/components/Title/title.scss +90 -20
  181. package/components/ToggleGroup/toggle-group.css +54 -48
  182. package/components/ToggleGroup/toggle-group.scss +62 -50
  183. package/components/Toolbar/toolbar.css +2527 -1031
  184. package/components/Toolbar/toolbar.scss +233 -520
  185. package/components/Tooltip/tooltip.css +16 -18
  186. package/components/Tooltip/tooltip.scss +20 -24
  187. package/components/TreeView/tree-view.css +76 -97
  188. package/components/TreeView/tree-view.scss +82 -113
  189. package/components/Truncate/truncate.css +4 -0
  190. package/components/Truncate/truncate.scss +3 -0
  191. package/docs/components/AboutModalBox/examples/AboutModalBox.md +2 -2
  192. package/docs/components/Accordion/examples/Accordion.md +614 -416
  193. package/docs/components/ActionList/examples/ActionList.md +73 -22
  194. package/docs/components/Alert/examples/Alert.md +3 -3
  195. package/docs/components/Avatar/examples/Avatar.md +5 -19
  196. package/docs/components/BackgroundImage/examples/BackgroundImage.md +1 -1
  197. package/docs/components/Badge/examples/Badge.md +21 -0
  198. package/docs/components/Banner/examples/Banner.md +48 -25
  199. package/docs/components/Brand/examples/Brand.css +12 -0
  200. package/docs/components/Brand/examples/Brand.md +51 -32
  201. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  202. package/docs/components/Button/examples/Button.css +4 -0
  203. package/docs/components/Button/examples/Button.md +1419 -93
  204. package/docs/components/CalendarMonth/examples/CalendarMonth.md +48 -224
  205. package/docs/components/Card/examples/Card.md +550 -133
  206. package/docs/components/Check/examples/Check.md +1 -0
  207. package/docs/components/CodeBlock/examples/CodeBlock.md +4 -4
  208. package/docs/components/CodeEditor/examples/CodeEditor.md +144 -132
  209. package/docs/components/Content/examples/Content.md +5 -5
  210. package/docs/components/DatePicker/examples/DatePicker.md +5 -2
  211. package/docs/components/Divider/examples/Divider.css +3 -1
  212. package/docs/components/Divider/examples/Divider.md +30 -5
  213. package/docs/components/DragDrop/examples/DragDrop.css +1 -1
  214. package/docs/components/Drawer/examples/Drawer.md +294 -256
  215. package/docs/components/EmptyState/examples/EmptyState.md +45 -1
  216. package/docs/components/ExpandableSection/examples/ExpandableSection.md +49 -28
  217. package/docs/components/FileUpload/examples/FileUpload.md +112 -53
  218. package/docs/components/Form/examples/Form.md +134 -89
  219. package/docs/components/Icon/examples/Icon.md +82 -11
  220. package/docs/components/InlineEdit/examples/InlineEdit.md +3 -1
  221. package/docs/components/JumpLinks/examples/JumpLinks.md +280 -168
  222. package/docs/components/Label/examples/Label.css +4 -0
  223. package/docs/components/Label/examples/Label.md +3090 -703
  224. package/docs/components/LogViewer/examples/LogViewer.md +180 -180
  225. package/docs/components/Login/examples/Login.md +10 -5
  226. package/docs/components/Masthead/examples/masthead.md +443 -65
  227. package/docs/components/Menu/examples/Menu.md +507 -473
  228. package/docs/components/MenuToggle/examples/MenuToggle.md +106 -114
  229. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +9 -9
  230. package/docs/components/Nav/examples/Navigation.css +1 -23
  231. package/docs/components/Nav/examples/Navigation.md +209 -356
  232. package/docs/components/NotificationBadge/examples/NotificationBadge.md +5 -7
  233. package/docs/components/Page/examples/Page.css +0 -8
  234. package/docs/components/Page/examples/Page.md +22 -21
  235. package/docs/components/Pagination/examples/Pagination.md +663 -637
  236. package/docs/components/Panel/examples/Panel.md +12 -0
  237. package/docs/components/Popover/examples/Popover.md +1 -1
  238. package/docs/components/ProgressStepper/examples/ProgressStepper.md +15 -14
  239. package/docs/components/Radio/examples/Radio.md +1 -1
  240. package/docs/components/Sidebar/examples/Sidebar.md +19 -0
  241. package/docs/components/SimpleList/examples/SimpleList.md +3 -3
  242. package/docs/components/TabContent/examples/TabContent.md +10 -10
  243. package/docs/components/Table/examples/Table.md +8 -8
  244. package/docs/components/Tabs/examples/Tabs.css +1 -1
  245. package/docs/components/Tabs/examples/Tabs.md +1025 -826
  246. package/docs/components/TextInputGroup/examples/TextInputGroup.md +9 -9
  247. package/docs/components/Tile/examples/Tile.md +264 -144
  248. package/docs/components/Title/examples/Title.md +18 -0
  249. package/docs/components/Toolbar/examples/Toolbar.css +20 -15
  250. package/docs/components/Toolbar/examples/Toolbar.md +985 -3355
  251. package/docs/components/TreeView/examples/TreeView.md +7 -57
  252. package/docs/components/Truncate/examples/Truncate.css +2 -2
  253. package/docs/demos/AboutModal/examples/AboutModal.md +104 -31
  254. package/docs/demos/Alert/examples/Alert.md +330 -87
  255. package/docs/demos/BackToTop/examples/BackToTop.md +102 -29
  256. package/docs/demos/Banner/examples/Banner.md +211 -60
  257. package/docs/demos/Card/examples/Card.md +2 -2
  258. package/docs/demos/CardView/examples/CardView.md +241 -187
  259. package/docs/demos/ContextSelector/examples/ContextSelector.md +377 -94
  260. package/docs/demos/Dashboard/examples/Dashboard.md +102 -29
  261. package/docs/demos/DataList/examples/DataList.md +999 -938
  262. package/docs/demos/DescriptionList/examples/DescriptionList.md +306 -87
  263. package/docs/demos/Drawer/examples/Drawer.md +640 -251
  264. package/docs/demos/Form/examples/BasicForms.md +138 -84
  265. package/docs/demos/JumpLinks/examples/JumpLinks.md +917 -385
  266. package/docs/demos/Masthead/examples/Masthead.md +786 -342
  267. package/docs/demos/Modal/examples/Modal.md +645 -198
  268. package/docs/demos/Nav/examples/Nav.md +691 -902
  269. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +515 -145
  270. package/docs/demos/Page/examples/Page.md +942 -273
  271. package/docs/demos/Page/examples/Penta.md +66 -26
  272. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -9
  273. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +44 -32
  274. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +1183 -832
  275. package/docs/demos/Skeleton/examples/Skeleton.md +102 -29
  276. package/docs/demos/Table/examples/Table.md +3811 -3456
  277. package/docs/demos/Tabs/examples/Tabs.md +636 -194
  278. package/docs/demos/Toolbar/examples/Toolbar.css +10 -0
  279. package/docs/demos/Toolbar/examples/Toolbar.md +1316 -1478
  280. package/docs/demos/Wizard/examples/Wizard.md +918 -261
  281. package/docs/layouts/Flex/examples/Flex.md +11 -11
  282. package/package.json +32 -32
  283. package/patternfly-base-no-globals-theme-dark-unversioned.css +897 -880
  284. package/patternfly-base-no-globals.css +897 -880
  285. package/patternfly-base-theme-dark-unversioned.css +890 -872
  286. package/patternfly-base.css +890 -872
  287. package/patternfly-no-globals.css +8107 -8027
  288. package/patternfly-theme-dark-unversioned.css +8111 -8030
  289. package/patternfly.css +8111 -8030
  290. package/patternfly.min.css +1 -1
  291. package/patternfly.min.css.map +1 -1
  292. package/sass-utilities/mixins.scss +18 -0
  293. package/base/themes/dark/_variables.scss +0 -102
  294. package/components/AboutModalBox/themes/dark/about-modal-box.scss +0 -7
  295. package/components/Accordion/themes/dark/accordion.scss +0 -9
  296. package/components/Alert/themes/dark/alert.scss +0 -17
  297. package/components/Badge/themes/dark/badge.scss +0 -9
  298. package/components/Banner/themes/dark/banner.scss +0 -14
  299. package/components/Button/themes/dark/button.scss +0 -51
  300. package/components/CalendarMonth/themes/dark/calendar-month.scss +0 -37
  301. package/components/Card/themes/dark/card.scss +0 -20
  302. package/components/ClipboardCopy/themes/dark/clipboard-copy.scss +0 -19
  303. package/components/CodeEditor/themes/dark/code-editor.scss +0 -14
  304. package/components/DataList/themes/dark/data-list.scss +0 -10
  305. package/components/DatePicker/themes/dark/date-picker.scss +0 -8
  306. package/components/DragDrop/themes/dark/drag-drop.scss +0 -7
  307. package/components/Drawer/themes/dark/drawer.scss +0 -13
  308. package/components/DualListSelector/themes/dark/dual-list-selector.scss +0 -9
  309. package/components/Form/themes/dark/form.scss +0 -7
  310. package/components/FormControl/themes/dark/form-control.scss +0 -24
  311. package/components/HelperText/themes/dark/helper-text.scss +0 -7
  312. package/components/Hint/themes/dark/hint.scss +0 -8
  313. package/components/InputGroup/themes/dark/input-group.scss +0 -22
  314. package/components/Label/themes/dark/label.scss +0 -53
  315. package/components/Login/themes/dark/login.scss +0 -12
  316. package/components/Masthead/themes/dark/masthead.scss +0 -14
  317. package/components/ModalBox/themes/dark/modal-box.scss +0 -7
  318. package/components/NotificationBadge/themes/dark/notification-badge.scss +0 -10
  319. package/components/NotificationDrawer/themes/dark/notification-drawer.scss +0 -14
  320. package/components/Page/themes/dark/page.scss +0 -69
  321. package/components/Pagination/themes/dark/pagination.scss +0 -7
  322. package/components/Panel/themes/dark/panel.scss +0 -7
  323. package/components/Popover/themes/dark/popover.scss +0 -11
  324. package/components/Progress/themes/dark/progress.scss +0 -9
  325. package/components/SimpleList/themes/dark/simple-list.scss +0 -14
  326. package/components/Skeleton/themes/dark/skeleton.scss +0 -10
  327. package/components/Switch/themes/dark/switch.scss +0 -11
  328. package/components/Tabs/themes/dark/tabs.scss +0 -10
  329. package/components/Tile/themes/dark/tile.scss +0 -10
  330. package/components/ToggleGroup/themes/dark/toggle-group.scss +0 -12
  331. package/components/Tooltip/themes/dark/tooltip.scss +0 -8
  332. package/components/TreeView/themes/dark/tree-view.scss +0 -8
  333. package/docs/components/Avatar/examples/Avatar.css +0 -3
  334. package/docs/components/NotificationBadge/examples/NotificationBadge.css +0 -3
package/docs/demos/JumpLinks/examples/JumpLinks.md CHANGED
@@ -28,23 +28,117 @@ section: components
28
28
  </span>
29
29
  <div class="pf-v5-c-masthead__main">
30
30
  <a class="pf-v5-c-masthead__brand" href="#">
31
- <img
32
- class="pf-v5-c-brand"
33
- src="/assets/images/pf-logo.svg"
34
- alt="PatternFly logo"
35
- style="--pf-v5-c-brand--Height:36px"
36
- />
31
+ <svg height="40px" viewBox="0 0 679 158">
32
+ <title>PF-HorizontalLogo-Color</title>
33
+ <defs>
34
+ <linearGradient
35
+ x1="68%"
36
+ y1="2.25860997e-13%"
37
+ x2="32%"
38
+ y2="100%"
39
+ id="linearGradient-jump-links-collapsed-mobile-example-masthead"
40
+ >
41
+ <stop stop-color="#2B9AF3" offset="0%" />
42
+ <stop
43
+ stop-color="#73BCF7"
44
+ stop-opacity="0.502212631"
45
+ offset="100%"
46
+ />
47
+ </linearGradient>
48
+ </defs>
49
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
50
+ <g
51
+ transform="translate(206.000000, 45.750000)"
52
+ fill="var(--pf-t--global--text--color--regular)"
53
+ fill-rule="nonzero"
54
+ >
55
+ <path
56
+ d="M0,65.25 L0,2.25 L33.21,2.25 C37.35,2.25 41.025,3.135 44.235,4.905 C47.445,6.675 49.98,9.09 51.84,12.15 C53.7,15.21 54.63,18.72 54.63,22.68 C54.63,26.46 53.7,29.865 51.84,32.895 C49.98,35.925 47.43,38.31 44.19,40.05 C40.95,41.79 37.29,42.66 33.21,42.66 L15.48,42.66 L15.48,65.25 L0,65.25 Z M15.48,29.88 L31.41,29.88 C33.69,29.88 35.52,29.22 36.9,27.9 C38.28,26.58 38.97,24.87 38.97,22.77 C38.97,20.61 38.28,18.855 36.9,17.505 C35.52,16.155 33.69,15.48 31.41,15.48 L15.48,15.48 L15.48,29.88 Z"
57
+ />
58
+ <path
59
+ d="M77.04,66.06 C73.68,66.06 70.695,65.43 68.085,64.17 C65.475,62.91 63.435,61.17 61.965,58.95 C60.495,56.73 59.76,54.18 59.76,51.3 C59.76,46.74 61.485,43.215 64.935,40.725 C68.385,38.235 73.2,36.99 79.38,36.99 C83.1,36.99 86.7,37.44 90.18,38.34 L90.18,36 C90.18,31.26 87.15,28.89 81.09,28.89 C77.49,28.89 72.69,30.15 66.69,32.67 L61.47,21.96 C69.15,18.48 76.56,16.74 83.7,16.74 C90.3,16.74 95.43,18.315 99.09,21.465 C102.75,24.615 104.58,29.04 104.58,34.74 L104.58,65.25 L90.18,65.25 L90.18,62.37 C88.26,63.69 86.235,64.635 84.105,65.205 C81.975,65.775 79.62,66.06 77.04,66.06 Z M73.62,51.03 C73.62,52.53 74.28,53.7 75.6,54.54 C76.92,55.38 78.75,55.8 81.09,55.8 C84.69,55.8 87.72,55.05 90.18,53.55 L90.18,47.43 C87.42,46.71 84.54,46.35 81.54,46.35 C79.02,46.35 77.07,46.755 75.69,47.565 C74.31,48.375 73.62,49.53 73.62,51.03 Z"
60
+ />
61
+ <path
62
+ d="M137.25,65.88 C125.73,65.88 119.97,60.84 119.97,50.76 L119.97,29.79 L110.34,29.79 L110.34,17.64 L119.97,17.64 L119.97,5.4 L134.55,2.25 L134.55,17.64 L147.87,17.64 L147.87,29.79 L134.55,29.79 L134.55,47.88 C134.55,49.98 135.015,51.465 135.945,52.335 C136.875,53.205 138.51,53.64 140.85,53.64 C143.01,53.64 145.2,53.31 147.42,52.65 L147.42,64.44 C146.1,64.86 144.42,65.205 142.38,65.475 C140.34,65.745 138.63,65.88 137.25,65.88 Z"
63
+ />
64
+ <path
65
+ d="M177.57,65.88 C166.05,65.88 160.29,60.84 160.29,50.76 L160.29,29.79 L150.66,29.79 L150.66,17.64 L160.29,17.64 L160.29,5.4 L174.87,2.25 L174.87,17.64 L188.19,17.64 L188.19,29.79 L174.87,29.79 L174.87,47.88 C174.87,49.98 175.335,51.465 176.265,52.335 C177.195,53.205 178.83,53.64 181.17,53.64 C183.33,53.64 185.52,53.31 187.74,52.65 L187.74,64.44 C186.42,64.86 184.74,65.205 182.7,65.475 C180.66,65.745 178.95,65.88 177.57,65.88 Z"
66
+ />
67
+ <path
68
+ d="M217.62,66.15 C212.76,66.15 208.365,65.055 204.435,62.865 C200.505,60.675 197.4,57.72 195.12,54 C192.84,50.28 191.7,46.11 191.7,41.49 C191.7,36.87 192.795,32.7 194.985,28.98 C197.175,25.26 200.16,22.305 203.94,20.115 C207.72,17.925 211.92,16.83 216.54,16.83 C221.22,16.83 225.36,17.955 228.96,20.205 C232.56,22.455 235.395,25.53 237.465,29.43 C239.535,33.33 240.57,37.8 240.57,42.84 L240.57,46.44 L206.64,46.44 C207.6,48.66 209.1,50.475 211.14,51.885 C213.18,53.295 215.58,54 218.34,54 C222.42,54 225.6,52.8 227.88,50.4 L237.51,58.95 C234.51,61.47 231.435,63.3 228.285,64.44 C225.135,65.58 221.58,66.15 217.62,66.15 Z M206.37,36.27 L226.26,36.27 C225.48,33.99 224.205,32.16 222.435,30.78 C220.665,29.4 218.61,28.71 216.27,28.71 C213.87,28.71 211.8,29.37 210.06,30.69 C208.32,32.01 207.09,33.87 206.37,36.27 Z"
69
+ />
70
+ <path
71
+ d="M247.41,65.25 L247.41,17.64 L261.99,17.64 L261.99,22.41 C265.23,18.51 269.4,16.56 274.5,16.56 C277.08,16.62 278.91,17.01 279.99,17.73 L279.99,30.42 C277.95,29.46 275.64,28.98 273.06,28.98 C270.78,28.98 268.665,29.505 266.715,30.555 C264.765,31.605 263.19,33.09 261.99,35.01 L261.99,65.25 L247.41,65.25 Z"
72
+ />
73
+ <path
74
+ d="M286.29,65.25 L286.29,17.64 L300.87,17.64 L300.87,20.88 C304.47,18.12 308.73,16.74 313.65,16.74 C317.37,16.74 320.655,17.55 323.505,19.17 C326.355,20.79 328.59,23.04 330.21,25.92 C331.83,28.8 332.64,32.13 332.64,35.91 L332.64,65.25 L318.06,65.25 L318.06,37.89 C318.06,35.25 317.28,33.15 315.72,31.59 C314.16,30.03 312.06,29.25 309.42,29.25 C305.76,29.25 302.91,30.51 300.87,33.03 L300.87,65.25 L286.29,65.25 Z"
75
+ />
76
+ <polygon
77
+ points="342 65.25 342 2.25 392.04 2.25 392.04 15.66 357.48 15.66 357.48 27.45 380.52 27.45 380.52 40.41 357.48 40.41 357.48 65.25"
78
+ />
79
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
80
+ <path
81
+ d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
82
+ />
83
+ </g>
84
+ <g transform="translate(0.000000, 0.000000)">
85
+ <path
86
+ d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
87
+ fill="#0066CC"
88
+ />
89
+ <path
90
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
91
+ fill="url(#linearGradient-jump-links-collapsed-mobile-example-masthead)"
92
+ />
93
+ <path
94
+ 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"
95
+ fill="url(#linearGradient-jump-links-collapsed-mobile-example-masthead)"
96
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
97
+ />
98
+ </g>
99
+ </g>
100
+ </svg>
37
101
  </a>
38
102
  </div>
39
103
  <div class="pf-v5-c-masthead__content">
40
104
  <div
41
- class="pf-v5-c-toolbar pf-m-full-height pf-m-static"
105
+ class="pf-v5-c-toolbar pf-m-static"
42
106
  id="jump-links-collapsed-mobile-example-masthead-toolbar"
43
107
  >
44
108
  <div class="pf-v5-c-toolbar__content">
45
109
  <div class="pf-v5-c-toolbar__content-section">
110
+ <div class="pf-v5-c-toolbar__item">
111
+ <button
112
+ class="pf-v5-c-menu-toggle"
113
+ type="button"
114
+ aria-expanded="false"
115
+ >
116
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
117
+ <span class="pf-v5-c-menu-toggle__controls">
118
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
119
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
120
+ </span>
121
+ </span>
122
+ </button>
123
+ </div>
124
+
125
+ <div class="pf-v5-c-toolbar__item">
126
+ <button
127
+ class="pf-v5-c-menu-toggle"
128
+ type="button"
129
+ aria-expanded="false"
130
+ >
131
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
132
+ <span class="pf-v5-c-menu-toggle__controls">
133
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
134
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
135
+ </span>
136
+ </span>
137
+ </button>
138
+ </div>
139
+
46
140
  <div
47
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
141
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-spacer-none pf-m-spacer-md-on-md"
48
142
  >
49
143
  <div
50
144
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -91,27 +185,6 @@ section: components
91
185
  </button>
92
186
  </div>
93
187
  </div>
94
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
95
- <button
96
- class="pf-v5-c-menu-toggle pf-m-full-height"
97
- type="button"
98
- aria-expanded="false"
99
- >
100
- <span class="pf-v5-c-menu-toggle__icon">
101
- <img
102
- class="pf-v5-c-avatar"
103
- alt="Avatar image"
104
- src="/assets/images/img_avatar-light.svg"
105
- />
106
- </span>
107
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
108
- <span class="pf-v5-c-menu-toggle__controls">
109
- <span class="pf-v5-c-menu-toggle__toggle-icon">
110
- <i class="fas fa-angle-down" aria-hidden="true"></i>
111
- </span>
112
- </span>
113
- </button>
114
- </div>
115
188
  </div>
116
189
  </div>
117
190
  </div>
@@ -225,44 +298,64 @@ section: components
225
298
  </div>
226
299
  <ul class="pf-v5-c-jump-links__list" role="list">
227
300
  <li class="pf-v5-c-jump-links__item pf-m-current">
228
- <a
229
- class="pf-v5-c-jump-links__link"
230
- href="#jump-links-collapsed-mobile-example-jump-links-first"
231
- >
232
- <span class="pf-v5-c-jump-links__link-text">First section</span>
233
- </a>
301
+ <span class="pf-v5-c-jump-links__link">
302
+ <a
303
+ class="pf-v5-c-button pf-m-link"
304
+ href="#jump-links-collapsed-mobile-example-jump-links-first"
305
+ >
306
+ <span
307
+ class="pf-v5-c-jump-links__link-text"
308
+ >First section</span>
309
+ </a>
310
+ </span>
234
311
  </li>
235
312
  <li class="pf-v5-c-jump-links__item">
236
- <a
237
- class="pf-v5-c-jump-links__link"
238
- href="#jump-links-collapsed-mobile-example-jump-links-second"
239
- >
240
- <span class="pf-v5-c-jump-links__link-text">Second section</span>
241
- </a>
313
+ <span class="pf-v5-c-jump-links__link">
314
+ <a
315
+ class="pf-v5-c-button pf-m-link"
316
+ href="#jump-links-collapsed-mobile-example-jump-links-second"
317
+ >
318
+ <span
319
+ class="pf-v5-c-jump-links__link-text"
320
+ >Second section</span>
321
+ </a>
322
+ </span>
242
323
  </li>
243
324
  <li class="pf-v5-c-jump-links__item">
244
- <a
245
- class="pf-v5-c-jump-links__link"
246
- href="#jump-links-collapsed-mobile-example-jump-links-third"
247
- >
248
- <span class="pf-v5-c-jump-links__link-text">Third section</span>
249
- </a>
325
+ <span class="pf-v5-c-jump-links__link">
326
+ <a
327
+ class="pf-v5-c-button pf-m-link"
328
+ href="#jump-links-collapsed-mobile-example-jump-links-third"
329
+ >
330
+ <span
331
+ class="pf-v5-c-jump-links__link-text"
332
+ >Third section</span>
333
+ </a>
334
+ </span>
250
335
  </li>
251
336
  <li class="pf-v5-c-jump-links__item">
252
- <a
253
- class="pf-v5-c-jump-links__link"
254
- href="#jump-links-collapsed-mobile-example-jump-links-fourth"
255
- >
256
- <span class="pf-v5-c-jump-links__link-text">Fourth section</span>
257
- </a>
337
+ <span class="pf-v5-c-jump-links__link">
338
+ <a
339
+ class="pf-v5-c-button pf-m-link"
340
+ href="#jump-links-collapsed-mobile-example-jump-links-fourth"
341
+ >
342
+ <span
343
+ class="pf-v5-c-jump-links__link-text"
344
+ >Fourth section</span>
345
+ </a>
346
+ </span>
258
347
  </li>
259
348
  <li class="pf-v5-c-jump-links__item">
260
- <a
261
- class="pf-v5-c-jump-links__link"
262
- href="#jump-links-collapsed-mobile-example-jump-links-fifth"
263
- >
264
- <span class="pf-v5-c-jump-links__link-text">Fifth section</span>
265
- </a>
349
+ <span class="pf-v5-c-jump-links__link">
350
+ <a
351
+ class="pf-v5-c-button pf-m-link"
352
+ href="#jump-links-collapsed-mobile-example-jump-links-fifth"
353
+ >
354
+ <span
355
+ class="pf-v5-c-jump-links__link-text"
356
+ >Fifth section</span>
357
+ </a>
358
+ </span>
266
359
  </li>
267
360
  </ul>
268
361
  </nav>
@@ -335,23 +428,117 @@ section: components
335
428
  </span>
336
429
  <div class="pf-v5-c-masthead__main">
337
430
  <a class="pf-v5-c-masthead__brand" href="#">
338
- <img
339
- class="pf-v5-c-brand"
340
- src="/assets/images/pf-logo.svg"
341
- alt="PatternFly logo"
342
- style="--pf-v5-c-brand--Height:36px"
343
- />
431
+ <svg height="40px" viewBox="0 0 679 158">
432
+ <title>PF-HorizontalLogo-Color</title>
433
+ <defs>
434
+ <linearGradient
435
+ x1="68%"
436
+ y1="2.25860997e-13%"
437
+ x2="32%"
438
+ y2="100%"
439
+ id="linearGradient-jump-links-vertical-expanded-mobile-example-masthead"
440
+ >
441
+ <stop stop-color="#2B9AF3" offset="0%" />
442
+ <stop
443
+ stop-color="#73BCF7"
444
+ stop-opacity="0.502212631"
445
+ offset="100%"
446
+ />
447
+ </linearGradient>
448
+ </defs>
449
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
450
+ <g
451
+ transform="translate(206.000000, 45.750000)"
452
+ fill="var(--pf-t--global--text--color--regular)"
453
+ fill-rule="nonzero"
454
+ >
455
+ <path
456
+ d="M0,65.25 L0,2.25 L33.21,2.25 C37.35,2.25 41.025,3.135 44.235,4.905 C47.445,6.675 49.98,9.09 51.84,12.15 C53.7,15.21 54.63,18.72 54.63,22.68 C54.63,26.46 53.7,29.865 51.84,32.895 C49.98,35.925 47.43,38.31 44.19,40.05 C40.95,41.79 37.29,42.66 33.21,42.66 L15.48,42.66 L15.48,65.25 L0,65.25 Z M15.48,29.88 L31.41,29.88 C33.69,29.88 35.52,29.22 36.9,27.9 C38.28,26.58 38.97,24.87 38.97,22.77 C38.97,20.61 38.28,18.855 36.9,17.505 C35.52,16.155 33.69,15.48 31.41,15.48 L15.48,15.48 L15.48,29.88 Z"
457
+ />
458
+ <path
459
+ d="M77.04,66.06 C73.68,66.06 70.695,65.43 68.085,64.17 C65.475,62.91 63.435,61.17 61.965,58.95 C60.495,56.73 59.76,54.18 59.76,51.3 C59.76,46.74 61.485,43.215 64.935,40.725 C68.385,38.235 73.2,36.99 79.38,36.99 C83.1,36.99 86.7,37.44 90.18,38.34 L90.18,36 C90.18,31.26 87.15,28.89 81.09,28.89 C77.49,28.89 72.69,30.15 66.69,32.67 L61.47,21.96 C69.15,18.48 76.56,16.74 83.7,16.74 C90.3,16.74 95.43,18.315 99.09,21.465 C102.75,24.615 104.58,29.04 104.58,34.74 L104.58,65.25 L90.18,65.25 L90.18,62.37 C88.26,63.69 86.235,64.635 84.105,65.205 C81.975,65.775 79.62,66.06 77.04,66.06 Z M73.62,51.03 C73.62,52.53 74.28,53.7 75.6,54.54 C76.92,55.38 78.75,55.8 81.09,55.8 C84.69,55.8 87.72,55.05 90.18,53.55 L90.18,47.43 C87.42,46.71 84.54,46.35 81.54,46.35 C79.02,46.35 77.07,46.755 75.69,47.565 C74.31,48.375 73.62,49.53 73.62,51.03 Z"
460
+ />
461
+ <path
462
+ d="M137.25,65.88 C125.73,65.88 119.97,60.84 119.97,50.76 L119.97,29.79 L110.34,29.79 L110.34,17.64 L119.97,17.64 L119.97,5.4 L134.55,2.25 L134.55,17.64 L147.87,17.64 L147.87,29.79 L134.55,29.79 L134.55,47.88 C134.55,49.98 135.015,51.465 135.945,52.335 C136.875,53.205 138.51,53.64 140.85,53.64 C143.01,53.64 145.2,53.31 147.42,52.65 L147.42,64.44 C146.1,64.86 144.42,65.205 142.38,65.475 C140.34,65.745 138.63,65.88 137.25,65.88 Z"
463
+ />
464
+ <path
465
+ d="M177.57,65.88 C166.05,65.88 160.29,60.84 160.29,50.76 L160.29,29.79 L150.66,29.79 L150.66,17.64 L160.29,17.64 L160.29,5.4 L174.87,2.25 L174.87,17.64 L188.19,17.64 L188.19,29.79 L174.87,29.79 L174.87,47.88 C174.87,49.98 175.335,51.465 176.265,52.335 C177.195,53.205 178.83,53.64 181.17,53.64 C183.33,53.64 185.52,53.31 187.74,52.65 L187.74,64.44 C186.42,64.86 184.74,65.205 182.7,65.475 C180.66,65.745 178.95,65.88 177.57,65.88 Z"
466
+ />
467
+ <path
468
+ d="M217.62,66.15 C212.76,66.15 208.365,65.055 204.435,62.865 C200.505,60.675 197.4,57.72 195.12,54 C192.84,50.28 191.7,46.11 191.7,41.49 C191.7,36.87 192.795,32.7 194.985,28.98 C197.175,25.26 200.16,22.305 203.94,20.115 C207.72,17.925 211.92,16.83 216.54,16.83 C221.22,16.83 225.36,17.955 228.96,20.205 C232.56,22.455 235.395,25.53 237.465,29.43 C239.535,33.33 240.57,37.8 240.57,42.84 L240.57,46.44 L206.64,46.44 C207.6,48.66 209.1,50.475 211.14,51.885 C213.18,53.295 215.58,54 218.34,54 C222.42,54 225.6,52.8 227.88,50.4 L237.51,58.95 C234.51,61.47 231.435,63.3 228.285,64.44 C225.135,65.58 221.58,66.15 217.62,66.15 Z M206.37,36.27 L226.26,36.27 C225.48,33.99 224.205,32.16 222.435,30.78 C220.665,29.4 218.61,28.71 216.27,28.71 C213.87,28.71 211.8,29.37 210.06,30.69 C208.32,32.01 207.09,33.87 206.37,36.27 Z"
469
+ />
470
+ <path
471
+ d="M247.41,65.25 L247.41,17.64 L261.99,17.64 L261.99,22.41 C265.23,18.51 269.4,16.56 274.5,16.56 C277.08,16.62 278.91,17.01 279.99,17.73 L279.99,30.42 C277.95,29.46 275.64,28.98 273.06,28.98 C270.78,28.98 268.665,29.505 266.715,30.555 C264.765,31.605 263.19,33.09 261.99,35.01 L261.99,65.25 L247.41,65.25 Z"
472
+ />
473
+ <path
474
+ d="M286.29,65.25 L286.29,17.64 L300.87,17.64 L300.87,20.88 C304.47,18.12 308.73,16.74 313.65,16.74 C317.37,16.74 320.655,17.55 323.505,19.17 C326.355,20.79 328.59,23.04 330.21,25.92 C331.83,28.8 332.64,32.13 332.64,35.91 L332.64,65.25 L318.06,65.25 L318.06,37.89 C318.06,35.25 317.28,33.15 315.72,31.59 C314.16,30.03 312.06,29.25 309.42,29.25 C305.76,29.25 302.91,30.51 300.87,33.03 L300.87,65.25 L286.29,65.25 Z"
475
+ />
476
+ <polygon
477
+ points="342 65.25 342 2.25 392.04 2.25 392.04 15.66 357.48 15.66 357.48 27.45 380.52 27.45 380.52 40.41 357.48 40.41 357.48 65.25"
478
+ />
479
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
480
+ <path
481
+ d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
482
+ />
483
+ </g>
484
+ <g transform="translate(0.000000, 0.000000)">
485
+ <path
486
+ d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
487
+ fill="#0066CC"
488
+ />
489
+ <path
490
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
491
+ fill="url(#linearGradient-jump-links-vertical-expanded-mobile-example-masthead)"
492
+ />
493
+ <path
494
+ 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"
495
+ fill="url(#linearGradient-jump-links-vertical-expanded-mobile-example-masthead)"
496
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
497
+ />
498
+ </g>
499
+ </g>
500
+ </svg>
344
501
  </a>
345
502
  </div>
346
503
  <div class="pf-v5-c-masthead__content">
347
504
  <div
348
- class="pf-v5-c-toolbar pf-m-full-height pf-m-static"
505
+ class="pf-v5-c-toolbar pf-m-static"
349
506
  id="jump-links-vertical-expanded-mobile-example-masthead-toolbar"
350
507
  >
351
508
  <div class="pf-v5-c-toolbar__content">
352
509
  <div class="pf-v5-c-toolbar__content-section">
510
+ <div class="pf-v5-c-toolbar__item">
511
+ <button
512
+ class="pf-v5-c-menu-toggle"
513
+ type="button"
514
+ aria-expanded="false"
515
+ >
516
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
517
+ <span class="pf-v5-c-menu-toggle__controls">
518
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
519
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
520
+ </span>
521
+ </span>
522
+ </button>
523
+ </div>
524
+
525
+ <div class="pf-v5-c-toolbar__item">
526
+ <button
527
+ class="pf-v5-c-menu-toggle"
528
+ type="button"
529
+ aria-expanded="false"
530
+ >
531
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
532
+ <span class="pf-v5-c-menu-toggle__controls">
533
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
534
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
535
+ </span>
536
+ </span>
537
+ </button>
538
+ </div>
539
+
353
540
  <div
354
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
541
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-spacer-none pf-m-spacer-md-on-md"
355
542
  >
356
543
  <div
357
544
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -398,27 +585,6 @@ section: components
398
585
  </button>
399
586
  </div>
400
587
  </div>
401
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
402
- <button
403
- class="pf-v5-c-menu-toggle pf-m-full-height"
404
- type="button"
405
- aria-expanded="false"
406
- >
407
- <span class="pf-v5-c-menu-toggle__icon">
408
- <img
409
- class="pf-v5-c-avatar"
410
- alt="Avatar image"
411
- src="/assets/images/img_avatar-light.svg"
412
- />
413
- </span>
414
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
415
- <span class="pf-v5-c-menu-toggle__controls">
416
- <span class="pf-v5-c-menu-toggle__toggle-icon">
417
- <i class="fas fa-angle-down" aria-hidden="true"></i>
418
- </span>
419
- </span>
420
- </button>
421
- </div>
422
588
  </div>
423
589
  </div>
424
590
  </div>
@@ -532,44 +698,64 @@ section: components
532
698
  </div>
533
699
  <ul class="pf-v5-c-jump-links__list" role="list">
534
700
  <li class="pf-v5-c-jump-links__item pf-m-current">
535
- <a
536
- class="pf-v5-c-jump-links__link"
537
- href="#jump-links-vertical-expanded-mobile-example-jump-links-first"
538
- >
539
- <span class="pf-v5-c-jump-links__link-text">First section</span>
540
- </a>
701
+ <span class="pf-v5-c-jump-links__link">
702
+ <a
703
+ class="pf-v5-c-button pf-m-link"
704
+ href="#jump-links-vertical-expanded-mobile-example-jump-links-first"
705
+ >
706
+ <span
707
+ class="pf-v5-c-jump-links__link-text"
708
+ >First section</span>
709
+ </a>
710
+ </span>
541
711
  </li>
542
712
  <li class="pf-v5-c-jump-links__item">
543
- <a
544
- class="pf-v5-c-jump-links__link"
545
- href="#jump-links-vertical-expanded-mobile-example-jump-links-second"
546
- >
547
- <span class="pf-v5-c-jump-links__link-text">Second section</span>
548
- </a>
713
+ <span class="pf-v5-c-jump-links__link">
714
+ <a
715
+ class="pf-v5-c-button pf-m-link"
716
+ href="#jump-links-vertical-expanded-mobile-example-jump-links-second"
717
+ >
718
+ <span
719
+ class="pf-v5-c-jump-links__link-text"
720
+ >Second section</span>
721
+ </a>
722
+ </span>
549
723
  </li>
550
724
  <li class="pf-v5-c-jump-links__item">
551
- <a
552
- class="pf-v5-c-jump-links__link"
553
- href="#jump-links-vertical-expanded-mobile-example-jump-links-third"
554
- >
555
- <span class="pf-v5-c-jump-links__link-text">Third section</span>
556
- </a>
725
+ <span class="pf-v5-c-jump-links__link">
726
+ <a
727
+ class="pf-v5-c-button pf-m-link"
728
+ href="#jump-links-vertical-expanded-mobile-example-jump-links-third"
729
+ >
730
+ <span
731
+ class="pf-v5-c-jump-links__link-text"
732
+ >Third section</span>
733
+ </a>
734
+ </span>
557
735
  </li>
558
736
  <li class="pf-v5-c-jump-links__item">
559
- <a
560
- class="pf-v5-c-jump-links__link"
561
- href="#jump-links-vertical-expanded-mobile-example-jump-links-fourth"
562
- >
563
- <span class="pf-v5-c-jump-links__link-text">Fourth section</span>
564
- </a>
737
+ <span class="pf-v5-c-jump-links__link">
738
+ <a
739
+ class="pf-v5-c-button pf-m-link"
740
+ href="#jump-links-vertical-expanded-mobile-example-jump-links-fourth"
741
+ >
742
+ <span
743
+ class="pf-v5-c-jump-links__link-text"
744
+ >Fourth section</span>
745
+ </a>
746
+ </span>
565
747
  </li>
566
748
  <li class="pf-v5-c-jump-links__item">
567
- <a
568
- class="pf-v5-c-jump-links__link"
569
- href="#jump-links-vertical-expanded-mobile-example-jump-links-fifth"
570
- >
571
- <span class="pf-v5-c-jump-links__link-text">Fifth section</span>
572
- </a>
749
+ <span class="pf-v5-c-jump-links__link">
750
+ <a
751
+ class="pf-v5-c-button pf-m-link"
752
+ href="#jump-links-vertical-expanded-mobile-example-jump-links-fifth"
753
+ >
754
+ <span
755
+ class="pf-v5-c-jump-links__link-text"
756
+ >Fifth section</span>
757
+ </a>
758
+ </span>
573
759
  </li>
574
760
  </ul>
575
761
  </nav>
@@ -642,23 +828,117 @@ section: components
642
828
  </span>
643
829
  <div class="pf-v5-c-masthead__main">
644
830
  <a class="pf-v5-c-masthead__brand" href="#">
645
- <img
646
- class="pf-v5-c-brand"
647
- src="/assets/images/pf-logo.svg"
648
- alt="PatternFly logo"
649
- style="--pf-v5-c-brand--Height:36px"
650
- />
831
+ <svg height="40px" viewBox="0 0 679 158">
832
+ <title>PF-HorizontalLogo-Color</title>
833
+ <defs>
834
+ <linearGradient
835
+ x1="68%"
836
+ y1="2.25860997e-13%"
837
+ x2="32%"
838
+ y2="100%"
839
+ id="linearGradient-jump-links-vertical-toggle-text-mobile-example-masthead"
840
+ >
841
+ <stop stop-color="#2B9AF3" offset="0%" />
842
+ <stop
843
+ stop-color="#73BCF7"
844
+ stop-opacity="0.502212631"
845
+ offset="100%"
846
+ />
847
+ </linearGradient>
848
+ </defs>
849
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
850
+ <g
851
+ transform="translate(206.000000, 45.750000)"
852
+ fill="var(--pf-t--global--text--color--regular)"
853
+ fill-rule="nonzero"
854
+ >
855
+ <path
856
+ d="M0,65.25 L0,2.25 L33.21,2.25 C37.35,2.25 41.025,3.135 44.235,4.905 C47.445,6.675 49.98,9.09 51.84,12.15 C53.7,15.21 54.63,18.72 54.63,22.68 C54.63,26.46 53.7,29.865 51.84,32.895 C49.98,35.925 47.43,38.31 44.19,40.05 C40.95,41.79 37.29,42.66 33.21,42.66 L15.48,42.66 L15.48,65.25 L0,65.25 Z M15.48,29.88 L31.41,29.88 C33.69,29.88 35.52,29.22 36.9,27.9 C38.28,26.58 38.97,24.87 38.97,22.77 C38.97,20.61 38.28,18.855 36.9,17.505 C35.52,16.155 33.69,15.48 31.41,15.48 L15.48,15.48 L15.48,29.88 Z"
857
+ />
858
+ <path
859
+ d="M77.04,66.06 C73.68,66.06 70.695,65.43 68.085,64.17 C65.475,62.91 63.435,61.17 61.965,58.95 C60.495,56.73 59.76,54.18 59.76,51.3 C59.76,46.74 61.485,43.215 64.935,40.725 C68.385,38.235 73.2,36.99 79.38,36.99 C83.1,36.99 86.7,37.44 90.18,38.34 L90.18,36 C90.18,31.26 87.15,28.89 81.09,28.89 C77.49,28.89 72.69,30.15 66.69,32.67 L61.47,21.96 C69.15,18.48 76.56,16.74 83.7,16.74 C90.3,16.74 95.43,18.315 99.09,21.465 C102.75,24.615 104.58,29.04 104.58,34.74 L104.58,65.25 L90.18,65.25 L90.18,62.37 C88.26,63.69 86.235,64.635 84.105,65.205 C81.975,65.775 79.62,66.06 77.04,66.06 Z M73.62,51.03 C73.62,52.53 74.28,53.7 75.6,54.54 C76.92,55.38 78.75,55.8 81.09,55.8 C84.69,55.8 87.72,55.05 90.18,53.55 L90.18,47.43 C87.42,46.71 84.54,46.35 81.54,46.35 C79.02,46.35 77.07,46.755 75.69,47.565 C74.31,48.375 73.62,49.53 73.62,51.03 Z"
860
+ />
861
+ <path
862
+ d="M137.25,65.88 C125.73,65.88 119.97,60.84 119.97,50.76 L119.97,29.79 L110.34,29.79 L110.34,17.64 L119.97,17.64 L119.97,5.4 L134.55,2.25 L134.55,17.64 L147.87,17.64 L147.87,29.79 L134.55,29.79 L134.55,47.88 C134.55,49.98 135.015,51.465 135.945,52.335 C136.875,53.205 138.51,53.64 140.85,53.64 C143.01,53.64 145.2,53.31 147.42,52.65 L147.42,64.44 C146.1,64.86 144.42,65.205 142.38,65.475 C140.34,65.745 138.63,65.88 137.25,65.88 Z"
863
+ />
864
+ <path
865
+ d="M177.57,65.88 C166.05,65.88 160.29,60.84 160.29,50.76 L160.29,29.79 L150.66,29.79 L150.66,17.64 L160.29,17.64 L160.29,5.4 L174.87,2.25 L174.87,17.64 L188.19,17.64 L188.19,29.79 L174.87,29.79 L174.87,47.88 C174.87,49.98 175.335,51.465 176.265,52.335 C177.195,53.205 178.83,53.64 181.17,53.64 C183.33,53.64 185.52,53.31 187.74,52.65 L187.74,64.44 C186.42,64.86 184.74,65.205 182.7,65.475 C180.66,65.745 178.95,65.88 177.57,65.88 Z"
866
+ />
867
+ <path
868
+ d="M217.62,66.15 C212.76,66.15 208.365,65.055 204.435,62.865 C200.505,60.675 197.4,57.72 195.12,54 C192.84,50.28 191.7,46.11 191.7,41.49 C191.7,36.87 192.795,32.7 194.985,28.98 C197.175,25.26 200.16,22.305 203.94,20.115 C207.72,17.925 211.92,16.83 216.54,16.83 C221.22,16.83 225.36,17.955 228.96,20.205 C232.56,22.455 235.395,25.53 237.465,29.43 C239.535,33.33 240.57,37.8 240.57,42.84 L240.57,46.44 L206.64,46.44 C207.6,48.66 209.1,50.475 211.14,51.885 C213.18,53.295 215.58,54 218.34,54 C222.42,54 225.6,52.8 227.88,50.4 L237.51,58.95 C234.51,61.47 231.435,63.3 228.285,64.44 C225.135,65.58 221.58,66.15 217.62,66.15 Z M206.37,36.27 L226.26,36.27 C225.48,33.99 224.205,32.16 222.435,30.78 C220.665,29.4 218.61,28.71 216.27,28.71 C213.87,28.71 211.8,29.37 210.06,30.69 C208.32,32.01 207.09,33.87 206.37,36.27 Z"
869
+ />
870
+ <path
871
+ d="M247.41,65.25 L247.41,17.64 L261.99,17.64 L261.99,22.41 C265.23,18.51 269.4,16.56 274.5,16.56 C277.08,16.62 278.91,17.01 279.99,17.73 L279.99,30.42 C277.95,29.46 275.64,28.98 273.06,28.98 C270.78,28.98 268.665,29.505 266.715,30.555 C264.765,31.605 263.19,33.09 261.99,35.01 L261.99,65.25 L247.41,65.25 Z"
872
+ />
873
+ <path
874
+ d="M286.29,65.25 L286.29,17.64 L300.87,17.64 L300.87,20.88 C304.47,18.12 308.73,16.74 313.65,16.74 C317.37,16.74 320.655,17.55 323.505,19.17 C326.355,20.79 328.59,23.04 330.21,25.92 C331.83,28.8 332.64,32.13 332.64,35.91 L332.64,65.25 L318.06,65.25 L318.06,37.89 C318.06,35.25 317.28,33.15 315.72,31.59 C314.16,30.03 312.06,29.25 309.42,29.25 C305.76,29.25 302.91,30.51 300.87,33.03 L300.87,65.25 L286.29,65.25 Z"
875
+ />
876
+ <polygon
877
+ points="342 65.25 342 2.25 392.04 2.25 392.04 15.66 357.48 15.66 357.48 27.45 380.52 27.45 380.52 40.41 357.48 40.41 357.48 65.25"
878
+ />
879
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
880
+ <path
881
+ d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
882
+ />
883
+ </g>
884
+ <g transform="translate(0.000000, 0.000000)">
885
+ <path
886
+ d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
887
+ fill="#0066CC"
888
+ />
889
+ <path
890
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
891
+ fill="url(#linearGradient-jump-links-vertical-toggle-text-mobile-example-masthead)"
892
+ />
893
+ <path
894
+ 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"
895
+ fill="url(#linearGradient-jump-links-vertical-toggle-text-mobile-example-masthead)"
896
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
897
+ />
898
+ </g>
899
+ </g>
900
+ </svg>
651
901
  </a>
652
902
  </div>
653
903
  <div class="pf-v5-c-masthead__content">
654
904
  <div
655
- class="pf-v5-c-toolbar pf-m-full-height pf-m-static"
905
+ class="pf-v5-c-toolbar pf-m-static"
656
906
  id="jump-links-vertical-toggle-text-mobile-example-masthead-toolbar"
657
907
  >
658
908
  <div class="pf-v5-c-toolbar__content">
659
909
  <div class="pf-v5-c-toolbar__content-section">
910
+ <div class="pf-v5-c-toolbar__item">
911
+ <button
912
+ class="pf-v5-c-menu-toggle"
913
+ type="button"
914
+ aria-expanded="false"
915
+ >
916
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
917
+ <span class="pf-v5-c-menu-toggle__controls">
918
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
919
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
920
+ </span>
921
+ </span>
922
+ </button>
923
+ </div>
924
+
925
+ <div class="pf-v5-c-toolbar__item">
926
+ <button
927
+ class="pf-v5-c-menu-toggle"
928
+ type="button"
929
+ aria-expanded="false"
930
+ >
931
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
932
+ <span class="pf-v5-c-menu-toggle__controls">
933
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
934
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
935
+ </span>
936
+ </span>
937
+ </button>
938
+ </div>
939
+
660
940
  <div
661
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
941
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-spacer-none pf-m-spacer-md-on-md"
662
942
  >
663
943
  <div
664
944
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -705,27 +985,6 @@ section: components
705
985
  </button>
706
986
  </div>
707
987
  </div>
708
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
709
- <button
710
- class="pf-v5-c-menu-toggle pf-m-full-height"
711
- type="button"
712
- aria-expanded="false"
713
- >
714
- <span class="pf-v5-c-menu-toggle__icon">
715
- <img
716
- class="pf-v5-c-avatar"
717
- alt="Avatar image"
718
- src="/assets/images/img_avatar-light.svg"
719
- />
720
- </span>
721
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
722
- <span class="pf-v5-c-menu-toggle__controls">
723
- <span class="pf-v5-c-menu-toggle__toggle-icon">
724
- <i class="fas fa-angle-down" aria-hidden="true"></i>
725
- </span>
726
- </span>
727
- </button>
728
- </div>
729
988
  </div>
730
989
  </div>
731
990
  </div>
@@ -839,44 +1098,64 @@ section: components
839
1098
  </div>
840
1099
  <ul class="pf-v5-c-jump-links__list" role="list">
841
1100
  <li class="pf-v5-c-jump-links__item pf-m-current">
842
- <a
843
- class="pf-v5-c-jump-links__link"
844
- href="#jump-links-vertical-toggle-text-mobile-example-jump-links-first"
845
- >
846
- <span class="pf-v5-c-jump-links__link-text">First section</span>
847
- </a>
1101
+ <span class="pf-v5-c-jump-links__link">
1102
+ <a
1103
+ class="pf-v5-c-button pf-m-link"
1104
+ href="#jump-links-vertical-toggle-text-mobile-example-jump-links-first"
1105
+ >
1106
+ <span
1107
+ class="pf-v5-c-jump-links__link-text"
1108
+ >First section</span>
1109
+ </a>
1110
+ </span>
848
1111
  </li>
849
1112
  <li class="pf-v5-c-jump-links__item">
850
- <a
851
- class="pf-v5-c-jump-links__link"
852
- href="#jump-links-vertical-toggle-text-mobile-example-jump-links-second"
853
- >
854
- <span class="pf-v5-c-jump-links__link-text">Second section</span>
855
- </a>
1113
+ <span class="pf-v5-c-jump-links__link">
1114
+ <a
1115
+ class="pf-v5-c-button pf-m-link"
1116
+ href="#jump-links-vertical-toggle-text-mobile-example-jump-links-second"
1117
+ >
1118
+ <span
1119
+ class="pf-v5-c-jump-links__link-text"
1120
+ >Second section</span>
1121
+ </a>
1122
+ </span>
856
1123
  </li>
857
1124
  <li class="pf-v5-c-jump-links__item">
858
- <a
859
- class="pf-v5-c-jump-links__link"
860
- href="#jump-links-vertical-toggle-text-mobile-example-jump-links-third"
861
- >
862
- <span class="pf-v5-c-jump-links__link-text">Third section</span>
863
- </a>
1125
+ <span class="pf-v5-c-jump-links__link">
1126
+ <a
1127
+ class="pf-v5-c-button pf-m-link"
1128
+ href="#jump-links-vertical-toggle-text-mobile-example-jump-links-third"
1129
+ >
1130
+ <span
1131
+ class="pf-v5-c-jump-links__link-text"
1132
+ >Third section</span>
1133
+ </a>
1134
+ </span>
864
1135
  </li>
865
1136
  <li class="pf-v5-c-jump-links__item">
866
- <a
867
- class="pf-v5-c-jump-links__link"
868
- href="#jump-links-vertical-toggle-text-mobile-example-jump-links-fourth"
869
- >
870
- <span class="pf-v5-c-jump-links__link-text">Fourth section</span>
871
- </a>
1137
+ <span class="pf-v5-c-jump-links__link">
1138
+ <a
1139
+ class="pf-v5-c-button pf-m-link"
1140
+ href="#jump-links-vertical-toggle-text-mobile-example-jump-links-fourth"
1141
+ >
1142
+ <span
1143
+ class="pf-v5-c-jump-links__link-text"
1144
+ >Fourth section</span>
1145
+ </a>
1146
+ </span>
872
1147
  </li>
873
1148
  <li class="pf-v5-c-jump-links__item">
874
- <a
875
- class="pf-v5-c-jump-links__link"
876
- href="#jump-links-vertical-toggle-text-mobile-example-jump-links-fifth"
877
- >
878
- <span class="pf-v5-c-jump-links__link-text">Fifth section</span>
879
- </a>
1149
+ <span class="pf-v5-c-jump-links__link">
1150
+ <a
1151
+ class="pf-v5-c-button pf-m-link"
1152
+ href="#jump-links-vertical-toggle-text-mobile-example-jump-links-fifth"
1153
+ >
1154
+ <span
1155
+ class="pf-v5-c-jump-links__link-text"
1156
+ >Fifth section</span>
1157
+ </a>
1158
+ </span>
880
1159
  </li>
881
1160
  </ul>
882
1161
  </nav>
@@ -946,23 +1225,117 @@ section: components
946
1225
  </span>
947
1226
  <div class="pf-v5-c-masthead__main">
948
1227
  <a class="pf-v5-c-masthead__brand" href="#">
949
- <img
950
- class="pf-v5-c-brand"
951
- src="/assets/images/pf-logo.svg"
952
- alt="PatternFly logo"
953
- style="--pf-v5-c-brand--Height:36px"
954
- />
1228
+ <svg height="40px" viewBox="0 0 679 158">
1229
+ <title>PF-HorizontalLogo-Color</title>
1230
+ <defs>
1231
+ <linearGradient
1232
+ x1="68%"
1233
+ y1="2.25860997e-13%"
1234
+ x2="32%"
1235
+ y2="100%"
1236
+ id="linearGradient-jump-links-horizontal-example-masthead"
1237
+ >
1238
+ <stop stop-color="#2B9AF3" offset="0%" />
1239
+ <stop
1240
+ stop-color="#73BCF7"
1241
+ stop-opacity="0.502212631"
1242
+ offset="100%"
1243
+ />
1244
+ </linearGradient>
1245
+ </defs>
1246
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1247
+ <g
1248
+ transform="translate(206.000000, 45.750000)"
1249
+ fill="var(--pf-t--global--text--color--regular)"
1250
+ fill-rule="nonzero"
1251
+ >
1252
+ <path
1253
+ d="M0,65.25 L0,2.25 L33.21,2.25 C37.35,2.25 41.025,3.135 44.235,4.905 C47.445,6.675 49.98,9.09 51.84,12.15 C53.7,15.21 54.63,18.72 54.63,22.68 C54.63,26.46 53.7,29.865 51.84,32.895 C49.98,35.925 47.43,38.31 44.19,40.05 C40.95,41.79 37.29,42.66 33.21,42.66 L15.48,42.66 L15.48,65.25 L0,65.25 Z M15.48,29.88 L31.41,29.88 C33.69,29.88 35.52,29.22 36.9,27.9 C38.28,26.58 38.97,24.87 38.97,22.77 C38.97,20.61 38.28,18.855 36.9,17.505 C35.52,16.155 33.69,15.48 31.41,15.48 L15.48,15.48 L15.48,29.88 Z"
1254
+ />
1255
+ <path
1256
+ d="M77.04,66.06 C73.68,66.06 70.695,65.43 68.085,64.17 C65.475,62.91 63.435,61.17 61.965,58.95 C60.495,56.73 59.76,54.18 59.76,51.3 C59.76,46.74 61.485,43.215 64.935,40.725 C68.385,38.235 73.2,36.99 79.38,36.99 C83.1,36.99 86.7,37.44 90.18,38.34 L90.18,36 C90.18,31.26 87.15,28.89 81.09,28.89 C77.49,28.89 72.69,30.15 66.69,32.67 L61.47,21.96 C69.15,18.48 76.56,16.74 83.7,16.74 C90.3,16.74 95.43,18.315 99.09,21.465 C102.75,24.615 104.58,29.04 104.58,34.74 L104.58,65.25 L90.18,65.25 L90.18,62.37 C88.26,63.69 86.235,64.635 84.105,65.205 C81.975,65.775 79.62,66.06 77.04,66.06 Z M73.62,51.03 C73.62,52.53 74.28,53.7 75.6,54.54 C76.92,55.38 78.75,55.8 81.09,55.8 C84.69,55.8 87.72,55.05 90.18,53.55 L90.18,47.43 C87.42,46.71 84.54,46.35 81.54,46.35 C79.02,46.35 77.07,46.755 75.69,47.565 C74.31,48.375 73.62,49.53 73.62,51.03 Z"
1257
+ />
1258
+ <path
1259
+ d="M137.25,65.88 C125.73,65.88 119.97,60.84 119.97,50.76 L119.97,29.79 L110.34,29.79 L110.34,17.64 L119.97,17.64 L119.97,5.4 L134.55,2.25 L134.55,17.64 L147.87,17.64 L147.87,29.79 L134.55,29.79 L134.55,47.88 C134.55,49.98 135.015,51.465 135.945,52.335 C136.875,53.205 138.51,53.64 140.85,53.64 C143.01,53.64 145.2,53.31 147.42,52.65 L147.42,64.44 C146.1,64.86 144.42,65.205 142.38,65.475 C140.34,65.745 138.63,65.88 137.25,65.88 Z"
1260
+ />
1261
+ <path
1262
+ d="M177.57,65.88 C166.05,65.88 160.29,60.84 160.29,50.76 L160.29,29.79 L150.66,29.79 L150.66,17.64 L160.29,17.64 L160.29,5.4 L174.87,2.25 L174.87,17.64 L188.19,17.64 L188.19,29.79 L174.87,29.79 L174.87,47.88 C174.87,49.98 175.335,51.465 176.265,52.335 C177.195,53.205 178.83,53.64 181.17,53.64 C183.33,53.64 185.52,53.31 187.74,52.65 L187.74,64.44 C186.42,64.86 184.74,65.205 182.7,65.475 C180.66,65.745 178.95,65.88 177.57,65.88 Z"
1263
+ />
1264
+ <path
1265
+ d="M217.62,66.15 C212.76,66.15 208.365,65.055 204.435,62.865 C200.505,60.675 197.4,57.72 195.12,54 C192.84,50.28 191.7,46.11 191.7,41.49 C191.7,36.87 192.795,32.7 194.985,28.98 C197.175,25.26 200.16,22.305 203.94,20.115 C207.72,17.925 211.92,16.83 216.54,16.83 C221.22,16.83 225.36,17.955 228.96,20.205 C232.56,22.455 235.395,25.53 237.465,29.43 C239.535,33.33 240.57,37.8 240.57,42.84 L240.57,46.44 L206.64,46.44 C207.6,48.66 209.1,50.475 211.14,51.885 C213.18,53.295 215.58,54 218.34,54 C222.42,54 225.6,52.8 227.88,50.4 L237.51,58.95 C234.51,61.47 231.435,63.3 228.285,64.44 C225.135,65.58 221.58,66.15 217.62,66.15 Z M206.37,36.27 L226.26,36.27 C225.48,33.99 224.205,32.16 222.435,30.78 C220.665,29.4 218.61,28.71 216.27,28.71 C213.87,28.71 211.8,29.37 210.06,30.69 C208.32,32.01 207.09,33.87 206.37,36.27 Z"
1266
+ />
1267
+ <path
1268
+ d="M247.41,65.25 L247.41,17.64 L261.99,17.64 L261.99,22.41 C265.23,18.51 269.4,16.56 274.5,16.56 C277.08,16.62 278.91,17.01 279.99,17.73 L279.99,30.42 C277.95,29.46 275.64,28.98 273.06,28.98 C270.78,28.98 268.665,29.505 266.715,30.555 C264.765,31.605 263.19,33.09 261.99,35.01 L261.99,65.25 L247.41,65.25 Z"
1269
+ />
1270
+ <path
1271
+ d="M286.29,65.25 L286.29,17.64 L300.87,17.64 L300.87,20.88 C304.47,18.12 308.73,16.74 313.65,16.74 C317.37,16.74 320.655,17.55 323.505,19.17 C326.355,20.79 328.59,23.04 330.21,25.92 C331.83,28.8 332.64,32.13 332.64,35.91 L332.64,65.25 L318.06,65.25 L318.06,37.89 C318.06,35.25 317.28,33.15 315.72,31.59 C314.16,30.03 312.06,29.25 309.42,29.25 C305.76,29.25 302.91,30.51 300.87,33.03 L300.87,65.25 L286.29,65.25 Z"
1272
+ />
1273
+ <polygon
1274
+ points="342 65.25 342 2.25 392.04 2.25 392.04 15.66 357.48 15.66 357.48 27.45 380.52 27.45 380.52 40.41 357.48 40.41 357.48 65.25"
1275
+ />
1276
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
1277
+ <path
1278
+ d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
1279
+ />
1280
+ </g>
1281
+ <g transform="translate(0.000000, 0.000000)">
1282
+ <path
1283
+ d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
1284
+ fill="#0066CC"
1285
+ />
1286
+ <path
1287
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
1288
+ fill="url(#linearGradient-jump-links-horizontal-example-masthead)"
1289
+ />
1290
+ <path
1291
+ 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"
1292
+ fill="url(#linearGradient-jump-links-horizontal-example-masthead)"
1293
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
1294
+ />
1295
+ </g>
1296
+ </g>
1297
+ </svg>
955
1298
  </a>
956
1299
  </div>
957
1300
  <div class="pf-v5-c-masthead__content">
958
1301
  <div
959
- class="pf-v5-c-toolbar pf-m-full-height pf-m-static"
1302
+ class="pf-v5-c-toolbar pf-m-static"
960
1303
  id="jump-links-horizontal-example-masthead-toolbar"
961
1304
  >
962
1305
  <div class="pf-v5-c-toolbar__content">
963
1306
  <div class="pf-v5-c-toolbar__content-section">
1307
+ <div class="pf-v5-c-toolbar__item">
1308
+ <button
1309
+ class="pf-v5-c-menu-toggle"
1310
+ type="button"
1311
+ aria-expanded="false"
1312
+ >
1313
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
1314
+ <span class="pf-v5-c-menu-toggle__controls">
1315
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
1316
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
1317
+ </span>
1318
+ </span>
1319
+ </button>
1320
+ </div>
1321
+
1322
+ <div class="pf-v5-c-toolbar__item">
1323
+ <button
1324
+ class="pf-v5-c-menu-toggle"
1325
+ type="button"
1326
+ aria-expanded="false"
1327
+ >
1328
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
1329
+ <span class="pf-v5-c-menu-toggle__controls">
1330
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
1331
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
1332
+ </span>
1333
+ </span>
1334
+ </button>
1335
+ </div>
1336
+
964
1337
  <div
965
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
1338
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-spacer-none pf-m-spacer-md-on-md"
966
1339
  >
967
1340
  <div
968
1341
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -1009,27 +1382,6 @@ section: components
1009
1382
  </button>
1010
1383
  </div>
1011
1384
  </div>
1012
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
1013
- <button
1014
- class="pf-v5-c-menu-toggle pf-m-full-height"
1015
- type="button"
1016
- aria-expanded="false"
1017
- >
1018
- <span class="pf-v5-c-menu-toggle__icon">
1019
- <img
1020
- class="pf-v5-c-avatar"
1021
- alt="Avatar image"
1022
- src="/assets/images/img_avatar-light.svg"
1023
- />
1024
- </span>
1025
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
1026
- <span class="pf-v5-c-menu-toggle__controls">
1027
- <span class="pf-v5-c-menu-toggle__toggle-icon">
1028
- <i class="fas fa-angle-down" aria-hidden="true"></i>
1029
- </span>
1030
- </span>
1031
- </button>
1032
- </div>
1033
1385
  </div>
1034
1386
  </div>
1035
1387
  </div>
@@ -1123,29 +1475,39 @@ section: components
1123
1475
  </div>
1124
1476
  <ul class="pf-v5-c-jump-links__list" role="list">
1125
1477
  <li class="pf-v5-c-jump-links__item pf-m-current">
1126
- <a class="pf-v5-c-jump-links__link" href="#-first">
1127
- <span class="pf-v5-c-jump-links__link-text">First section</span>
1128
- </a>
1478
+ <span class="pf-v5-c-jump-links__link">
1479
+ <a class="pf-v5-c-button pf-m-link" href="#-first">
1480
+ <span class="pf-v5-c-jump-links__link-text">First section</span>
1481
+ </a>
1482
+ </span>
1129
1483
  </li>
1130
1484
  <li class="pf-v5-c-jump-links__item">
1131
- <a class="pf-v5-c-jump-links__link" href="#-second">
1132
- <span class="pf-v5-c-jump-links__link-text">Second section</span>
1133
- </a>
1485
+ <span class="pf-v5-c-jump-links__link">
1486
+ <a class="pf-v5-c-button pf-m-link" href="#-second">
1487
+ <span class="pf-v5-c-jump-links__link-text">Second section</span>
1488
+ </a>
1489
+ </span>
1134
1490
  </li>
1135
1491
  <li class="pf-v5-c-jump-links__item">
1136
- <a class="pf-v5-c-jump-links__link" href="#-third">
1137
- <span class="pf-v5-c-jump-links__link-text">Third section</span>
1138
- </a>
1492
+ <span class="pf-v5-c-jump-links__link">
1493
+ <a class="pf-v5-c-button pf-m-link" href="#-third">
1494
+ <span class="pf-v5-c-jump-links__link-text">Third section</span>
1495
+ </a>
1496
+ </span>
1139
1497
  </li>
1140
1498
  <li class="pf-v5-c-jump-links__item">
1141
- <a class="pf-v5-c-jump-links__link" href="#-fourth">
1142
- <span class="pf-v5-c-jump-links__link-text">Fourth section</span>
1143
- </a>
1499
+ <span class="pf-v5-c-jump-links__link">
1500
+ <a class="pf-v5-c-button pf-m-link" href="#-fourth">
1501
+ <span class="pf-v5-c-jump-links__link-text">Fourth section</span>
1502
+ </a>
1503
+ </span>
1144
1504
  </li>
1145
1505
  <li class="pf-v5-c-jump-links__item">
1146
- <a class="pf-v5-c-jump-links__link" href="#-fifth">
1147
- <span class="pf-v5-c-jump-links__link-text">Fifth section</span>
1148
- </a>
1506
+ <span class="pf-v5-c-jump-links__link">
1507
+ <a class="pf-v5-c-button pf-m-link" href="#-fifth">
1508
+ <span class="pf-v5-c-jump-links__link-text">Fifth section</span>
1509
+ </a>
1510
+ </span>
1149
1511
  </li>
1150
1512
  </ul>
1151
1513
  </div>
@@ -1200,23 +1562,117 @@ section: components
1200
1562
  </span>
1201
1563
  <div class="pf-v5-c-masthead__main">
1202
1564
  <a class="pf-v5-c-masthead__brand" href="#">
1203
- <img
1204
- class="pf-v5-c-brand"
1205
- src="/assets/images/pf-logo.svg"
1206
- alt="PatternFly logo"
1207
- style="--pf-v5-c-brand--Height:36px"
1208
- />
1565
+ <svg height="40px" viewBox="0 0 679 158">
1566
+ <title>PF-HorizontalLogo-Color</title>
1567
+ <defs>
1568
+ <linearGradient
1569
+ x1="68%"
1570
+ y1="2.25860997e-13%"
1571
+ x2="32%"
1572
+ y2="100%"
1573
+ id="linearGradient-jump-links-drawer-masthead"
1574
+ >
1575
+ <stop stop-color="#2B9AF3" offset="0%" />
1576
+ <stop
1577
+ stop-color="#73BCF7"
1578
+ stop-opacity="0.502212631"
1579
+ offset="100%"
1580
+ />
1581
+ </linearGradient>
1582
+ </defs>
1583
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1584
+ <g
1585
+ transform="translate(206.000000, 45.750000)"
1586
+ fill="var(--pf-t--global--text--color--regular)"
1587
+ fill-rule="nonzero"
1588
+ >
1589
+ <path
1590
+ d="M0,65.25 L0,2.25 L33.21,2.25 C37.35,2.25 41.025,3.135 44.235,4.905 C47.445,6.675 49.98,9.09 51.84,12.15 C53.7,15.21 54.63,18.72 54.63,22.68 C54.63,26.46 53.7,29.865 51.84,32.895 C49.98,35.925 47.43,38.31 44.19,40.05 C40.95,41.79 37.29,42.66 33.21,42.66 L15.48,42.66 L15.48,65.25 L0,65.25 Z M15.48,29.88 L31.41,29.88 C33.69,29.88 35.52,29.22 36.9,27.9 C38.28,26.58 38.97,24.87 38.97,22.77 C38.97,20.61 38.28,18.855 36.9,17.505 C35.52,16.155 33.69,15.48 31.41,15.48 L15.48,15.48 L15.48,29.88 Z"
1591
+ />
1592
+ <path
1593
+ d="M77.04,66.06 C73.68,66.06 70.695,65.43 68.085,64.17 C65.475,62.91 63.435,61.17 61.965,58.95 C60.495,56.73 59.76,54.18 59.76,51.3 C59.76,46.74 61.485,43.215 64.935,40.725 C68.385,38.235 73.2,36.99 79.38,36.99 C83.1,36.99 86.7,37.44 90.18,38.34 L90.18,36 C90.18,31.26 87.15,28.89 81.09,28.89 C77.49,28.89 72.69,30.15 66.69,32.67 L61.47,21.96 C69.15,18.48 76.56,16.74 83.7,16.74 C90.3,16.74 95.43,18.315 99.09,21.465 C102.75,24.615 104.58,29.04 104.58,34.74 L104.58,65.25 L90.18,65.25 L90.18,62.37 C88.26,63.69 86.235,64.635 84.105,65.205 C81.975,65.775 79.62,66.06 77.04,66.06 Z M73.62,51.03 C73.62,52.53 74.28,53.7 75.6,54.54 C76.92,55.38 78.75,55.8 81.09,55.8 C84.69,55.8 87.72,55.05 90.18,53.55 L90.18,47.43 C87.42,46.71 84.54,46.35 81.54,46.35 C79.02,46.35 77.07,46.755 75.69,47.565 C74.31,48.375 73.62,49.53 73.62,51.03 Z"
1594
+ />
1595
+ <path
1596
+ d="M137.25,65.88 C125.73,65.88 119.97,60.84 119.97,50.76 L119.97,29.79 L110.34,29.79 L110.34,17.64 L119.97,17.64 L119.97,5.4 L134.55,2.25 L134.55,17.64 L147.87,17.64 L147.87,29.79 L134.55,29.79 L134.55,47.88 C134.55,49.98 135.015,51.465 135.945,52.335 C136.875,53.205 138.51,53.64 140.85,53.64 C143.01,53.64 145.2,53.31 147.42,52.65 L147.42,64.44 C146.1,64.86 144.42,65.205 142.38,65.475 C140.34,65.745 138.63,65.88 137.25,65.88 Z"
1597
+ />
1598
+ <path
1599
+ d="M177.57,65.88 C166.05,65.88 160.29,60.84 160.29,50.76 L160.29,29.79 L150.66,29.79 L150.66,17.64 L160.29,17.64 L160.29,5.4 L174.87,2.25 L174.87,17.64 L188.19,17.64 L188.19,29.79 L174.87,29.79 L174.87,47.88 C174.87,49.98 175.335,51.465 176.265,52.335 C177.195,53.205 178.83,53.64 181.17,53.64 C183.33,53.64 185.52,53.31 187.74,52.65 L187.74,64.44 C186.42,64.86 184.74,65.205 182.7,65.475 C180.66,65.745 178.95,65.88 177.57,65.88 Z"
1600
+ />
1601
+ <path
1602
+ d="M217.62,66.15 C212.76,66.15 208.365,65.055 204.435,62.865 C200.505,60.675 197.4,57.72 195.12,54 C192.84,50.28 191.7,46.11 191.7,41.49 C191.7,36.87 192.795,32.7 194.985,28.98 C197.175,25.26 200.16,22.305 203.94,20.115 C207.72,17.925 211.92,16.83 216.54,16.83 C221.22,16.83 225.36,17.955 228.96,20.205 C232.56,22.455 235.395,25.53 237.465,29.43 C239.535,33.33 240.57,37.8 240.57,42.84 L240.57,46.44 L206.64,46.44 C207.6,48.66 209.1,50.475 211.14,51.885 C213.18,53.295 215.58,54 218.34,54 C222.42,54 225.6,52.8 227.88,50.4 L237.51,58.95 C234.51,61.47 231.435,63.3 228.285,64.44 C225.135,65.58 221.58,66.15 217.62,66.15 Z M206.37,36.27 L226.26,36.27 C225.48,33.99 224.205,32.16 222.435,30.78 C220.665,29.4 218.61,28.71 216.27,28.71 C213.87,28.71 211.8,29.37 210.06,30.69 C208.32,32.01 207.09,33.87 206.37,36.27 Z"
1603
+ />
1604
+ <path
1605
+ d="M247.41,65.25 L247.41,17.64 L261.99,17.64 L261.99,22.41 C265.23,18.51 269.4,16.56 274.5,16.56 C277.08,16.62 278.91,17.01 279.99,17.73 L279.99,30.42 C277.95,29.46 275.64,28.98 273.06,28.98 C270.78,28.98 268.665,29.505 266.715,30.555 C264.765,31.605 263.19,33.09 261.99,35.01 L261.99,65.25 L247.41,65.25 Z"
1606
+ />
1607
+ <path
1608
+ d="M286.29,65.25 L286.29,17.64 L300.87,17.64 L300.87,20.88 C304.47,18.12 308.73,16.74 313.65,16.74 C317.37,16.74 320.655,17.55 323.505,19.17 C326.355,20.79 328.59,23.04 330.21,25.92 C331.83,28.8 332.64,32.13 332.64,35.91 L332.64,65.25 L318.06,65.25 L318.06,37.89 C318.06,35.25 317.28,33.15 315.72,31.59 C314.16,30.03 312.06,29.25 309.42,29.25 C305.76,29.25 302.91,30.51 300.87,33.03 L300.87,65.25 L286.29,65.25 Z"
1609
+ />
1610
+ <polygon
1611
+ points="342 65.25 342 2.25 392.04 2.25 392.04 15.66 357.48 15.66 357.48 27.45 380.52 27.45 380.52 40.41 357.48 40.41 357.48 65.25"
1612
+ />
1613
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
1614
+ <path
1615
+ d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
1616
+ />
1617
+ </g>
1618
+ <g transform="translate(0.000000, 0.000000)">
1619
+ <path
1620
+ d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
1621
+ fill="#0066CC"
1622
+ />
1623
+ <path
1624
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
1625
+ fill="url(#linearGradient-jump-links-drawer-masthead)"
1626
+ />
1627
+ <path
1628
+ 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"
1629
+ fill="url(#linearGradient-jump-links-drawer-masthead)"
1630
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
1631
+ />
1632
+ </g>
1633
+ </g>
1634
+ </svg>
1209
1635
  </a>
1210
1636
  </div>
1211
1637
  <div class="pf-v5-c-masthead__content">
1212
1638
  <div
1213
- class="pf-v5-c-toolbar pf-m-full-height pf-m-static"
1639
+ class="pf-v5-c-toolbar pf-m-static"
1214
1640
  id="jump-links-drawer-masthead-toolbar"
1215
1641
  >
1216
1642
  <div class="pf-v5-c-toolbar__content">
1217
1643
  <div class="pf-v5-c-toolbar__content-section">
1644
+ <div class="pf-v5-c-toolbar__item">
1645
+ <button
1646
+ class="pf-v5-c-menu-toggle"
1647
+ type="button"
1648
+ aria-expanded="false"
1649
+ >
1650
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
1651
+ <span class="pf-v5-c-menu-toggle__controls">
1652
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
1653
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
1654
+ </span>
1655
+ </span>
1656
+ </button>
1657
+ </div>
1658
+
1659
+ <div class="pf-v5-c-toolbar__item">
1660
+ <button
1661
+ class="pf-v5-c-menu-toggle"
1662
+ type="button"
1663
+ aria-expanded="false"
1664
+ >
1665
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
1666
+ <span class="pf-v5-c-menu-toggle__controls">
1667
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
1668
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
1669
+ </span>
1670
+ </span>
1671
+ </button>
1672
+ </div>
1673
+
1218
1674
  <div
1219
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
1675
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-spacer-none pf-m-spacer-md-on-md"
1220
1676
  >
1221
1677
  <div
1222
1678
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -1263,27 +1719,6 @@ section: components
1263
1719
  </button>
1264
1720
  </div>
1265
1721
  </div>
1266
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
1267
- <button
1268
- class="pf-v5-c-menu-toggle pf-m-full-height"
1269
- type="button"
1270
- aria-expanded="false"
1271
- >
1272
- <span class="pf-v5-c-menu-toggle__icon">
1273
- <img
1274
- class="pf-v5-c-avatar"
1275
- alt="Avatar image"
1276
- src="/assets/images/img_avatar-light.svg"
1277
- />
1278
- </span>
1279
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
1280
- <span class="pf-v5-c-menu-toggle__controls">
1281
- <span class="pf-v5-c-menu-toggle__toggle-icon">
1282
- <i class="fas fa-angle-down" aria-hidden="true"></i>
1283
- </span>
1284
- </span>
1285
- </button>
1286
- </div>
1287
1722
  </div>
1288
1723
  </div>
1289
1724
  </div>
@@ -1342,54 +1777,64 @@ section: components
1342
1777
  <div class="pf-v5-c-jump-links__label">Jump to section</div>
1343
1778
  <ul class="pf-v5-c-jump-links__list" role="list">
1344
1779
  <li class="pf-v5-c-jump-links__item pf-m-current">
1345
- <a
1346
- class="pf-v5-c-jump-links__link"
1347
- href="#jump-links-drawer-jump-links-first"
1348
- >
1349
- <span
1350
- class="pf-v5-c-jump-links__link-text"
1351
- >First section</span>
1352
- </a>
1780
+ <span class="pf-v5-c-jump-links__link">
1781
+ <a
1782
+ class="pf-v5-c-button pf-m-link"
1783
+ href="#jump-links-drawer-jump-links-first"
1784
+ >
1785
+ <span
1786
+ class="pf-v5-c-jump-links__link-text"
1787
+ >First section</span>
1788
+ </a>
1789
+ </span>
1353
1790
  </li>
1354
1791
  <li class="pf-v5-c-jump-links__item">
1355
- <a
1356
- class="pf-v5-c-jump-links__link"
1357
- href="#jump-links-drawer-jump-links-second"
1358
- >
1359
- <span
1360
- class="pf-v5-c-jump-links__link-text"
1361
- >Second section</span>
1362
- </a>
1792
+ <span class="pf-v5-c-jump-links__link">
1793
+ <a
1794
+ class="pf-v5-c-button pf-m-link"
1795
+ href="#jump-links-drawer-jump-links-second"
1796
+ >
1797
+ <span
1798
+ class="pf-v5-c-jump-links__link-text"
1799
+ >Second section</span>
1800
+ </a>
1801
+ </span>
1363
1802
  </li>
1364
1803
  <li class="pf-v5-c-jump-links__item">
1365
- <a
1366
- class="pf-v5-c-jump-links__link"
1367
- href="#jump-links-drawer-jump-links-third"
1368
- >
1369
- <span
1370
- class="pf-v5-c-jump-links__link-text"
1371
- >Third section</span>
1372
- </a>
1804
+ <span class="pf-v5-c-jump-links__link">
1805
+ <a
1806
+ class="pf-v5-c-button pf-m-link"
1807
+ href="#jump-links-drawer-jump-links-third"
1808
+ >
1809
+ <span
1810
+ class="pf-v5-c-jump-links__link-text"
1811
+ >Third section</span>
1812
+ </a>
1813
+ </span>
1373
1814
  </li>
1374
1815
  <li class="pf-v5-c-jump-links__item">
1375
- <a
1376
- class="pf-v5-c-jump-links__link"
1377
- href="#jump-links-drawer-jump-links-fourth"
1378
- >
1379
- <span
1380
- class="pf-v5-c-jump-links__link-text"
1381
- >Fourth section</span>
1382
- </a>
1816
+ <span class="pf-v5-c-jump-links__link">
1817
+ <a
1818
+ class="pf-v5-c-button pf-m-link"
1819
+ href="#jump-links-drawer-jump-links-fourth"
1820
+ >
1821
+ <span
1822
+ class="pf-v5-c-jump-links__link-text"
1823
+ >Fourth section</span>
1824
+ </a>
1825
+ </span>
1383
1826
  </li>
1384
1827
  <li class="pf-v5-c-jump-links__item">
1385
- <a
1386
- class="pf-v5-c-jump-links__link"
1387
- href="#jump-links-drawer-jump-links-fifth"
1388
- >
1389
- <span
1390
- class="pf-v5-c-jump-links__link-text"
1391
- >Fifth section</span>
1392
- </a>
1828
+ <span class="pf-v5-c-jump-links__link">
1829
+ <a
1830
+ class="pf-v5-c-button pf-m-link"
1831
+ href="#jump-links-drawer-jump-links-fifth"
1832
+ >
1833
+ <span
1834
+ class="pf-v5-c-jump-links__link-text"
1835
+ >Fifth section</span>
1836
+ </a>
1837
+ </span>
1393
1838
  </li>
1394
1839
  </ul>
1395
1840
  </nav>
@@ -1428,22 +1873,24 @@ section: components
1428
1873
  </div>
1429
1874
  </div>
1430
1875
  <div class="pf-v5-c-drawer__panel" hidden>
1431
- <div class="pf-v5-c-drawer__body">
1432
- <div class="pf-v5-c-drawer__head">
1433
- <span>drawer-panel</span>
1434
- <div class="pf-v5-c-drawer__actions">
1435
- <div class="pf-v5-c-drawer__close">
1436
- <button
1437
- class="pf-v5-c-button pf-m-plain"
1438
- type="button"
1439
- aria-label="Close drawer panel"
1440
- >
1441
- <i class="fas fa-times" aria-hidden="true"></i>
1442
- </button>
1443
- </div>
1876
+ <div class="pf-v5-c-drawer__head">
1877
+ <span>Drawer panel header content</span>
1878
+ <div class="pf-v5-c-drawer__actions">
1879
+ <div class="pf-v5-c-drawer__close">
1880
+ <button
1881
+ class="pf-v5-c-button pf-m-plain"
1882
+ type="button"
1883
+ aria-label="Close drawer panel"
1884
+ >
1885
+ <i class="fas fa-times" aria-hidden="true"></i>
1886
+ </button>
1444
1887
  </div>
1445
1888
  </div>
1446
1889
  </div>
1890
+ <div
1891
+ class="pf-v5-c-drawer__description"
1892
+ >This is a helpful description of the drawer panel.</div>
1893
+ <div class="pf-v5-c-drawer__body">Drawer panel body content</div>
1447
1894
  </div>
1448
1895
  </div>
1449
1896
  </div>
@@ -1474,23 +1921,117 @@ section: components
1474
1921
  </span>
1475
1922
  <div class="pf-v5-c-masthead__main">
1476
1923
  <a class="pf-v5-c-masthead__brand" href="#">
1477
- <img
1478
- class="pf-v5-c-brand"
1479
- src="/assets/images/pf-logo.svg"
1480
- alt="PatternFly logo"
1481
- style="--pf-v5-c-brand--Height:36px"
1482
- />
1924
+ <svg height="40px" viewBox="0 0 679 158">
1925
+ <title>PF-HorizontalLogo-Color</title>
1926
+ <defs>
1927
+ <linearGradient
1928
+ x1="68%"
1929
+ y1="2.25860997e-13%"
1930
+ x2="32%"
1931
+ y2="100%"
1932
+ id="linearGradient-jump-links-drawer-expanded-masthead"
1933
+ >
1934
+ <stop stop-color="#2B9AF3" offset="0%" />
1935
+ <stop
1936
+ stop-color="#73BCF7"
1937
+ stop-opacity="0.502212631"
1938
+ offset="100%"
1939
+ />
1940
+ </linearGradient>
1941
+ </defs>
1942
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1943
+ <g
1944
+ transform="translate(206.000000, 45.750000)"
1945
+ fill="var(--pf-t--global--text--color--regular)"
1946
+ fill-rule="nonzero"
1947
+ >
1948
+ <path
1949
+ d="M0,65.25 L0,2.25 L33.21,2.25 C37.35,2.25 41.025,3.135 44.235,4.905 C47.445,6.675 49.98,9.09 51.84,12.15 C53.7,15.21 54.63,18.72 54.63,22.68 C54.63,26.46 53.7,29.865 51.84,32.895 C49.98,35.925 47.43,38.31 44.19,40.05 C40.95,41.79 37.29,42.66 33.21,42.66 L15.48,42.66 L15.48,65.25 L0,65.25 Z M15.48,29.88 L31.41,29.88 C33.69,29.88 35.52,29.22 36.9,27.9 C38.28,26.58 38.97,24.87 38.97,22.77 C38.97,20.61 38.28,18.855 36.9,17.505 C35.52,16.155 33.69,15.48 31.41,15.48 L15.48,15.48 L15.48,29.88 Z"
1950
+ />
1951
+ <path
1952
+ d="M77.04,66.06 C73.68,66.06 70.695,65.43 68.085,64.17 C65.475,62.91 63.435,61.17 61.965,58.95 C60.495,56.73 59.76,54.18 59.76,51.3 C59.76,46.74 61.485,43.215 64.935,40.725 C68.385,38.235 73.2,36.99 79.38,36.99 C83.1,36.99 86.7,37.44 90.18,38.34 L90.18,36 C90.18,31.26 87.15,28.89 81.09,28.89 C77.49,28.89 72.69,30.15 66.69,32.67 L61.47,21.96 C69.15,18.48 76.56,16.74 83.7,16.74 C90.3,16.74 95.43,18.315 99.09,21.465 C102.75,24.615 104.58,29.04 104.58,34.74 L104.58,65.25 L90.18,65.25 L90.18,62.37 C88.26,63.69 86.235,64.635 84.105,65.205 C81.975,65.775 79.62,66.06 77.04,66.06 Z M73.62,51.03 C73.62,52.53 74.28,53.7 75.6,54.54 C76.92,55.38 78.75,55.8 81.09,55.8 C84.69,55.8 87.72,55.05 90.18,53.55 L90.18,47.43 C87.42,46.71 84.54,46.35 81.54,46.35 C79.02,46.35 77.07,46.755 75.69,47.565 C74.31,48.375 73.62,49.53 73.62,51.03 Z"
1953
+ />
1954
+ <path
1955
+ d="M137.25,65.88 C125.73,65.88 119.97,60.84 119.97,50.76 L119.97,29.79 L110.34,29.79 L110.34,17.64 L119.97,17.64 L119.97,5.4 L134.55,2.25 L134.55,17.64 L147.87,17.64 L147.87,29.79 L134.55,29.79 L134.55,47.88 C134.55,49.98 135.015,51.465 135.945,52.335 C136.875,53.205 138.51,53.64 140.85,53.64 C143.01,53.64 145.2,53.31 147.42,52.65 L147.42,64.44 C146.1,64.86 144.42,65.205 142.38,65.475 C140.34,65.745 138.63,65.88 137.25,65.88 Z"
1956
+ />
1957
+ <path
1958
+ d="M177.57,65.88 C166.05,65.88 160.29,60.84 160.29,50.76 L160.29,29.79 L150.66,29.79 L150.66,17.64 L160.29,17.64 L160.29,5.4 L174.87,2.25 L174.87,17.64 L188.19,17.64 L188.19,29.79 L174.87,29.79 L174.87,47.88 C174.87,49.98 175.335,51.465 176.265,52.335 C177.195,53.205 178.83,53.64 181.17,53.64 C183.33,53.64 185.52,53.31 187.74,52.65 L187.74,64.44 C186.42,64.86 184.74,65.205 182.7,65.475 C180.66,65.745 178.95,65.88 177.57,65.88 Z"
1959
+ />
1960
+ <path
1961
+ d="M217.62,66.15 C212.76,66.15 208.365,65.055 204.435,62.865 C200.505,60.675 197.4,57.72 195.12,54 C192.84,50.28 191.7,46.11 191.7,41.49 C191.7,36.87 192.795,32.7 194.985,28.98 C197.175,25.26 200.16,22.305 203.94,20.115 C207.72,17.925 211.92,16.83 216.54,16.83 C221.22,16.83 225.36,17.955 228.96,20.205 C232.56,22.455 235.395,25.53 237.465,29.43 C239.535,33.33 240.57,37.8 240.57,42.84 L240.57,46.44 L206.64,46.44 C207.6,48.66 209.1,50.475 211.14,51.885 C213.18,53.295 215.58,54 218.34,54 C222.42,54 225.6,52.8 227.88,50.4 L237.51,58.95 C234.51,61.47 231.435,63.3 228.285,64.44 C225.135,65.58 221.58,66.15 217.62,66.15 Z M206.37,36.27 L226.26,36.27 C225.48,33.99 224.205,32.16 222.435,30.78 C220.665,29.4 218.61,28.71 216.27,28.71 C213.87,28.71 211.8,29.37 210.06,30.69 C208.32,32.01 207.09,33.87 206.37,36.27 Z"
1962
+ />
1963
+ <path
1964
+ d="M247.41,65.25 L247.41,17.64 L261.99,17.64 L261.99,22.41 C265.23,18.51 269.4,16.56 274.5,16.56 C277.08,16.62 278.91,17.01 279.99,17.73 L279.99,30.42 C277.95,29.46 275.64,28.98 273.06,28.98 C270.78,28.98 268.665,29.505 266.715,30.555 C264.765,31.605 263.19,33.09 261.99,35.01 L261.99,65.25 L247.41,65.25 Z"
1965
+ />
1966
+ <path
1967
+ d="M286.29,65.25 L286.29,17.64 L300.87,17.64 L300.87,20.88 C304.47,18.12 308.73,16.74 313.65,16.74 C317.37,16.74 320.655,17.55 323.505,19.17 C326.355,20.79 328.59,23.04 330.21,25.92 C331.83,28.8 332.64,32.13 332.64,35.91 L332.64,65.25 L318.06,65.25 L318.06,37.89 C318.06,35.25 317.28,33.15 315.72,31.59 C314.16,30.03 312.06,29.25 309.42,29.25 C305.76,29.25 302.91,30.51 300.87,33.03 L300.87,65.25 L286.29,65.25 Z"
1968
+ />
1969
+ <polygon
1970
+ points="342 65.25 342 2.25 392.04 2.25 392.04 15.66 357.48 15.66 357.48 27.45 380.52 27.45 380.52 40.41 357.48 40.41 357.48 65.25"
1971
+ />
1972
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
1973
+ <path
1974
+ d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
1975
+ />
1976
+ </g>
1977
+ <g transform="translate(0.000000, 0.000000)">
1978
+ <path
1979
+ d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
1980
+ fill="#0066CC"
1981
+ />
1982
+ <path
1983
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
1984
+ fill="url(#linearGradient-jump-links-drawer-expanded-masthead)"
1985
+ />
1986
+ <path
1987
+ 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"
1988
+ fill="url(#linearGradient-jump-links-drawer-expanded-masthead)"
1989
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
1990
+ />
1991
+ </g>
1992
+ </g>
1993
+ </svg>
1483
1994
  </a>
1484
1995
  </div>
1485
1996
  <div class="pf-v5-c-masthead__content">
1486
1997
  <div
1487
- class="pf-v5-c-toolbar pf-m-full-height pf-m-static"
1998
+ class="pf-v5-c-toolbar pf-m-static"
1488
1999
  id="jump-links-drawer-expanded-masthead-toolbar"
1489
2000
  >
1490
2001
  <div class="pf-v5-c-toolbar__content">
1491
2002
  <div class="pf-v5-c-toolbar__content-section">
2003
+ <div class="pf-v5-c-toolbar__item">
2004
+ <button
2005
+ class="pf-v5-c-menu-toggle"
2006
+ type="button"
2007
+ aria-expanded="false"
2008
+ >
2009
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
2010
+ <span class="pf-v5-c-menu-toggle__controls">
2011
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
2012
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
2013
+ </span>
2014
+ </span>
2015
+ </button>
2016
+ </div>
2017
+
2018
+ <div class="pf-v5-c-toolbar__item">
2019
+ <button
2020
+ class="pf-v5-c-menu-toggle"
2021
+ type="button"
2022
+ aria-expanded="false"
2023
+ >
2024
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
2025
+ <span class="pf-v5-c-menu-toggle__controls">
2026
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
2027
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
2028
+ </span>
2029
+ </span>
2030
+ </button>
2031
+ </div>
2032
+
1492
2033
  <div
1493
- class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
2034
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-spacer-none pf-m-spacer-md-on-md"
1494
2035
  >
1495
2036
  <div
1496
2037
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -1537,27 +2078,6 @@ section: components
1537
2078
  </button>
1538
2079
  </div>
1539
2080
  </div>
1540
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
1541
- <button
1542
- class="pf-v5-c-menu-toggle pf-m-full-height"
1543
- type="button"
1544
- aria-expanded="false"
1545
- >
1546
- <span class="pf-v5-c-menu-toggle__icon">
1547
- <img
1548
- class="pf-v5-c-avatar"
1549
- alt="Avatar image"
1550
- src="/assets/images/img_avatar-light.svg"
1551
- />
1552
- </span>
1553
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
1554
- <span class="pf-v5-c-menu-toggle__controls">
1555
- <span class="pf-v5-c-menu-toggle__toggle-icon">
1556
- <i class="fas fa-angle-down" aria-hidden="true"></i>
1557
- </span>
1558
- </span>
1559
- </button>
1560
- </div>
1561
2081
  </div>
1562
2082
  </div>
1563
2083
  </div>
@@ -1616,54 +2136,64 @@ section: components
1616
2136
  <div class="pf-v5-c-jump-links__label">Jump to section</div>
1617
2137
  <ul class="pf-v5-c-jump-links__list" role="list">
1618
2138
  <li class="pf-v5-c-jump-links__item pf-m-current">
1619
- <a
1620
- class="pf-v5-c-jump-links__link"
1621
- href="#jump-links-drawer-expanded-jump-links-first"
1622
- >
1623
- <span
1624
- class="pf-v5-c-jump-links__link-text"
1625
- >First section</span>
1626
- </a>
2139
+ <span class="pf-v5-c-jump-links__link">
2140
+ <a
2141
+ class="pf-v5-c-button pf-m-link"
2142
+ href="#jump-links-drawer-expanded-jump-links-first"
2143
+ >
2144
+ <span
2145
+ class="pf-v5-c-jump-links__link-text"
2146
+ >First section</span>
2147
+ </a>
2148
+ </span>
1627
2149
  </li>
1628
2150
  <li class="pf-v5-c-jump-links__item">
1629
- <a
1630
- class="pf-v5-c-jump-links__link"
1631
- href="#jump-links-drawer-expanded-jump-links-second"
1632
- >
1633
- <span
1634
- class="pf-v5-c-jump-links__link-text"
1635
- >Second section</span>
1636
- </a>
2151
+ <span class="pf-v5-c-jump-links__link">
2152
+ <a
2153
+ class="pf-v5-c-button pf-m-link"
2154
+ href="#jump-links-drawer-expanded-jump-links-second"
2155
+ >
2156
+ <span
2157
+ class="pf-v5-c-jump-links__link-text"
2158
+ >Second section</span>
2159
+ </a>
2160
+ </span>
1637
2161
  </li>
1638
2162
  <li class="pf-v5-c-jump-links__item">
1639
- <a
1640
- class="pf-v5-c-jump-links__link"
1641
- href="#jump-links-drawer-expanded-jump-links-third"
1642
- >
1643
- <span
1644
- class="pf-v5-c-jump-links__link-text"
1645
- >Third section</span>
1646
- </a>
2163
+ <span class="pf-v5-c-jump-links__link">
2164
+ <a
2165
+ class="pf-v5-c-button pf-m-link"
2166
+ href="#jump-links-drawer-expanded-jump-links-third"
2167
+ >
2168
+ <span
2169
+ class="pf-v5-c-jump-links__link-text"
2170
+ >Third section</span>
2171
+ </a>
2172
+ </span>
1647
2173
  </li>
1648
2174
  <li class="pf-v5-c-jump-links__item">
1649
- <a
1650
- class="pf-v5-c-jump-links__link"
1651
- href="#jump-links-drawer-expanded-jump-links-fourth"
1652
- >
1653
- <span
1654
- class="pf-v5-c-jump-links__link-text"
1655
- >Fourth section</span>
1656
- </a>
2175
+ <span class="pf-v5-c-jump-links__link">
2176
+ <a
2177
+ class="pf-v5-c-button pf-m-link"
2178
+ href="#jump-links-drawer-expanded-jump-links-fourth"
2179
+ >
2180
+ <span
2181
+ class="pf-v5-c-jump-links__link-text"
2182
+ >Fourth section</span>
2183
+ </a>
2184
+ </span>
1657
2185
  </li>
1658
2186
  <li class="pf-v5-c-jump-links__item">
1659
- <a
1660
- class="pf-v5-c-jump-links__link"
1661
- href="#jump-links-drawer-expanded-jump-links-fifth"
1662
- >
1663
- <span
1664
- class="pf-v5-c-jump-links__link-text"
1665
- >Fifth section</span>
1666
- </a>
2187
+ <span class="pf-v5-c-jump-links__link">
2188
+ <a
2189
+ class="pf-v5-c-button pf-m-link"
2190
+ href="#jump-links-drawer-expanded-jump-links-fifth"
2191
+ >
2192
+ <span
2193
+ class="pf-v5-c-jump-links__link-text"
2194
+ >Fifth section</span>
2195
+ </a>
2196
+ </span>
1667
2197
  </li>
1668
2198
  </ul>
1669
2199
  </nav>
@@ -1708,22 +2238,24 @@ section: components
1708
2238
  </div>
1709
2239
  </div>
1710
2240
  <div class="pf-v5-c-drawer__panel">
1711
- <div class="pf-v5-c-drawer__body">
1712
- <div class="pf-v5-c-drawer__head">
1713
- <span>drawer-panel</span>
1714
- <div class="pf-v5-c-drawer__actions">
1715
- <div class="pf-v5-c-drawer__close">
1716
- <button
1717
- class="pf-v5-c-button pf-m-plain"
1718
- type="button"
1719
- aria-label="Close drawer panel"
1720
- >
1721
- <i class="fas fa-times" aria-hidden="true"></i>
1722
- </button>
1723
- </div>
2241
+ <div class="pf-v5-c-drawer__head">
2242
+ <span>Drawer panel header content</span>
2243
+ <div class="pf-v5-c-drawer__actions">
2244
+ <div class="pf-v5-c-drawer__close">
2245
+ <button
2246
+ class="pf-v5-c-button pf-m-plain"
2247
+ type="button"
2248
+ aria-label="Close drawer panel"
2249
+ >
2250
+ <i class="fas fa-times" aria-hidden="true"></i>
2251
+ </button>
1724
2252
  </div>
1725
2253
  </div>
1726
2254
  </div>
2255
+ <div
2256
+ class="pf-v5-c-drawer__description"
2257
+ >This is a helpful description of the drawer panel.</div>
2258
+ <div class="pf-v5-c-drawer__body">Drawer panel body content</div>
1727
2259
  </div>
1728
2260
  </div>
1729
2261
  </div>