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

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 (331) hide show
  1. package/CODE_OF_CONDUCT.md +1 -2
  2. package/assets/images/PF-Backdrop.svg +1 -0
  3. package/assets/images/PF-HorizontalLogo-Color.svg +29 -0
  4. package/assets/images/PF-HorizontalLogo-Reverse.svg +28 -0
  5. package/assets/images/PF-IconLogo-Reverse.svg +14 -0
  6. package/assets/images/PF-IconLogo-color.svg +17 -0
  7. package/assets/images/PF-IconLogo.svg +17 -0
  8. package/assets/images/logo__pf--reverse-on-md.svg +1 -1
  9. package/assets/images/pf-background.svg +22 -0
  10. package/assets/images/pf-c-brand__logo-on-lg-white.svg +32 -0
  11. package/assets/images/pf-c-brand__logo-on-md-white.svg +42 -0
  12. package/assets/images/pf-c-brand__logo-on-sm-white.svg +17 -0
  13. package/assets/images/pf-c-brand__logo-on-sm.svg +1 -1
  14. package/assets/images/pf-c-brand__logo-on-xl-white.svg +39 -0
  15. package/assets/images/pf_logo_white.hbs +35 -0
  16. package/assets/images/pf_logo_white.svg +38 -0
  17. package/base/_common.scss +8 -4
  18. package/base/_globals.scss +4 -6
  19. package/base/_variables.scss +2 -7
  20. package/base/patternfly-common.css +8 -4
  21. package/base/patternfly-globals.css +4 -3
  22. package/base/patternfly-variables.css +884 -871
  23. package/base/tokens/_tokens-charts.scss +159 -0
  24. package/base/tokens/_tokens-dark.scss +311 -287
  25. package/base/tokens/_tokens-default.scss +425 -329
  26. package/base/tokens/_tokens-font.scss +29 -36
  27. package/base/tokens/_tokens-palette.scss +71 -71
  28. package/base/tokens/_workspace-overrides.scss +7 -0
  29. package/components/AboutModalBox/about-modal-box.css +57 -94
  30. package/components/AboutModalBox/about-modal-box.scss +37 -62
  31. package/components/Accordion/accordion.css +85 -177
  32. package/components/Accordion/accordion.scss +96 -195
  33. package/components/ActionList/action-list.css +18 -17
  34. package/components/ActionList/action-list.scss +26 -16
  35. package/components/Alert/alert-group.css +20 -16
  36. package/components/Alert/alert-group.scss +20 -16
  37. package/components/Alert/alert.css +59 -84
  38. package/components/Alert/alert.scss +62 -78
  39. package/components/Avatar/avatar.css +10 -13
  40. package/components/Avatar/avatar.scss +10 -17
  41. package/components/BackToTop/back-to-top.css +17 -16
  42. package/components/BackToTop/back-to-top.scss +12 -12
  43. package/components/Backdrop/backdrop.css +6 -2
  44. package/components/Backdrop/backdrop.scss +5 -2
  45. package/components/BackgroundImage/background-image.css +5 -1
  46. package/components/BackgroundImage/background-image.scss +5 -1
  47. package/components/Badge/badge.css +23 -15
  48. package/components/Badge/badge.scss +25 -17
  49. package/components/Banner/banner.css +90 -64
  50. package/components/Banner/banner.scss +95 -32
  51. package/components/Breadcrumb/breadcrumb.css +19 -16
  52. package/components/Breadcrumb/breadcrumb.scss +18 -16
  53. package/components/Button/button.css +419 -353
  54. package/components/Button/button.scss +476 -476
  55. package/components/CalendarMonth/calendar-month.css +61 -92
  56. package/components/CalendarMonth/calendar-month.scss +68 -63
  57. package/components/Card/card.css +100 -194
  58. package/components/Card/card.scss +121 -237
  59. package/components/Check/check.css +24 -21
  60. package/components/Check/check.scss +25 -23
  61. package/components/ClipboardCopy/clipboard-copy.css +30 -33
  62. package/components/ClipboardCopy/clipboard-copy.scss +34 -26
  63. package/components/CodeBlock/code-block.css +22 -9
  64. package/components/CodeBlock/code-block.scss +22 -10
  65. package/components/CodeEditor/code-editor.css +94 -72
  66. package/components/CodeEditor/code-editor.scss +104 -82
  67. package/components/Content/content.css +7 -7
  68. package/components/Content/content.scss +7 -7
  69. package/components/DataList/data-list.css +101 -158
  70. package/components/DataList/data-list.scss +95 -154
  71. package/components/DatePicker/date-picker.css +13 -14
  72. package/components/DatePicker/date-picker.scss +12 -16
  73. package/components/DescriptionList/description-list.css +39 -34
  74. package/components/DescriptionList/description-list.scss +25 -25
  75. package/components/Divider/divider.css +91 -169
  76. package/components/Divider/divider.scss +60 -77
  77. package/components/DragDrop/drag-drop.css +18 -14
  78. package/components/DragDrop/drag-drop.scss +18 -17
  79. package/components/Drawer/drawer.css +112 -113
  80. package/components/Drawer/drawer.scss +134 -134
  81. package/components/Dropdown/dropdown.css +1 -3
  82. package/components/Dropdown/dropdown.scss +2 -6
  83. package/components/EmptyState/empty-state.css +57 -34
  84. package/components/EmptyState/empty-state.scss +63 -34
  85. package/components/ExpandableSection/expandable-section.css +64 -62
  86. package/components/ExpandableSection/expandable-section.scss +73 -76
  87. package/components/FileUpload/file-upload.css +28 -34
  88. package/components/FileUpload/file-upload.scss +30 -42
  89. package/components/Form/form.css +68 -114
  90. package/components/Form/form.scss +65 -126
  91. package/components/FormControl/form-control.css +86 -111
  92. package/components/FormControl/form-control.scss +88 -92
  93. package/components/HelperText/helper-text.css +28 -34
  94. package/components/HelperText/helper-text.scss +30 -40
  95. package/components/Hint/hint.css +28 -21
  96. package/components/Hint/hint.scss +28 -24
  97. package/components/Icon/icon.css +154 -18
  98. package/components/Icon/icon.scss +187 -20
  99. package/components/InlineEdit/inline-edit.css +8 -7
  100. package/components/InlineEdit/inline-edit.scss +8 -7
  101. package/components/InputGroup/input-group.css +22 -38
  102. package/components/InputGroup/input-group.scss +21 -29
  103. package/components/JumpLinks/jump-links.css +34 -34
  104. package/components/JumpLinks/jump-links.scss +35 -36
  105. package/components/Label/label-group.css +39 -44
  106. package/components/Label/label-group.scss +39 -45
  107. package/components/Label/label.css +380 -355
  108. package/components/Label/label.scss +434 -348
  109. package/components/List/list.css +16 -16
  110. package/components/List/list.scss +17 -17
  111. package/components/Login/login.css +70 -97
  112. package/components/Login/login.scss +56 -64
  113. package/components/Masthead/masthead.css +261 -502
  114. package/components/Masthead/masthead.scss +123 -286
  115. package/components/Menu/menu.css +3 -0
  116. package/components/Menu/menu.scss +7 -3
  117. package/components/MenuToggle/menu-toggle.css +8 -8
  118. package/components/MenuToggle/menu-toggle.scss +8 -10
  119. package/components/ModalBox/modal-box.css +59 -52
  120. package/components/ModalBox/modal-box.scss +57 -53
  121. package/components/MultipleFileUpload/multiple-file-upload.css +77 -50
  122. package/components/MultipleFileUpload/multiple-file-upload.scss +82 -53
  123. package/components/Nav/nav.css +240 -918
  124. package/components/Nav/nav.scss +300 -1082
  125. package/components/NotificationBadge/notification-badge.css +56 -81
  126. package/components/NotificationBadge/notification-badge.scss +60 -97
  127. package/components/NotificationDrawer/notification-drawer.css +104 -115
  128. package/components/NotificationDrawer/notification-drawer.scss +106 -116
  129. package/components/NumberInput/number-input.css +8 -8
  130. package/components/NumberInput/number-input.scss +7 -12
  131. package/components/OverflowMenu/overflow-menu.css +17 -47
  132. package/components/OverflowMenu/overflow-menu.scss +27 -65
  133. package/components/Page/page.css +56 -164
  134. package/components/Page/page.scss +60 -154
  135. package/components/Pagination/pagination.css +57 -124
  136. package/components/Pagination/pagination.scss +40 -128
  137. package/components/Panel/panel.css +27 -23
  138. package/components/Panel/panel.scss +29 -26
  139. package/components/Popover/popover.css +42 -53
  140. package/components/Popover/popover.scss +46 -55
  141. package/components/Progress/progress.css +31 -45
  142. package/components/Progress/progress.scss +36 -55
  143. package/components/ProgressStepper/progress-stepper.css +72 -69
  144. package/components/ProgressStepper/progress-stepper.scss +65 -65
  145. package/components/Radio/radio.css +27 -20
  146. package/components/Radio/radio.scss +28 -22
  147. package/components/Sidebar/sidebar.css +20 -9
  148. package/components/Sidebar/sidebar.scss +23 -11
  149. package/components/SimpleList/simple-list.css +35 -52
  150. package/components/SimpleList/simple-list.scss +41 -51
  151. package/components/Skeleton/skeleton.css +18 -20
  152. package/components/Skeleton/skeleton.scss +17 -21
  153. package/components/SkipToContent/skip-to-content.css +6 -3
  154. package/components/SkipToContent/skip-to-content.scss +8 -6
  155. package/components/Slider/slider.css +34 -30
  156. package/components/Slider/slider.scss +46 -43
  157. package/components/Spinner/spinner.css +17 -34
  158. package/components/Spinner/spinner.scss +19 -47
  159. package/components/Switch/switch.css +42 -38
  160. package/components/Switch/switch.scss +48 -43
  161. package/components/TabContent/tab-content.css +17 -11
  162. package/components/TabContent/tab-content.scss +18 -14
  163. package/components/Table/table-grid.css +29 -45
  164. package/components/Table/table-grid.scss +40 -53
  165. package/components/Table/table-scrollable.css +6 -6
  166. package/components/Table/table-scrollable.scss +8 -8
  167. package/components/Table/table-tree-view.css +76 -74
  168. package/components/Table/table-tree-view.scss +44 -39
  169. package/components/Table/table.css +67 -93
  170. package/components/Table/table.scss +83 -105
  171. package/components/Tabs/tabs.css +143 -175
  172. package/components/Tabs/tabs.scss +159 -217
  173. package/components/Tile/tile.css +40 -81
  174. package/components/Tile/tile.scss +38 -84
  175. package/components/Timestamp/timestamp.css +12 -9
  176. package/components/Timestamp/timestamp.scss +11 -10
  177. package/components/Title/title.css +70 -19
  178. package/components/Title/title.scss +90 -20
  179. package/components/ToggleGroup/toggle-group.css +54 -48
  180. package/components/ToggleGroup/toggle-group.scss +62 -50
  181. package/components/Toolbar/toolbar.css +2527 -1031
  182. package/components/Toolbar/toolbar.scss +233 -520
  183. package/components/Tooltip/tooltip.css +16 -18
  184. package/components/Tooltip/tooltip.scss +20 -24
  185. package/components/TreeView/tree-view.css +76 -97
  186. package/components/TreeView/tree-view.scss +82 -113
  187. package/components/Truncate/truncate.css +4 -0
  188. package/components/Truncate/truncate.scss +3 -0
  189. package/docs/components/AboutModalBox/examples/AboutModalBox.md +2 -2
  190. package/docs/components/Accordion/examples/Accordion.md +614 -416
  191. package/docs/components/ActionList/examples/ActionList.md +73 -22
  192. package/docs/components/Alert/examples/Alert.md +3 -3
  193. package/docs/components/Avatar/examples/Avatar.md +5 -19
  194. package/docs/components/BackgroundImage/examples/BackgroundImage.md +1 -1
  195. package/docs/components/Badge/examples/Badge.md +21 -0
  196. package/docs/components/Banner/examples/Banner.md +48 -25
  197. package/docs/components/Brand/examples/Brand.css +12 -0
  198. package/docs/components/Brand/examples/Brand.md +51 -32
  199. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  200. package/docs/components/Button/examples/Button.css +4 -0
  201. package/docs/components/Button/examples/Button.md +1419 -93
  202. package/docs/components/CalendarMonth/examples/CalendarMonth.md +48 -224
  203. package/docs/components/Card/examples/Card.md +550 -133
  204. package/docs/components/Check/examples/Check.md +1 -0
  205. package/docs/components/CodeBlock/examples/CodeBlock.md +4 -4
  206. package/docs/components/CodeEditor/examples/CodeEditor.md +144 -132
  207. package/docs/components/Content/examples/Content.md +5 -5
  208. package/docs/components/DatePicker/examples/DatePicker.md +5 -2
  209. package/docs/components/Divider/examples/Divider.css +3 -1
  210. package/docs/components/Divider/examples/Divider.md +30 -5
  211. package/docs/components/DragDrop/examples/DragDrop.css +1 -1
  212. package/docs/components/Drawer/examples/Drawer.md +294 -256
  213. package/docs/components/EmptyState/examples/EmptyState.md +45 -1
  214. package/docs/components/ExpandableSection/examples/ExpandableSection.md +49 -28
  215. package/docs/components/FileUpload/examples/FileUpload.md +112 -53
  216. package/docs/components/Form/examples/Form.md +134 -89
  217. package/docs/components/Icon/examples/Icon.md +82 -11
  218. package/docs/components/InlineEdit/examples/InlineEdit.md +3 -1
  219. package/docs/components/JumpLinks/examples/JumpLinks.md +280 -168
  220. package/docs/components/Label/examples/Label.css +4 -0
  221. package/docs/components/Label/examples/Label.md +3090 -703
  222. package/docs/components/LogViewer/examples/LogViewer.md +180 -180
  223. package/docs/components/Login/examples/Login.md +10 -5
  224. package/docs/components/Masthead/examples/masthead.md +443 -65
  225. package/docs/components/Menu/examples/Menu.md +507 -473
  226. package/docs/components/MenuToggle/examples/MenuToggle.md +106 -114
  227. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +9 -9
  228. package/docs/components/Nav/examples/Navigation.css +1 -23
  229. package/docs/components/Nav/examples/Navigation.md +209 -356
  230. package/docs/components/NotificationBadge/examples/NotificationBadge.md +5 -7
  231. package/docs/components/Page/examples/Page.css +0 -8
  232. package/docs/components/Page/examples/Page.md +22 -21
  233. package/docs/components/Pagination/examples/Pagination.md +663 -637
  234. package/docs/components/Panel/examples/Panel.md +12 -0
  235. package/docs/components/Popover/examples/Popover.md +1 -1
  236. package/docs/components/ProgressStepper/examples/ProgressStepper.md +15 -14
  237. package/docs/components/Radio/examples/Radio.md +1 -1
  238. package/docs/components/Sidebar/examples/Sidebar.md +19 -0
  239. package/docs/components/SimpleList/examples/SimpleList.md +3 -3
  240. package/docs/components/TabContent/examples/TabContent.md +10 -10
  241. package/docs/components/Table/examples/Table.md +8 -8
  242. package/docs/components/Tabs/examples/Tabs.css +1 -1
  243. package/docs/components/Tabs/examples/Tabs.md +1025 -826
  244. package/docs/components/TextInputGroup/examples/TextInputGroup.md +9 -9
  245. package/docs/components/Tile/examples/Tile.md +264 -144
  246. package/docs/components/Title/examples/Title.md +18 -0
  247. package/docs/components/Toolbar/examples/Toolbar.css +20 -15
  248. package/docs/components/Toolbar/examples/Toolbar.md +985 -3355
  249. package/docs/components/TreeView/examples/TreeView.md +7 -57
  250. package/docs/components/Truncate/examples/Truncate.css +2 -2
  251. package/docs/demos/AboutModal/examples/AboutModal.md +104 -31
  252. package/docs/demos/Alert/examples/Alert.md +330 -87
  253. package/docs/demos/BackToTop/examples/BackToTop.md +102 -29
  254. package/docs/demos/Banner/examples/Banner.md +211 -60
  255. package/docs/demos/Card/examples/Card.md +2 -2
  256. package/docs/demos/CardView/examples/CardView.md +241 -187
  257. package/docs/demos/ContextSelector/examples/ContextSelector.md +377 -94
  258. package/docs/demos/Dashboard/examples/Dashboard.md +102 -29
  259. package/docs/demos/DataList/examples/DataList.md +999 -938
  260. package/docs/demos/DescriptionList/examples/DescriptionList.md +306 -87
  261. package/docs/demos/Drawer/examples/Drawer.md +640 -251
  262. package/docs/demos/Form/examples/BasicForms.md +138 -84
  263. package/docs/demos/JumpLinks/examples/JumpLinks.md +917 -385
  264. package/docs/demos/Masthead/examples/Masthead.md +786 -342
  265. package/docs/demos/Modal/examples/Modal.md +645 -198
  266. package/docs/demos/Nav/examples/Nav.md +691 -902
  267. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +515 -145
  268. package/docs/demos/Page/examples/Page.md +942 -273
  269. package/docs/demos/Page/examples/Penta.md +66 -26
  270. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -9
  271. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +44 -32
  272. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +1183 -832
  273. package/docs/demos/Skeleton/examples/Skeleton.md +102 -29
  274. package/docs/demos/Table/examples/Table.md +3811 -3456
  275. package/docs/demos/Tabs/examples/Tabs.md +636 -194
  276. package/docs/demos/Toolbar/examples/Toolbar.css +10 -0
  277. package/docs/demos/Toolbar/examples/Toolbar.md +1316 -1478
  278. package/docs/demos/Wizard/examples/Wizard.md +918 -261
  279. package/docs/layouts/Flex/examples/Flex.md +11 -11
  280. package/package.json +32 -32
  281. package/patternfly-base-no-globals-theme-dark-unversioned.css +897 -880
  282. package/patternfly-base-no-globals.css +897 -880
  283. package/patternfly-base-theme-dark-unversioned.css +890 -872
  284. package/patternfly-base.css +890 -872
  285. package/patternfly-no-globals.css +8053 -7977
  286. package/patternfly-theme-dark-unversioned.css +8059 -7982
  287. package/patternfly.css +8059 -7982
  288. package/patternfly.min.css +1 -1
  289. package/patternfly.min.css.map +1 -1
  290. package/sass-utilities/mixins.scss +18 -0
  291. package/base/themes/dark/_variables.scss +0 -102
  292. package/components/AboutModalBox/themes/dark/about-modal-box.scss +0 -7
  293. package/components/Accordion/themes/dark/accordion.scss +0 -9
  294. package/components/Alert/themes/dark/alert.scss +0 -17
  295. package/components/Badge/themes/dark/badge.scss +0 -9
  296. package/components/Banner/themes/dark/banner.scss +0 -14
  297. package/components/Button/themes/dark/button.scss +0 -51
  298. package/components/CalendarMonth/themes/dark/calendar-month.scss +0 -37
  299. package/components/Card/themes/dark/card.scss +0 -20
  300. package/components/ClipboardCopy/themes/dark/clipboard-copy.scss +0 -19
  301. package/components/CodeEditor/themes/dark/code-editor.scss +0 -14
  302. package/components/DataList/themes/dark/data-list.scss +0 -10
  303. package/components/DatePicker/themes/dark/date-picker.scss +0 -8
  304. package/components/DragDrop/themes/dark/drag-drop.scss +0 -7
  305. package/components/Drawer/themes/dark/drawer.scss +0 -13
  306. package/components/Form/themes/dark/form.scss +0 -7
  307. package/components/FormControl/themes/dark/form-control.scss +0 -24
  308. package/components/HelperText/themes/dark/helper-text.scss +0 -7
  309. package/components/Hint/themes/dark/hint.scss +0 -8
  310. package/components/InputGroup/themes/dark/input-group.scss +0 -22
  311. package/components/Label/themes/dark/label.scss +0 -53
  312. package/components/Login/themes/dark/login.scss +0 -12
  313. package/components/Masthead/themes/dark/masthead.scss +0 -14
  314. package/components/ModalBox/themes/dark/modal-box.scss +0 -7
  315. package/components/NotificationBadge/themes/dark/notification-badge.scss +0 -10
  316. package/components/NotificationDrawer/themes/dark/notification-drawer.scss +0 -14
  317. package/components/Page/themes/dark/page.scss +0 -69
  318. package/components/Pagination/themes/dark/pagination.scss +0 -7
  319. package/components/Panel/themes/dark/panel.scss +0 -7
  320. package/components/Popover/themes/dark/popover.scss +0 -11
  321. package/components/Progress/themes/dark/progress.scss +0 -9
  322. package/components/SimpleList/themes/dark/simple-list.scss +0 -14
  323. package/components/Skeleton/themes/dark/skeleton.scss +0 -10
  324. package/components/Switch/themes/dark/switch.scss +0 -11
  325. package/components/Tabs/themes/dark/tabs.scss +0 -10
  326. package/components/Tile/themes/dark/tile.scss +0 -10
  327. package/components/ToggleGroup/themes/dark/toggle-group.scss +0 -12
  328. package/components/Tooltip/themes/dark/tooltip.scss +0 -8
  329. package/components/TreeView/themes/dark/tree-view.scss +0 -8
  330. package/docs/components/Avatar/examples/Avatar.css +0 -3
  331. package/docs/components/NotificationBadge/examples/NotificationBadge.css +0 -3
