@patternfly/patternfly 6.0.0-alpha.90 → 6.0.0-alpha.92

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 (259) hide show
  1. package/base/patternfly-common.css +10 -10
  2. package/base/patternfly-globals.css +3 -3
  3. package/base/patternfly-icons.css +1 -1
  4. package/base/patternfly-themes.css +53 -53
  5. package/base/patternfly-variables.css +236 -245
  6. package/base/tokens/_tokens-font.scss +0 -11
  7. package/components/AboutModalBox/about-modal-box.css +102 -102
  8. package/components/Accordion/accordion.css +118 -118
  9. package/components/ActionList/action-list.css +16 -16
  10. package/components/Alert/alert-group.css +50 -50
  11. package/components/Alert/alert.css +161 -161
  12. package/components/AppLauncher/app-launcher.css +167 -167
  13. package/components/Avatar/avatar.css +116 -116
  14. package/components/BackToTop/back-to-top.css +21 -21
  15. package/components/Backdrop/backdrop.css +9 -9
  16. package/components/BackgroundImage/background-image.css +15 -15
  17. package/components/Badge/badge.css +35 -35
  18. package/components/Banner/banner.css +114 -114
  19. package/components/Brand/brand.css +28 -28
  20. package/components/Breadcrumb/breadcrumb.css +62 -62
  21. package/components/Button/button.css +514 -514
  22. package/components/CalendarMonth/calendar-month.css +144 -144
  23. package/components/Card/card.css +230 -230
  24. package/components/Check/check.css +43 -43
  25. package/components/Chip/chip-group.css +60 -60
  26. package/components/Chip/chip.css +83 -83
  27. package/components/ClipboardCopy/clipboard-copy.css +71 -71
  28. package/components/CodeBlock/code-block.css +35 -35
  29. package/components/CodeEditor/code-editor.css +121 -121
  30. package/components/Content/content.css +216 -216
  31. package/components/ContextSelector/context-selector.css +251 -251
  32. package/components/DataList/data-list-grid.css +182 -182
  33. package/components/DataList/data-list.css +468 -468
  34. package/components/DatePicker/date-picker.css +35 -35
  35. package/components/DescriptionList/description-list-order.css +90 -90
  36. package/components/DescriptionList/description-list.css +193 -193
  37. package/components/Divider/divider.css +143 -143
  38. package/components/DragDrop/drag-drop.css +46 -46
  39. package/components/Drawer/drawer.css +474 -474
  40. package/components/Dropdown/dropdown.css +457 -457
  41. package/components/DualListSelector/dual-list-selector.css +199 -199
  42. package/components/EmptyState/empty-state.css +104 -104
  43. package/components/ExpandableSection/expandable-section.css +113 -113
  44. package/components/FileUpload/file-upload.css +32 -32
  45. package/components/Form/form.css +281 -281
  46. package/components/FormControl/form-control.css +197 -197
  47. package/components/HelperText/helper-text.css +51 -51
  48. package/components/Hint/hint.css +46 -46
  49. package/components/Icon/icon.css +218 -218
  50. package/components/InlineEdit/inline-edit.css +43 -43
  51. package/components/InputGroup/input-group.css +52 -52
  52. package/components/JumpLinks/jump-links.css +183 -183
  53. package/components/Label/label-group.css +86 -86
  54. package/components/Label/label.css +438 -438
  55. package/components/List/list.css +53 -53
  56. package/components/LogViewer/log-viewer.css +138 -138
  57. package/components/Login/login.css +139 -139
  58. package/components/Masthead/masthead.css +319 -319
  59. package/components/Menu/menu.css +415 -415
  60. package/components/MenuToggle/menu-toggle.css +275 -275
  61. package/components/ModalBox/modal-box.css +121 -121
  62. package/components/MultipleFileUpload/multiple-file-upload.css +163 -163
  63. package/components/Nav/nav.css +225 -225
  64. package/components/NotificationBadge/notification-badge.css +66 -66
  65. package/components/NotificationDrawer/notification-drawer.css +179 -179
  66. package/components/NumberInput/number-input.css +20 -20
  67. package/components/OptionsMenu/options-menu.css +190 -190
  68. package/components/OverflowMenu/overflow-menu.css +19 -19
  69. package/components/Page/page.css +598 -598
  70. package/components/Pagination/pagination.css +220 -220
  71. package/components/Panel/panel.css +72 -72
  72. package/components/Popover/popover.css +148 -148
  73. package/components/Progress/progress.css +80 -80
  74. package/components/ProgressStepper/progress-stepper.css +514 -514
  75. package/components/Radio/radio.css +44 -44
  76. package/components/Select/select.css +423 -423
  77. package/components/Sidebar/sidebar.css +166 -166
  78. package/components/SimpleList/simple-list.css +53 -53
  79. package/components/Skeleton/skeleton.css +112 -112
  80. package/components/SkipToContent/skip-to-content.css +8 -8
  81. package/components/Slider/slider.css +144 -144
  82. package/components/Spinner/spinner.css +36 -36
  83. package/components/Switch/switch.css +89 -89
  84. package/components/TabContent/tab-content.css +34 -34
  85. package/components/Table/table-grid.css +911 -911
  86. package/components/Table/table-scrollable.css +38 -38
  87. package/components/Table/table-tree-view.css +497 -497
  88. package/components/Table/table.css +660 -660
  89. package/components/Tabs/tabs.css +616 -616
  90. package/components/TextInputGroup/text-input-group.css +88 -88
  91. package/components/Tile/tile.css +68 -68
  92. package/components/Timestamp/timestamp.css +29 -29
  93. package/components/Title/title.css +87 -87
  94. package/components/ToggleGroup/toggle-group.css +86 -86
  95. package/components/Toolbar/toolbar.css +2279 -2279
  96. package/components/Tooltip/tooltip.css +85 -85
  97. package/components/TreeView/tree-view.css +363 -363
  98. package/components/Truncate/truncate.css +15 -15
  99. package/components/Wizard/wizard.css +272 -272
  100. package/docs/components/AboutModalBox/examples/AboutModalBox.md +11 -11
  101. package/docs/components/Accordion/examples/Accordion.md +188 -188
  102. package/docs/components/ActionList/examples/ActionList.md +55 -55
  103. package/docs/components/Alert/examples/Alert.md +222 -222
  104. package/docs/components/AppLauncher/deprecated/application-launcher.md +146 -146
  105. package/docs/components/Avatar/examples/Avatar.md +6 -6
  106. package/docs/components/BackToTop/examples/BackToTop.md +3 -3
  107. package/docs/components/Backdrop/examples/Backdrop.md +1 -1
  108. package/docs/components/BackgroundImage/examples/BackgroundImage.md +2 -2
  109. package/docs/components/Badge/examples/Badge.md +17 -17
  110. package/docs/components/Banner/examples/Banner.md +42 -42
  111. package/docs/components/Brand/examples/Brand.md +4 -4
  112. package/docs/components/Breadcrumb/examples/Breadcrumb.md +90 -90
  113. package/docs/components/Button/examples/Button.md +364 -364
  114. package/docs/components/CalendarMonth/examples/CalendarMonth.md +436 -436
  115. package/docs/components/Card/examples/Card.md +515 -515
  116. package/docs/components/Check/examples/Check.md +37 -37
  117. package/docs/components/Chip/examples/Chip.md +216 -216
  118. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +82 -82
  119. package/docs/components/CodeBlock/examples/CodeBlock.md +39 -39
  120. package/docs/components/CodeEditor/examples/CodeEditor.md +85 -85
  121. package/docs/components/Content/examples/Content.md +1 -1
  122. package/docs/components/ContextSelector/deprecated/context-selector.md +160 -160
  123. package/docs/components/DataList/examples/DataList.md +666 -666
  124. package/docs/components/DatePicker/examples/DatePicker.md +54 -54
  125. package/docs/components/DescriptionList/examples/DescriptionList.md +737 -737
  126. package/docs/components/Divider/examples/Divider.md +18 -18
  127. package/docs/components/DragDrop/examples/DragDrop.md +27 -27
  128. package/docs/components/Drawer/examples/Drawer.md +225 -225
  129. package/docs/components/Dropdown/deprecated/Dropdown.md +541 -541
  130. package/docs/components/DualListSelector/examples/DualListSelector.md +1012 -1012
  131. package/docs/components/EmptyState/examples/EmptyState.md +100 -100
  132. package/docs/components/ExpandableSection/examples/ExpandableSection.md +47 -47
  133. package/docs/components/FileUpload/examples/FileUpload.md +94 -94
  134. package/docs/components/Form/examples/Form.md +226 -226
  135. package/docs/components/FormControl/examples/FormControl.md +65 -65
  136. package/docs/components/HelperText/examples/HelperText.md +72 -72
  137. package/docs/components/Hint/examples/Hint.md +44 -44
  138. package/docs/components/Icon/examples/Icon.md +85 -85
  139. package/docs/components/InlineEdit/examples/InlineEdit.md +209 -209
  140. package/docs/components/InputGroup/examples/InputGroup.md +73 -73
  141. package/docs/components/JumpLinks/examples/JumpLinks.md +285 -285
  142. package/docs/components/Label/examples/Label.md +1717 -1717
  143. package/docs/components/List/examples/List.md +30 -30
  144. package/docs/components/LogViewer/examples/LogViewer.md +1785 -1785
  145. package/docs/components/Login/examples/Login.md +287 -287
  146. package/docs/components/Masthead/examples/masthead.md +39 -39
  147. package/docs/components/Menu/examples/Menu.md +2377 -2377
  148. package/docs/components/MenuToggle/examples/MenuToggle.md +242 -242
  149. package/docs/components/ModalBox/examples/ModalBox.md +119 -119
  150. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +192 -192
  151. package/docs/components/Nav/examples/Navigation.md +856 -856
  152. package/docs/components/NotificationBadge/examples/NotificationBadge.md +42 -42
  153. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +659 -659
  154. package/docs/components/NumberInput/examples/NumberInput.md +127 -127
  155. package/docs/components/OptionsMenu/deprecated/options-menu.md +178 -178
  156. package/docs/components/OverflowMenu/examples/overflow-menu.md +97 -97
  157. package/docs/components/Page/deprecated/PageHeader.md +85 -85
  158. package/docs/components/Page/examples/Page.md +90 -90
  159. package/docs/components/Pagination/examples/Pagination.md +285 -285
  160. package/docs/components/Panel/examples/Panel.md +38 -38
  161. package/docs/components/Popover/examples/Popover.md +169 -169
  162. package/docs/components/Progress/examples/Progress.md +145 -145
  163. package/docs/components/ProgressStepper/examples/ProgressStepper.md +295 -295
  164. package/docs/components/Radio/examples/Radio.md +33 -33
  165. package/docs/components/Select/deprecated/Select.md +736 -736
  166. package/docs/components/Sidebar/examples/Sidebar.md +65 -65
  167. package/docs/components/SimpleList/examples/SimpleList.md +39 -39
  168. package/docs/components/Skeleton/examples/Skeleton.md +29 -29
  169. package/docs/components/SkipToContent/examples/SkipToContent.md +3 -3
  170. package/docs/components/Slider/examples/Slider.md +213 -213
  171. package/docs/components/Spinner/examples/Spinner.md +14 -14
  172. package/docs/components/Switch/examples/Switch.md +58 -58
  173. package/docs/components/TabContent/examples/TabContent.md +24 -24
  174. package/docs/components/Table/examples/Table.md +6982 -6982
  175. package/docs/components/Tabs/examples/Tabs.md +2114 -2114
  176. package/docs/components/TextInputGroup/examples/TextInputGroup.md +373 -373
  177. package/docs/components/Tile/examples/Tile.md +131 -131
  178. package/docs/components/Timestamp/examples/Timestamp.md +10 -10
  179. package/docs/components/Title/examples/Title.md +12 -12
  180. package/docs/components/ToggleGroup/examples/toggle-group.md +116 -116
  181. package/docs/components/Toolbar/examples/Toolbar.md +611 -611
  182. package/docs/components/Tooltip/examples/Tooltip.md +27 -27
  183. package/docs/components/TreeView/examples/TreeView.md +1166 -1166
  184. package/docs/components/Truncate/examples/Truncate.md +7 -7
  185. package/docs/components/Wizard/examples/Wizard.md +522 -522
  186. package/docs/demos/AboutModal/examples/AboutModal.md +106 -106
  187. package/docs/demos/Alert/examples/Alert.md +391 -391
  188. package/docs/demos/BackToTop/examples/BackToTop.md +175 -175
  189. package/docs/demos/Banner/examples/Banner.md +364 -364
  190. package/docs/demos/Button/examples/Button.md +50 -50
  191. package/docs/demos/Card/examples/Card.md +1054 -1054
  192. package/docs/demos/CardView/examples/CardView.md +378 -378
  193. package/docs/demos/ContextSelector/examples/ContextSelector.md +449 -449
  194. package/docs/demos/Dashboard/examples/Dashboard.md +541 -541
  195. package/docs/demos/DataList/examples/DataList.md +1148 -1148
  196. package/docs/demos/DescriptionList/examples/DescriptionList.md +544 -544
  197. package/docs/demos/Drawer/examples/Drawer.md +531 -531
  198. package/docs/demos/Form/examples/BasicForms.md +444 -444
  199. package/docs/demos/HelperText/examples/HelperText.md +51 -51
  200. package/docs/demos/JumpLinks/examples/JumpLinks.md +596 -596
  201. package/docs/demos/Masthead/examples/Masthead.md +763 -763
  202. package/docs/demos/Modal/examples/Modal.md +645 -645
  203. package/docs/demos/Nav/examples/Nav.md +649 -649
  204. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +1570 -1570
  205. package/docs/demos/Page/examples/Page.md +1330 -1330
  206. package/docs/demos/Page/examples/Penta.md +217 -217
  207. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +23 -23
  208. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +108 -108
  209. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +1890 -1890
  210. package/docs/demos/Skeleton/examples/Skeleton.md +176 -176
  211. package/docs/demos/Table/examples/Table.md +4580 -4580
  212. package/docs/demos/Tabs/examples/Tabs.md +1040 -1040
  213. package/docs/demos/Toolbar/examples/Toolbar.md +961 -961
  214. package/docs/demos/Wizard/examples/Wizard.md +1574 -1574
  215. package/docs/layouts/Bullseye/examples/Bullseye.md +2 -2
  216. package/docs/layouts/Flex/examples/Flex.md +290 -290
  217. package/docs/layouts/Gallery/examples/Gallery.md +48 -48
  218. package/docs/layouts/Grid/examples/Grid.md +121 -121
  219. package/docs/layouts/Level/examples/Level.md +11 -11
  220. package/docs/layouts/Split/examples/Split.md +23 -23
  221. package/docs/layouts/Stack/examples/Stack.md +8 -8
  222. package/docs/utilities/Accessibility/examples/Accessibility.md +3 -3
  223. package/docs/utilities/Alignment/examples/Alignment.md +4 -4
  224. package/docs/utilities/Display/examples/Display.md +16 -16
  225. package/docs/utilities/Flex/examples/Flex.md +53 -53
  226. package/docs/utilities/Float/examples/Float.md +2 -2
  227. package/docs/utilities/Spacing/examples/Spacing.md +16 -16
  228. package/layouts/Bullseye/bullseye.css +3 -3
  229. package/layouts/Flex/flex.css +1276 -1276
  230. package/layouts/Gallery/gallery.css +34 -34
  231. package/layouts/Grid/grid.css +531 -531
  232. package/layouts/Level/level.css +4 -4
  233. package/layouts/Split/split.css +6 -6
  234. package/layouts/Stack/stack.css +5 -5
  235. package/package.json +5 -5
  236. package/patternfly-addons.css +2989 -2989
  237. package/patternfly-base-no-globals-theme-dark-unversioned.css +269 -278
  238. package/patternfly-base-no-globals.css +284 -293
  239. package/patternfly-base-theme-dark-unversioned.css +271 -280
  240. package/patternfly-base.css +286 -295
  241. package/patternfly-charts-theme-dark-unversioned.css +66 -66
  242. package/patternfly-charts-theme-dark.css +66 -66
  243. package/patternfly-charts.css +320 -320
  244. package/patternfly-no-globals.css +20217 -20226
  245. package/patternfly-theme-dark-unversioned.css +20209 -20218
  246. package/patternfly.css +20219 -20228
  247. package/patternfly.min.css +1 -1
  248. package/patternfly.min.css.map +1 -1
  249. package/sass-utilities/_init.scss +1 -1
  250. package/utilities/Accessibility/accessibility.css +18 -18
  251. package/utilities/Alignment/alignment.css +24 -24
  252. package/utilities/BackgroundColor/BackgroundColor.css +252 -252
  253. package/utilities/BoxShadow/box-shadow.css +42 -42
  254. package/utilities/Display/display.css +54 -54
  255. package/utilities/Flex/flex.css +228 -228
  256. package/utilities/Float/float.css +12 -12
  257. package/utilities/Sizing/sizing.css +216 -216
  258. package/utilities/Spacing/spacing.css +1512 -1512
  259. package/utilities/Text/text.css +631 -631
