@patternfly/patternfly 5.0.0-alpha.3 → 5.0.0-alpha.30

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 (290) hide show
  1. package/RELEASE-NOTES.md +17 -0
  2. package/assets/icons/iconUnicodes.json +1 -0
  3. package/assets/pficon/pficon.scss +6 -0
  4. package/assets/pficon/pficon.woff +0 -0
  5. package/assets/pficon/pficon.woff2 +0 -0
  6. package/base/_base.scss +0 -18
  7. package/base/_chart-globals.scss +0 -4
  8. package/base/_common.scss +0 -22
  9. package/base/_fonts.scss +22 -22
  10. package/base/_globals.scss +1 -1
  11. package/base/_icons.scss +1 -28
  12. package/base/_svg-icons.scss +6 -0
  13. package/base/_variables.scss +1 -1
  14. package/base/patternfly-common.css +0 -10
  15. package/base/patternfly-fonts.css +17 -17
  16. package/base/patternfly-icons.css +6 -20
  17. package/base/patternfly-pf-icons.css +5 -1
  18. package/base/themes/dark/_globals.scss +1 -1
  19. package/base/themes/dark/_variables.scss +1 -1
  20. package/components/AboutModalBox/about-modal-box.css +7 -7
  21. package/components/AboutModalBox/about-modal-box.scss +7 -7
  22. package/components/Accordion/accordion.css +2 -0
  23. package/components/Accordion/accordion.scss +2 -0
  24. package/components/Alert/alert.css +3 -3
  25. package/components/Alert/alert.scss +3 -3
  26. package/components/AppLauncher/app-launcher.css +2 -0
  27. package/components/AppLauncher/app-launcher.scss +2 -0
  28. package/components/Avatar/avatar.scss +2 -2
  29. package/components/Banner/banner.css +14 -14
  30. package/components/Banner/banner.scss +9 -13
  31. package/components/Breadcrumb/breadcrumb.css +2 -0
  32. package/components/Breadcrumb/breadcrumb.scss +2 -0
  33. package/components/CalendarMonth/calendar-month.css +2 -2
  34. package/components/CalendarMonth/calendar-month.scss +3 -3
  35. package/components/Card/card.css +20 -21
  36. package/components/Card/card.scss +22 -26
  37. package/components/Chip/chip.css +33 -24
  38. package/components/Chip/chip.scss +40 -31
  39. package/components/ChipGroup/chip-group.css +27 -17
  40. package/components/ChipGroup/chip-group.scss +36 -22
  41. package/components/Content/content.css +11 -5
  42. package/components/Content/content.scss +17 -9
  43. package/components/ContextSelector/context-selector.css +5 -1
  44. package/components/ContextSelector/context-selector.scss +6 -2
  45. package/components/DataList/data-list-grid.css +7 -7
  46. package/components/DataList/data-list-grid.scss +1 -1
  47. package/components/DataList/data-list.css +12 -11
  48. package/components/DataList/data-list.scss +5 -4
  49. package/components/DescriptionList/description-list.css +7 -7
  50. package/components/DescriptionList/description-list.scss +7 -7
  51. package/components/Divider/divider.css +2 -2
  52. package/components/Divider/divider.scss +3 -3
  53. package/components/Drawer/drawer.css +15 -16
  54. package/components/Drawer/drawer.scss +2 -3
  55. package/components/Dropdown/dropdown.css +12 -10
  56. package/components/Dropdown/dropdown.scss +2 -0
  57. package/components/DualListSelector/dual-list-selector.css +1 -1
  58. package/components/DualListSelector/dual-list-selector.scss +1 -1
  59. package/components/EmptyState/empty-state.css +46 -52
  60. package/components/EmptyState/empty-state.scss +58 -57
  61. package/components/ExpandableSection/expandable-section.css +2 -0
  62. package/components/ExpandableSection/expandable-section.scss +2 -0
  63. package/components/Form/form.css +12 -12
  64. package/components/Form/form.scss +7 -7
  65. package/components/FormControl/form-control.css +2 -5
  66. package/components/FormControl/themes/dark/form-control.scss +2 -6
  67. package/components/Hint/hint.css +2 -2
  68. package/components/Hint/hint.scss +2 -2
  69. package/components/Label/label.css +43 -30
  70. package/components/Label/label.scss +49 -34
  71. package/components/LabelGroup/label-group.css +26 -22
  72. package/components/LabelGroup/label-group.scss +31 -26
  73. package/components/Login/login.css +11 -11
  74. package/components/Login/login.scss +10 -10
  75. package/components/Masthead/masthead.css +4 -4
  76. package/components/Masthead/masthead.scss +4 -4
  77. package/components/Menu/menu.css +9 -6
  78. package/components/Menu/menu.scss +34 -31
  79. package/components/MenuToggle/menu-toggle.css +3 -1
  80. package/components/MenuToggle/menu-toggle.scss +3 -1
  81. package/components/ModalBox/modal-box.css +9 -8
  82. package/components/ModalBox/modal-box.scss +11 -11
  83. package/components/MultipleFileUpload/multiple-file-upload.css +6 -6
  84. package/components/MultipleFileUpload/multiple-file-upload.scss +6 -6
  85. package/components/Nav/nav.css +1 -1
  86. package/components/Nav/nav.scss +2 -2
  87. package/components/NotificationDrawer/notification-drawer.css +3 -3
  88. package/components/NotificationDrawer/notification-drawer.scss +3 -3
  89. package/components/Page/page.css +71 -71
  90. package/components/Page/page.scss +12 -12
  91. package/components/Pagination/pagination.css +2 -2
  92. package/components/Popover/popover.css +25 -31
  93. package/components/Popover/popover.scss +27 -32
  94. package/components/Popover/themes/dark/popover.scss +2 -8
  95. package/components/Progress/progress.css +13 -10
  96. package/components/Progress/progress.scss +13 -10
  97. package/components/ProgressStepper/progress-stepper.css +5 -5
  98. package/components/ProgressStepper/progress-stepper.scss +5 -5
  99. package/components/SearchInput/search-input.css +4 -2
  100. package/components/SearchInput/search-input.scss +4 -2
  101. package/components/Select/select.css +1 -1
  102. package/components/Select/select.scss +1 -1
  103. package/components/Sidebar/sidebar.css +69 -26
  104. package/components/Sidebar/sidebar.scss +84 -27
  105. package/components/SimpleList/simple-list.css +1 -1
  106. package/components/SimpleList/simple-list.scss +2 -2
  107. package/components/Spinner/spinner.css +4 -4
  108. package/components/Spinner/spinner.scss +4 -4
  109. package/components/Table/table-grid.css +28 -28
  110. package/components/Table/table-scrollable.css +31 -26
  111. package/components/Table/table-scrollable.scss +33 -28
  112. package/components/Table/table-tree-view.css +14 -4
  113. package/components/Table/table-tree-view.scss +15 -0
  114. package/components/Table/table.css +7 -2
  115. package/components/Table/table.scss +9 -2
  116. package/components/Tabs/tabs.css +0 -4
  117. package/components/Tabs/tabs.scss +0 -7
  118. package/components/TextInputGroup/text-input-group.css +6 -4
  119. package/components/TextInputGroup/text-input-group.scss +6 -5
  120. package/components/Tile/tile.css +1 -1
  121. package/components/Tile/tile.scss +1 -1
  122. package/components/Timestamp/timestamp.css +3 -3
  123. package/components/Timestamp/timestamp.scss +3 -3
  124. package/components/Toolbar/toolbar.css +67 -39
  125. package/components/Toolbar/toolbar.scss +39 -5
  126. package/components/Tooltip/themes/dark/tooltip.scss +1 -11
  127. package/components/Tooltip/tooltip.css +7 -12
  128. package/components/Tooltip/tooltip.scss +6 -3
  129. package/components/TreeView/tree-view.css +7 -15
  130. package/components/TreeView/tree-view.scss +7 -18
  131. package/components/Wizard/wizard.css +16 -1
  132. package/components/Wizard/wizard.scss +20 -2
  133. package/docs/components/AboutModalBox/examples/AboutModalBox.md +13 -13
  134. package/docs/components/Accordion/examples/Accordion.md +12 -12
  135. package/docs/components/ActionList/examples/ActionList.md +6 -6
  136. package/docs/components/Alert/examples/Alert.md +19 -19
  137. package/docs/components/AlertGroup/examples/AlertGroup.md +12 -12
  138. package/docs/components/AppLauncher/examples/application-launcher.md +51 -46
  139. package/docs/components/Avatar/examples/Avatar.md +11 -11
  140. package/docs/components/BackToTop/examples/BackToTop.md +4 -4
  141. package/docs/components/Backdrop/examples/Backdrop.md +4 -4
  142. package/docs/components/BackgroundImage/examples/BackgroundImage.md +4 -4
  143. package/docs/components/Badge/examples/Badge.md +5 -5
  144. package/docs/components/Banner/examples/Banner.md +8 -8
  145. package/docs/components/Brand/examples/Brand.md +9 -9
  146. package/docs/components/Breadcrumb/examples/Breadcrumb.md +20 -20
  147. package/docs/components/Button/examples/Button.md +35 -35
  148. package/docs/components/CalendarMonth/examples/CalendarMonth.md +32 -32
  149. package/docs/components/Card/examples/Card.md +139 -64
  150. package/docs/components/Check/examples/Check.md +15 -19
  151. package/docs/components/Chip/examples/Chip.md +70 -52
  152. package/docs/components/ChipGroup/examples/ChipGroup.md +452 -673
  153. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +22 -22
  154. package/docs/components/CodeBlock/examples/CodeBlock.md +9 -9
  155. package/docs/components/CodeEditor/examples/CodeEditor.md +54 -35
  156. package/docs/components/Content/examples/Content.md +37 -9
  157. package/docs/components/ContextSelector/examples/context-selector.css +5 -1
  158. package/docs/components/ContextSelector/examples/context-selector.md +86 -80
  159. package/docs/components/DataList/examples/DataList.md +187 -148
  160. package/docs/components/DatePicker/examples/DatePicker.md +10 -10
  161. package/docs/components/DescriptionList/examples/DescriptionList.md +24 -24
  162. package/docs/components/Divider/examples/Divider.md +10 -10
  163. package/docs/components/DragDrop/examples/DragDrop.md +5 -5
  164. package/docs/components/Drawer/examples/Drawer.md +43 -43
  165. package/docs/components/Dropdown/examples/Dropdown.css +5 -2
  166. package/docs/components/Dropdown/examples/Dropdown.md +123 -99
  167. package/docs/components/DualListSelector/examples/DualListSelector.md +201 -197
  168. package/docs/components/EmptyState/examples/EmptyState.md +130 -82
  169. package/docs/components/ExpandableSection/examples/ExpandableSection.md +23 -23
  170. package/docs/components/FileUpload/examples/FileUpload.md +8 -8
  171. package/docs/components/Form/examples/Form.md +64 -64
  172. package/docs/components/FormControl/examples/FormControl.md +20 -20
  173. package/docs/components/HelperText/examples/HelperText.md +12 -12
  174. package/docs/components/Hint/examples/Hint.md +7 -7
  175. package/docs/components/Icon/examples/Icon.md +10 -10
  176. package/docs/components/InlineEdit/examples/InlineEdit.md +29 -27
  177. package/docs/components/InputGroup/examples/InputGroup.md +10 -10
  178. package/docs/components/JumpLinks/examples/JumpLinks.md +35 -35
  179. package/docs/components/Label/examples/Label.md +1427 -746
  180. package/docs/components/LabelGroup/examples/LabelGroup.md +295 -242
  181. package/docs/components/List/examples/List.md +18 -18
  182. package/docs/components/LogViewer/examples/LogViewer.md +79 -73
  183. package/docs/components/Login/examples/Login.md +32 -32
  184. package/docs/components/Masthead/examples/masthead.md +9 -9
  185. package/docs/components/Menu/examples/Menu.md +82 -80
  186. package/docs/components/MenuToggle/examples/MenuToggle.md +28 -28
  187. package/docs/components/ModalBox/examples/ModalBox.md +106 -85
  188. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +25 -25
  189. package/docs/components/Nav/examples/Navigation.md +69 -69
  190. package/docs/components/NotificationBadge/examples/NotificationBadge.md +8 -8
  191. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +44 -44
  192. package/docs/components/NumberInput/examples/NumberInput.md +12 -12
  193. package/docs/components/OptionsMenu/examples/options-menu.md +27 -28
  194. package/docs/components/OverflowMenu/examples/overflow-menu.md +25 -25
  195. package/docs/components/Page/examples/Page.md +54 -54
  196. package/docs/components/Pagination/examples/Pagination.md +27 -27
  197. package/docs/components/Panel/examples/Panel.md +10 -10
  198. package/docs/components/Popover/examples/Popover.md +201 -144
  199. package/docs/components/Progress/examples/Progress.md +31 -60
  200. package/docs/components/ProgressStepper/examples/ProgressStepper.md +45 -38
  201. package/docs/components/Radio/examples/Radio.md +11 -11
  202. package/docs/components/SearchInput/examples/SearchInput.md +34 -34
  203. package/docs/components/Select/examples/Select.md +367 -313
  204. package/docs/components/Sidebar/examples/Sidebar.md +70 -14
  205. package/docs/components/SimpleList/examples/SimpleList.md +15 -15
  206. package/docs/components/Skeleton/examples/Skeleton.md +8 -8
  207. package/docs/components/SkipToContent/examples/SkipToContent.md +5 -5
  208. package/docs/components/Slider/examples/Slider.md +24 -24
  209. package/docs/components/Spinner/examples/Spinner.md +24 -24
  210. package/docs/components/Switch/examples/Switch.md +19 -19
  211. package/docs/components/TabContent/examples/TabContent.md +13 -13
  212. package/docs/components/Table/examples/Table.css +4 -0
  213. package/docs/components/Table/examples/Table.md +3163 -1712
  214. package/docs/components/Tabs/examples/Tabs.md +149 -149
  215. package/docs/components/TextInputGroup/examples/TextInputGroup.md +362 -280
  216. package/docs/components/Tile/examples/Tile.md +15 -15
  217. package/docs/components/Timestamp/examples/Timestamp.md +5 -5
  218. package/docs/components/Title/examples/Title.md +17 -17
  219. package/docs/components/ToggleGroup/examples/toggle-group.md +13 -13
  220. package/docs/components/Toolbar/examples/Toolbar.md +471 -378
  221. package/docs/components/Tooltip/examples/Tooltip.md +10 -10
  222. package/docs/components/TreeView/examples/TreeView.md +34 -34
  223. package/docs/components/Truncate/examples/Truncate.md +4 -4
  224. package/docs/components/Wizard/examples/Wizard.md +119 -127
  225. package/docs/demos/AboutModal/examples/AboutModal.md +4 -4
  226. package/docs/demos/Alert/examples/Alert.md +13 -13
  227. package/docs/demos/BackToTop/examples/BackToTop.md +4 -4
  228. package/docs/demos/Banner/examples/Banner.md +8 -9
  229. package/docs/demos/Card/examples/Card.md +219 -156
  230. package/docs/demos/CardView/examples/CardView.md +56 -29
  231. package/docs/demos/ContextSelector/examples/ContextSelector.md +18 -18
  232. package/docs/demos/Dashboard/examples/Dashboard.md +51 -35
  233. package/docs/demos/DataList/examples/DataList.md +160 -111
  234. package/docs/demos/DescriptionList/examples/DescriptionList.md +33 -22
  235. package/docs/demos/Drawer/examples/Drawer.md +24 -22
  236. package/docs/demos/Form/examples/BasicForms.md +28 -22
  237. package/docs/demos/HelperText/examples/HelperText.md +8 -9
  238. package/docs/demos/JumpLinks/examples/JumpLinks.md +28 -28
  239. package/docs/demos/Masthead/examples/Masthead.md +32 -35
  240. package/docs/demos/Modal/examples/Modal.md +54 -66
  241. package/docs/demos/Nav/examples/Nav.md +47 -47
  242. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +40 -28
  243. package/docs/demos/Page/examples/Page.md +37 -37
  244. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +32 -33
  245. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +83 -67
  246. package/docs/demos/Skeleton/examples/Skeleton.md +4 -4
  247. package/docs/demos/Table/examples/Table.md +2465 -478
  248. package/docs/demos/Tabs/examples/Tabs.md +141 -90
  249. package/docs/demos/Toolbar/examples/Toolbar.md +1811 -177
  250. package/docs/demos/Wizard/examples/Wizard.md +289 -266
  251. package/docs/layouts/Bullseye/examples/Bullseye.md +4 -4
  252. package/docs/layouts/Flex/examples/Flex.md +98 -98
  253. package/docs/layouts/Gallery/examples/Gallery.md +7 -7
  254. package/docs/layouts/Grid/examples/Grid.md +9 -9
  255. package/docs/layouts/Level/examples/Level.md +5 -5
  256. package/docs/layouts/Split/examples/Split.md +7 -7
  257. package/docs/layouts/Stack/examples/Stack.md +6 -6
  258. package/docs/utilities/Accessibility/examples/Accessibility.md +4 -4
  259. package/docs/utilities/Alignment/examples/Alignment.md +6 -6
  260. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +12 -12
  261. package/docs/utilities/BoxShadow/examples/box-shadow.md +22 -22
  262. package/docs/utilities/Display/examples/Display.md +11 -11
  263. package/docs/utilities/Flex/examples/Flex.md +34 -34
  264. package/docs/utilities/Float/examples/Float.md +4 -4
  265. package/docs/utilities/Sizing/examples/Sizing.md +50 -50
  266. package/docs/utilities/Spacing/examples/Spacing.md +34 -34
  267. package/docs/utilities/Text/examples/Text.md +27 -27
  268. package/icons/{pf-icons.json → pf-icons.mjs} +2 -1
  269. package/layouts/Gallery/gallery.css +1 -1
  270. package/layouts/Gallery/gallery.scss +1 -1
  271. package/layouts/Grid/grid.css +7 -7
  272. package/layouts/Grid/grid.scss +2 -2
  273. package/package.json +59 -65
  274. package/patternfly-base-no-reset.css +23 -47
  275. package/patternfly-base.css +23 -47
  276. package/patternfly-no-reset.css +770 -652
  277. package/patternfly.css +770 -652
  278. package/patternfly.min.css +1 -1
  279. package/patternfly.min.css.map +1 -1
  280. package/sass-utilities/functions.scss +8 -24
  281. package/sass-utilities/mixins.scss +15 -39
  282. package/sass-utilities/scss-variables.scss +1 -1
  283. package/sass-utilities/themes/dark/scss-variables.scss +1 -1
  284. package/utilities/Spacing/spacing.scss +2 -2
  285. package/base/_shield-inheritable.scss +0 -69
  286. package/base/_shield-noninheritable.scss +0 -13
  287. package/base/patternfly-shield-inheritable.css +0 -66
  288. package/base/patternfly-shield-inheritable.scss +0 -4
  289. package/base/patternfly-shield-noninheritable.css +0 -9
  290. package/base/patternfly-shield-noninheritable.scss +0 -4
