@patternfly/patternfly 6.0.0-alpha.99 → 6.0.0-prerelease.10

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 (501) hide show
  1. package/README.md +1 -2
  2. package/assets/fontawesome/_animated.scss +1 -0
  3. package/assets/fontawesome/_bordered-pulled.scss +1 -0
  4. package/assets/fontawesome/_fixed-width.scss +3 -1
  5. package/assets/fontawesome/_icons.scss +1333 -1330
  6. package/assets/fontawesome/_index.scss +11 -0
  7. package/assets/fontawesome/_larger.scss +4 -2
  8. package/assets/fontawesome/_list.scss +4 -2
  9. package/assets/fontawesome/_rotated-flipped.scss +2 -0
  10. package/assets/fontawesome/_screen-reader.scss +1 -0
  11. package/assets/fontawesome/_stacked.scss +3 -1
  12. package/assets/fontawesome/_variables.scss +4 -4
  13. package/assets/fontawesome/fontawesome.scss +12 -12
  14. package/assets/icons/iconUnicodes.json +6 -0
  15. package/assets/images/img_avatar-dark.svg +22 -16
  16. package/assets/images/img_avatar-light.svg +25 -18
  17. package/assets/images/pf-background.svg +21 -21
  18. package/assets/images/pf_logo.svg +11 -11
  19. package/assets/images/pf_logo_white.svg +16 -17
  20. package/assets/pficon/pf-v6-pficon.woff2 +0 -0
  21. package/assets/pficon/pficon.scss +310 -271
  22. package/base/_index.scss +10 -0
  23. package/base/{_globals.scss → normalize.scss} +15 -48
  24. package/base/patternfly-common.css +14 -0
  25. package/base/patternfly-common.scss +69 -2
  26. package/base/patternfly-fa-icons.css +2787 -1420
  27. package/base/patternfly-fa-icons.scss +53 -2
  28. package/base/patternfly-fonts.css +10 -80
  29. package/base/patternfly-fonts.scss +49 -2
  30. package/base/patternfly-pf-icons.css +158 -134
  31. package/base/patternfly-pf-icons.scss +1 -2
  32. package/base/patternfly-svg-icons.css +5 -0
  33. package/base/{_svg-icons.scss → patternfly-svg-icons.scss} +2 -0
  34. package/base/patternfly-variables.css +1094 -1206
  35. package/base/patternfly-variables.scss +20 -2
  36. package/base/reset.scss +33 -0
  37. package/base/tokens/_index.scss +6 -0
  38. package/base/tokens/tokens-charts-dark.scss +173 -0
  39. package/base/tokens/{_tokens-charts.scss → tokens-charts.scss} +162 -148
  40. package/base/tokens/{_tokens-dark.scss → tokens-dark.scss} +310 -294
  41. package/base/tokens/{_tokens-default.scss → tokens-default.scss} +580 -447
  42. package/base/tokens/{_tokens-font.scss → tokens-local.scss} +16 -34
  43. package/base/tokens/{_tokens-palette.scss → tokens-palette.scss} +69 -70
  44. package/components/AboutModalBox/about-modal-box.css +86 -81
  45. package/components/AboutModalBox/about-modal-box.scss +80 -82
  46. package/components/Accordion/accordion.css +46 -45
  47. package/components/Accordion/accordion.scss +56 -55
  48. package/components/ActionList/action-list.css +6 -5
  49. package/components/ActionList/action-list.scss +7 -5
  50. package/components/Alert/alert-group.css +72 -19
  51. package/components/Alert/alert-group.scss +105 -18
  52. package/components/Alert/alert.css +52 -59
  53. package/components/Alert/alert.scss +56 -65
  54. package/components/Avatar/avatar.css +42 -41
  55. package/components/Avatar/avatar.scss +8 -7
  56. package/components/BackToTop/back-to-top.css +19 -17
  57. package/components/BackToTop/back-to-top.scss +17 -17
  58. package/components/Backdrop/backdrop.css +1 -1
  59. package/components/Backdrop/backdrop.scss +3 -4
  60. package/components/BackgroundImage/background-image.scss +3 -4
  61. package/components/Badge/badge.css +29 -7
  62. package/components/Badge/badge.scss +33 -9
  63. package/components/Banner/banner.css +30 -37
  64. package/components/Banner/banner.scss +30 -43
  65. package/components/Brand/brand.css +14 -10
  66. package/components/Brand/brand.scss +8 -5
  67. package/components/Breadcrumb/breadcrumb.css +23 -24
  68. package/components/Breadcrumb/breadcrumb.scss +25 -28
  69. package/components/Button/button.css +152 -130
  70. package/components/Button/button.scss +157 -133
  71. package/components/CalendarMonth/calendar-month.css +47 -47
  72. package/components/CalendarMonth/calendar-month.scss +50 -51
  73. package/components/Card/card.css +111 -94
  74. package/components/Card/card.scss +119 -93
  75. package/components/Check/check.css +6 -6
  76. package/components/Check/check.scss +8 -9
  77. package/components/ClipboardCopy/clipboard-copy.css +34 -45
  78. package/components/ClipboardCopy/clipboard-copy.scss +36 -49
  79. package/components/CodeBlock/code-block.css +21 -20
  80. package/components/CodeBlock/code-block.scss +21 -21
  81. package/components/CodeEditor/code-editor.css +36 -35
  82. package/components/CodeEditor/code-editor.scss +36 -36
  83. package/components/Content/content.css +167 -153
  84. package/components/Content/content.scss +204 -145
  85. package/components/DataList/data-list-grid.css +117 -117
  86. package/components/DataList/data-list-grid.scss +22 -20
  87. package/components/DataList/data-list.css +308 -312
  88. package/components/DataList/data-list.scss +145 -152
  89. package/components/DatePicker/date-picker.css +17 -17
  90. package/components/DatePicker/date-picker.scss +17 -18
  91. package/components/DescriptionList/description-list-order.css +5 -5
  92. package/components/DescriptionList/description-list-order.scss +3 -1
  93. package/components/DescriptionList/description-list.css +52 -50
  94. package/components/DescriptionList/description-list.scss +32 -37
  95. package/components/Divider/divider.css +104 -107
  96. package/components/Divider/divider.scss +19 -19
  97. package/components/DragDrop/drag-drop.css +4 -2
  98. package/components/DragDrop/drag-drop.scss +3 -3
  99. package/components/Drawer/drawer.css +119 -114
  100. package/components/Drawer/drawer.scss +139 -134
  101. package/components/DualListSelector/dual-list-selector.css +65 -62
  102. package/components/DualListSelector/dual-list-selector.scss +55 -52
  103. package/components/EmptyState/empty-state.css +38 -37
  104. package/components/EmptyState/empty-state.scss +39 -39
  105. package/components/ExpandableSection/expandable-section.css +27 -86
  106. package/components/ExpandableSection/expandable-section.scss +32 -101
  107. package/components/FileUpload/file-upload.css +3 -3
  108. package/components/FileUpload/file-upload.scss +3 -4
  109. package/components/Form/form.css +177 -125
  110. package/components/Form/form.scss +121 -115
  111. package/components/FormControl/form-control.css +68 -64
  112. package/components/FormControl/form-control.scss +80 -74
  113. package/components/HelperText/helper-text.css +5 -4
  114. package/components/HelperText/helper-text.scss +8 -6
  115. package/components/Hint/hint.css +25 -25
  116. package/components/Hint/hint.scss +25 -27
  117. package/components/Icon/icon.css +10 -10
  118. package/components/Icon/icon.scss +11 -12
  119. package/components/InlineEdit/inline-edit.css +12 -12
  120. package/components/InlineEdit/inline-edit.scss +12 -13
  121. package/components/InputGroup/input-group.css +17 -17
  122. package/components/InputGroup/input-group.scss +19 -20
  123. package/components/JumpLinks/jump-links.css +80 -96
  124. package/components/JumpLinks/jump-links.scss +80 -100
  125. package/components/Label/label-group.css +28 -28
  126. package/components/Label/label-group.scss +29 -30
  127. package/components/Label/label.css +103 -88
  128. package/components/Label/label.scss +114 -95
  129. package/components/List/list.css +44 -47
  130. package/components/List/list.scss +51 -58
  131. package/components/Login/login.css +122 -118
  132. package/components/Login/login.scss +105 -112
  133. package/components/Masthead/masthead.css +273 -175
  134. package/components/Masthead/masthead.scss +102 -68
  135. package/components/Menu/menu.css +151 -95
  136. package/components/Menu/menu.scss +59 -40
  137. package/components/MenuToggle/menu-toggle.css +131 -110
  138. package/components/MenuToggle/menu-toggle.scss +152 -130
  139. package/components/ModalBox/modal-box.css +53 -45
  140. package/components/ModalBox/modal-box.scss +52 -46
  141. package/components/MultipleFileUpload/multiple-file-upload.css +37 -37
  142. package/components/MultipleFileUpload/multiple-file-upload.scss +38 -39
  143. package/components/Nav/nav.css +33 -9
  144. package/components/Nav/nav.scss +46 -13
  145. package/components/NotificationDrawer/notification-drawer.css +50 -51
  146. package/components/NotificationDrawer/notification-drawer.scss +58 -57
  147. package/components/NumberInput/number-input.css +7 -11
  148. package/components/NumberInput/number-input.scss +5 -7
  149. package/components/OverflowMenu/overflow-menu.css +2 -1
  150. package/components/OverflowMenu/overflow-menu.scss +3 -1
  151. package/components/Page/page.css +177 -517
  152. package/components/Page/page.scss +157 -384
  153. package/components/Pagination/pagination.css +82 -79
  154. package/components/Pagination/pagination.scss +43 -40
  155. package/components/Panel/panel.css +33 -30
  156. package/components/Panel/panel.scss +35 -33
  157. package/components/Popover/popover.css +54 -52
  158. package/components/Popover/popover.scss +55 -54
  159. package/components/Progress/progress.css +8 -4
  160. package/components/Progress/progress.scss +14 -11
  161. package/components/ProgressStepper/progress-stepper.css +246 -245
  162. package/components/ProgressStepper/progress-stepper.scss +118 -118
  163. package/components/Radio/radio.css +9 -9
  164. package/components/Radio/radio.scss +11 -12
  165. package/components/Sidebar/sidebar.css +139 -139
  166. package/components/Sidebar/sidebar.scss +61 -61
  167. package/components/SimpleList/simple-list.css +21 -20
  168. package/components/SimpleList/simple-list.scss +22 -23
  169. package/components/Skeleton/skeleton.css +4 -4
  170. package/components/Skeleton/skeleton.scss +7 -8
  171. package/components/SkipToContent/skip-to-content.css +7 -6
  172. package/components/SkipToContent/skip-to-content.scss +7 -7
  173. package/components/Slider/slider.css +31 -31
  174. package/components/Slider/slider.scss +54 -55
  175. package/components/Spinner/spinner.scss +4 -5
  176. package/components/Switch/switch.css +4 -10
  177. package/components/Switch/switch.scss +8 -17
  178. package/components/TabContent/tab-content.css +25 -25
  179. package/components/TabContent/tab-content.scss +28 -28
  180. package/components/Table/table-grid.css +434 -508
  181. package/components/Table/table-grid.scss +131 -150
  182. package/components/Table/table-scrollable.css +31 -34
  183. package/components/Table/table-scrollable.scss +44 -41
  184. package/components/Table/table-tree-view.css +287 -279
  185. package/components/Table/table-tree-view.scss +84 -84
  186. package/components/Table/table.css +316 -279
  187. package/components/Table/table.scss +346 -301
  188. package/components/Tabs/tabs.css +215 -240
  189. package/components/Tabs/tabs.scss +130 -162
  190. package/components/TextInputGroup/text-input-group.css +122 -64
  191. package/components/TextInputGroup/text-input-group.scss +144 -87
  192. package/components/Tile/tile.css +15 -15
  193. package/components/Tile/tile.scss +16 -17
  194. package/components/Timestamp/timestamp.css +13 -19
  195. package/components/Timestamp/timestamp.scss +16 -22
  196. package/components/Title/title.css +14 -13
  197. package/components/Title/title.scss +15 -15
  198. package/components/ToggleGroup/toggle-group.css +37 -37
  199. package/components/ToggleGroup/toggle-group.scss +38 -41
  200. package/components/Toolbar/toolbar.css +547 -1431
  201. package/components/Toolbar/toolbar.scss +159 -123
  202. package/components/Tooltip/tooltip.css +28 -27
  203. package/components/Tooltip/tooltip.scss +31 -30
  204. package/components/TreeView/tree-view.css +184 -184
  205. package/components/TreeView/tree-view.scss +133 -133
  206. package/components/Truncate/truncate.css +2 -2
  207. package/components/Truncate/truncate.scss +7 -8
  208. package/components/Wizard/wizard.css +190 -154
  209. package/components/Wizard/wizard.scss +211 -165
  210. package/components/_index.css +22381 -0
  211. package/components/_index.scss +82 -0
  212. package/docs/components/AboutModalBox/examples/AboutModalBox.md +3 -1
  213. package/docs/components/Accordion/examples/Accordion.md +1 -1
  214. package/docs/components/ActionList/examples/ActionList.md +64 -24
  215. package/docs/components/Alert/examples/Alert.md +116 -74
  216. package/docs/components/BackToTop/examples/BackToTop.md +1 -1
  217. package/docs/components/Badge/examples/Badge.md +6 -16
  218. package/docs/components/Banner/examples/Banner.md +16 -10
  219. package/docs/components/Brand/examples/Brand.md +2 -2
  220. package/docs/components/Breadcrumb/examples/Breadcrumb.md +19 -59
  221. package/docs/components/Button/examples/Button.md +537 -368
  222. package/docs/components/CalendarMonth/examples/CalendarMonth.md +24 -8
  223. package/docs/components/Card/examples/Card.md +372 -658
  224. package/docs/components/Check/examples/Check.md +10 -15
  225. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +92 -47
  226. package/docs/components/CodeBlock/examples/CodeBlock.md +51 -28
  227. package/docs/components/CodeEditor/examples/CodeEditor.md +41 -22
  228. package/docs/components/Content/examples/Content.md +600 -60
  229. package/docs/components/DataList/examples/DataList.md +291 -1028
  230. package/docs/components/DatePicker/examples/DatePicker.md +18 -6
  231. package/docs/components/DescriptionList/examples/DescriptionList.md +80 -55
  232. package/docs/components/Drawer/examples/Drawer.md +60 -21
  233. package/docs/components/DualListSelector/examples/DualListSelector.md +364 -996
  234. package/docs/components/EmptyState/examples/EmptyState.md +123 -53
  235. package/docs/components/ExpandableSection/examples/ExpandableSection.md +96 -91
  236. package/docs/components/FileUpload/examples/FileUpload.md +42 -14
  237. package/docs/components/Form/examples/Form.md +100 -26
  238. package/docs/components/Hint/examples/Hint.md +54 -164
  239. package/docs/components/InlineEdit/examples/InlineEdit.md +132 -45
  240. package/docs/components/InputGroup/examples/InputGroup.md +38 -62
  241. package/docs/components/JumpLinks/examples/JumpLinks.md +189 -72
  242. package/docs/components/Label/examples/Label.md +2577 -406
  243. package/docs/components/Login/examples/Login.md +372 -334
  244. package/docs/components/Masthead/examples/masthead.md +515 -484
  245. package/docs/components/Menu/examples/Menu.md +77 -138
  246. package/docs/components/MenuToggle/examples/MenuToggle.md +289 -39
  247. package/docs/components/ModalBox/examples/ModalBox.md +158 -100
  248. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +137 -97
  249. package/docs/components/Nav/examples/Navigation.css +2 -7
  250. package/docs/components/Nav/examples/Navigation.md +337 -270
  251. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +515 -2076
  252. package/docs/components/NumberInput/examples/NumberInput.md +96 -48
  253. package/docs/components/OverflowMenu/examples/overflow-menu.css +4 -28
  254. package/docs/components/OverflowMenu/examples/overflow-menu.md +104 -159
  255. package/docs/components/Page/examples/Page.css +5 -9
  256. package/docs/components/Page/examples/Page.md +254 -181
  257. package/docs/components/Pagination/examples/Pagination.md +336 -756
  258. package/docs/components/Panel/examples/Panel.md +3 -2
  259. package/docs/components/Popover/examples/Popover.md +60 -15
  260. package/docs/components/ProgressStepper/examples/ProgressStepper.md +15 -15
  261. package/docs/components/Sidebar/examples/Sidebar.css +4 -2
  262. package/docs/components/Sidebar/examples/Sidebar.md +3 -3
  263. package/docs/components/Skeleton/examples/Skeleton.css +1 -1
  264. package/docs/components/SkipToContent/examples/SkipToContent.md +3 -1
  265. package/docs/components/Slider/examples/Slider.md +53 -45
  266. package/docs/components/Spinner/examples/Spinner.md +1 -1
  267. package/docs/components/Switch/examples/Switch.md +33 -148
  268. package/docs/components/Table/examples/Table.css +11 -6
  269. package/docs/components/Table/examples/Table.md +5302 -2464
  270. package/docs/components/Tabs/examples/Tabs.md +1267 -607
  271. package/docs/components/TextInputGroup/examples/TextInputGroup.css +8 -3
  272. package/docs/components/TextInputGroup/examples/TextInputGroup.md +469 -278
  273. package/docs/components/Tile/examples/Tile.css +5 -5
  274. package/docs/components/Timestamp/examples/Timestamp.md +7 -1
  275. package/docs/components/ToggleGroup/examples/toggle-group.md +1 -3
  276. package/docs/components/Toolbar/examples/Toolbar.css +50 -39
  277. package/docs/components/Toolbar/examples/Toolbar.md +1562 -1200
  278. package/docs/components/Tooltip/examples/Tooltip.css +1 -1
  279. package/docs/components/TreeView/examples/TreeView.md +627 -49
  280. package/docs/components/Truncate/examples/Truncate.css +1 -2
  281. package/docs/components/Wizard/examples/Wizard.md +1595 -126
  282. package/docs/demos/AboutModal/examples/AboutModal.md +191 -198
  283. package/docs/demos/Alert/examples/Alert.md +924 -909
  284. package/docs/demos/BackToTop/examples/BackToTop.md +318 -327
  285. package/docs/demos/Banner/examples/Banner.md +641 -659
  286. package/docs/demos/Button/examples/Button.md +8 -8
  287. package/docs/demos/Card/examples/Card.css +6 -6
  288. package/docs/demos/Card/examples/Card.md +419 -606
  289. package/docs/demos/CardView/examples/CardView.md +822 -1435
  290. package/docs/demos/Dashboard/examples/Dashboard.md +1308 -1442
  291. package/docs/demos/DataList/examples/DataList.md +3210 -3424
  292. package/docs/demos/DescriptionList/examples/DescriptionList.md +899 -937
  293. package/docs/demos/Drawer/examples/Drawer.md +1165 -1176
  294. package/docs/demos/Form/examples/BasicForms.md +153 -88
  295. package/docs/demos/JumpLinks/examples/JumpLinks.md +1710 -1602
  296. package/docs/demos/Masthead/examples/Masthead.md +1719 -1583
  297. package/docs/demos/Modal/examples/Modal.md +1231 -1235
  298. package/docs/demos/Nav/examples/Nav.md +1216 -1230
  299. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +1910 -4577
  300. package/docs/demos/Page/examples/Page.css +11 -0
  301. package/docs/demos/Page/examples/Page.md +3753 -2540
  302. package/docs/demos/Panel/Panel.md +88 -0
  303. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +9 -3
  304. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +16 -48
  305. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +5150 -6255
  306. package/docs/demos/Skeleton/examples/Skeleton.md +297 -304
  307. package/docs/demos/Table/examples/Table.md +14272 -15154
  308. package/docs/demos/Tabs/examples/Tabs.md +2821 -2891
  309. package/docs/demos/Toolbar/examples/Toolbar.css +10 -18
  310. package/docs/demos/Toolbar/examples/Toolbar.md +2487 -2663
  311. package/docs/demos/Wizard/examples/Wizard.md +3021 -2784
  312. package/docs/layouts/Bullseye/examples/Bullseye.css +4 -4
  313. package/docs/layouts/Flex/examples/Flex.css +4 -4
  314. package/docs/layouts/Flex/examples/Flex.md +50 -50
  315. package/docs/layouts/Gallery/examples/Gallery.css +4 -4
  316. package/docs/layouts/Gallery/examples/Gallery.md +6 -6
  317. package/docs/layouts/Grid/examples/Grid.css +3 -3
  318. package/docs/layouts/Grid/examples/Grid.md +33 -33
  319. package/docs/layouts/Level/examples/Level.css +5 -5
  320. package/docs/layouts/Split/examples/Split.css +4 -4
  321. package/docs/layouts/Stack/examples/Stack.css +5 -5
  322. package/docs/utilities/Accessibility/examples/Accessibility.md +2 -2
  323. package/docs/utilities/Alignment/examples/Alignment.css +6 -6
  324. package/docs/utilities/Alignment/examples/Alignment.md +5 -5
  325. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +7 -67
  326. package/docs/utilities/BoxShadow/examples/box-shadow.css +11 -11
  327. package/docs/utilities/BoxShadow/examples/box-shadow.md +15 -38
  328. package/docs/utilities/Display/examples/Display.css +3 -10
  329. package/docs/utilities/Display/examples/Display.md +21 -12
  330. package/docs/utilities/Flex/examples/Flex.css +7 -7
  331. package/docs/utilities/Flex/examples/Flex.md +82 -40
  332. package/docs/utilities/Float/examples/Float.css +5 -5
  333. package/docs/utilities/Float/examples/Float.md +6 -6
  334. package/docs/utilities/Sizing/examples/Sizing.css +6 -6
  335. package/docs/utilities/Sizing/examples/Sizing.md +60 -60
  336. package/docs/utilities/Spacing/examples/Spacing.css +3 -3
  337. package/docs/utilities/Spacing/examples/Spacing.md +37 -37
  338. package/docs/utilities/Text/examples/Text.md +78 -77
  339. package/icons/pficons.mjs +6 -0
  340. package/layouts/Bullseye/bullseye.css +4 -0
  341. package/layouts/Bullseye/bullseye.scss +5 -1
  342. package/layouts/Flex/flex.css +241 -237
  343. package/layouts/Flex/flex.scss +48 -44
  344. package/layouts/Gallery/gallery.css +15 -11
  345. package/layouts/Gallery/gallery.scss +9 -5
  346. package/layouts/Grid/grid.css +20 -16
  347. package/layouts/Grid/grid.scss +12 -8
  348. package/layouts/Level/level.css +5 -1
  349. package/layouts/Level/level.scss +6 -2
  350. package/layouts/Split/split.css +5 -1
  351. package/layouts/Split/split.scss +6 -2
  352. package/layouts/Stack/stack.css +5 -1
  353. package/layouts/Stack/stack.scss +6 -2
  354. package/layouts/_index.css +3461 -0
  355. package/layouts/_index.scss +8 -0
  356. package/package.json +39 -39
  357. package/patternfly-addons.css +2071 -2648
  358. package/patternfly-addons.scss +2 -12
  359. package/patternfly-base-no-globals.css +4227 -3064
  360. package/patternfly-base-no-globals.scss +5 -3
  361. package/patternfly-base.css +4307 -3140
  362. package/patternfly-base.scss +2 -6
  363. package/patternfly-charts.css +579 -240
  364. package/patternfly-charts.scss +352 -337
  365. package/patternfly-no-globals.css +21105 -23238
  366. package/patternfly-no-globals.scss +5 -4
  367. package/patternfly.css +21209 -23338
  368. package/patternfly.min.css +1 -1
  369. package/patternfly.min.css.map +1 -1
  370. package/patternfly.scss +6 -4
  371. package/sass-utilities/_index.scss +6 -0
  372. package/sass-utilities/functions.scss +25 -25
  373. package/sass-utilities/{_init.scss → init.scss} +6 -6
  374. package/sass-utilities/mixins.scss +108 -72
  375. package/sass-utilities/{component-namespaces.scss → namespaces-components.scss} +3 -27
  376. package/sass-utilities/{layout-namespaces.scss → namespaces-layouts.scss} +3 -1
  377. package/sass-utilities/scss-variables.scss +48 -261
  378. package/utilities/Accessibility/accessibility.css +15 -15
  379. package/utilities/Accessibility/accessibility.scss +8 -6
  380. package/utilities/Alignment/alignment.css +29 -29
  381. package/utilities/Alignment/alignment.scss +6 -4
  382. package/utilities/BackgroundColor/background-color.css +67 -0
  383. package/utilities/BackgroundColor/background-color.scss +16 -0
  384. package/utilities/BoxShadow/box-shadow.css +15 -39
  385. package/utilities/BoxShadow/box-shadow.scss +19 -28
  386. package/utilities/Display/display.css +43 -5
  387. package/utilities/Display/display.scss +7 -4
  388. package/utilities/Flex/flex.css +50 -50
  389. package/utilities/Flex/flex.scss +21 -20
  390. package/utilities/Float/float.css +29 -29
  391. package/utilities/Float/float.scss +6 -6
  392. package/utilities/Sizing/sizing.css +58 -58
  393. package/utilities/Sizing/sizing.scss +23 -21
  394. package/utilities/Spacing/spacing.css +1372 -1372
  395. package/utilities/Spacing/spacing.scss +6 -6
  396. package/utilities/Text/text.css +419 -662
  397. package/utilities/Text/text.scss +81 -107
  398. package/utilities/_index.css +7815 -0
  399. package/utilities/_index.scss +10 -0
  400. package/assets/fontawesome/_core.scss +0 -20
  401. package/assets/images/pf-logo-small.svg +0 -23
  402. package/assets/images/pf_logo_white.hbs +0 -35
  403. package/assets/images/pfbg-icon.svg +0 -1
  404. package/assets/pficon/pf-v5-pficon.woff2 +0 -0
  405. package/base/_base.scss +0 -2
  406. package/base/_chart-globals.scss +0 -415
  407. package/base/_common.scss +0 -50
  408. package/base/_fa-icons.scss +0 -33
  409. package/base/_fonts.scss +0 -136
  410. package/base/_icons.scss +0 -3
  411. package/base/_pficons.scss +0 -2
  412. package/base/_themes.scss +0 -43
  413. package/base/_variables.scss +0 -299
  414. package/base/patternfly-globals.css +0 -120
  415. package/base/patternfly-globals.scss +0 -2
  416. package/base/patternfly-icons.css +0 -4728
  417. package/base/patternfly-icons.scss +0 -2
  418. package/base/patternfly-themes.css +0 -82
  419. package/base/patternfly-themes.scss +0 -2
  420. package/base/themes/dark/_chart-globals.scss +0 -42
  421. package/base/themes/dark/_globals.scss +0 -5
  422. package/base/tokens/_workspace-overrides.scss +0 -7
  423. package/components/AppLauncher/app-launcher.css +0 -244
  424. package/components/AppLauncher/app-launcher.scss +0 -308
  425. package/components/AppLauncher/themes/dark/app-launcher.scss +0 -13
  426. package/components/Chip/chip-group.css +0 -93
  427. package/components/Chip/chip-group.scss +0 -98
  428. package/components/Chip/chip.css +0 -122
  429. package/components/Chip/chip.scss +0 -140
  430. package/components/Chip/themes/dark/chip.scss +0 -9
  431. package/components/ContextSelector/context-selector.css +0 -336
  432. package/components/ContextSelector/context-selector.scss +0 -384
  433. package/components/ContextSelector/themes/dark/context-selector.scss +0 -24
  434. package/components/Dropdown/dropdown.css +0 -686
  435. package/components/Dropdown/dropdown.scss +0 -820
  436. package/components/Dropdown/themes/dark/dropdown.scss +0 -32
  437. package/components/LogViewer/log-viewer.css +0 -197
  438. package/components/LogViewer/log-viewer.scss +0 -226
  439. package/components/LogViewer/themes/dark/log-viewer.scss +0 -7
  440. package/components/NotificationBadge/notification-badge.css +0 -87
  441. package/components/NotificationBadge/notification-badge.scss +0 -108
  442. package/components/OptionsMenu/options-menu.css +0 -279
  443. package/components/OptionsMenu/options-menu.scss +0 -332
  444. package/components/OptionsMenu/themes/dark/options-menu.scss +0 -21
  445. package/components/Select/select.css +0 -599
  446. package/components/Select/select.scss +0 -713
  447. package/components/Select/themes/dark/select.scss +0 -23
  448. package/components/_all.scss +0 -91
  449. package/docs/components/AppLauncher/deprecated/application-launcher.css +0 -25
  450. package/docs/components/AppLauncher/deprecated/application-launcher.md +0 -792
  451. package/docs/components/Breadcrumb/examples/Breadcrumb.css +0 -3
  452. package/docs/components/Chip/examples/Chip.md +0 -846
  453. package/docs/components/ContextSelector/deprecated/context-selector.css +0 -7
  454. package/docs/components/ContextSelector/deprecated/context-selector.md +0 -909
  455. package/docs/components/Dropdown/deprecated/Dropdown.css +0 -64
  456. package/docs/components/Dropdown/deprecated/Dropdown.md +0 -2920
  457. package/docs/components/LogViewer/examples/LogViewer.css +0 -17
  458. package/docs/components/LogViewer/examples/LogViewer.md +0 -5936
  459. package/docs/components/NotificationBadge/examples/NotificationBadge.md +0 -222
  460. package/docs/components/OptionsMenu/deprecated/options-menu.css +0 -25
  461. package/docs/components/OptionsMenu/deprecated/options-menu.md +0 -1014
  462. package/docs/components/Page/deprecated/PageHeader.css +0 -17
  463. package/docs/components/Page/deprecated/PageHeader.md +0 -261
  464. package/docs/components/Pagination/examples/Pagination.css +0 -3
  465. package/docs/components/Select/deprecated/Select.css +0 -56
  466. package/docs/components/Select/deprecated/Select.md +0 -3525
  467. package/docs/components/Tabs/examples/Tabs.css +0 -10
  468. package/docs/components/ToggleGroup/examples/toggle-group.css +0 -4
  469. package/docs/demos/ContextSelector/examples/ContextSelector.md +0 -1712
  470. package/docs/demos/Page/examples/Penta.md +0 -821
  471. package/docs/utilities/Text/examples/Text.css +0 -0
  472. package/layouts/_all.scss +0 -7
  473. package/patternfly-base-no-globals-theme-dark-unversioned.css +0 -6276
  474. package/patternfly-base-no-globals-theme-dark-unversioned.scss +0 -11
  475. package/patternfly-base-theme-dark-unversioned.css +0 -6393
  476. package/patternfly-base-theme-dark-unversioned.scss +0 -5
  477. package/patternfly-charts-theme-dark-unversioned.css +0 -70
  478. package/patternfly-charts-theme-dark-unversioned.scss +0 -8
  479. package/patternfly-charts-theme-dark.css +0 -70
  480. package/patternfly-charts-theme-dark.scss +0 -8
  481. package/patternfly-theme-dark-unversioned.css +0 -35533
  482. package/patternfly-theme-dark-unversioned.scss +0 -6
  483. package/patternfly-theme-dark.css +0 -0
  484. package/patternfly-theme-dark.scss +0 -1
  485. package/sass-utilities/_all.scss +0 -9
  486. package/sass-utilities/colors.scss +0 -82
  487. package/sass-utilities/div.import.scss +0 -3
  488. package/sass-utilities/div.scss +0 -4
  489. package/sass-utilities/placeholders.scss +0 -72
  490. package/sass-utilities/themes/dark/_all.scss +0 -4
  491. package/sass-utilities/themes/dark/colors.scss +0 -16
  492. package/sass-utilities/themes/dark/mixins.scss +0 -7
  493. package/sass-utilities/themes/dark/placeholders.scss +0 -5
  494. package/sass-utilities/themes/dark/scss-variables.scss +0 -92
  495. package/themes/dark/_patternfly-charts-theme-dark.scss +0 -98
  496. package/utilities/BackgroundColor/BackgroundColor.css +0 -414
  497. package/utilities/BackgroundColor/BackgroundColor.scss +0 -64
  498. package/utilities/BackgroundColor/themes/dark/BackgroundColor.css +0 -0
  499. package/utilities/BackgroundColor/themes/dark/BackgroundColor.scss +0 -25
  500. package/utilities/Text/themes/dark/text.css +0 -0
  501. package/utilities/Text/themes/dark/text.scss +0 -33
