@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/ContextSelector/examples/ContextSelector.md CHANGED
@@ -27,12 +27,76 @@ deprecated: true
27
27
  </span>
28
28
  <div class="pf-v5-c-masthead__main">
29
29
  <a class="pf-v5-c-masthead__brand" href="#">
30
- <img
31
- class="pf-v5-c-brand"
32
- src="/assets/images/pf-logo.svg"
33
- alt="PatternFly logo"
34
- style="--pf-v5-c-brand--Height:36px"
35
- />
30
+ <svg height="40px" viewBox="0 0 679 158">
31
+ <title>PF-HorizontalLogo-Color</title>
32
+ <defs>
33
+ <linearGradient
34
+ x1="68%"
35
+ y1="2.25860997e-13%"
36
+ x2="32%"
37
+ y2="100%"
38
+ id="linearGradient-context-selector-in-masthead-masthead"
39
+ >
40
+ <stop stop-color="#2B9AF3" offset="0%" />
41
+ <stop
42
+ stop-color="#73BCF7"
43
+ stop-opacity="0.502212631"
44
+ offset="100%"
45
+ />
46
+ </linearGradient>
47
+ </defs>
48
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
49
+ <g
50
+ transform="translate(206.000000, 45.750000)"
51
+ fill="var(--pf-t--global--text--color--regular)"
52
+ fill-rule="nonzero"
53
+ >
54
+ <path
55
+ 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"
56
+ />
57
+ <path
58
+ 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"
59
+ />
60
+ <path
61
+ 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"
62
+ />
63
+ <path
64
+ 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"
65
+ />
66
+ <path
67
+ 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"
68
+ />
69
+ <path
70
+ 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"
71
+ />
72
+ <path
73
+ 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"
74
+ />
75
+ <polygon
76
+ 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"
77
+ />
78
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
79
+ <path
80
+ 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"
81
+ />
82
+ </g>
83
+ <g transform="translate(0.000000, 0.000000)">
84
+ <path
85
+ 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"
86
+ fill="#0066CC"
87
+ />
88
+ <path
89
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
90
+ fill="url(#linearGradient-context-selector-in-masthead-masthead)"
91
+ />
92
+ <path
93
+ 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"
94
+ fill="url(#linearGradient-context-selector-in-masthead-masthead)"
95
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
96
+ />
97
+ </g>
98
+ </g>
99
+ </svg>
36
100
  </a>
37
101
  </div>
38
102
  <div class="pf-v5-c-masthead__content">
@@ -207,12 +271,76 @@ deprecated: true
207
271
  </span>
208
272
  <div class="pf-v5-c-masthead__main">
209
273
  <a class="pf-v5-c-masthead__brand" href="#">
210
- <img
211
- class="pf-v5-c-brand"
212
- src="/assets/images/pf-logo.svg"
213
- alt="PatternFly logo"
214
- style="--pf-v5-c-brand--Height:36px"
215
- />
274
+ <svg height="40px" viewBox="0 0 679 158">
275
+ <title>PF-HorizontalLogo-Color</title>
276
+ <defs>
277
+ <linearGradient
278
+ x1="68%"
279
+ y1="2.25860997e-13%"
280
+ x2="32%"
281
+ y2="100%"
282
+ id="linearGradient-context-selector-in-sidebar-example-masthead"
283
+ >
284
+ <stop stop-color="#2B9AF3" offset="0%" />
285
+ <stop
286
+ stop-color="#73BCF7"
287
+ stop-opacity="0.502212631"
288
+ offset="100%"
289
+ />
290
+ </linearGradient>
291
+ </defs>
292
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
293
+ <g
294
+ transform="translate(206.000000, 45.750000)"
295
+ fill="var(--pf-t--global--text--color--regular)"
296
+ fill-rule="nonzero"
297
+ >
298
+ <path
299
+ 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"
300
+ />
301
+ <path
302
+ 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"
303
+ />
304
+ <path
305
+ 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"
306
+ />
307
+ <path
308
+ 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"
309
+ />
310
+ <path
311
+ 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"
312
+ />
313
+ <path
314
+ 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"
315
+ />
316
+ <path
317
+ 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"
318
+ />
319
+ <polygon
320
+ 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"
321
+ />
322
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
323
+ <path
324
+ 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"
325
+ />
326
+ </g>
327
+ <g transform="translate(0.000000, 0.000000)">
328
+ <path
329
+ 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"
330
+ fill="#0066CC"
331
+ />
332
+ <path
333
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
334
+ fill="url(#linearGradient-context-selector-in-sidebar-example-masthead)"
335
+ />
336
+ <path
337
+ 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"
338
+ fill="url(#linearGradient-context-selector-in-sidebar-example-masthead)"
339
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
340
+ />
341
+ </g>
342
+ </g>
343
+ </svg>
216
344
  </a>