@@ -872,21 +872,21 @@ cssPrefix: pf-c-tile
872
872
 
873
873
  ### Accessibility
874
874
 
875
- | Attribute | Applied to | Outcome |
876
- | --------------- | ------------ | ------------------------------------------------------------------------------------- |
877
- | `tabindex="0"` | `.pf-c-tile` | Inserts the tile into the tab order of the page so that it is focusable. **Required** |
878
- | `tabindex="-1"` | `.pf-c-tile` | Removes the tile from keyboard focus when it is disabled. |
875
+ | Attribute | Applied to | Outcome |
876
+ | -- | -- | -- |
877
+ | `tabindex="0"` | `.pf-c-tile` | Inserts the tile into the tab order of the page so that it is focusable. **Required** |
878
+ | `tabindex="-1"` | `.pf-c-tile` | Removes the tile from keyboard focus when it is disabled. |
879
879
 
880
880
  ### Usage
881
881
 
882
- | Class | Applied to | Outcome |
883
- | -------------------- | -------------------- | -------------------------------------------------- |
884
- | `.pf-c-tile` | `<div>` | Initiates a tile. **Required** |
885
- | `.pf-c-tile__header` | `<div>` | Initiates the tile header. |
886
- | `.pf-c-tile__title` | `<div>` | Initiates the tile title. |
887
- | `.pf-c-tile__icon` | `<div>` | Initiates the tile icon or image. |
888
- | `.pf-c-tile__body` | `<div>` | Initiates the tile body. |
889
- | `.pf-m-selected` | `.pf-c-tile` | Modifies the tile for the selected state. |
890
- | `.pf-m-disabled` | `.pf-c-tile` | Modifies the tile for the disabled state. |
891
- | `.pf-m-stacked` | `.pf-c-tile__header` | Modifies the tile header to be stacked vertically. |
892
- | `.pf-m-display-lg` | `.pf-c-tile` | Modifies the tile to have large display styling. |
882
+ | Class | Applied to | Outcome |
883
+ | -- | -- | -- |
884
+ | `.pf-c-tile` | `<div>` | Initiates a tile. **Required** |
885
+ | `.pf-c-tile__header` | `<div>` | Initiates the tile header. |
886
+ | `.pf-c-tile__title` | `<div>` | Initiates the tile title. |
887
+ | `.pf-c-tile__icon` | `<div>` | Initiates the tile icon or image. |
888
+ | `.pf-c-tile__body` | `<div>` | Initiates the tile body. |
889
+ | `.pf-m-selected` | `.pf-c-tile` | Modifies the tile for the selected state. |
890
+ | `.pf-m-disabled` | `.pf-c-tile` | Modifies the tile for the disabled state. |
891
+ | `.pf-m-stacked` | `.pf-c-tile__header` | Modifies the tile header to be stacked vertically. |
892
+ | `.pf-m-display-lg` | `.pf-c-tile` | Modifies the tile to have large display styling. |
@@ -55,8 +55,8 @@ cssPrefix: pf-c-timestamp
55
55
 