package/docs/components/Form/examples/Form.md CHANGED
@@ -20,7 +20,9 @@ cssPrefix: pf-v6-c-form
20
20
  aria-label="More information for name field"
21
21
  aria-describedby="form-vertical-name"
22
22
  >
23
- <i class="fas fa-question-circle" aria-hidden="true"></i>
23
+ <span class="pf-v6-c-button__icon">
24
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
25
+ </span>
24
26
  </span></span>
25
27
  </div>
26
28
  <div class="pf-v6-c-form__group-control">
@@ -68,7 +70,9 @@ cssPrefix: pf-v6-c-form
68
70
  aria-label="More information for information field"
69
71
  aria-describedby="form-horizontal-info"
70
72
  >
71
- <i class="fas fa-question-circle" aria-hidden="true"></i>
73
+ <span class="pf-v6-c-button__icon">
74
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
75
+ </span>
72
76
  </span></span>
73
77
  </div>
74
78
  <div class="pf-v6-c-form__group-control">
@@ -100,7 +104,9 @@ cssPrefix: pf-v6-c-form
100
104
  aria-label="More information for label field"
101
105
  aria-describedby="form-horizontal-checkbox-legend"
102
106
  >
103
- <i class="fas fa-question-circle" aria-hidden="true"></i>
107
+ <span class="pf-v6-c-button__icon">
108
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
109
+ </span>
104
110
  </span></span>