package/docs/components/Accordion/examples/Accordion.md CHANGED
@@ -7,108 +7,108 @@ cssPrefix: pf-v5-c-accordion
7
7
  ### Fluid
8
8
 
9
9
  ```html
10
- <div class="pf-v5-c-accordion">
11
- <div class="pf-v5-c-accordion__item">
10
+ <div class="pf-v6-c-accordion">
11
+ <div class="pf-v6-c-accordion__item">
12
12
  <h3>
13
13
  <button
14
- class="pf-v5-c-accordion__toggle"
14
+ class="pf-v6-c-accordion__toggle"
15
15
  type="button"
16
16
  aria-expanded="false"
17
17
  >
18
- <span class="pf-v5-c-accordion__toggle-text">Item one</span>
18
+ <span class="pf-v6-c-accordion__toggle-text">Item one</span>
19
19
 
20
- <span class="pf-v5-c-accordion__toggle-icon">
20
+ <span class="pf-v6-c-accordion__toggle-icon">
21
21
  <i class="fas fa-angle-right" aria-hidden="true"></i>
22
22
  </span>
23
23
  </button>
24
24
  </h3>
25
- <div class="pf-v5-c-accordion__expandable-content" hidden>
25
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
26
26
  <div
27
- class="pf-v5-c-accordion__expandable-content-body"
27
+ class="pf-v6-c-accordion__expandable-content-body"
28
28
  >This text is hidden</div>
29
29
  </div>
30
30
  </div>
31
31
 
32
- <div class="pf-v5-c-accordion__item">
32
+ <div class="pf-v6-c-accordion__item">
33
33
  <h3>
34
34
  <button
35
- class="pf-v5-c-accordion__toggle"
35
+ class="pf-v6-c-accordion__toggle"
36
36
  type="button"
37
37
  aria-expanded="false"
38
38
  >
39
- <span class="pf-v5-c-accordion__toggle-text">Item two</span>
39
+ <span class="pf-v6-c-accordion__toggle-text">Item two</span>
40
40
 
41
- <span class="pf-v5-c-accordion__toggle-icon">
41
+ <span class="pf-v6-c-accordion__toggle-icon">
42
42
  <i class="fas fa-angle-right" aria-hidden="true"></i>
43
43
  </span>
44
44
  </button>
45
45
  </h3>
46
- <div class="pf-v5-c-accordion__expandable-content" hidden>
46
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
47
47
  <div
48
- class="pf-v5-c-accordion__expandable-content-body"
48
+ class="pf-v6-c-accordion__expandable-content-body"
49
49
  >This text is hidden</div>
50
50
  </div>
51
51
  </div>
52
52
 
53
- <div class="pf-v5-c-accordion__item">
53
+ <div class="pf-v6-c-accordion__item">
54
54
  <h3>
55
55
  <button
56
- class="pf-v5-c-accordion__toggle"
56
+ class="pf-v6-c-accordion__toggle"
57
57
  type="button"
58
58
  aria-expanded="false"
59
59
  >
60
- <span class="pf-v5-c-accordion__toggle-text">Item three</span>
60
+ <span class="pf-v6-c-accordion__toggle-text">Item three</span>
61
61
 
62
- <span class="pf-v5-c-accordion__toggle-icon">
62
+ <span class="pf-v6-c-accordion__toggle-icon">
63
63
  <i class="fas fa-angle-right" aria-hidden="true"></i>
64
64
  </span>
65
65
  </button>
66
66
  </h3>
67
- <div class="pf-v5-c-accordion__expandable-content" hidden>
67
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
68
68
  <div
69
- class="pf-v5-c-accordion__expandable-content-body"
69
+ class="pf-v6-c-accordion__expandable-content-body"
70
70
  >This text is hidden</div>
71
71
  </div>
72
72
  </div>
73
73
 
74
- <div class="pf-v5-c-accordion__item pf-m-expanded">
74
+ <div class="pf-v6-c-accordion__item pf-m-expanded">
75
75
  <h3>
76
76
  <button
77
- class="pf-v5-c-accordion__toggle"
77
+ class="pf-v6-c-accordion__toggle"
78
78
  type="button"
79
79
  aria-expanded="true"
80
80
  >
81
- <span class="pf-v5-c-accordion__toggle-text">Item four</span>
81
+ <span class="pf-v6-c-accordion__toggle-text">Item four</span>
82
82
 
83
- <span class="pf-v5-c-accordion__toggle-icon">
83
+ <span class="pf-v6-c-accordion__toggle-icon">
84
84
  <i class="fas fa-angle-right" aria-hidden="true"></i>
85
85
  </span>
86
86
  </button>
87
87
  </h3>
88
- <div class="pf-v5-c-accordion__expandable-content">
88
+ <div class="pf-v6-c-accordion__expandable-content">
89
89
  <div
90
- class="pf-v5-c-accordion__expandable-content-body"
90
+ class="pf-v6-c-accordion__expandable-content-body"
91
91
  >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie lorem lacinia dolor aliquet faucibus. Suspendisse gravida imperdiet accumsan. Aenean auctor lorem justo, vitae tincidunt enim blandit vel. Aenean quis tempus dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
92
92
  </div>
93
93
  </div>
94
94
 
95
- <div class="pf-v5-c-accordion__item">
95
+ <div class="pf-v6-c-accordion__item">
96
96
  <h3>
97
97
  <button
98
- class="pf-v5-c-accordion__toggle"
98
+ class="pf-v6-c-accordion__toggle"
99
99
  type="button"
100
100
  aria-expanded="false"
101
101
  >
102
- <span class="pf-v5-c-accordion__toggle-text">Item five</span>
102
+ <span class="pf-v6-c-accordion__toggle-text">Item five</span>
103
103
 
104
- <span class="pf-v5-c-accordion__toggle-icon">
104
+ <span class="pf-v6-c-accordion__toggle-icon">
105
105
  <i class="fas fa-angle-right" aria-hidden="true"></i>
106
106
  </span>
107
107
  </button>
108
108
  </h3>
109
- <div class="pf-v5-c-accordion__expandable-content" hidden>
109
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
110
110
  <div
111
- class="pf-v5-c-accordion__expandable-content-body"
111
+ class="pf-v6-c-accordion__expandable-content-body"
112
112
  >This text is hidden</div>
113
113
  </div>
114
114
  </div>
@@ -119,120 +119,120 @@ cssPrefix: pf-v5-c-accordion
119
119
  ### Fixed
120
120
 
121
121
  ```html