56
56
  ### Usage
57
57
 
58
- | Class | Applied to | Outcome |
59
- | ----------------------- | ----------------- | ------------------------------------------------------ |
60
- | `.pf-c-timestamp` | `<span>` | Creates a timestamp. **Required** |
61
- | `.pf-c-timestamp__text` | `<time>` | Creates the visual text of the timestamp. **Required** |
62
- | `.pf-m-help-text` | `.pf-c-timestamp` | Modifies styling for a timestamp that has help text. |
58
+ | Class | Applied to | Outcome |
59
+ | -- | -- | -- |
60
+ | `.pf-c-timestamp` | `<span>` | Creates a timestamp. **Required** |
61
+ | `.pf-c-timestamp__text` | `<time>` | Creates the visual text of the timestamp. **Required** |
62
+ | `.pf-m-help-text`| `.pf-c-timestamp` | Modifies styling for a timestamp that has help text. |
@@ -24,23 +24,23 @@ The title component styles font-size, font-weight, and line-height to titles.
24
24
 
25
25
  The content component defines margin on headers. To regain the same spacing use, spacer utility classes:
26
26
 
27
- | Title | Margin top | Margin bottom |
28
- | ----- | ------------- | ------------- |
29
- | 4xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
30
- | 3xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
31
- | 2xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
32
- | xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
33
- | lg | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
34
- | md | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
27
+ | Title | Margin top | Margin bottom |
28
+ | -- | -- | -- |
29
+ | 4xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
30
+ | 3xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
31
+ | 2xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
32
+ | xl | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
33
+ | lg | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
34
+ | md | `.pf-u-mt-lg` | `.pf-u-mb-sm` |
35
35
 
