@patternfly/patternfly 6.0.0-alpha.6 → 6.0.0-alpha.61

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 (371) hide show
  1. package/README.md +13 -3
  2. package/assets/icons/iconUnicodes.json +1 -0
  3. package/assets/images/PF-Backdrop.svg +1 -0
  4. package/assets/images/PF-HorizontalLogo-Color.svg +29 -0
  5. package/assets/images/PF-HorizontalLogo-Reverse.svg +28 -0
  6. package/assets/images/PF-IconLogo-Reverse.svg +14 -0
  7. package/assets/images/PF-IconLogo-color.svg +17 -0
  8. package/assets/images/PF-IconLogo.svg +17 -0
  9. package/assets/images/logo__pf--reverse-on-md.svg +1 -1
  10. package/assets/images/pf-background.svg +22 -0
  11. package/assets/images/pf-c-brand__logo-on-lg-white.svg +32 -0
  12. package/assets/images/pf-c-brand__logo-on-md-white.svg +42 -0
  13. package/assets/images/pf-c-brand__logo-on-sm-white.svg +17 -0
  14. package/assets/images/pf-c-brand__logo-on-sm.svg +1 -1
  15. package/assets/images/pf-c-brand__logo-on-xl-white.svg +39 -0
  16. package/assets/images/pf_logo_white.hbs +35 -0
  17. package/assets/images/pf_logo_white.svg +38 -0
  18. package/assets/pficon/pf-v5-pficon.woff2 +0 -0
  19. package/assets/pficon/pficon.scss +6 -129
  20. package/base/_common.scss +29 -4
  21. package/base/_globals.scss +5 -7
  22. package/base/_variables.scss +8 -6
  23. package/base/patternfly-common.css +24 -6
  24. package/base/patternfly-globals.css +5 -4
  25. package/base/patternfly-icons.css +5 -1
  26. package/base/patternfly-pf-icons.css +5 -1
  27. package/base/patternfly-variables.css +889 -787
  28. package/base/tokens/_tokens-dark.scss +322 -265
  29. package/base/tokens/_tokens-default.scss +428 -306
  30. package/base/tokens/_tokens-font.scss +41 -46
  31. package/base/tokens/_tokens-palette.scss +69 -71
  32. package/base/tokens/_workspace-overrides.scss +7 -0
  33. package/components/AboutModalBox/about-modal-box.css +80 -108
  34. package/components/AboutModalBox/about-modal-box.scss +64 -78
  35. package/components/Accordion/accordion.css +96 -175
  36. package/components/Accordion/accordion.scss +106 -193
  37. package/components/ActionList/action-list.css +2 -2
  38. package/components/ActionList/action-list.scss +2 -2
  39. package/components/Alert/alert-group.css +27 -20
  40. package/components/Alert/alert-group.scss +27 -20
  41. package/components/Alert/alert.css +74 -95
  42. package/components/Alert/alert.scss +76 -89
  43. package/components/AppLauncher/app-launcher.css +32 -23
  44. package/components/AppLauncher/app-launcher.scss +32 -23
  45. package/components/Avatar/avatar.css +10 -13
  46. package/components/Avatar/avatar.scss +10 -17
  47. package/components/BackToTop/back-to-top.css +17 -15
  48. package/components/BackToTop/back-to-top.scss +14 -13
  49. package/components/Backdrop/backdrop.css +8 -4
  50. package/components/Backdrop/backdrop.scss +7 -4
  51. package/components/BackgroundImage/background-image.css +11 -4
  52. package/components/BackgroundImage/background-image.scss +13 -4
  53. package/components/Badge/badge.css +25 -17
  54. package/components/Badge/badge.scss +27 -19
  55. package/components/Banner/banner.css +95 -69
  56. package/components/Banner/banner.scss +100 -34
  57. package/components/Breadcrumb/breadcrumb.css +28 -19
  58. package/components/Breadcrumb/breadcrumb.scss +26 -19
  59. package/components/Button/button.css +422 -359
  60. package/components/Button/button.scss +480 -487
  61. package/components/CalendarMonth/calendar-month.css +25 -15
  62. package/components/CalendarMonth/calendar-month.scss +23 -15
  63. package/components/Card/card.css +28 -17
  64. package/components/Card/card.scss +32 -17
  65. package/components/Check/check.css +25 -22
  66. package/components/Check/check.scss +26 -24
  67. package/components/Chip/chip-group.css +6 -6
  68. package/components/Chip/chip-group.scss +6 -6
  69. package/components/Chip/chip.css +16 -9
  70. package/components/Chip/chip.scss +17 -9
  71. package/components/ClipboardCopy/clipboard-copy.css +47 -41
  72. package/components/ClipboardCopy/clipboard-copy.scss +50 -34
  73. package/components/CodeBlock/code-block.css +24 -12
  74. package/components/CodeBlock/code-block.scss +24 -13
  75. package/components/CodeEditor/code-editor.css +31 -22
  76. package/components/CodeEditor/code-editor.scss +30 -21
  77. package/components/CodeEditor/themes/dark/code-editor.scss +1 -1
  78. package/components/Content/content.css +40 -37
  79. package/components/Content/content.scss +40 -37
  80. package/components/ContextSelector/context-selector.css +41 -26
  81. package/components/ContextSelector/context-selector.scss +40 -25
  82. package/components/ContextSelector/themes/dark/context-selector.scss +1 -1
  83. package/components/DataList/data-list-grid.css +21 -21
  84. package/components/DataList/data-list-grid.scss +3 -3
  85. package/components/DataList/data-list.css +165 -209
  86. package/components/DataList/data-list.scss +138 -185
  87. package/components/DatePicker/date-picker.css +8 -8
  88. package/components/DatePicker/date-picker.scss +8 -8
  89. package/components/DescriptionList/description-list.css +47 -39
  90. package/components/DescriptionList/description-list.scss +33 -30
  91. package/components/Divider/divider.css +97 -177
  92. package/components/Divider/divider.scss +60 -79
  93. package/components/DragDrop/drag-drop.css +26 -22
  94. package/components/DragDrop/drag-drop.scss +26 -25
  95. package/components/Drawer/drawer.css +120 -62
  96. package/components/Drawer/drawer.scss +94 -44
  97. package/components/Dropdown/dropdown.css +76 -69
  98. package/components/Dropdown/dropdown.scss +67 -62
  99. package/components/DualListSelector/dual-list-selector.css +29 -15
  100. package/components/DualListSelector/dual-list-selector.scss +30 -15
  101. package/components/EmptyState/empty-state.css +64 -38
  102. package/components/EmptyState/empty-state.scss +70 -38
  103. package/components/ExpandableSection/expandable-section.css +75 -66
  104. package/components/ExpandableSection/expandable-section.scss +82 -80
  105. package/components/FileUpload/file-upload.css +31 -43
  106. package/components/FileUpload/file-upload.scss +31 -49
  107. package/components/Form/form.css +111 -154
  108. package/components/Form/form.scss +101 -160
  109. package/components/FormControl/form-control.css +95 -111
  110. package/components/FormControl/form-control.scss +97 -92
  111. package/components/HelperText/helper-text.css +29 -35
  112. package/components/HelperText/helper-text.scss +31 -41
  113. package/components/Hint/hint.css +37 -27
  114. package/components/Hint/hint.scss +37 -30
  115. package/components/Icon/icon.css +155 -19
  116. package/components/Icon/icon.scss +188 -21
  117. package/components/InlineEdit/inline-edit.css +12 -11
  118. package/components/InlineEdit/inline-edit.scss +12 -11
  119. package/components/InputGroup/input-group.css +32 -42
  120. package/components/InputGroup/input-group.scss +31 -33
  121. package/components/JumpLinks/jump-links.css +61 -58
  122. package/components/JumpLinks/jump-links.scss +61 -60
  123. package/components/Label/label-group.css +48 -50
  124. package/components/Label/label-group.scss +48 -51
  125. package/components/Label/label.css +266 -363
  126. package/components/Label/label.scss +306 -356
  127. package/components/List/list.css +25 -25
  128. package/components/List/list.scss +26 -26
  129. package/components/LogViewer/log-viewer.css +14 -14
  130. package/components/LogViewer/log-viewer.scss +14 -14
  131. package/components/Login/login.css +104 -122
  132. package/components/Login/login.scss +92 -91
  133. package/components/Masthead/masthead.css +273 -498
  134. package/components/Masthead/masthead.scss +137 -282
  135. package/components/Menu/menu.css +82 -65
  136. package/components/Menu/menu.scss +85 -69
  137. package/components/MenuToggle/menu-toggle.css +37 -31
  138. package/components/MenuToggle/menu-toggle.scss +37 -33
  139. package/components/ModalBox/modal-box.css +76 -69
  140. package/components/ModalBox/modal-box.scss +74 -70
  141. package/components/MultipleFileUpload/multiple-file-upload.css +11 -8
  142. package/components/MultipleFileUpload/multiple-file-upload.scss +11 -8
  143. package/components/Nav/nav.css +248 -899
  144. package/components/Nav/nav.scss +304 -1059
  145. package/components/Nav/themes/dark/nav.scss +2 -2
  146. package/components/NotificationBadge/notification-badge.css +66 -85
  147. package/components/NotificationBadge/notification-badge.scss +72 -103
  148. package/components/NotificationDrawer/notification-drawer.css +130 -128
  149. package/components/NotificationDrawer/notification-drawer.scss +130 -129
  150. package/components/NumberInput/number-input.css +10 -10
  151. package/components/NumberInput/number-input.scss +9 -14
  152. package/components/OptionsMenu/options-menu.css +43 -31
  153. package/components/OptionsMenu/options-menu.scss +43 -31
  154. package/components/OverflowMenu/overflow-menu.css +2 -2
  155. package/components/OverflowMenu/overflow-menu.scss +2 -2
  156. package/components/Page/page.css +182 -232
  157. package/components/Page/page.scss +130 -195
  158. package/components/Pagination/pagination.css +71 -121
  159. package/components/Pagination/pagination.scss +56 -127
  160. package/components/Panel/panel.css +40 -30
  161. package/components/Panel/panel.scss +42 -33
  162. package/components/Popover/popover.css +108 -87
  163. package/components/Popover/popover.scss +120 -109
  164. package/components/Progress/progress.css +40 -52
  165. package/components/Progress/progress.scss +48 -62
  166. package/components/ProgressStepper/progress-stepper.css +26 -20
  167. package/components/ProgressStepper/progress-stepper.scss +25 -19
  168. package/components/Radio/radio.css +30 -23
  169. package/components/Radio/radio.scss +31 -25
  170. package/components/Select/select.css +56 -47
  171. package/components/Select/select.scss +56 -47
  172. package/components/Sidebar/sidebar.css +31 -14
  173. package/components/Sidebar/sidebar.scss +34 -16
  174. package/components/SimpleList/simple-list.css +45 -56
  175. package/components/SimpleList/simple-list.scss +51 -55
  176. package/components/Skeleton/skeleton.css +24 -25
  177. package/components/Skeleton/skeleton.scss +21 -26
  178. package/components/SkipToContent/skip-to-content.css +9 -6
  179. package/components/SkipToContent/skip-to-content.scss +8 -6
  180. package/components/Slider/slider.css +80 -55
  181. package/components/Slider/slider.scss +96 -65
  182. package/components/Spinner/spinner.css +17 -34
  183. package/components/Spinner/spinner.scss +19 -47
  184. package/components/Switch/switch.css +49 -41
  185. package/components/Switch/switch.scss +51 -42
  186. package/components/TabContent/tab-content.css +21 -12
  187. package/components/TabContent/tab-content.scss +22 -15
  188. package/components/Table/table-grid.css +264 -203
  189. package/components/Table/table-grid.scss +61 -47
  190. package/components/Table/table-scrollable.css +4 -4
  191. package/components/Table/table-scrollable.scss +6 -4
  192. package/components/Table/table-tree-view.css +112 -105
  193. package/components/Table/table-tree-view.scss +38 -33
  194. package/components/Table/table.css +105 -89
  195. package/components/Table/table.scss +105 -89
  196. package/components/Tabs/tabs.css +76 -48
  197. package/components/Tabs/tabs.scss +74 -48
  198. package/components/TextInputGroup/text-input-group.css +15 -15
  199. package/components/TextInputGroup/text-input-group.scss +15 -15
  200. package/components/Tile/tile.css +47 -88
  201. package/components/Tile/tile.scss +45 -91
  202. package/components/Timestamp/timestamp.css +12 -9
  203. package/components/Timestamp/timestamp.scss +11 -10
  204. package/components/Title/title.css +70 -19
  205. package/components/Title/title.scss +90 -20
  206. package/components/ToggleGroup/toggle-group.css +48 -58
  207. package/components/ToggleGroup/toggle-group.scss +48 -56
  208. package/components/Toolbar/toolbar.css +57 -43
  209. package/components/Toolbar/toolbar.scss +45 -25
  210. package/components/Tooltip/tooltip.css +74 -44
  211. package/components/Tooltip/tooltip.scss +93 -77
  212. package/components/TreeView/tree-view.css +48 -27
  213. package/components/TreeView/tree-view.scss +50 -28
  214. package/components/Truncate/truncate.css +13 -0
  215. package/components/Truncate/truncate.scss +19 -3
  216. package/components/Wizard/wizard.css +57 -36
  217. package/components/Wizard/wizard.scss +57 -36
  218. package/docs/components/AboutModalBox/examples/AboutModalBox.md +2 -2
  219. package/docs/components/Accordion/examples/Accordion.md +614 -416
  220. package/docs/components/Alert/examples/Alert.md +3 -3
  221. package/docs/components/Avatar/examples/Avatar.md +5 -19
  222. package/docs/components/BackgroundImage/examples/BackgroundImage.md +1 -1
  223. package/docs/components/Badge/examples/Badge.md +21 -0
  224. package/docs/components/Banner/examples/Banner.md +48 -25
  225. package/docs/components/Brand/examples/Brand.css +12 -0
  226. package/docs/components/Brand/examples/Brand.md +51 -32
  227. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  228. package/docs/components/Button/examples/Button.css +6 -2
  229. package/docs/components/Button/examples/Button.md +1425 -87
  230. package/docs/components/Card/examples/Card.md +143 -37
  231. package/docs/components/Check/examples/Check.md +71 -58
  232. package/docs/components/Chip/examples/Chip.md +1 -1
  233. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +106 -0
  234. package/docs/components/CodeBlock/examples/CodeBlock.md +4 -4
  235. package/docs/components/CodeEditor/examples/CodeEditor.md +3 -3
  236. package/docs/components/Content/examples/Content.md +5 -5
  237. package/docs/components/Divider/examples/Divider.css +3 -1
  238. package/docs/components/Divider/examples/Divider.md +4 -5
  239. package/docs/components/DragDrop/examples/DragDrop.css +3 -3
  240. package/docs/components/Dropdown/deprecated/Dropdown.css +1 -1
  241. package/docs/components/DualListSelector/examples/DualListSelector.md +64 -16
  242. package/docs/components/EmptyState/examples/EmptyState.md +45 -1
  243. package/docs/components/ExpandableSection/examples/ExpandableSection.md +49 -28
  244. package/docs/components/FileUpload/examples/FileUpload.md +112 -53
  245. package/docs/components/Form/examples/Form.md +134 -89
  246. package/docs/components/Icon/examples/Icon.md +82 -11
  247. package/docs/components/InlineEdit/examples/InlineEdit.md +3 -1
  248. package/docs/components/JumpLinks/examples/JumpLinks.md +280 -168
  249. package/docs/components/Label/examples/Label.css +4 -0
  250. package/docs/components/Label/examples/Label.md +1001 -225
  251. package/docs/components/LogViewer/examples/LogViewer.css +2 -2
  252. package/docs/components/LogViewer/examples/LogViewer.md +250 -160
  253. package/docs/components/Login/examples/Login.md +10 -5
  254. package/docs/components/Masthead/examples/masthead.md +443 -65
  255. package/docs/components/Menu/examples/Menu.css +8 -0
  256. package/docs/components/Menu/examples/Menu.md +594 -543
  257. package/docs/components/MenuToggle/examples/MenuToggle.md +109 -96
  258. package/docs/components/ModalBox/examples/ModalBox.css +3 -8
  259. package/docs/components/Nav/examples/Navigation.css +3 -42
  260. package/docs/components/Nav/examples/Navigation.md +305 -353
  261. package/docs/components/NotificationBadge/examples/NotificationBadge.md +5 -7
  262. package/docs/components/OptionsMenu/deprecated/options-menu.md +12 -3
  263. package/docs/components/Page/examples/Page.css +0 -8
  264. package/docs/components/Page/examples/Page.md +22 -21
  265. package/docs/components/Pagination/examples/Pagination.md +663 -637
  266. package/docs/components/Panel/examples/Panel.md +12 -0
  267. package/docs/components/Popover/examples/Popover.css +4 -9
  268. package/docs/components/Popover/examples/Popover.md +1 -1
  269. package/docs/components/Radio/examples/Radio.md +62 -54
  270. package/docs/components/Select/deprecated/Select.md +184 -177
  271. package/docs/components/Sidebar/examples/Sidebar.md +19 -0
  272. package/docs/components/SimpleList/examples/SimpleList.md +3 -3
  273. package/docs/components/TabContent/examples/TabContent.md +10 -10
  274. package/docs/components/Table/examples/Table.css +2 -2
  275. package/docs/components/Table/examples/Table.md +10 -10
  276. package/docs/components/TextInputGroup/examples/TextInputGroup.css +1 -1
  277. package/docs/components/TextInputGroup/examples/TextInputGroup.md +9 -9
  278. package/docs/components/Tile/examples/Tile.css +1 -1
  279. package/docs/components/Tile/examples/Tile.md +264 -144
  280. package/docs/components/Title/examples/Title.md +18 -0
  281. package/docs/components/Toolbar/examples/Toolbar.md +663 -2894
  282. package/docs/components/Tooltip/examples/Tooltip.css +4 -0
  283. package/docs/components/Tooltip/examples/Tooltip.md +3 -1
  284. package/docs/components/Truncate/examples/Truncate.css +2 -2
  285. package/docs/components/Truncate/examples/Truncate.md +2 -2
  286. package/docs/demos/AboutModal/examples/AboutModal.md +103 -30
  287. package/docs/demos/Alert/examples/Alert.md +327 -84
  288. package/docs/demos/BackToTop/examples/BackToTop.md +101 -28
  289. package/docs/demos/Banner/examples/Banner.md +209 -58
  290. package/docs/demos/Card/examples/Card.css +3 -3
  291. package/docs/demos/Card/examples/Card.md +28 -12
  292. package/docs/demos/CardView/examples/CardView.md +263 -205
  293. package/docs/demos/ContextSelector/examples/ContextSelector.md +373 -90
  294. package/docs/demos/Dashboard/examples/Dashboard.md +104 -31
  295. package/docs/demos/DataList/examples/DataList.md +995 -928
  296. package/docs/demos/DescriptionList/examples/DescriptionList.md +303 -84
  297. package/docs/demos/Drawer/examples/Drawer.md +605 -220
  298. package/docs/demos/Form/examples/BasicForms.md +133 -82
  299. package/docs/demos/JumpLinks/examples/JumpLinks.md +881 -353
  300. package/docs/demos/Masthead/examples/Masthead.md +767 -323
  301. package/docs/demos/Modal/examples/Modal.md +639 -192
  302. package/docs/demos/Nav/examples/Nav.md +685 -896
  303. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +510 -140
  304. package/docs/demos/Page/examples/Page.md +933 -264
  305. package/docs/demos/Page/examples/Penta.md +569 -501
  306. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -9
  307. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +44 -32
  308. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +1296 -917
  309. package/docs/demos/Skeleton/examples/Skeleton.md +108 -63
  310. package/docs/demos/Table/examples/Table.md +3832 -3390
  311. package/docs/demos/Tabs/examples/Tabs.md +636 -191
  312. package/docs/demos/Toolbar/examples/Toolbar.css +15 -0
  313. package/docs/demos/Toolbar/examples/Toolbar.md +1331 -1493
  314. package/docs/demos/Wizard/examples/Wizard.md +909 -252
  315. package/docs/layouts/Flex/examples/Flex.md +16 -16
  316. package/docs/utilities/BoxShadow/examples/box-shadow.css +5 -5
  317. package/icons/pficons.mjs +1 -0
  318. package/layouts/Flex/flex.css +115 -43
  319. package/layouts/Flex/flex.scss +20 -8
  320. package/package.json +36 -32
  321. package/patternfly-addons.css +732 -972
  322. package/patternfly-base-no-globals-theme-dark-unversioned.css +923 -799
  323. package/patternfly-base-no-globals.css +923 -799
  324. package/patternfly-base-theme-dark-unversioned.css +928 -803
  325. package/patternfly-base.css +928 -803
  326. package/patternfly-no-globals.css +6887 -7357
  327. package/patternfly-theme-dark-unversioned.css +6892 -7361
  328. package/patternfly.css +6892 -7361
  329. package/patternfly.min.css +1 -1
  330. package/patternfly.min.css.map +1 -1
  331. package/sass-utilities/functions.scss +6 -0
  332. package/sass-utilities/mixins.scss +80 -2
  333. package/sass-utilities/scss-variables.scss +8 -8
  334. package/sass-utilities/themes/dark/mixins.scss +3 -1
  335. package/utilities/Accessibility/accessibility.css +12 -12
  336. package/utilities/Spacing/spacing.css +720 -960
  337. package/utilities/Spacing/spacing.scss +4 -8
  338. package/base/themes/dark/_variables.scss +0 -102
  339. package/components/AboutModalBox/themes/dark/about-modal-box.scss +0 -7
  340. package/components/Accordion/themes/dark/accordion.scss +0 -9
  341. package/components/Alert/themes/dark/alert.scss +0 -17
  342. package/components/Badge/themes/dark/badge.scss +0 -9
  343. package/components/Banner/themes/dark/banner.scss +0 -14
  344. package/components/Button/themes/dark/button.scss +0 -51
  345. package/components/ClipboardCopy/themes/dark/clipboard-copy.scss +0 -19
  346. package/components/DataList/themes/dark/data-list.scss +0 -10
  347. package/components/DragDrop/themes/dark/drag-drop.scss +0 -7
  348. package/components/Form/themes/dark/form.scss +0 -7
  349. package/components/FormControl/themes/dark/form-control.scss +0 -24
  350. package/components/HelperText/themes/dark/helper-text.scss +0 -7
  351. package/components/Hint/themes/dark/hint.scss +0 -8
  352. package/components/InputGroup/themes/dark/input-group.scss +0 -22
  353. package/components/Label/themes/dark/label.scss +0 -53
  354. package/components/Login/themes/dark/login.scss +0 -12
  355. package/components/Masthead/themes/dark/masthead.scss +0 -14
  356. package/components/ModalBox/themes/dark/modal-box.scss +0 -7
  357. package/components/NotificationBadge/themes/dark/notification-badge.scss +0 -10
  358. package/components/NotificationDrawer/themes/dark/notification-drawer.scss +0 -14
  359. package/components/Page/themes/dark/page.scss +0 -69
  360. package/components/Pagination/themes/dark/pagination.scss +0 -7
  361. package/components/Panel/themes/dark/panel.scss +0 -7
  362. package/components/Popover/themes/dark/popover.scss +0 -11
  363. package/components/Progress/themes/dark/progress.scss +0 -9
  364. package/components/SimpleList/themes/dark/simple-list.scss +0 -14
  365. package/components/Skeleton/themes/dark/skeleton.scss +0 -10
  366. package/components/Switch/themes/dark/switch.scss +0 -11
  367. package/components/Tile/themes/dark/tile.scss +0 -10
  368. package/components/ToggleGroup/themes/dark/toggle-group.scss +0 -12
  369. package/components/Tooltip/themes/dark/tooltip.scss +0 -8
  370. package/docs/components/Avatar/examples/Avatar.css +0 -3
  371. package/docs/components/NotificationBadge/examples/NotificationBadge.css +0 -3