122
- <div class="pf-v5-c-accordion">
123
- <div class="pf-v5-c-accordion__item">
122
+ <div class="pf-v6-c-accordion">
123
+ <div class="pf-v6-c-accordion__item">
124
124
  <h3>
125
125
  <button
126
- class="pf-v5-c-accordion__toggle"
126
+ class="pf-v6-c-accordion__toggle"
127
127
  type="button"
128
128
  aria-expanded="false"
129
129
  >
130
- <span class="pf-v5-c-accordion__toggle-text">Item one</span>
130
+ <span class="pf-v6-c-accordion__toggle-text">Item one</span>
131
131
 
132
- <span class="pf-v5-c-accordion__toggle-icon">
132
+ <span class="pf-v6-c-accordion__toggle-icon">
133
133
  <i class="fas fa-angle-right" aria-hidden="true"></i>
134
134
  </span>
135
135
  </button>
136
136
  </h3>
137
- <div class="pf-v5-c-accordion__expandable-content" hidden>
137
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
138
138
  <div
139
- class="pf-v5-c-accordion__expandable-content-body"
139
+ class="pf-v6-c-accordion__expandable-content-body"
140
140
  >This text is hidden</div>
141
141
  </div>
142
142
  </div>
143
143
 
144
- <div class="pf-v5-c-accordion__item pf-m-expanded">
144
+ <div class="pf-v6-c-accordion__item pf-m-expanded">
145
145
  <h3>