package/docs/demos/Alert/examples/Alert.md CHANGED
@@ -25,23 +25,117 @@ section: components
25
25
  </span>
26
26
  <div class="pf-v5-c-masthead__main">
27
27
  <a class="pf-v5-c-masthead__brand" href="#">
28
- <img
29
- class="pf-v5-c-brand"
30
- src="/assets/images/pf-logo.svg"
31
- alt="PatternFly logo"
32
- style="--pf-v5-c-brand--Height:36px"
33
- />
28
+ <svg height="40px" viewBox="0 0 679 158">
29
+ <title>PF-HorizontalLogo-Color</title>
30
+ <defs>
31
+ <linearGradient
32
+ x1="68%"
33
+ y1="2.25860997e-13%"
34
+ x2="32%"
35
+ y2="100%"
36
+ id="linearGradient-alert-basic-example-masthead"
37
+ >
38
+ <stop stop-color="#2B9AF3" offset="0%" />
39
+ <stop
40
+ stop-color="#73BCF7"
41
+ stop-opacity="0.502212631"
42
+ offset="100%"
43
+ />
44
+ </linearGradient>
45
+ </defs>
46
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
47
+ <g
48
+ transform="translate(206.000000, 45.750000)"
49
+ fill="var(--pf-t--global--text--color--regular)"
50
+ fill-rule="nonzero"
51
+ >
52
+ <path
53
+ 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"
54
+ />
55
+ <path
56
+ 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"
57
+ />
58
+ <path
59
+ 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"
60
+ />
61
+ <path
62
+ 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"
63
+ />
64
+ <path
65
+ 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"
66
+ />
67
+ <path
68
+ 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"
69
+ />
70
+ <path
71
+ 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"
72
+ />
73
+ <polygon
74
+ 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"
75
+ />
76
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
77
+ <path
78
+ 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"
79
+ />
80
+ </g>
81
+ <g transform="translate(0.000000, 0.000000)">
82
+ <path
83
+ 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"
84
+ fill="#0066CC"
85
+ />
86
+ <path
87
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
88
+ fill="url(#linearGradient-alert-basic-example-masthead)"
89
+ />
90
+ <path
91
+ 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"
92
+ fill="url(#linearGradient-alert-basic-example-masthead)"
93
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
94
+ />
95
+ </g>
96
+ </g>
97
+ </svg>
34
98
  </a>