36
36
  ### Usage
37
37
 
38
- | Class | Applied | Outcome |
39
- | ------------- | ------------- | ------------------------------------------------------- |
40
- | `.pf-c-title` | `*` | Initiates a title. Always use it with a modifier class. |
41
- | `.pf-m-4xl` | `.pf-c-title` | Modifies for 4xl size |
42
- | `.pf-m-3xl` | `.pf-c-title` | Modifies for 3xl size |
43
- | `.pf-m-2xl` | `.pf-c-title` | Modifies for 2xl size |
44
- | `.pf-m-xl` | `.pf-c-title` | Modifies for xl size |
45
- | `.pf-m-lg` | `.pf-c-title` | Modifies for lg size |
46
- | `.pf-m-md` | `.pf-c-title` | Modifies for md size |
38
+ | Class | Applied | Outcome |
39
+ | -- | -- | -- |
40
+ | `.pf-c-title` | `*` | Initiates a title. Always use it with a modifier class. |
41
+ | `.pf-m-4xl` | `.pf-c-title` | Modifies for 4xl size |
42
+ | `.pf-m-3xl` | `.pf-c-title` | Modifies for 3xl size |
43
+ | `.pf-m-2xl` | `.pf-c-title` | Modifies for 2xl size |
44
+ | `.pf-m-xl` | `.pf-c-title` | Modifies for xl size |
45
+ | `.pf-m-lg` | `.pf-c-title` | Modifies for lg size |
46
+ | `.pf-m-md` | `.pf-c-title` | Modifies for md size |
@@ -319,19 +319,19 @@ cssPrefix: pf-c-toggle-group
319
319
 