146
146
  <button
147
- class="pf-v5-c-accordion__toggle"
147
+ class="pf-v6-c-accordion__toggle"
148
148
  type="button"
149
149
  aria-expanded="true"
150
150
  id="accordion-fixed-item-two-toggle"
151
151
  >
152
- <span class="pf-v5-c-accordion__toggle-text">Item two</span>
152
+ <span class="pf-v6-c-accordion__toggle-text">Item two</span>
153
153
 
154
- <span class="pf-v5-c-accordion__toggle-icon">
154
+ <span class="pf-v6-c-accordion__toggle-icon">
155
155
  <i class="fas fa-angle-right" aria-hidden="true"></i>
156
156
  </span>
157
157
  </button>
158
158
  </h3>
159
159
  <div
160
- class="pf-v5-c-accordion__expandable-content pf-m-fixed"
160
+ class="pf-v6-c-accordion__expandable-content pf-m-fixed"
161
161
  role="region"
162
162
  tabindex="0"
163
163
  aria-labelledby="accordion-fixed-item-two-toggle"
164
164
  >
165
165
  <div
166
- class="pf-v5-c-accordion__expandable-content-body"
166
+ class="pf-v6-c-accordion__expandable-content-body"
167
167
  >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie lorem lacinia dolor aliquet faucibus. Suspendisse gravida imperdiet accumsan. Aenean auctor lorem justo, vitae tincidunt enim blandit vel. Aenean quis tempus dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
168
168
  <div
169
- class="pf-v5-c-accordion__expandable-content-body"
169
+ class="pf-v6-c-accordion__expandable-content-body"
170
170
  >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie lorem lacinia dolor aliquet faucibus. Suspendisse gravida imperdiet accumsan. Aenean auctor lorem justo, vitae tincidunt enim blandit vel. Aenean quis tempus dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
171
171
  <div
172
- class="pf-v5-c-accordion__expandable-content-body"
172
+ class="pf-v6-c-accordion__expandable-content-body"
173
173
  >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie lorem lacinia dolor aliquet faucibus. Suspendisse gravida imperdiet accumsan. Aenean auctor lorem justo, vitae tincidunt enim blandit vel. Aenean quis tempus dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
174
174
  </div>
175
175
  </div>
176
176
 
177
- <div class="pf-v5-c-accordion__item">
177
+ <div class="pf-v6-c-accordion__item">
178
178
  <h3>
179
179
  <button
180
- class="pf-v5-c-accordion__toggle"
180
+ class="pf-v6-c-accordion__toggle"
181
181
  type="button"
182
182
  aria-expanded="false"
183
183
  >
184
- <span class="pf-v5-c-accordion__toggle-text">Item three</span>
184
+ <span class="pf-v6-c-accordion__toggle-text">Item three</span>
185
185
 
186
- <span class="pf-v5-c-accordion__toggle-icon">
186
+ <span class="pf-v6-c-accordion__toggle-icon">
187
187
  <i class="fas fa-angle-right" aria-hidden="true"></i>