package/docs/demos/JumpLinks/examples/JumpLinks.md CHANGED
@@ -28,12 +28,76 @@ 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">
@@ -43,8 +107,38 @@ section: components
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-align-right 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,12 +428,76 @@ 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">
@@ -350,8 +507,38 @@ section: components
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-align-right 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,12 +828,76 @@ 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">
@@ -657,8 +907,38 @@ section: components
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-align-right 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,12 +1225,76 @@ 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">
@@ -961,8 +1304,38 @@ section: components
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-align-right 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,12 +1562,76 @@ 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">
@@ -1215,8 +1641,38 @@ section: components
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-align-right 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>
@@ -1474,12 +1919,76 @@ section: components
1474
1919
  </span>
1475
1920
  <div class="pf-v5-c-masthead__main">
1476
1921
  <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
- />
1922
+ <svg height="40px" viewBox="0 0 679 158">
1923
+ <title>PF-HorizontalLogo-Color</title>
1924
+ <defs>
1925
+ <linearGradient
1926
+ x1="68%"
1927
+ y1="2.25860997e-13%"
1928
+ x2="32%"
1929
+ y2="100%"
1930
+ id="linearGradient-jump-links-drawer-expanded-masthead"
1931
+ >
1932
+ <stop stop-color="#2B9AF3" offset="0%" />
1933
+ <stop
1934
+ stop-color="#73BCF7"
1935
+ stop-opacity="0.502212631"
1936
+ offset="100%"
1937
+ />
1938
+ </linearGradient>
1939
+ </defs>
1940
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1941
+ <g
1942
+ transform="translate(206.000000, 45.750000)"
1943
+ fill="var(--pf-t--global--text--color--regular)"
1944
+ fill-rule="nonzero"
1945
+ >
1946
+ <path
1947
+ 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"
1948
+ />
1949
+ <path
1950
+ 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"
1951
+ />
1952
+ <path
1953
+ 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"
1954
+ />
1955
+ <path
1956
+ 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"
1957
+ />
1958
+ <path
1959
+ 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"
1960
+ />
1961
+ <path
1962
+ 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"
1963
+ />
1964
+ <path
1965
+ 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"
1966
+ />
1967
+ <polygon
1968
+ 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"
1969
+ />
1970
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
1971
+ <path
1972
+ 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"
1973
+ />
1974
+ </g>
1975
+ <g transform="translate(0.000000, 0.000000)">
1976
+ <path
1977
+ 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"
1978
+ fill="#0066CC"
1979
+ />
1980
+ <path
1981
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
1982
+ fill="url(#linearGradient-jump-links-drawer-expanded-masthead)"
1983
+ />
1984
+ <path
1985
+ 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"
1986
+ fill="url(#linearGradient-jump-links-drawer-expanded-masthead)"
1987
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
1988
+ />
1989
+ </g>
1990
+ </g>
1991
+ </svg>
1483
1992
  </a>