320
320
  ### Accessibility
321
321
 
322
- | Attribute | Applied to | Outcome |
323
- | ---------------------------------- | ---------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
324
- | `aria-label="[button label text]"` | `.pf-c-toggle-group__button` | Provides an accessible name for the button when an icon is used instead of text. **Required when icon is used with no supporting text** |
325
- | `disabled` | `.pf-c-toggle-group__button` | When a button element is used, indicates that it is unavailable and removes it from keyboard focus. **Required when button is disabled** |
322
+ | Attribute | Applied to | Outcome |
323
+ | -- | -- | -- |
324
+ | `aria-label="[button label text]"` | `.pf-c-toggle-group__button` | Provides an accessible name for the button when an icon is used instead of text. **Required when icon is used with no supporting text** |
325
+ | `disabled` | `.pf-c-toggle-group__button` | When a button element is used, indicates that it is unavailable and removes it from keyboard focus. **Required when button is disabled** |
326
326
 
327
327
  ### Usage
328
328
 
329
- | Class | Applied to | Outcome |
330
- | ---------------------------- | ---------------------------- | --------------------------------------------------------------- |
331
- | `.pf-c-toggle-group` | `<div>` | Initiates the toggle group. **Required** |
332
- | `.pf-c-toggle-group__button` | `<button>` | Initiates the toggle group button. **Required** |
333
- | `.pf-c-toggle-group__item` | `<div>` | Initiates the toggle group item wrapper. **Required** |
334
- | `.pf-c-toggle-group__text` | `<span>` | Initiates the toggle button text element. |
335
- | `.pf-c-toggle-group__icon` | `<span>` | Initiates the toggle button icon element. |
336
- | `.pf-m-compact` | `.pf-c-toggle-group` | Modifies the toggle group for compact styles. |
337
- | `.pf-m-selected` | `.pf-c-toggle-group__button` | Modifies the toggle button group button for the selected state. |
329
+ | Class | Applied to | Outcome |
330
+ | -- | -- | -- |
331
+ | `.pf-c-toggle-group` | `<div>` | Initiates the toggle group. **Required** |
332
+ | `.pf-c-toggle-group__button` | `<button>` | Initiates the toggle group button. **Required** |
333
+ | `.pf-c-toggle-group__item` | `<div>` | Initiates the toggle group item wrapper. **Required** |
334
+ | `.pf-c-toggle-group__text` | `<span>` | Initiates the toggle button text element. |
335
+ | `.pf-c-toggle-group__icon` | `<span>` | Initiates the toggle button icon element. |
336
+ | `.pf-m-compact` | `.pf-c-toggle-group` | Modifies the toggle group for compact styles. |
337
+ | `.pf-m-selected` | `.pf-c-toggle-group__button` | Modifies the toggle button group button for the selected state. |