188
188
  </span>
189
189
  </button>
190
190
  </h3>
191
- <div class="pf-v5-c-accordion__expandable-content" hidden>
191
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
192
192
  <div
193
- class="pf-v5-c-accordion__expandable-content-body"
193
+ class="pf-v6-c-accordion__expandable-content-body"
194
194
  >This text is hidden</div>
195
195
  </div>
196
196
  </div>
197
197
 
198
- <div class="pf-v5-c-accordion__item">
198
+ <div class="pf-v6-c-accordion__item">
199
199
  <h3>
200
200
  <button
201
- class="pf-v5-c-accordion__toggle"
201
+ class="pf-v6-c-accordion__toggle"
202
202
  type="button"
203
203
  aria-expanded="false"
204
204
  >
205
- <span class="pf-v5-c-accordion__toggle-text">Item four</span>
205
+ <span class="pf-v6-c-accordion__toggle-text">Item four</span>
206
206
 
207
- <span class="pf-v5-c-accordion__toggle-icon">
207
+ <span class="pf-v6-c-accordion__toggle-icon">
208
208
  <i class="fas fa-angle-right" aria-hidden="true"></i>
209
209
  </span>
210
210
  </button>
211
211
  </h3>
212
- <div class="pf-v5-c-accordion__expandable-content" hidden>
212
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
213
213
  <div
214
- class="pf-v5-c-accordion__expandable-content-body"
214
+ class="pf-v6-c-accordion__expandable-content-body"
215
215
  >This text is hidden</div>
216
216
  </div>
217
217
  </div>
218
218
 
219
- <div class="pf-v5-c-accordion__item">
219
+ <div class="pf-v6-c-accordion__item">
220
220
  <h3>
221
221
  <button
222
- class="pf-v5-c-accordion__toggle"
222
+ class="pf-v6-c-accordion__toggle"
223
223
  type="button"
224
224
  aria-expanded="false"
225
225
  >
226
- <span class="pf-v5-c-accordion__toggle-text">Item five</span>
226
+ <span class="pf-v6-c-accordion__toggle-text">Item five</span>
227
227
 
228
- <span class="pf-v5-c-accordion__toggle-icon">
228
+ <span class="pf-v6-c-accordion__toggle-icon">
229
229
  <i class="fas fa-angle-right" aria-hidden="true"></i>
230
230
  </span>
231
231
  </button>
232
232
  </h3>
233
- <div class="pf-v5-c-accordion__expandable-content" hidden>
233
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
234
234
  <div
235
- class="pf-v5-c-accordion__expandable-content-body"
235
+ class="pf-v6-c-accordion__expandable-content-body"
236
236
  >This text is hidden</div>
237
237
  </div>
238
238
  </div>
@@ -243,108 +243,108 @@ cssPrefix: pf-v5-c-accordion
243
243
  ### Definition list
244
244
 
245
245
  ```html
246
- <dl class="pf-v5-c-accordion">
247
- <div class="pf-v5-c-accordion__item">
246
+ <dl class="pf-v6-c-accordion">
247
+ <div class="pf-v6-c-accordion__item">
248
248
  <dt>
249
249
  <button
250
- class="pf-v5-c-accordion__toggle"
250
+ class="pf-v6-c-accordion__toggle"
251
251
  type="button"
252
252
  aria-expanded="false"
253
253
  >
254
- <span class="pf-v5-c-accordion__toggle-text">Item one</span>
254
+ <span class="pf-v6-c-accordion__toggle-text">Item one</span>
255
255
 
256
- <span class="pf-v5-c-accordion__toggle-icon">
256
+ <span class="pf-v6-c-accordion__toggle-icon">
257
257
  <i class="fas fa-angle-right" aria-hidden="true"></i>
258
258
  </span>
259
259
  </button>
260
260
  </dt>
261
- <dd class="pf-v5-c-accordion__expandable-content" hidden>
261
+ <dd class="pf-v6-c-accordion__expandable-content" hidden>
262
262
  <div
263
- class="pf-v5-c-accordion__expandable-content-body"
263
+ class="pf-v6-c-accordion__expandable-content-body"
264
264
  >This text is hidden</div>
265
265
  </dd>
266
266
  </div>
267
267
 
268
- <div class="pf-v5-c-accordion__item">
268
+ <div class="pf-v6-c-accordion__item">
269
269
  <dt>
270
270
  <button
271
- class="pf-v5-c-accordion__toggle"
271
+ class="pf-v6-c-accordion__toggle"
272
272
  type="button"
273
273
  aria-expanded="false"
274
274
  >
275
- <span class="pf-v5-c-accordion__toggle-text">Item two</span>
275
+ <span class="pf-v6-c-accordion__toggle-text">Item two</span>
276
276
 
277
- <span class="pf-v5-c-accordion__toggle-icon">
277
+ <span class="pf-v6-c-accordion__toggle-icon">
278
278
  <i class="fas fa-angle-right" aria-hidden="true"></i>
279
279
  </span>
280
280
  </button>
281
281
  </dt>
282
- <dd class="pf-v5-c-accordion__expandable-content" hidden>
282
+ <dd class="pf-v6-c-accordion__expandable-content" hidden>
283
283
  <div
284
- class="pf-v5-c-accordion__expandable-content-body"
284
+ class="pf-v6-c-accordion__expandable-content-body"
285
285
  >This text is hidden</div>
286
286
  </dd>
287
287
  </div>
288
288
 
289
- <div class="pf-v5-c-accordion__item">
289
+ <div class="pf-v6-c-accordion__item">
290
290
  <dt>
291
291
  <button
292
- class="pf-v5-c-accordion__toggle"
292
+ class="pf-v6-c-accordion__toggle"
293
293
  type="button"
294
294
  aria-expanded="false"
295
295
  >
296
- <span class="pf-v5-c-accordion__toggle-text">Item three</span>
296
+ <span class="pf-v6-c-accordion__toggle-text">Item three</span>
297
297
 
298
- <span class="pf-v5-c-accordion__toggle-icon">
298
+ <span class="pf-v6-c-accordion__toggle-icon">
299
299
  <i class="fas fa-angle-right" aria-hidden="true"></i>
300
300
  </span>
301
301
  </button>
302
302
  </dt>
303
- <dd class="pf-v5-c-accordion__expandable-content" hidden>
303
+ <dd class="pf-v6-c-accordion__expandable-content" hidden>
304
304
  <div
305
- class="pf-v5-c-accordion__expandable-content-body"
305
+ class="pf-v6-c-accordion__expandable-content-body"
306
306
  >This text is hidden</div>
307
307
  </dd>
308
308
  </div>
309
309
 
310
- <div class="pf-v5-c-accordion__item pf-m-expanded">
310
+ <div class="pf-v6-c-accordion__item pf-m-expanded">
311
311
  <dt>
312
312
  <button
313
- class="pf-v5-c-accordion__toggle"
313
+ class="pf-v6-c-accordion__toggle"
314
314
  type="button"
315
315
  aria-expanded="true"
316
316
  >
317
- <span class="pf-v5-c-accordion__toggle-text">Item four</span>
317
+ <span class="pf-v6-c-accordion__toggle-text">Item four</span>
318
318
 
319
- <span class="pf-v5-c-accordion__toggle-icon">
319
+ <span class="pf-v6-c-accordion__toggle-icon">
320
320
  <i class="fas fa-angle-right" aria-hidden="true"></i>
321
321
  </span>
322
322
  </button>
323
323
  </dt>
324
- <dd class="pf-v5-c-accordion__expandable-content">
324
+ <dd class="pf-v6-c-accordion__expandable-content">
325
325
  <div
326
- class="pf-v5-c-accordion__expandable-content-body"
326
+ class="pf-v6-c-accordion__expandable-content-body"
327
327
  >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie lorem lacinia dolor aliquet faucibus. Suspendisse gravida imperdiet accumsan. Aenean auctor lorem justo, vitae tincidunt enim blandit vel. Aenean quis tempus dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
328
328
  </dd>
329
329
  </div>
330
330
 
331
- <div class="pf-v5-c-accordion__item">
331
+ <div class="pf-v6-c-accordion__item">
332
332
  <dt>
333
333
  <button
334
- class="pf-v5-c-accordion__toggle"
334
+ class="pf-v6-c-accordion__toggle"
335
335
  type="button"
336
336
  aria-expanded="false"
337
337
  >
338
- <span class="pf-v5-c-accordion__toggle-text">Item five</span>
338
+ <span class="pf-v6-c-accordion__toggle-text">Item five</span>
339
339
 
340
- <span class="pf-v5-c-accordion__toggle-icon">
340
+ <span class="pf-v6-c-accordion__toggle-icon">
341
341
  <i class="fas fa-angle-right" aria-hidden="true"></i>
342
342
  </span>
343
343
  </button>
344
344
  </dt>
345
- <dd class="pf-v5-c-accordion__expandable-content" hidden>
345
+ <dd class="pf-v6-c-accordion__expandable-content" hidden>
346
346
  <div
347
- class="pf-v5-c-accordion__expandable-content-body"
347
+ class="pf-v6-c-accordion__expandable-content-body"
348
348
  >This text is hidden</div>
349
349
  </dd>
350
350
  </div>
@@ -355,108 +355,108 @@ cssPrefix: pf-v5-c-accordion
355
355
  ### Bordered
356
356
 
357
357
  ```html