217
345
  </div>
218
346
  <div class="pf-v5-c-masthead__content">
@@ -222,8 +350,38 @@ deprecated: true
222
350
  >
223
351
  <div class="pf-v5-c-toolbar__content">
224
352
  <div class="pf-v5-c-toolbar__content-section">
353
+ <div class="pf-v5-c-toolbar__item">
354
+ <button
355
+ class="pf-v5-c-menu-toggle"
356
+ type="button"
357
+ aria-expanded="false"
358
+ >
359
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
360
+ <span class="pf-v5-c-menu-toggle__controls">
361
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
362
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
363
+ </span>
364
+ </span>
365
+ </button>
366
+ </div>
367
+
368
+ <div class="pf-v5-c-toolbar__item">
369
+ <button
370
+ class="pf-v5-c-menu-toggle"
371
+ type="button"
372
+ aria-expanded="false"
373
+ >
374
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
375
+ <span class="pf-v5-c-menu-toggle__controls">
376
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
377
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
378
+ </span>
379
+ </span>
380
+ </button>
381
+ </div>
382
+
225
383
  <div
226
- 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"
384
+ 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"
227
385
  >
228
386
  <div
229
387
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -270,27 +428,6 @@ deprecated: true
270
428
  </button>
271
429
  </div>
272
430
  </div>
273
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
274
- <button
275
- class="pf-v5-c-menu-toggle pf-m-full-height"
276
- type="button"
277
- aria-expanded="false"
278
- >
279
- <span class="pf-v5-c-menu-toggle__icon">
280
- <img
281
- class="pf-v5-c-avatar"
282
- alt="Avatar image"
283
- src="/assets/images/img_avatar-light.svg"
284
- />
285
- </span>
286
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
287
- <span class="pf-v5-c-menu-toggle__controls">
288
- <span class="pf-v5-c-menu-toggle__toggle-icon">
289
- <i class="fas fa-angle-down" aria-hidden="true"></i>
290
- </span>
291
- </span>
292
- </button>
293
- </div>
294
431
  </div>
295
432
  </div>
296
433
  </div>
@@ -584,12 +721,76 @@ deprecated: true
584
721
  </span>
585
722
  <div class="pf-v5-c-masthead__main">
586
723
  <a class="pf-v5-c-masthead__brand" href="#">