105
111
  </div>
106
112
  <div class="pf-v6-c-form__group-control pf-m-stack">
@@ -154,7 +160,9 @@ cssPrefix: pf-v6-c-form
154
160
  aria-label="More information for name field"
155
161
  aria-describedby="form-horizontal-custom-breakpoint-name"
156
162
  >
157
- <i class="fas fa-question-circle" aria-hidden="true"></i>
163
+ <span class="pf-v6-c-button__icon">
164
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
165
+ </span>
158
166
  </span></span>
159
167
  </div>
160
168
  <div class="pf-v6-c-form__group-control">
@@ -462,10 +470,12 @@ cssPrefix: pf-v6-c-form
462
470
  aria-label="More information for name field"
463
471
  aria-describedby="form-additional-infoform-additional-info-name"
464
472
  >
465
- <i class="fas fa-question-circle" aria-hidden="true"></i>
473
+ <span class="pf-v6-c-button__icon">
474
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
475
+ </span>
466
476
  </span></span>
467
477
  </div>
468
- <div class="pf-v6-c-form__group-label-info">info</div>
478
+ <div class="pf-v6-c-form__group-label-info">More info about the name field</div>
469
479
  </div>
470
480
  <div class="pf-v6-c-form__group-control">
471
481
  <span class="pf-v6-c-form-control pf-m-required">