35
99
  </div>
36
100
  <div class="pf-v5-c-masthead__content">
37
101
  <div
38
- class="pf-v5-c-toolbar pf-m-full-height pf-m-static"
102
+ class="pf-v5-c-toolbar pf-m-static"
39
103
  id="alert-basic-example-masthead-toolbar"
40
104
  >
41
105
  <div class="pf-v5-c-toolbar__content">
42
106
  <div class="pf-v5-c-toolbar__content-section">
107
+ <div class="pf-v5-c-toolbar__item">
108
+ <button
109
+ class="pf-v5-c-menu-toggle"
110
+ type="button"
111
+ aria-expanded="false"
112
+ >
113
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
114
+ <span class="pf-v5-c-menu-toggle__controls">
115
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
116
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
117
+ </span>
118
+ </span>
119
+ </button>
120
+ </div>
121
+
122
+ <div class="pf-v5-c-toolbar__item">
123
+ <button
124
+ class="pf-v5-c-menu-toggle"
125
+ type="button"
126
+ aria-expanded="false"
127
+ >
128
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
129
+ <span class="pf-v5-c-menu-toggle__controls">
130
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
131
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
132
+ </span>
133
+ </span>
134
+ </button>
135
+ </div>
136
+
43
137
  <div
44
- 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"
138
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-spacer-none pf-m-spacer-md-on-md"
45
139
  >