358
- <div class="pf-v5-c-accordion pf-m-bordered">
359
- <div class="pf-v5-c-accordion__item">
358
+ <div class="pf-v6-c-accordion pf-m-bordered">
359
+ <div class="pf-v6-c-accordion__item">
360
360
  <h3>
361
361
  <button
362
- class="pf-v5-c-accordion__toggle"
362
+ class="pf-v6-c-accordion__toggle"
363
363
  type="button"
364
364
  aria-expanded="false"
365
365
  >
366
- <span class="pf-v5-c-accordion__toggle-text">Item one</span>
366
+ <span class="pf-v6-c-accordion__toggle-text">Item one</span>
367
367
 
368
- <span class="pf-v5-c-accordion__toggle-icon">
368
+ <span class="pf-v6-c-accordion__toggle-icon">
369
369
  <i class="fas fa-angle-right" aria-hidden="true"></i>
370
370
  </span>
371
371
  </button>
372
372
  </h3>
373
- <div class="pf-v5-c-accordion__expandable-content" hidden>
373
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
374
374
  <div
375
- class="pf-v5-c-accordion__expandable-content-body"
375
+ class="pf-v6-c-accordion__expandable-content-body"
376
376
  >This text is hidden</div>
377
377
  </div>
378
378
  </div>
379
379
 
380
- <div class="pf-v5-c-accordion__item">
380
+ <div class="pf-v6-c-accordion__item">
381
381
  <h3>
382
382
  <button
383
- class="pf-v5-c-accordion__toggle"
383
+ class="pf-v6-c-accordion__toggle"
384
384
  type="button"
385
385
  aria-expanded="false"
386
386
  >
387
- <span class="pf-v5-c-accordion__toggle-text">Item two</span>
387
+ <span class="pf-v6-c-accordion__toggle-text">Item two</span>
388
388
 
389
- <span class="pf-v5-c-accordion__toggle-icon">
389
+ <span class="pf-v6-c-accordion__toggle-icon">
390
390
  <i class="fas fa-angle-right" aria-hidden="true"></i>
391
391
  </span>
392
392
  </button>
393
393
  </h3>
394
- <div class="pf-v5-c-accordion__expandable-content" hidden>
394
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
395
395
  <div
396
- class="pf-v5-c-accordion__expandable-content-body"
396
+ class="pf-v6-c-accordion__expandable-content-body"
397
397
  >This text is hidden</div>
398
398
  </div>
399
399
  </div>
400
400
 
401
- <div class="pf-v5-c-accordion__item">
401
+ <div class="pf-v6-c-accordion__item">
402
402
  <h3>
403
403
  <button
404
- class="pf-v5-c-accordion__toggle"
404
+ class="pf-v6-c-accordion__toggle"
405
405
  type="button"
406
406
  aria-expanded="false"
407
407
  >
408
- <span class="pf-v5-c-accordion__toggle-text">Item three</span>
408
+ <span class="pf-v6-c-accordion__toggle-text">Item three</span>
409
409
 
410
- <span class="pf-v5-c-accordion__toggle-icon">
410
+ <span class="pf-v6-c-accordion__toggle-icon">
411
411
  <i class="fas fa-angle-right" aria-hidden="true"></i>
412
412
  </span>
413
413
  </button>
414
414
  </h3>
415
- <div class="pf-v5-c-accordion__expandable-content" hidden>
415
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
416
416
  <div
417
- class="pf-v5-c-accordion__expandable-content-body"
417
+ class="pf-v6-c-accordion__expandable-content-body"
418
418
  >This text is hidden</div>
419
419
  </div>
420
420
  </div>
421
421
 
422
- <div class="pf-v5-c-accordion__item pf-m-expanded">
422
+ <div class="pf-v6-c-accordion__item pf-m-expanded">
423
423
  <h3>
424
424
  <button
425
- class="pf-v5-c-accordion__toggle"
425
+ class="pf-v6-c-accordion__toggle"
426
426
  type="button"
427
427
  aria-expanded="true"
428
428
  >
429
- <span class="pf-v5-c-accordion__toggle-text">Item four</span>
429
+ <span class="pf-v6-c-accordion__toggle-text">Item four</span>
430
430
 
431
- <span class="pf-v5-c-accordion__toggle-icon">
431
+ <span class="pf-v6-c-accordion__toggle-icon">
432
432
  <i class="fas fa-angle-right" aria-hidden="true"></i>
433
433
  </span>
434
434
  </button>
435
435
  </h3>
436
- <div class="pf-v5-c-accordion__expandable-content">
436
+ <div class="pf-v6-c-accordion__expandable-content">
437
437
  <div