@@ -482,14 +492,59 @@ cssPrefix: pf-v6-c-form
482
492
 
483
493
  ```
484
494
 
495
+ ### Label with additional info (horizontal form)
496
+
497
+ ```html
498
+ <form class="pf-v6-c-form pf-m-horizontal" novalidate>
499
+ <div class="pf-v6-c-form__group">
500
+ <div class="pf-v6-c-form__group-label pf-m-info">
501
+ <div class="pf-v6-c-form__group-label-main"><label
502
+ class="pf-v6-c-form__label"
503
+ for="form-additional-info-horizontal-name"
504
+ >
505
+ <span class="pf-v6-c-form__label-text">Name</span>&nbsp;<span class="pf-v6-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v6-c-form__group-label-help">
506
+ <span
507
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
508
+ type="button"
509
+ role="button"
510
+ tabindex="0"
511
+ aria-label="More information for name field"
512
+ aria-describedby="form-additional-info-horizontalform-additional-info-horizontal-name"
513
+ >
514
+ <span class="pf-v6-c-button__icon">
515
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
516
+ </span>
517
+ </span></span>
518
+ </div>
519
+ <div class="pf-v6-c-form__group-label-info">More info about the name field</div>
520
+ </div>
521
+ <div class="pf-v6-c-form__group-control">
522
+ <span class="pf-v6-c-form-control pf-m-required">
523
+ <input
524
+ required
525
+ type="text"
526
+ id="form-additional-info-horizontal-name"
527
+ name="form-additional-info-horizontal-name"
528
+ />
529
+ </span>
530
+ </div>
531
+ </div>
532
+ </form>
533
+
534
+ ```
535
+
485
536
  ### Action group
486
537
 
487
538
  ```html