46
140
  <div
47
141
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -88,27 +182,6 @@ section: components
88
182
  </button>
89
183
  </div>
90
184
  </div>
91
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
92
- <button
93
- class="pf-v5-c-menu-toggle pf-m-full-height"
94
- type="button"
95
- aria-expanded="false"
96
- >
97
- <span class="pf-v5-c-menu-toggle__icon">
98
- <img
99
- class="pf-v5-c-avatar"
100
- alt="Avatar image"
101
- src="/assets/images/img_avatar-light.svg"
102
- />
103
- </span>
104
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
105
- <span class="pf-v5-c-menu-toggle__controls">
106
- <span class="pf-v5-c-menu-toggle__toggle-icon">
107
- <i class="fas fa-angle-down" aria-hidden="true"></i>
108
- </span>
109
- </span>
110
- </button>
111
- </div>
112
185
  </div>
113
186
  </div>
114
187
  </div>
@@ -328,23 +401,117 @@ section: components
328
401
  </span>
329
402
  <div class="pf-v5-c-masthead__main">
330
403
  <a class="pf-v5-c-masthead__brand" href="#">
331
- <img
332
- class="pf-v5-c-brand"
333
- src="/assets/images/pf-logo.svg"
334
- alt="PatternFly logo"
335
- style="--pf-v5-c-brand--Height:36px"
336
- />
404
+ <svg height="40px" viewBox="0 0 679 158">
405
+ <title>PF-HorizontalLogo-Color</title>
406
+ <defs>
407
+ <linearGradient
408
+ x1="68%"
409
+ y1="2.25860997e-13%"
410
+ x2="32%"
411
+ y2="100%"
412
+ id="linearGradient-alert-horizontal-example-masthead"
413
+ >
414
+ <stop stop-color="#2B9AF3" offset="0%" />
415
+ <stop
416
+ stop-color="#73BCF7"
417
+ stop-opacity="0.502212631"
418
+ offset="100%"
419
+ />
420
+ </linearGradient>
421
+ </defs>
422
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
423
+ <g
424
+ transform="translate(206.000000, 45.750000)"
425
+ fill="var(--pf-t--global--text--color--regular)"
426
+ fill-rule="nonzero"
427
+ >
428
+ <path
429
+ 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"
430
+ />
431
+ <path
432
+ 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"
433
+ />
434
+ <path
435
+ 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"
436
+ />
437
+ <path
438
+ 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"
439
+ />
440
+ <path
441
+ 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"
442
+ />
443
+ <path
444
+ 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"
445
+ />
446
+ <path
447
+ 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"
448
+ />
449
+ <polygon
450
+ 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"
451
+ />
452
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
453
+ <path
454
+ 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"
455
+ />
456
+ </g>
457
+ <g transform="translate(0.000000, 0.000000)">
458
+ <path
459
+ 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"
460
+ fill="#0066CC"
461
+ />
462
+ <path
463
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
464
+ fill="url(#linearGradient-alert-horizontal-example-masthead)"
465
+ />
466
+ <path
467
+ 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"
468
+ fill="url(#linearGradient-alert-horizontal-example-masthead)"
469
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
470
+ />
471
+ </g>
472
+ </g>
473
+ </svg>
337
474
  </a>