587
- <img
588
- class="pf-v5-c-brand"
589
- src="/assets/images/pf-logo.svg"
590
- alt="PatternFly logo"
591
- style="--pf-v5-c-brand--Height:36px"
592
- />
724
+ <svg height="40px" viewBox="0 0 679 158">
725
+ <title>PF-HorizontalLogo-Color</title>
726
+ <defs>
727
+ <linearGradient
728
+ x1="68%"
729
+ y1="2.25860997e-13%"
730
+ x2="32%"
731
+ y2="100%"
732
+ id="linearGradient-context-selector-in-sidebar-expanded-example-masthead"
733
+ >
734
+ <stop stop-color="#2B9AF3" offset="0%" />
735
+ <stop
736
+ stop-color="#73BCF7"
737
+ stop-opacity="0.502212631"
738
+ offset="100%"
739
+ />
740
+ </linearGradient>
741
+ </defs>
742
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
743
+ <g
744
+ transform="translate(206.000000, 45.750000)"
745
+ fill="var(--pf-t--global--text--color--regular)"
746
+ fill-rule="nonzero"
747
+ >
748
+ <path
749
+ 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"
750
+ />
751
+ <path
752
+ 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"
753
+ />
754
+ <path
755
+ 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"
756
+ />
757
+ <path
758
+ 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"
759
+ />
760
+ <path
761
+ 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"
762
+ />
763
+ <path
764
+ 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"
765
+ />
766
+ <path
767
+ 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"
768
+ />
769
+ <polygon
770
+ 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"
771
+ />
772
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
773
+ <path
774
+ 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"
775
+ />
776
+ </g>
777
+ <g transform="translate(0.000000, 0.000000)">
778
+ <path
779
+ 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"
780
+ fill="#0066CC"
781
+ />
782
+ <path
783
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
784
+ fill="url(#linearGradient-context-selector-in-sidebar-expanded-example-masthead)"
785
+ />
786
+ <path
787
+ 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"
788
+ fill="url(#linearGradient-context-selector-in-sidebar-expanded-example-masthead)"
789
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
790
+ />
791
+ </g>
792
+ </g>
793
+ </svg>
593
794
  </a>
594
795
  </div>
595
796
  <div class="pf-v5-c-masthead__content">
@@ -599,8 +800,38 @@ deprecated: true
599
800
  >
600
801
  <div class="pf-v5-c-toolbar__content">
601
802
  <div class="pf-v5-c-toolbar__content-section">
803
+ <div class="pf-v5-c-toolbar__item">
804
+ <button
805
+ class="pf-v5-c-menu-toggle"
806
+ type="button"
807
+ aria-expanded="false"
808
+ >
809
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
810
+ <span class="pf-v5-c-menu-toggle__controls">
811
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
812
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
813
+ </span>
814
+ </span>
815
+ </button>
816
+ </div>
817
+
818
+ <div class="pf-v5-c-toolbar__item">
819
+ <button
820
+ class="pf-v5-c-menu-toggle"
821
+ type="button"
822
+ aria-expanded="false"
823
+ >
824
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
825
+ <span class="pf-v5-c-menu-toggle__controls">
826
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
827
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
828
+ </span>
829
+ </span>
830
+ </button>
831
+ </div>
832
+
602
833
  <div
603
- 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"
834
+ 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"
604
835
  >
605
836
  <div
606
837
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -647,27 +878,6 @@ deprecated: true
647
878
  </button>
648
879
  </div>
649
880
  </div>
650
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
651
- <button
652
- class="pf-v5-c-menu-toggle pf-m-full-height"
653
- type="button"
654
- aria-expanded="false"
655
- >
656
- <span class="pf-v5-c-menu-toggle__icon">
657
- <img
658
- class="pf-v5-c-avatar"
659
- alt="Avatar image"
660
- src="/assets/images/img_avatar-light.svg"
661
- />
662
- </span>
663
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
664
- <span class="pf-v5-c-menu-toggle__controls">
665
- <span class="pf-v5-c-menu-toggle__toggle-icon">
666
- <i class="fas fa-angle-down" aria-hidden="true"></i>
667
- </span>
668
- </span>
669
- </button>
670
- </div>
671
881
  </div>
672
882
  </div>
673
883
  </div>
@@ -963,12 +1173,76 @@ deprecated: true
963
1173
  </span>
964
1174
  <div class="pf-v5-c-masthead__main">
965
1175
  <a class="pf-v5-c-masthead__brand" href="#">