488
539
  <form class="pf-v6-c-form" novalidate>
489
540
  <div class="pf-v6-c-form__group pf-m-action">
490
541
  <div class="pf-v6-c-form__actions">
491
- <button class="pf-v6-c-button pf-m-primary" type="submit">Submit form</button>
492
- <button class="pf-v6-c-button pf-m-link" type="reset">Reset form</button>
542
+ <button class="pf-v6-c-button pf-m-primary" type="submit">
543
+ <span class="pf-v6-c-button__text">Submit form</span>
544
+ </button>
545
+ <button class="pf-v6-c-button pf-m-link" type="reset">
546
+ <span class="pf-v6-c-button__text">Reset form</span>
547
+ </button>
493
548
  </div>
494
549
  </div>
495
550
  </form>
@@ -518,7 +573,9 @@ cssPrefix: pf-v6-c-form
518
573
  >Field group description text</div>
519
574
  </div>
520
575
  <div class="pf-v6-c-form__field-group-header-actions">
521
- <button class="pf-v6-c-button pf-m-secondary" type="button">Action</button>
576
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
577
+ <span class="pf-v6-c-button__text">Action</span>
578
+ </button>
522
579
  </div>
523
580
  </div>
524
581
  <div class="pf-v6-c-form__field-group-body" hidden>