438
- class="pf-v5-c-accordion__expandable-content-body"
438
+ class="pf-v6-c-accordion__expandable-content-body"
439
439
  >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie lorem lacinia dolor aliquet faucibus. Suspendisse gravida imperdiet accumsan. Aenean auctor lorem justo, vitae tincidunt enim blandit vel. Aenean quis tempus dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
440
440
  </div>
441
441
  </div>
442
442
 
443
- <div class="pf-v5-c-accordion__item">
443
+ <div class="pf-v6-c-accordion__item">
444
444
  <h3>
445
445
  <button
446
- class="pf-v5-c-accordion__toggle"
446
+ class="pf-v6-c-accordion__toggle"
447
447
  type="button"
448
448
  aria-expanded="false"
449
449
  >
450
- <span class="pf-v5-c-accordion__toggle-text">Item five</span>
450
+ <span class="pf-v6-c-accordion__toggle-text">Item five</span>
451
451
 
452
- <span class="pf-v5-c-accordion__toggle-icon">
452
+ <span class="pf-v6-c-accordion__toggle-icon">
453
453
  <i class="fas fa-angle-right" aria-hidden="true"></i>
454
454
  </span>
455
455
  </button>
456
456
  </h3>
457
- <div class="pf-v5-c-accordion__expandable-content" hidden>
457
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
458
458
  <div
459
- class="pf-v5-c-accordion__expandable-content-body"
459
+ class="pf-v6-c-accordion__expandable-content-body"
460
460
  >This text is hidden</div>
461
461
  </div>
462
462
  </div>
@@ -467,108 +467,108 @@ cssPrefix: pf-v5-c-accordion
467
467
  ### Large bordered
468
468
 
469
469
  ```html
470
- <div class="pf-v5-c-accordion pf-m-display-lg pf-m-bordered">
471
- <div class="pf-v5-c-accordion__item">
470
+ <div class="pf-v6-c-accordion pf-m-display-lg pf-m-bordered">
471
+ <div class="pf-v6-c-accordion__item">
472
472
  <h3>
473
473
  <button
474
- class="pf-v5-c-accordion__toggle"
474
+ class="pf-v6-c-accordion__toggle"
475
475
  type="button"
476
476
  aria-expanded="false"
477
477
  >
478
- <span class="pf-v5-c-accordion__toggle-text">Item one</span>
478
+ <span class="pf-v6-c-accordion__toggle-text">Item one</span>
479
479
 
480
- <span class="pf-v5-c-accordion__toggle-icon">
480
+ <span class="pf-v6-c-accordion__toggle-icon">
481
481
  <i class="fas fa-angle-right" aria-hidden="true"></i>
482
482
  </span>
483
483
  </button>
484
484
  </h3>
485
- <div class="pf-v5-c-accordion__expandable-content" hidden>
485
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
486
486
  <div
487
- class="pf-v5-c-accordion__expandable-content-body"
487
+ class="pf-v6-c-accordion__expandable-content-body"
488
488
  >This text is hidden</div>
489
489
  </div>
490
490
  </div>
491
491
 
492
- <div class="pf-v5-c-accordion__item">
492
+ <div class="pf-v6-c-accordion__item">
493
493
  <h3>
494
494
  <button
495
- class="pf-v5-c-accordion__toggle"
495
+ class="pf-v6-c-accordion__toggle"
496
496
  type="button"
497
497
  aria-expanded="false"
498
498
  >
499
- <span class="pf-v5-c-accordion__toggle-text">Item two</span>
499
+ <span class="pf-v6-c-accordion__toggle-text">Item two</span>
500
500
 
501
- <span class="pf-v5-c-accordion__toggle-icon">
501
+ <span class="pf-v6-c-accordion__toggle-icon">
502
502
  <i class="fas fa-angle-right" aria-hidden="true"></i>
503
503
  </span>
504
504
  </button>
505
505
  </h3>
506
- <div class="pf-v5-c-accordion__expandable-content" hidden>
506
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
507
507
  <div
508
- class="pf-v5-c-accordion__expandable-content-body"
508
+ class="pf-v6-c-accordion__expandable-content-body"
509
509
  >This text is hidden</div>
510
510
  </div>
511
511
  </div>
512
512
 
513
- <div class="pf-v5-c-accordion__item">
513
+ <div class="pf-v6-c-accordion__item">
514
514
  <h3>
515
515
  <button
516
- class="pf-v5-c-accordion__toggle"
516
+ class="pf-v6-c-accordion__toggle"
517
517
  type="button"
518
518
  aria-expanded="false"
519
519
  >
520
- <span class="pf-v5-c-accordion__toggle-text">Item three</span>
520
+ <span class="pf-v6-c-accordion__toggle-text">Item three</span>
521
521
 
522
- <span class="pf-v5-c-accordion__toggle-icon">
522
+ <span class="pf-v6-c-accordion__toggle-icon">
523
523
  <i class="fas fa-angle-right" aria-hidden="true"></i>
524
524
  </span>
525
525
  </button>
526
526
  </h3>
527
- <div class="pf-v5-c-accordion__expandable-content" hidden>
527
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
528
528
  <div
529
- class="pf-v5-c-accordion__expandable-content-body"
529
+ class="pf-v6-c-accordion__expandable-content-body"
530
530
  >This text is hidden</div>
531
531
  </div>
532
532
  </div>
533
533
 
534
- <div class="pf-v5-c-accordion__item pf-m-expanded">
534
+ <div class="pf-v6-c-accordion__item pf-m-expanded">
535
535
  <h3>
536
536
  <button
537
- class="pf-v5-c-accordion__toggle"
537
+ class="pf-v6-c-accordion__toggle"
538
538
  type="button"
539
539
  aria-expanded="true"
540
540
  >
541
- <span class="pf-v5-c-accordion__toggle-text">Item four</span>
541
+ <span class="pf-v6-c-accordion__toggle-text">Item four</span>
542
542
 
543
- <span class="pf-v5-c-accordion__toggle-icon">
543
+ <span class="pf-v6-c-accordion__toggle-icon">
544
544
  <i class="fas fa-angle-right" aria-hidden="true"></i>
545
545
  </span>
546
546
  </button>
547
547
  </h3>
548
- <div class="pf-v5-c-accordion__expandable-content">
548
+ <div class="pf-v6-c-accordion__expandable-content">
549
549
  <div
550
- class="pf-v5-c-accordion__expandable-content-body"
550
+ class="pf-v6-c-accordion__expandable-content-body"
551
551
  >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie lorem lacinia dolor aliquet faucibus. Suspendisse gravida imperdiet accumsan. Aenean auctor lorem justo, vitae tincidunt enim blandit vel. Aenean quis tempus dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
552
552
  </div>
553
553
  </div>
554
554
 
555
- <div class="pf-v5-c-accordion__item">
555
+ <div class="pf-v6-c-accordion__item">
556
556
  <h3>
557
557
  <button
558
- class="pf-v5-c-accordion__toggle"
558
+ class="pf-v6-c-accordion__toggle"
559
559
  type="button"
560
560
  aria-expanded="false"
561
561
  >
562
- <span class="pf-v5-c-accordion__toggle-text">Item five</span>
562
+ <span class="pf-v6-c-accordion__toggle-text">Item five</span>
563
563
 
564
- <span class="pf-v5-c-accordion__toggle-icon">
564
+ <span class="pf-v6-c-accordion__toggle-icon">
565
565
  <i class="fas fa-angle-right" aria-hidden="true"></i>
566
566
  </span>
567
567
  </button>
568
568
  </h3>
569
- <div class="pf-v5-c-accordion__expandable-content" hidden>
569
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
570
570
  <div
571
- class="pf-v5-c-accordion__expandable-content-body"
571
+ class="pf-v6-c-accordion__expandable-content-body"
572
572
  >This text is hidden</div>
573
573
  </div>
574
574
  </div>
@@ -579,108 +579,108 @@ cssPrefix: pf-v5-c-accordion
579
579
  ### Toggle icon at start
580
580
 
581
581
  ```html isBeta
