@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
@@ -1,17 +0,0 @@
1
- .ws-html-deprecated-c-page :is(.pf-v5-c-page__sidebar, .pf-v5-c-page__main-subnav) {
2
- color: var(--pf-v5-global--Color--light-100);
3
- }
4
-
5
- .ws-html-deprecated-c-page .pf-v5-c-page__main-section.pf-m-dark-200 {
6
- color: var(--pf-v5-global--Color--dark-100);
7
- }
8
-
9
- #ws-html-deprecated-c-page-with-or-without-fill .ws-preview-html,
10
- #ws-html-deprecated-c-page-multiple-sidebar-body-elements-padding-and-fill .ws-preview-html {
11
- height: 500px;
12
- }
13
-
14
- #ws-html-deprecated-c-page-multiple-sidebar-body-elements .ws-preview-html,
15
- #ws-html-deprecated-c-page-using-flex-layout .ws-preview-html {
16
- height: 100%;
17
- }
@@ -1,261 +0,0 @@
1
- ---
2
- id: Page
3
- section: components
4
- wrapperTag: div
5
- deprecated: true
6
- ---import './PageHeader.css'
7
-
8
- ## Page header examples
9
-
10
- ### Vertical nav
11
-
12
- ```html
13
- <div class="pf-v6-c-page">
14
- <header class="pf-v6-c-page__header">
15
- <div class="pf-v6-c-page__header-brand">
16
- <div class="pf-v6-c-page__header-brand-toggle">toggle</div>
17
- <a href="#" class="pf-v6-c-page__header-brand-link">Logo</a>
18
- </div>
19
- <div class="pf-v6-c-page__header-tools">header-tools</div>
20
- </header>
21
- <div class="pf-v6-c-page__sidebar">
22
- <div class="pf-v6-c-page__sidebar-body">Navigation</div>
23
- </div>
24
- <main class="pf-v6-c-page__main" tabindex="-1">
25
- <section class="pf-v6-c-page__main-section pf-m-dark-100">
26
- This
27
- <code>.pf-v6-c-page__main-section</code> uses
28
- <code>.pf-m-dark-100</code>.
29
- </section>
30
- <section class="pf-v6-c-page__main-section pf-m-dark-200">
31
- This
32
- <code>.pf-v6-c-page__main-section</code> uses
33
- <code>.pf-m-dark-200</code>.
34
- </section>
35
- <section class="pf-v6-c-page__main-section pf-m-light">
36
- This
37
- <code>.pf-v6-c-page__main-section</code> uses
38
- <code>.pf-m-light</code>.
39
- </section>
40
- <section class="pf-v6-c-page__main-section">
41
- This is a default
42
- <code>.pf-v6-c-page__main-section</code>.
43
- </section>
44
- </main>
45
- </div>
46
-
47
- ```
48
-
49
- ### Horizontal nav
50
-
51
- ```html
52
- <div class="pf-v6-c-page">
53
- <header class="pf-v6-c-page__header">
54
- <div class="pf-v6-c-page__header-brand">
55
- <a href="#" class="pf-v6-c-page__header-brand-link">Logo</a>
56
- </div>
57
- <div class="pf-v6-c-page__header-nav">Navigation</div>
58
- <div class="pf-v6-c-page__header-tools">header-tools</div>
59
- </header>
60
- <main class="pf-v6-c-page__main" tabindex="-1">
61
- <section class="pf-v6-c-page__main-section pf-m-dark-100"></section>
62
- <section class="pf-v6-c-page__main-section pf-m-dark-200"></section>
63
- <section class="pf-v6-c-page__main-section pf-m-light"></section>
64
- <section class="pf-v6-c-page__main-section"></section>
65
- </main>
66
- </div>
67
-
68
- ```
69
-
70
- ### Multiple sidebar body elements, padding, and fill
71
-
72
- ```html
73
- <div class="pf-v6-c-page">
74
- <header class="pf-v6-c-page__header">
75
- <div class="pf-v6-c-page__header-brand">
76
- <div class="pf-v6-c-page__header-brand-toggle">toggle</div>
77
- <a href="#" class="pf-v6-c-page__header-brand-link">Logo</a>
78
- </div>
79
- <div class="pf-v6-c-page__header-tools">header-tools</div>
80
- </header>
81
- <div class="pf-v6-c-page__sidebar">
82
- <div class="pf-v6-c-page__sidebar-body">Navigation</div>
83
- <div
84
- class="pf-v6-c-page__sidebar-body pf-m-fill pf-m-page-insets"
85
- >inset content</div>
86
- <div class="pf-v6-c-page__sidebar-body pf-m-page-insets">footer content</div>
87
- </div>
88
- <main class="pf-v6-c-page__main" tabindex="-1">
89
- <section class="pf-v6-c-page__main-section pf-m-light"></section>
90
- </main>
91
- </div>
92
-
93
- ```
94
-
95
- ### With or without fill
96
-
97
- ```html
98
- <div class="pf-v6-c-page">
99
- <header class="pf-v6-c-page__header">
100
- <div class="pf-v6-c-page__header-brand">
101
- <a href="#" class="pf-v6-c-page__header-brand-link">Logo</a>
102
- </div>
103
- <div class="pf-v6-c-page__header-nav">Navigation</div>
104
- <div class="pf-v6-c-page__header-tools">header-tools</div>
105
- </header>
106
- <main class="pf-v6-c-page__main" tabindex="-1">
107
- <section
108
- class="pf-v6-c-page__main-section pf-m-light"
109
- >A regular page section.</section>
110
- <section class="pf-v6-c-page__main-section pf-m-fill">
111
- This section uses
112
- <code>.pf-m-fill</code> to fill the available space.
113
- </section>
114
- <section class="pf-v6-c-page__main-section pf-m-light pf-m-no-fill">
115
- This section uses
116
- <code>.pf-m-no-fill</code> to not fill the available space.
117
- </section>
118
- </main>
119
- </div>
120
-
121
- ```
122
-
123
- ### Main section padding
124
-
125
- ```html
126
- <div class="pf-v6-c-page">
127
- <header class="pf-v6-c-page__header">
128
- <div class="pf-v6-c-page__header-brand">
129
- <div class="pf-v6-c-page__header-brand-toggle">toggle</div>
130
- <a href="#" class="pf-v6-c-page__header-brand-link">Logo</a>
131
- </div>
132
- <div class="pf-v6-c-page__header-tools">header-tools</div>
133
- </header>
134
- <div class="pf-v6-c-page__sidebar">
135
- <div class="pf-v6-c-page__sidebar-body">Navigation</div>
136
- </div>
137
- <main class="pf-v6-c-page__main" tabindex="-1">
138
- <section class="pf-v6-c-page__main-section">
139
- This
140
- <code>.pf-v6-c-page__main-section</code> has default padding.
141
- </section>
142
- <section class="pf-v6-c-page__main-section pf-m-no-padding pf-m-light">
143
- This
144
- <code>.pf-v6-c-page__main-section</code> uses
145
- <code>.pf-m-no-padding</code> to remove all padding.
146
- </section>
147
- <section
148
- class="pf-v6-c-page__main-section pf-m-no-padding pf-m-padding-on-md"
149
- >
150
- This
151
- <code>.pf-v6-c-page__main-section</code> uses
152
- <code>.pf-m-no-padding .pf-m-padding-on-md</code> to remove padding up to the
153
- <code>md</code> breakpoint.
154
- </section>
155
- </main>
156
- </div>
157
-
158
- ```
159
-
160
- ### Main section variations
161
-
162
- ```html
163
- <div class="pf-v6-c-page">
164
- <header class="pf-v6-c-page__header">
165
- <div class="pf-v6-c-page__header-brand">
166
- <div class="pf-v6-c-page__header-brand-toggle">toggle</div>
167
- <a href="#" class="pf-v6-c-page__header-brand-link">Logo</a>
168
- </div>
169
- <div class="pf-v6-c-page__header-tools">header-tools</div>
170
- </header>
171
- <div class="pf-v6-c-page__sidebar">
172
- <div class="pf-v6-c-page__sidebar-body">Navigation</div>
173
- </div>
174
- <main class="pf-v6-c-page__main" tabindex="-1">
175
- <section class="pf-v6-c-page__main-subnav">
176
- <code>.pf-v6-c-page__main-subnav</code> for horizontal subnav navigation
177
- </section>
178
- <section class="pf-v6-c-page__main-nav">
179
- <code>.pf-v6-c-page__main-nav</code> for tertiary navigation
180
- </section>
181
- <section class="pf-v6-c-page__main-tabs">
182
- <code>.pf-v6-c-page__main-tabs</code> for tabs
183
- </section>
184
- <div class="pf-v6-c-page__main-group">
185
- <code>.pf-v6-c-page__main-group</code> for a group of page sections
186
- </div>
187
- <section class="pf-v6-c-page__main-breadcrumb">
188
- <code>.pf-v6-c-page__main-breadcrumb</code> for breadcrumbs
189
- </section>
190
- <section class="pf-v6-c-page__main-section">
191
- <code>.pf-v6-c-page__main-section</code> for main sections
192
- </section>
193
- <section class="pf-v6-c-page__main-wizard">
194
- <code>.pf-v6-c-page__main-wizard</code> for wizards
195
- </section>
196
- </main>
197
- </div>
198
-
199
- ```
200
-
201
- ### Centered section
202
-
203
- ```html
204
- <div class="pf-v6-c-page">
205
- <header class="pf-v6-c-page__header">
206
- <div class="pf-v6-c-page__header-brand">
207
- <div class="pf-v6-c-page__header-brand-toggle">toggle</div>
208
- <a href="#" class="pf-v6-c-page__header-brand-link">Logo</a>
209
- </div>
210
- <div class="pf-v6-c-page__header-tools">header-tools</div>
211
- </header>
212
- <main class="pf-v6-c-page__main" tabindex="-1">
213
- <section
214
- class="pf-v6-c-page__main-section pf-m-limit-width pf-m-align-center"
215
- >
216
- <div class="pf-v6-c-page__main-body">
217
- <div class="pf-v6-c-card">
218
- <div class="pf-v6-c-card__body">
219
- When a width limited page section is wider than the value of
220
- <code>--pf-v6-c-page--section--m-limit-width--MaxWidth</code>, the section will be centered in the main section.
221
- <br />
222
- <br />The content in this example is placed in a card to better illustrate how the section behaves when it is centered. A card is not required to center a page section.
223
- </div>
224
- </div>
225
- </div>
226
- </section>
227
- </main>
228
- </div>
229
-
230
- ```
231
-
232
- ## Documentation
233
-
234
- ### Overview
235
-
236
- The page header component is a deprecated approach to building a header on the page component. The recommended approach uses the masthead component instead.
237
-
238
- ### Accessibility
239
-
240
- | Attribute | Applied to | Outcome |
241
- | -- | -- | -- |
242
- | `role="banner"` | `.pf-v6-c-page__header` | Identifies the element that serves as the banner region. |
243
- | `aria-expanded="true/false"` | `.pf-v6-c-page__header-brand-toggle > .pf-v6-c-button` | Indicates that the expandable content is visible and the current state of the contents. **Required** |
244
- | `aria-controls="[id of nav]"` | `.pf-v6-c-page__header-brand-toggle > .pf-v6-c-button` | Identifies the element controlled by the toggle. **Required**
245
-
246
- ### Usage
247
-
248
- | Class | Applied to | Outcome |
249
- | -- | -- | -- |
250
- | `.pf-v6-c-page__header` | `<header>` | Declares the page header. |
251
- | `.pf-v6-c-page__header-brand` | `<div>` | Creates a header container to nest the brand component. |
252
- | `.pf-v6-c-page__header-brand-toggle` | `<div>` | Creates a container to nest the sidebar toggle. |
253
- | `.pf-v6-c-page__header-brand-link` | `<a>`, `<span>` | Creates a link for the brand logo. Use a `<span>` if there is no link. |
254
- | `.pf-v6-c-page__header-selector` | `<div>` | Creates a header container to nest the context selector component. |
255
- | `.pf-v6-c-page__header-nav` | `<div>` | Creates a container to nest the navigation component in the header. |
256
- | `.pf-v6-c-page__header-tools` | `<div>` | Creates a container to nest the icons and menus in header. |
257
- | `.pf-v6-c-page__header-tools-group` | `<div>` | Creates a container for grouping sets of icons and menus in header. |
258
- | `.pf-v6-c-page__header-tools-item` | `<div>` | Creates a container for an item in a header tools group. |
259
- | `.pf-m-selected` | `.pf-v6-c-page__header-tools-item` | Modifies a header tools item to indicate that the button inside is in the selected state. |
260
- | `.pf-m-hidden{-on-[breakpoint]}` | `.pf-v6-c-page__header-tools-group`, `.pf-v6-c-page__header-tools-item` | Hides a header tools group or item at an optional breakpoint, or hides it at all [breakpoints](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes) with `.pf-m-hidden`. |
261
- | `.pf-m-visible{-on-[breakpoint]}` | `.pf-v6-c-page__header-tools-group`, `.pf-v6-c-page__header-tools-item` | Shows a header tools group or item at an optional [breakpoint](/developer-resources/global-css-variables#breakpoint-variables-and-class-suffixes). |
@@ -1,3 +0,0 @@
1
- #ws-core-c-pagination-top-expanded {
2
- height: 220px;
3
- }
@@ -1,56 +0,0 @@
1
- #ws-html-deprecated-c-select-single-with-top-expanded,
2
- #ws-html-deprecated-c-select-single-expanded,
3
- #ws-html-deprecated-c-select-single-expanded-and-selected,
4
- #ws-html-deprecated-c-select-single-with-typeahead-expanded-and-selected,
5
- #ws-html-deprecated-c-select-plain-toggle-expanded,
6
- #ws-html-deprecated-c-select-view-more-menu-item,
7
- #ws-html-deprecated-c-select-loading-menu-item,
8
- #ws-html-deprecated-c-select-placeholder-expanded,
9
- #ws-html-deprecated-c-select-placeholder-item-disabled,
10
- #ws-html-deprecated-c-select-placeholder-item-enabled,
11
- #ws-html-deprecated-c-select-multi-with-typeahead-invalid {
12
- min-height: 330px;
13
- }
14
-
15
- #ws-html-deprecated-c-select-single-with-top-expanded {
16
- display: flex;
17
- align-items: flex-end;
18
- width: 100%;
19
- }
20
-
21
- #ws-html-deprecated-c-select-single-with-typeahead-expanded,
22
- #ws-html-deprecated-c-select-multi-with-typeahead-chip-group-collapsed {
23
- min-height: 210px;
24
- }
25
-
26
- #ws-html-deprecated-c-select-checkbox-expanded,
27
- #ws-html-deprecated-c-select-checkbox-expanded-without-badge,
28
- #ws-html-deprecated-c-select-checkbox-with-counts {
29
- min-height: 270px;
30
- }
31
-
32
- #ws-html-deprecated-c-select-multi-with-typeahead-chip-group-expanded,
33
- #ws-html-deprecated-c-select-menu-footer,
34
- #ws-html-deprecated-c-select-checkbox-item-description {
35
- min-height: 365px;
36
- }
37
-
38
- #ws-html-deprecated-c-select-checkbox-expanded-and-selected-with-groups {
39
- min-height: 460px;
40
- }
41
-
42
- #ws-html-deprecated-c-select-checkbox-expanded-and-selected-with-groups-and-filter {
43
- min-height: 530px;
44
- }
45
-
46
- #ws-html-deprecated-c-select-panel-menu {
47
- min-height: 120px;
48
- }
49
-
50
- #ws-html-deprecated-c-select-item-description {
51
- min-height: 400px;
52
- }
53
-
54
- #ws-html-deprecated-c-select-menu-item-favorites {
55
- min-height: 650px;
56
- }