@@ -536,7 +593,9 @@ cssPrefix: pf-v6-c-form
536
593
  aria-label="More information for label 1 field"
537
594
  aria-describedby="form-field-group-field-group-label1"
538
595
  >
539
- <i class="fas fa-question-circle" aria-hidden="true"></i>
596
+ <span class="pf-v6-c-button__icon">
597
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
598
+ </span>
540
599
  </span></span>
541
600
  </div>
542
601
  <div class="pf-v6-c-form__group-control">
@@ -564,7 +623,9 @@ cssPrefix: pf-v6-c-form
564
623
  aria-label="More information for label 2 field"
565
624
  aria-describedby="form-field-group-field-group-label2"
566
625
  >
567
- <i class="fas fa-question-circle" aria-hidden="true"></i>
626
+ <span class="pf-v6-c-button__icon">
627
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
628
+ </span>
568
629
  </span></span>
569
630
  </div>
570
631
  <div class="pf-v6-c-form__group-control">
@@ -597,14 +658,15 @@ cssPrefix: pf-v6-c-form
597
658
  <div class="pf-v6-c-form__field-group-toggle-button">
598
659
  <button
599
660
  class="pf-v6-c-button pf-m-plain"
600
- type="button"
601
- aria-expanded="false"
602
- aria-label="Details"
603
661
  id="form-expandable-field-groups-field-group-1-toggle"