338
475
  </div>
339
476
  <div class="pf-v5-c-masthead__content">
340
477
  <div
341
- class="pf-v5-c-toolbar pf-m-full-height pf-m-static"
478
+ class="pf-v5-c-toolbar pf-m-static"
342
479
  id="alert-horizontal-example-masthead-toolbar"
343
480
  >
344
481
  <div class="pf-v5-c-toolbar__content">
345
482
  <div class="pf-v5-c-toolbar__content-section">
483
+ <div class="pf-v5-c-toolbar__item">
484
+ <button
485
+ class="pf-v5-c-menu-toggle"
486
+ type="button"
487
+ aria-expanded="false"
488
+ >
489
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
490
+ <span class="pf-v5-c-menu-toggle__controls">
491
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
492
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
493
+ </span>
494
+ </span>
495
+ </button>
496
+ </div>
497
+
498
+ <div class="pf-v5-c-toolbar__item">
499
+ <button
500
+ class="pf-v5-c-menu-toggle"
501
+ type="button"
502
+ aria-expanded="false"
503
+ >
504
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
505
+ <span class="pf-v5-c-menu-toggle__controls">
506
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
507
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
508
+ </span>
509
+ </span>
510
+ </button>
511
+ </div>
512
+
346
513
  <div
347
- 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"
514
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-spacer-none pf-m-spacer-md-on-md"
348
515
  >