1484
1993
  </div>
1485
1994
  <div class="pf-v5-c-masthead__content">
@@ -1489,8 +1998,38 @@ section: components
1489
1998
  >
1490
1999
  <div class="pf-v5-c-toolbar__content">
1491
2000
  <div class="pf-v5-c-toolbar__content-section">
2001
+ <div class="pf-v5-c-toolbar__item">
2002
+ <button
2003
+ class="pf-v5-c-menu-toggle"
2004
+ type="button"
2005
+ aria-expanded="false"
2006
+ >
2007
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
2008
+ <span class="pf-v5-c-menu-toggle__controls">
2009
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
2010
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
2011
+ </span>
2012
+ </span>
2013
+ </button>
2014
+ </div>
2015
+
2016
+ <div class="pf-v5-c-toolbar__item">
2017
+ <button
2018
+ class="pf-v5-c-menu-toggle"
2019
+ type="button"
2020
+ aria-expanded="false"
2021
+ >
2022
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
2023
+ <span class="pf-v5-c-menu-toggle__controls">
2024
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
2025
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
2026
+ </span>
2027
+ </span>
2028
+ </button>
2029
+ </div>
2030
+
1492
2031
  <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"
2032
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-align-right pf-m-spacer-none pf-m-spacer-md-on-md"
1494
2033
  >