582
- <div class="pf-v5-c-accordion pf-m-toggle-start">
583
- <div class="pf-v5-c-accordion__item">
582
+ <div class="pf-v6-c-accordion pf-m-toggle-start">
583
+ <div class="pf-v6-c-accordion__item">
584
584
  <h3>
585
585
  <button
586
- class="pf-v5-c-accordion__toggle"
586
+ class="pf-v6-c-accordion__toggle"
587
587
  type="button"
588
588
  aria-expanded="false"
589
589
  >
590
- <span class="pf-v5-c-accordion__toggle-icon">
590
+ <span class="pf-v6-c-accordion__toggle-icon">
591
591
  <i class="fas fa-angle-right" aria-hidden="true"></i>
592
592
  </span>
593
593
 
594
- <span class="pf-v5-c-accordion__toggle-text">Item one</span>
594
+ <span class="pf-v6-c-accordion__toggle-text">Item one</span>
595
595
  </button>
596
596
  </h3>
597
- <div class="pf-v5-c-accordion__expandable-content" hidden>
597
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
598
598
  <div
599
- class="pf-v5-c-accordion__expandable-content-body"
599
+ class="pf-v6-c-accordion__expandable-content-body"
600
600
  >This text is hidden</div>
601
601
  </div>
602
602
  </div>
603
603
 
604
- <div class="pf-v5-c-accordion__item">
604
+ <div class="pf-v6-c-accordion__item">
605
605
  <h3>
606
606
  <button
607
- class="pf-v5-c-accordion__toggle"
607
+ class="pf-v6-c-accordion__toggle"
608
608
  type="button"
609
609
  aria-expanded="false"
610
610
  >
611
- <span class="pf-v5-c-accordion__toggle-icon">
611
+ <span class="pf-v6-c-accordion__toggle-icon">
612
612
  <i class="fas fa-angle-right" aria-hidden="true"></i>
613
613
  </span>
614
614
 
615
- <span class="pf-v5-c-accordion__toggle-text">Item two</span>
615
+ <span class="pf-v6-c-accordion__toggle-text">Item two</span>
616
616
  </button>
617
617
  </h3>
618
- <div class="pf-v5-c-accordion__expandable-content" hidden>
618
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
619
619
  <div
620
- class="pf-v5-c-accordion__expandable-content-body"
620
+ class="pf-v6-c-accordion__expandable-content-body"
621
621
  >This text is hidden</div>
622
622
  </div>
623
623
  </div>
624
624
 
625
- <div class="pf-v5-c-accordion__item">
625
+ <div class="pf-v6-c-accordion__item">
626
626
  <h3>
627
627
  <button
628
- class="pf-v5-c-accordion__toggle"
628
+ class="pf-v6-c-accordion__toggle"
629
629
  type="button"
630
630
  aria-expanded="false"
631
631
  >
632
- <span class="pf-v5-c-accordion__toggle-icon">
632
+ <span class="pf-v6-c-accordion__toggle-icon">
633
633
  <i class="fas fa-angle-right" aria-hidden="true"></i>
634
634
  </span>
635
635
 
636
- <span class="pf-v5-c-accordion__toggle-text">Item three</span>
636
+ <span class="pf-v6-c-accordion__toggle-text">Item three</span>
637
637
  </button>
638
638
  </h3>
639
- <div class="pf-v5-c-accordion__expandable-content" hidden>
639
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
640
640
  <div
641
- class="pf-v5-c-accordion__expandable-content-body"
641
+ class="pf-v6-c-accordion__expandable-content-body"
642
642
  >This text is hidden</div>
643
643
  </div>
644
644
  </div>
645
645
 
646
- <div class="pf-v5-c-accordion__item pf-m-expanded">
646
+ <div class="pf-v6-c-accordion__item pf-m-expanded">
647
647
  <h3>
648
648
  <button
649
- class="pf-v5-c-accordion__toggle"
649
+ class="pf-v6-c-accordion__toggle"
650
650
  type="button"
651
651
  aria-expanded="true"
652
652
  >
653
- <span class="pf-v5-c-accordion__toggle-icon">
653
+ <span class="pf-v6-c-accordion__toggle-icon">
654
654
  <i class="fas fa-angle-right" aria-hidden="true"></i>
655
655
  </span>
656
656
 
657
- <span class="pf-v5-c-accordion__toggle-text">Item four</span>
657
+ <span class="pf-v6-c-accordion__toggle-text">Item four</span>
658
658
  </button>
659
659
  </h3>
660
- <div class="pf-v5-c-accordion__expandable-content">
660
+ <div class="pf-v6-c-accordion__expandable-content">
661
661
  <div
662
- class="pf-v5-c-accordion__expandable-content-body"
662
+ class="pf-v6-c-accordion__expandable-content-body"
663
663
  >Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis molestie lorem lacinia dolor aliquet faucibus. Suspendisse gravida imperdiet accumsan. Aenean auctor lorem justo, vitae tincidunt enim blandit vel. Aenean quis tempus dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
664
664
  </div>
665
665
  </div>
666
666
 
667
- <div class="pf-v5-c-accordion__item">
667
+ <div class="pf-v6-c-accordion__item">
668
668
  <h3>
669
669
  <button
670
- class="pf-v5-c-accordion__toggle"
670
+ class="pf-v6-c-accordion__toggle"
671
671
  type="button"
672
672
  aria-expanded="false"
673
673
  >
674
- <span class="pf-v5-c-accordion__toggle-icon">
674
+ <span class="pf-v6-c-accordion__toggle-icon">
675
675
  <i class="fas fa-angle-right" aria-hidden="true"></i>
676
676
  </span>
677
677
 
678
- <span class="pf-v5-c-accordion__toggle-text">Item five</span>
678
+ <span class="pf-v6-c-accordion__toggle-text">Item five</span>
679
679
  </button>
680
680
  </h3>
681
- <div class="pf-v5-c-accordion__expandable-content" hidden>
681
+ <div class="pf-v6-c-accordion__expandable-content" hidden>
682
682
  <div
683
- class="pf-v5-c-accordion__expandable-content-body"
683
+ class="pf-v6-c-accordion__expandable-content-body"
684
684
  >This text is hidden</div>
685
685
  </div>
686
686
  </div>