349
516
  <div
350
517
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -391,27 +558,6 @@ section: components
391
558
  </button>
392
559
  </div>
393
560
  </div>
394
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
395
- <button
396
- class="pf-v5-c-menu-toggle pf-m-full-height"
397
- type="button"
398
- aria-expanded="false"
399
- >
400
- <span class="pf-v5-c-menu-toggle__icon">
401
- <img
402
- class="pf-v5-c-avatar"
403
- alt="Avatar image"
404
- src="/assets/images/img_avatar-light.svg"
405
- />
406
- </span>
407
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
408
- <span class="pf-v5-c-menu-toggle__controls">
409
- <span class="pf-v5-c-menu-toggle__toggle-icon">
410
- <i class="fas fa-angle-down" aria-hidden="true"></i>
411
- </span>
412
- </span>
413
- </button>
414
- </div>
415
561
  </div>
416
562
  </div>
417
563
  </div>
@@ -545,6 +691,12 @@ section: components
545
691
  class="pf-v5-c-helper-text__item pf-m-error"
546
692
  id="alert-horizontal-example-form-name-helper"
547
693
  >
694
+ <span class="pf-v5-c-helper-text__item-icon">
695
+ <i
696
+ class="fas fa-fw fa-exclamation-circle"
697
+ aria-hidden="true"
698
+ ></i>
699
+ </span>
548
700
  <span class="pf-v5-c-helper-text__item-text">Required field</span>