662
+ type="button"
604
663
  aria-labelledby="form-expandable-field-groups-field-group-1-title form-expandable-field-groups-field-group-1-toggle"
664
+ aria-label="Details"
605
665
  >
606
- <span class="pf-v6-c-form__field-group-toggle-icon">
607
- <i class="fas fa-angle-right" aria-hidden="true"></i>
666
+ <span class="pf-v6-c-button__icon">
667
+ <span class="pf-v6-c-form__field-group-toggle-icon">
668
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
669
+ </span>
608
670
  </span>
609
671
  </button>
610
672
  </div>
@@ -622,7 +684,9 @@ cssPrefix: pf-v6-c-form
622
684
  >Field group 1 description text</div>
623
685
  </div>
624
686
  <div class="pf-v6-c-form__field-group-header-actions">
625
- <button class="pf-v6-c-button pf-m-secondary" type="button">Action</button>
687
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
688
+ <span class="pf-v6-c-button__text">Action</span>
689
+ </button>
626
690
  </div>
627
691
  </div>
628
692
  </div>
@@ -634,15 +698,17 @@ cssPrefix: pf-v6-c-form
634
698
  <div class="pf-v6-c-form__field-group-toggle">
635
699
  <div class="pf-v6-c-form__field-group-toggle-button">
636
700
  <button
637
- class="pf-v6-c-button pf-m-plain"
701
+ class="pf-v6-c-button pf-m-expanded pf-m-plain"
702
+ id="form-expandable-field-groups-field-group-2-toggle"
638
703
  type="button"
639
704
  aria-expanded="true"
640
- aria-label="Details"
641
- id="form-expandable-field-groups-field-group-2-toggle"
642
705
  aria-labelledby="form-expandable-field-groups-field-group-2-title form-expandable-field-groups-field-group-2-toggle"
706
+ aria-label="Details"
643
707
  >
644
- <span class="pf-v6-c-form__field-group-toggle-icon">
645
- <i class="fas fa-angle-right" aria-hidden="true"></i>
708
+ <span class="pf-v6-c-button__icon">
709
+ <span class="pf-v6-c-form__field-group-toggle-icon">
710
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
711
+ </span>
646
712
  </span>
647
713
  </button>
648
714
  </div>
@@ -675,7 +741,9 @@ cssPrefix: pf-v6-c-form
675
741
  aria-label="More information for label 1 field"
676
742
  aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-2-label1"
677
743
  >
678
- <i class="fas fa-question-circle" aria-hidden="true"></i>
744
+ <span class="pf-v6-c-button__icon">
745
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
746
+ </span>
679
747
  </span></span>
680
748
  </div>
681
749
  <div class="pf-v6-c-form__group-control">
@@ -703,7 +771,9 @@ cssPrefix: pf-v6-c-form
703
771
  aria-label="More information for label 2 field"
704
772
  aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-2-label2"
705
773
  >
706
- <i class="fas fa-question-circle" aria-hidden="true"></i>
774
+ <span class="pf-v6-c-button__icon">
775
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
776
+ </span>
707
777
  </span></span>
708
778
  </div>
709
779
  <div class="pf-v6-c-form__group-control">
@@ -750,7 +820,9 @@ cssPrefix: pf-v6-c-form
750
820
  aria-label="More information for label 1 field"
751
821
  aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-3-label1"
752
822
  >
753
- <i class="fas fa-question-circle" aria-hidden="true"></i>
823
+ <span class="pf-v6-c-button__icon">
824
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
825
+ </span>
754
826
  </span></span>
755
827
  </div>
756
828
  <div class="pf-v6-c-form__group-control">
@@ -781,7 +853,9 @@ cssPrefix: pf-v6-c-form
781
853
  aria-label="More information for label 2 field"
782
854
  aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-3-label2"
783
855
  >
784
- <i class="fas fa-question-circle" aria-hidden="true"></i>
856
+ <span class="pf-v6-c-button__icon">
857
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
858
+ </span>
785
859
  </span></span>
786
860
  </div>
787
861
  <div class="pf-v6-c-form__group-control">