966
- <img
967
- class="pf-v5-c-brand"
968
- src="/assets/images/pf-logo.svg"
969
- alt="PatternFly logo"
970
- style="--pf-v5-c-brand--Height:36px"
971
- />
1176
+ <svg height="40px" viewBox="0 0 679 158">
1177
+ <title>PF-HorizontalLogo-Color</title>
1178
+ <defs>
1179
+ <linearGradient
1180
+ x1="68%"
1181
+ y1="2.25860997e-13%"
1182
+ x2="32%"
1183
+ y2="100%"
1184
+ id="linearGradient-context-selector-in-page-content-example-masthead"
1185
+ >
1186
+ <stop stop-color="#2B9AF3" offset="0%" />
1187
+ <stop
1188
+ stop-color="#73BCF7"
1189
+ stop-opacity="0.502212631"
1190
+ offset="100%"
1191
+ />
1192
+ </linearGradient>
1193
+ </defs>
1194
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
1195
+ <g
1196
+ transform="translate(206.000000, 45.750000)"
1197
+ fill="var(--pf-t--global--text--color--regular)"
1198
+ fill-rule="nonzero"
1199
+ >
1200
+ <path
1201
+ 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"
1202
+ />
1203
+ <path
1204
+ 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"
1205
+ />
1206
+ <path
1207
+ 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"
1208
+ />
1209
+ <path
1210
+ 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"
1211
+ />
1212
+ <path
1213
+ 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"
1214
+ />
1215
+ <path
1216
+ 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"
1217
+ />
1218
+ <path
1219
+ 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"
1220
+ />
1221
+ <polygon
1222
+ 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"
1223
+ />
1224
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
1225
+ <path
1226
+ 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"
1227
+ />
1228
+ </g>
1229
+ <g transform="translate(0.000000, 0.000000)">
1230
+ <path
1231
+ 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"
1232
+ fill="#0066CC"
1233
+ />
1234
+ <path
1235
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
1236
+ fill="url(#linearGradient-context-selector-in-page-content-example-masthead)"
1237
+ />
1238
+ <path
1239
+ 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"
1240
+ fill="url(#linearGradient-context-selector-in-page-content-example-masthead)"
1241
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
1242
+ />
1243
+ </g>
1244
+ </g>
1245
+ </svg>
972
1246
  </a>
973
1247
  </div>
974
1248
  <div class="pf-v5-c-masthead__content">
@@ -978,8 +1252,38 @@ deprecated: true
978
1252
  >
979
1253
  <div class="pf-v5-c-toolbar__content">
980
1254
  <div class="pf-v5-c-toolbar__content-section">
1255
+ <div class="pf-v5-c-toolbar__item">
1256
+ <button
1257
+ class="pf-v5-c-menu-toggle"
1258
+ type="button"
1259
+ aria-expanded="false"
1260
+ >
1261
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
1262
+ <span class="pf-v5-c-menu-toggle__controls">
1263
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
1264
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
1265
+ </span>
1266
+ </span>
1267
+ </button>
1268
+ </div>
1269
+
1270
+ <div class="pf-v5-c-toolbar__item">
1271
+ <button
1272
+ class="pf-v5-c-menu-toggle"
1273
+ type="button"
1274
+ aria-expanded="false"
1275
+ >
1276
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
1277
+ <span class="pf-v5-c-menu-toggle__controls">
1278
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
1279
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
1280
+ </span>
1281
+ </span>
1282
+ </button>
1283
+ </div>
1284
+
981
1285
  <div
982
- 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"
1286
+ 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"
983
1287
  >
984
1288
  <div
985
1289
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -1026,27 +1330,6 @@ deprecated: true
1026
1330
  </button>
1027
1331
  </div>
1028
1332
  </div>
1029
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
1030
- <button
1031
- class="pf-v5-c-menu-toggle pf-m-full-height"
1032
- type="button"
1033
- aria-expanded="false"
1034
- >
1035
- <span class="pf-v5-c-menu-toggle__icon">
1036
- <img
1037
- class="pf-v5-c-avatar"
1038
- alt="Avatar image"
1039
- src="/assets/images/img_avatar-light.svg"
1040
- />
1041
- </span>
1042
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
1043
- <span class="pf-v5-c-menu-toggle__controls">
1044
- <span class="pf-v5-c-menu-toggle__toggle-icon">
1045
- <i class="fas fa-angle-down" aria-hidden="true"></i>
1046
- </span>
1047
- </span>
1048
- </button>
1049
- </div>
1050
1333
  </div>
1051
1334
  </div>
1052
1335
  </div>