549
701
  </div>
550
702
  </div>
@@ -605,6 +757,12 @@ section: components
605
757
  class="pf-v5-c-helper-text__item pf-m-error"
606
758
  id="alert-horizontal-example-form-phone-helper"
607
759
  >
760
+ <span class="pf-v5-c-helper-text__item-icon">
761
+ <i
762
+ class="fas fa-fw fa-exclamation-circle"
763
+ aria-hidden="true"
764
+ ></i>
765
+ </span>
608
766
  <span class="pf-v5-c-helper-text__item-text">Required field</span>
609
767
  </div>
610
768
  </div>
@@ -712,23 +870,117 @@ section: components
712
870
  </span>
713
871
  <div class="pf-v5-c-masthead__main">
714
872
  <a class="pf-v5-c-masthead__brand" href="#">
715
- <img
716
- class="pf-v5-c-brand"
717
- src="/assets/images/pf-logo.svg"
718
- alt="PatternFly logo"
719
- style="--pf-v5-c-brand--Height:36px"
720
- />
873
+ <svg height="40px" viewBox="0 0 679 158">
874
+ <title>PF-HorizontalLogo-Color</title>
875
+ <defs>
876
+ <linearGradient
877
+ x1="68%"
878
+ y1="2.25860997e-13%"
879
+ x2="32%"
880
+ y2="100%"
881
+ id="linearGradient-alert-stacked-example-masthead"
882
+ >
883
+ <stop stop-color="#2B9AF3" offset="0%" />
884
+ <stop
885
+ stop-color="#73BCF7"
886
+ stop-opacity="0.502212631"
887
+ offset="100%"
888
+ />
889
+ </linearGradient>
890
+ </defs>
891
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
892
+ <g
893
+ transform="translate(206.000000, 45.750000)"
894
+ fill="var(--pf-t--global--text--color--regular)"
895
+ fill-rule="nonzero"
896
+ >
897
+ <path
898
+ 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"
899
+ />
900
+ <path
901
+ 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"
902
+ />
903
+ <path
904
+ 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"
905
+ />
906
+ <path
907
+ 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"
908
+ />
909
+ <path
910
+ 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"
911
+ />
912
+ <path
913
+ 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"
914
+ />
915
+ <path
916
+ 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"
917
+ />
918
+ <polygon
919
+ 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"
920
+ />
921
+ <polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
922
+ <path
923
+ 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"
924
+ />
925
+ </g>
926
+ <g transform="translate(0.000000, 0.000000)">
927
+ <path
928
+ 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"
929
+ fill="#0066CC"
930
+ />
931
+ <path
932
+ d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
933
+ fill="url(#linearGradient-alert-stacked-example-masthead)"
934
+ />
935
+ <path
936
+ 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"
937
+ fill="url(#linearGradient-alert-stacked-example-masthead)"
938
+ transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
939
+ />
940
+ </g>
941
+ </g>
942
+ </svg>
721
943
  </a>