package/docs/components/Hint/examples/Hint.md CHANGED
@@ -9,59 +9,17 @@ cssPrefix: pf-v6-c-hint
9
9
  ```html
10
10
  <div class="pf-v6-c-hint">
11
11
  <div class="pf-v6-c-hint__actions">
12
- <div class="pf-v6-c-dropdown">
13
- <button
14
- class="pf-v6-c-dropdown__toggle pf-m-plain"
15
- id="hint-with-title-dropdown-kebab-button"
16
- aria-expanded="false"
17
- type="button"
18
- aria-label="Actions"
19
- >
12
+ <button
13
+ class="pf-v6-c-menu-toggle pf-m-plain"
14
+ type="button"
15
+ aria-expanded="false"
16
+ aria-label="Menu toggle"
17
+ id="hint-with-title-example-hint"
18
+ >
19
+ <span class="pf-v6-c-menu-toggle__icon">
20
20
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
21
- </button>
22
- <ul
23
- class="pf-v6-c-dropdown__menu"
24
- aria-labelledby="hint-with-title-dropdown-kebab-button"
25
- hidden
26
- role="menu"
27
- >
28
- <li role="none">
29
- <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
30
- </li>
31
- <li role="none">
32
- <button
33
- class="pf-v6-c-dropdown__menu-item"
34
- role="menuitem"
35
- type="button"
36
- >Action</button>
37
- </li>
38
- <li role="none">
39
- <a
40
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
41
- role="menuitem"
42
- href="#"
43
- aria-disabled="true"
44
- tabindex="-1"
45
- >Disabled link</a>
46
- </li>
47
- <li role="none">
48
- <button
49
- class="pf-v6-c-dropdown__menu-item"
50
- role="menuitem"
51
- type="button"
52
- disabled
53
- >Disabled action</button>
54
- </li>
55
- <li class="pf-v6-c-divider" role="separator"></li>
56
- <li role="none">
57
- <a
58
- class="pf-v6-c-dropdown__menu-item"
59
- role="menuitem"
60
- href="#"
61
- >Separated link</a>
62
- </li>
63
- </ul>
64
- </div>
21
+ </span>
22
+ </button>
65
23
  </div>
66
24
  <div class="pf-v6-c-hint__title">Do more with Find it Fix it capabilities</div>
67
25
  <div
@@ -73,69 +31,26 @@ cssPrefix: pf-v6-c-hint
73
31
 
74
32
  <div class="pf-v6-c-hint">
75
33
  <div class="pf-v6-c-hint__actions">
76
- <div class="pf-v6-c-dropdown">
77
- <button
78
- class="pf-v6-c-dropdown__toggle pf-m-plain"
79
- id="hint-with-title-with-footer-dropdown-kebab-button"
80
- aria-expanded="false"
81
- type="button"
82
- aria-label="Actions"
83
- >
34
+ <button
35
+ class="pf-v6-c-menu-toggle pf-m-plain"
36
+ type="button"
37
+ aria-expanded="false"
38
+ aria-label="Menu toggle"
39
+ id="hint-with-title-and-actions-example-hint"
40
+ >
41
+ <span class="pf-v6-c-menu-toggle__icon">
84
42
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
85
- </button>
86
- <ul
87
- class="pf-v6-c-dropdown__menu"
88
- aria-labelledby="hint-with-title-with-footer-dropdown-kebab-button"
89
- hidden
90
- role="menu"
91
- >
92
- <li role="none">
93
- <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
94
- </li>
95
- <li role="none">
96
- <button
97
- class="pf-v6-c-dropdown__menu-item"
98
- role="menuitem"
99
- type="button"
100
- >Action</button>
101
- </li>
102
- <li role="none">
103
- <a
104
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
105
- role="menuitem"
106
- href="#"
107
- aria-disabled="true"
108
- tabindex="-1"
109
- >Disabled link</a>
110
- </li>
111
- <li role="none">
112
- <button
113
- class="pf-v6-c-dropdown__menu-item"
114
- role="menuitem"
115
- type="button"
116
- disabled
117
- >Disabled action</button>
118
- </li>
119
- <li class="pf-v6-c-divider" role="separator"></li>
120
- <li role="none">
121
- <a
122
- class="pf-v6-c-dropdown__menu-item"
123
- role="menuitem"
124
- href="#"
125
- >Separated link</a>
126
- </li>
127
- </ul>
128
- </div>
43
+ </span>
44
+ </button>
129
45
  </div>
130
46
  <div class="pf-v6-c-hint__title">Do more with Find it Fix it capabilities</div>
131
47
  <div
132
48
  class="pf-v6-c-hint__body"
133
49
  >Upgrade to Red Hat Smart Management to remediate all your systems across regions and geographies.</div>
134
50
  <div class="pf-v6-c-hint__footer">
135
- <button
136
- class="pf-v6-c-button pf-m-link pf-m-inline"
137
- type="button"
138
- >Try it for 90 days</button>
51
+ <button class="pf-v6-c-button pf-m-inline pf-m-link" type="button">
52
+ <span class="pf-v6-c-button__text">Try it for 90 days</span>
53
+ </button>
139
54
  </div>
140
55
  </div>
141
56
 
@@ -155,69 +70,43 @@ cssPrefix: pf-v6-c-hint
155
70
 
156
71
  <div class="pf-v6-c-hint">
157
72
  <div class="pf-v6-c-hint__actions">
158
- <div class="pf-v6-c-dropdown">
159
- <button
160
- class="pf-v6-c-dropdown__toggle pf-m-plain"
161
- id="hint-with-no-title-dropdown-kebab-button"
162
- aria-expanded="false"
163
- type="button"
164
- aria-label="Actions"
165
- >
73
+ <button
74
+ class="pf-v6-c-menu-toggle pf-m-plain"
75
+ type="button"
76
+ aria-expanded="false"
77
+ aria-label="Menu toggle"
78
+ id="hint-with-no-title-example-hint"
79
+ >
80
+ <span class="pf-v6-c-menu-toggle__icon">
166
81
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
167
- </button>
168
- <ul
169
- class="pf-v6-c-dropdown__menu"
170
- aria-labelledby="hint-with-no-title-dropdown-kebab-button"
171
- hidden
172
- role="menu"
173
- >
174
- <li role="none">
175
- <a class="pf-v6-c-dropdown__menu-item" role="menuitem" href="#">Link</a>
176
- </li>
177
- <li role="none">
178
- <button
179
- class="pf-v6-c-dropdown__menu-item"
180
- role="menuitem"
181
- type="button"
182
- >Action</button>
183
- </li>
184
- <li role="none">
185
- <a
186
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
187
- role="menuitem"
188
- href="#"
189
- aria-disabled="true"
190
- tabindex="-1"
191
- >Disabled link</a>
192
- </li>
193
- <li role="none">
194
- <button
195
- class="pf-v6-c-dropdown__menu-item"
196
- role="menuitem"
197
- type="button"
198
- disabled
199
- >Disabled action</button>
200
- </li>
201
- <li class="pf-v6-c-divider" role="separator"></li>
202
- <li role="none">
203
- <a
204
- class="pf-v6-c-dropdown__menu-item"
205
- role="menuitem"
206
- href="#"
207
- >Separated link</a>
208
- </li>
209
- </ul>
210
- </div>
82
+ </span>
83
+ </button>
211
84
  </div>
212
85
  <div
213
86
  class="pf-v6-c-hint__body"
214
87
  >Upgrade to Red Hat Smart Management to remediate all your systems across regions and geographies.</div>
215
88
  <div class="pf-v6-c-hint__footer">
216
- <button
217
- class="pf-v6-c-button pf-m-link pf-m-inline"
218
- type="button"
219
- >Try it for 90 days</button>
89
+ <button class="pf-v6-c-button pf-m-inline pf-m-link" type="button">
90
+ <span class="pf-v6-c-button__text">Try it for 90 days</span>
91
+ </button>
92
+ </div>
93
+ </div>
94
+
95
+ ```
96
+
97
+ ### Actions with no offset
98
+
99
+ ```html
100
+ <div class="pf-v6-c-hint">
101
+ <div class="pf-v6-c-hint__actions pf-m-no-offset">
102
+ <button class="pf-v6-c-button pf-m-primary" type="button">
103
+ <span class="pf-v6-c-button__text">Action</span>
104
+ </button>
220
105
  </div>
106
+ <div class="pf-v6-c-hint__title">Do more with Find it Fix it capabilities</div>
107
+ <div
108
+ class="pf-v6-c-hint__body"
109
+ >Upgrade to Red Hat Smart Management to remediate all your systems across regions and geographies.</div>
221
110
  </div>
222
111
 
223
112
  ```
@@ -233,3 +122,4 @@ cssPrefix: pf-v6-c-hint
233
122
  | `.pf-v6-c-hint__body` | `<div>` | Initiates the hint body element. |
234
123
  | `.pf-v6-c-hint__footer` | `<div>` | Initiates the hint footer element. |
235
124
  | `.pf-v6-c-hint__actions` | `<div>` | Initiates the hint actions element. |
125
+ | `.pf-m-no-offset` | `.pf-v6-c-hint__actions` | Removes the negative vertical margins on the actions element intended to align the action content with the hint title. |