1495
2034
  <div
1496
2035
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -1537,27 +2076,6 @@ section: components
1537
2076
  </button>
1538
2077
  </div>
1539
2078
  </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
2079
  </div>
1562
2080
  </div>
1563
2081
  </div>
@@ -1616,54 +2134,64 @@ section: components
1616
2134
  <div class="pf-v5-c-jump-links__label">Jump to section</div>
1617
2135
  <ul class="pf-v5-c-jump-links__list" role="list">
1618
2136
  <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>
2137
+ <span class="pf-v5-c-jump-links__link">
2138
+ <a
2139
+ class="pf-v5-c-button pf-m-link"
2140
+ href="#jump-links-drawer-expanded-jump-links-first"
2141
+ >
2142
+ <span
2143
+ class="pf-v5-c-jump-links__link-text"
2144
+ >First section</span>
2145
+ </a>
2146
+ </span>
1627
2147
  </li>
1628
2148
  <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>
2149
+ <span class="pf-v5-c-jump-links__link">
2150
+ <a
2151
+ class="pf-v5-c-button pf-m-link"
2152
+ href="#jump-links-drawer-expanded-jump-links-second"
2153
+ >
2154
+ <span
2155
+ class="pf-v5-c-jump-links__link-text"
2156
+ >Second section</span>
2157
+ </a>
2158
+ </span>
1637
2159
  </li>