722
944
  </div>
723
945
  <div class="pf-v5-c-masthead__content">
724
946
  <div
725
- class="pf-v5-c-toolbar pf-m-full-height pf-m-static"
947
+ class="pf-v5-c-toolbar pf-m-static"
726
948
  id="alert-stacked-example-masthead-toolbar"
727
949
  >
728
950
  <div class="pf-v5-c-toolbar__content">
729
951
  <div class="pf-v5-c-toolbar__content-section">
952
+ <div class="pf-v5-c-toolbar__item">
953
+ <button
954
+ class="pf-v5-c-menu-toggle"
955
+ type="button"
956
+ aria-expanded="false"
957
+ >
958
+ <span class="pf-v5-c-menu-toggle__text">Overview</span>
959
+ <span class="pf-v5-c-menu-toggle__controls">
960
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
961
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
962
+ </span>
963
+ </span>
964
+ </button>
965
+ </div>
966
+
967
+ <div class="pf-v5-c-toolbar__item">
968
+ <button
969
+ class="pf-v5-c-menu-toggle"
970
+ type="button"
971
+ aria-expanded="false"
972
+ >
973
+ <span class="pf-v5-c-menu-toggle__text">Services</span>
974
+ <span class="pf-v5-c-menu-toggle__controls">
975
+ <span class="pf-v5-c-menu-toggle__toggle-icon">
976
+ <i class="fas fa-angle-down" aria-hidden="true"></i>
977
+ </span>
978
+ </span>
979
+ </button>
980
+ </div>
981
+
730
982
  <div
731
- 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"
983
+ class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-align-end pf-m-spacer-none pf-m-spacer-md-on-md"
732
984
  >
733
985
  <div
734
986
  class="pf-v5-c-toolbar__group pf-m-icon-button-group pf-m-hidden pf-m-visible-on-lg"
@@ -775,27 +1027,6 @@ section: components
775
1027
  </button>
776
1028
  </div>
777
1029
  </div>
778
- <div class="pf-v5-c-toolbar__item pf-m-hidden pf-m-visible-on-sm">
779
- <button
780
- class="pf-v5-c-menu-toggle pf-m-full-height"
781
- type="button"
782
- aria-expanded="false"
783
- >
784
- <span class="pf-v5-c-menu-toggle__icon">
785
- <img
786
- class="pf-v5-c-avatar"
787
- alt="Avatar image"
788
- src="/assets/images/img_avatar-light.svg"
789
- />
790
- </span>
791
- <span class="pf-v5-c-menu-toggle__text">Ned Username</span>
792
- <span class="pf-v5-c-menu-toggle__controls">
793
- <span class="pf-v5-c-menu-toggle__toggle-icon">
794
- <i class="fas fa-angle-down" aria-hidden="true"></i>
795
- </span>
796
- </span>
797
- </button>
798
- </div>
799
1030
  </div>
800
1031
  </div>
801
1032
  </div>
@@ -929,6 +1160,12 @@ section: components
929
1160
  class="pf-v5-c-helper-text__item pf-m-error"
930
1161
  id="alert-stacked-example-form-name-helper"
931
1162
  >
1163
+ <span class="pf-v5-c-helper-text__item-icon">
1164
+ <i
1165
+ class="fas fa-fw fa-exclamation-circle"
1166
+ aria-hidden="true"
1167
+ ></i>
1168
+ </span>
932
1169
  <span class="pf-v5-c-helper-text__item-text">Required field</span>
933
1170
  </div>
934
1171
  </div>
@@ -962,6 +1199,9 @@ section: components
962
1199
  class="pf-v5-c-helper-text__item pf-m-error"
963
1200
  id="alert-stacked-example-form-email-helper"
964
1201
  >
1202
+ <span class="pf-v5-c-helper-text__item-icon">
1203
+ <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
1204
+ </span>
965
1205
  <span
966
1206
  class="pf-v5-c-helper-text__item-text"
967
1207
  >Enter a valid email address: example@gmail.com</span>
@@ -1013,6 +1253,9 @@ section: components
1013
1253
  class="pf-v5-c-helper-text__item pf-m-error"
1014
1254
  id="alert-stacked-example-form-state-helper"
1015
1255
  >
1256
+ <span class="pf-v5-c-helper-text__item-icon">
1257
+ <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
1258
+ </span>
1016
1259
  <span class="pf-v5-c-helper-text__item-text">Required field</span>
1017
1260
  </div>
1018
1261
  </div>