1638
2160
  <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>
2161
+ <span class="pf-v5-c-jump-links__link">
2162
+ <a
2163
+ class="pf-v5-c-button pf-m-link"
2164
+ href="#jump-links-drawer-expanded-jump-links-third"
2165
+ >
2166
+ <span
2167
+ class="pf-v5-c-jump-links__link-text"
2168
+ >Third section</span>
2169
+ </a>
2170
+ </span>
1647
2171
  </li>
1648
2172
  <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>
2173
+ <span class="pf-v5-c-jump-links__link">
2174
+ <a
2175
+ class="pf-v5-c-button pf-m-link"
2176
+ href="#jump-links-drawer-expanded-jump-links-fourth"
2177
+ >
2178
+ <span
2179
+ class="pf-v5-c-jump-links__link-text"
2180
+ >Fourth section</span>
2181
+ </a>
2182
+ </span>
1657
2183
  </li>
1658
2184
  <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>
2185
+ <span class="pf-v5-c-jump-links__link">
2186
+ <a
2187
+ class="pf-v5-c-button pf-m-link"
2188
+ href="#jump-links-drawer-expanded-jump-links-fifth"
2189
+ >
2190
+ <span
2191
+ class="pf-v5-c-jump-links__link-text"
2192
+ >Fifth section</span>
2193
+ </a>
2194
+ </span>
1667
2195
  </li>
1668
2196
  </ul>
1669
2197
  </nav>