@patternfly/patternfly 6.3.0-prerelease.25 → 6.3.0-prerelease.26

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 (50) hide show
  1. package/components/Button/button.css +103 -0
  2. package/components/Button/button.scss +103 -2
  3. package/components/MenuToggle/menu-toggle.css +30 -0
  4. package/components/MenuToggle/menu-toggle.scss +33 -0
  5. package/components/Page/page.css +45 -0
  6. package/components/Page/page.scss +29 -0
  7. package/components/_index.css +178 -0
  8. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  9. package/docs/components/Button/examples/Button.md +85 -3
  10. package/docs/components/Card/examples/Card.md +8 -8
  11. package/docs/components/DataList/examples/DataList.md +23 -23
  12. package/docs/components/DualListSelector/examples/DualListSelector.md +18 -18
  13. package/docs/components/Hint/examples/Hint.md +3 -3
  14. package/docs/components/InlineEdit/examples/InlineEdit.md +2 -2
  15. package/docs/components/Masthead/examples/masthead.md +90 -12
  16. package/docs/components/Menu/examples/Menu.md +2 -2
  17. package/docs/components/MenuToggle/examples/MenuToggle.md +90 -51
  18. package/docs/components/OverflowMenu/examples/overflow-menu.md +5 -5
  19. package/docs/components/Page/examples/Page.md +147 -14
  20. package/docs/components/Pagination/examples/Pagination.md +12 -12
  21. package/docs/components/Table/examples/Table.md +240 -240
  22. package/docs/components/Toolbar/examples/Toolbar.md +7 -7
  23. package/docs/demos/AboutModal/examples/AboutModal.md +22 -3
  24. package/docs/demos/Alert/examples/Alert.md +66 -9
  25. package/docs/demos/BackToTop/examples/BackToTop.md +22 -3
  26. package/docs/demos/Banner/examples/Banner.md +47 -6
  27. package/docs/demos/Card/examples/Card.md +4 -4
  28. package/docs/demos/CardView/examples/CardView.md +24 -5
  29. package/docs/demos/Dashboard/examples/Dashboard.md +24 -5
  30. package/docs/demos/DataList/examples/DataList.md +100 -24
  31. package/docs/demos/DescriptionList/examples/DescriptionList.md +66 -9
  32. package/docs/demos/Drawer/examples/Drawer.md +110 -15
  33. package/docs/demos/JumpLinks/examples/JumpLinks.md +132 -18
  34. package/docs/demos/Masthead/examples/Masthead.md +170 -18
  35. package/docs/demos/Modal/examples/Modal.md +132 -18
  36. package/docs/demos/Nav/examples/Nav.md +111 -16
  37. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +110 -15
  38. package/docs/demos/Page/examples/Page.md +309 -43
  39. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +160 -27
  40. package/docs/demos/Skeleton/examples/Skeleton.md +22 -3
  41. package/docs/demos/Table/examples/Table.md +435 -150
  42. package/docs/demos/Tabs/examples/Tabs.md +137 -23
  43. package/docs/demos/Toolbar/examples/Toolbar.md +72 -34
  44. package/docs/demos/Wizard/examples/Wizard.md +198 -27
  45. package/package.json +1 -1
  46. package/patternfly-no-globals.css +178 -0
  47. package/patternfly.css +178 -0
  48. package/patternfly.min.css +1 -1
  49. package/patternfly.min.css.map +1 -1
  50. package/sass-utilities/mixins.scss +35 -0
package/docs/demos/Tabs/examples/Tabs.md CHANGED
@@ -19,12 +19,31 @@ section: components
19
19
  <div class="pf-v6-c-masthead__main">
20
20
  <span class="pf-v6-c-masthead__toggle">
21
21
  <button
22
- class="pf-v6-c-button pf-m-plain"
22
+ class="pf-v6-c-button pf-m-hamburger pf-m-plain"
23
23
  type="button"
24
24
  aria-label="Global navigation"
25
25
  >
26
26
  <span class="pf-v6-c-button__icon">
27
- <i class="fas fa-bars" aria-hidden="true"></i>
27
+ <svg
28
+ viewBox="0 0 10 10"
29
+ class="pf-v6-c-button--hamburger-icon pf-v6-svg"
30
+ width="1em"
31
+ height="1em"
32
+ >
33
+ <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
34
+ <path
35
+ class="pf-v6-c-button--hamburger-icon--middle"
36
+ d="M1,5 L9,5"
37
+ />
38
+ <path
39
+ class="pf-v6-c-button--hamburger-icon--arrow"
40
+ d="M1,5 L1,5 L1,5"
41
+ />
42
+ <path
43
+ class="pf-v6-c-button--hamburger-icon--bottom"
44
+ d="M9,9 L1,9"
45
+ />
46
+ </svg>
28
47
  </span>
29
48
  </button>
30
49
  </span>
@@ -132,7 +151,7 @@ section: components
132
151
  </div>
133
152
  <div class="pf-v6-c-toolbar__item">
134
153
  <button
135
- class="pf-v6-c-menu-toggle pf-m-plain"
154
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
136
155
  type="button"
137
156
  aria-expanded="false"
138
157
  aria-label="Settings"
@@ -585,12 +604,31 @@ section: components
585
604
  <div class="pf-v6-c-masthead__main">
586
605
  <span class="pf-v6-c-masthead__toggle">
587
606
  <button
588
- class="pf-v6-c-button pf-m-plain"
607
+ class="pf-v6-c-button pf-m-hamburger pf-m-plain"
589
608
  type="button"
590
609
  aria-label="Global navigation"
591
610
  >
592
611
  <span class="pf-v6-c-button__icon">
593
- <i class="fas fa-bars" aria-hidden="true"></i>
612
+ <svg
613
+ viewBox="0 0 10 10"
614
+ class="pf-v6-c-button--hamburger-icon pf-v6-svg"
615
+ width="1em"
616
+ height="1em"
617
+ >
618
+ <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
619
+ <path
620
+ class="pf-v6-c-button--hamburger-icon--middle"
621
+ d="M1,5 L9,5"
622
+ />
623
+ <path
624
+ class="pf-v6-c-button--hamburger-icon--arrow"
625
+ d="M1,5 L1,5 L1,5"
626
+ />
627
+ <path
628
+ class="pf-v6-c-button--hamburger-icon--bottom"
629
+ d="M9,9 L1,9"
630
+ />
631
+ </svg>
594
632
  </span>
595
633
  </button>
596
634
  </span>
@@ -698,7 +736,7 @@ section: components
698
736
  </div>
699
737
  <div class="pf-v6-c-toolbar__item">
700
738
  <button
701
- class="pf-v6-c-menu-toggle pf-m-plain"
739
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
702
740
  type="button"
703
741
  aria-expanded="false"
704
742
  aria-label="Settings"
@@ -1152,12 +1190,31 @@ section: components
1152
1190
  <div class="pf-v6-c-masthead__main">
1153
1191
  <span class="pf-v6-c-masthead__toggle">
1154
1192
  <button
1155
- class="pf-v6-c-button pf-m-plain"
1193
+ class="pf-v6-c-button pf-m-hamburger pf-m-plain"
1156
1194
  type="button"
1157
1195
  aria-label="Global navigation"
1158
1196
  >
1159
1197
  <span class="pf-v6-c-button__icon">
1160
- <i class="fas fa-bars" aria-hidden="true"></i>
1198
+ <svg
1199
+ viewBox="0 0 10 10"
1200
+ class="pf-v6-c-button--hamburger-icon pf-v6-svg"
1201
+ width="1em"
1202
+ height="1em"
1203
+ >
1204
+ <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
1205
+ <path
1206
+ class="pf-v6-c-button--hamburger-icon--middle"
1207
+ d="M1,5 L9,5"
1208
+ />
1209
+ <path
1210
+ class="pf-v6-c-button--hamburger-icon--arrow"
1211
+ d="M1,5 L1,5 L1,5"
1212
+ />
1213
+ <path
1214
+ class="pf-v6-c-button--hamburger-icon--bottom"
1215
+ d="M9,9 L1,9"
1216
+ />
1217
+ </svg>
1161
1218
  </span>
1162
1219
  </button>
1163
1220
  </span>
@@ -1265,7 +1322,7 @@ section: components
1265
1322
  </div>
1266
1323
  <div class="pf-v6-c-toolbar__item">
1267
1324
  <button
1268
- class="pf-v6-c-menu-toggle pf-m-plain"
1325
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
1269
1326
  type="button"
1270
1327
  aria-expanded="false"
1271
1328
  aria-label="Settings"
@@ -1638,12 +1695,31 @@ section: components
1638
1695
  <div class="pf-v6-c-masthead__main">
1639
1696
  <span class="pf-v6-c-masthead__toggle">
1640
1697
  <button
1641
- class="pf-v6-c-button pf-m-plain"
1698
+ class="pf-v6-c-button pf-m-hamburger pf-m-plain"
1642
1699
  type="button"
1643
1700
  aria-label="Global navigation"
1644
1701
  >
1645
1702
  <span class="pf-v6-c-button__icon">
1646
- <i class="fas fa-bars" aria-hidden="true"></i>
1703
+ <svg
1704
+ viewBox="0 0 10 10"
1705
+ class="pf-v6-c-button--hamburger-icon pf-v6-svg"
1706
+ width="1em"
1707
+ height="1em"
1708
+ >
1709
+ <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
1710
+ <path
1711
+ class="pf-v6-c-button--hamburger-icon--middle"
1712
+ d="M1,5 L9,5"
1713
+ />
1714
+ <path
1715
+ class="pf-v6-c-button--hamburger-icon--arrow"
1716
+ d="M1,5 L1,5 L1,5"
1717
+ />
1718
+ <path
1719
+ class="pf-v6-c-button--hamburger-icon--bottom"
1720
+ d="M9,9 L1,9"
1721
+ />
1722
+ </svg>
1647
1723
  </span>
1648
1724
  </button>
1649
1725
  </span>
@@ -1751,7 +1827,7 @@ section: components
1751
1827
  </div>
1752
1828
  <div class="pf-v6-c-toolbar__item">
1753
1829
  <button
1754
- class="pf-v6-c-menu-toggle pf-m-plain"
1830
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
1755
1831
  type="button"
1756
1832
  aria-expanded="false"
1757
1833
  aria-label="Settings"
@@ -2144,7 +2220,7 @@ section: components
2144
2220
  class="pf-v6-c-menu-toggle pf-m-plain"
2145
2221
  type="button"
2146
2222
  aria-expanded="false"
2147
- aria-label="Menu toggle"
2223
+ aria-label="Table actions"
2148
2224
  >
2149
2225
  <span class="pf-v6-c-menu-toggle__icon">
2150
2226
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -2236,7 +2312,7 @@ section: components
2236
2312
  class="pf-v6-c-menu-toggle pf-m-plain"
2237
2313
  type="button"
2238
2314
  aria-expanded="false"
2239
- aria-label="Menu toggle"
2315
+ aria-label="Table actions"
2240
2316
  >
2241
2317
  <span class="pf-v6-c-menu-toggle__icon">
2242
2318
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -2328,7 +2404,7 @@ section: components
2328
2404
  class="pf-v6-c-menu-toggle pf-m-plain"
2329
2405
  type="button"
2330
2406
  aria-expanded="false"
2331
- aria-label="Menu toggle"
2407
+ aria-label="Table actions"
2332
2408
  >
2333
2409
  <span class="pf-v6-c-menu-toggle__icon">
2334
2410
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -2420,7 +2496,7 @@ section: components
2420
2496
  class="pf-v6-c-menu-toggle pf-m-plain"
2421
2497
  type="button"
2422
2498
  aria-expanded="false"
2423
- aria-label="Menu toggle"
2499
+ aria-label="Table actions"
2424
2500
  >
2425
2501
  <span class="pf-v6-c-menu-toggle__icon">
2426
2502
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -2511,7 +2587,7 @@ section: components
2511
2587
  class="pf-v6-c-menu-toggle pf-m-plain"
2512
2588
  type="button"
2513
2589
  aria-expanded="false"
2514
- aria-label="Menu toggle"
2590
+ aria-label="Table actions"
2515
2591
  >
2516
2592
  <span class="pf-v6-c-menu-toggle__icon">
2517
2593
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -2883,12 +2959,31 @@ section: components
2883
2959
  <div class="pf-v6-c-masthead__main">
2884
2960
  <span class="pf-v6-c-masthead__toggle">
2885
2961
  <button
2886
- class="pf-v6-c-button pf-m-plain"
2962
+ class="pf-v6-c-button pf-m-hamburger pf-m-plain"
2887
2963
  type="button"
2888
2964
  aria-label="Global navigation"
2889
2965
  >
2890
2966
  <span class="pf-v6-c-button__icon">
2891
- <i class="fas fa-bars" aria-hidden="true"></i>
2967
+ <svg
2968
+ viewBox="0 0 10 10"
2969
+ class="pf-v6-c-button--hamburger-icon pf-v6-svg"
2970
+ width="1em"
2971
+ height="1em"
2972
+ >
2973
+ <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
2974
+ <path
2975
+ class="pf-v6-c-button--hamburger-icon--middle"
2976
+ d="M1,5 L9,5"
2977
+ />
2978
+ <path
2979
+ class="pf-v6-c-button--hamburger-icon--arrow"
2980
+ d="M1,5 L1,5 L1,5"
2981
+ />
2982
+ <path
2983
+ class="pf-v6-c-button--hamburger-icon--bottom"
2984
+ d="M9,9 L1,9"
2985
+ />
2986
+ </svg>
2892
2987
  </span>
2893
2988
  </button>
2894
2989
  </span>
@@ -2996,7 +3091,7 @@ section: components
2996
3091
  </div>
2997
3092
  <div class="pf-v6-c-toolbar__item">
2998
3093
  <button
2999
- class="pf-v6-c-menu-toggle pf-m-plain"
3094
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
3000
3095
  type="button"
3001
3096
  aria-expanded="false"
3002
3097
  aria-label="Settings"
@@ -3188,12 +3283,31 @@ section: components
3188
3283
  <div class="pf-v6-c-masthead__main">
3189
3284
  <span class="pf-v6-c-masthead__toggle">
3190
3285
  <button
3191
- class="pf-v6-c-button pf-m-plain"
3286
+ class="pf-v6-c-button pf-m-hamburger pf-m-plain"
3192
3287
  type="button"
3193
3288
  aria-label="Global navigation"
3194
3289
  >
3195
3290
  <span class="pf-v6-c-button__icon">
3196
- <i class="fas fa-bars" aria-hidden="true"></i>
3291
+ <svg
3292
+ viewBox="0 0 10 10"
3293
+ class="pf-v6-c-button--hamburger-icon pf-v6-svg"
3294
+ width="1em"
3295
+ height="1em"
3296
+ >
3297
+ <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
3298
+ <path
3299
+ class="pf-v6-c-button--hamburger-icon--middle"
3300
+ d="M1,5 L9,5"
3301
+ />
3302
+ <path
3303
+ class="pf-v6-c-button--hamburger-icon--arrow"
3304
+ d="M1,5 L1,5 L1,5"
3305
+ />
3306
+ <path
3307
+ class="pf-v6-c-button--hamburger-icon--bottom"
3308
+ d="M9,9 L1,9"
3309
+ />
3310
+ </svg>
3197
3311
  </span>
3198
3312
  </button>
3199
3313
  </span>
@@ -3301,7 +3415,7 @@ section: components
3301
3415
  </div>
3302
3416
  <div class="pf-v6-c-toolbar__item">
3303
3417
  <button
3304
- class="pf-v6-c-menu-toggle pf-m-plain"
3418
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
3305
3419
  type="button"
3306
3420
  aria-expanded="false"
3307
3421
  aria-label="Settings"
package/docs/demos/Toolbar/examples/Toolbar.md CHANGED
@@ -95,7 +95,7 @@ section: components
95
95
  class="pf-v6-c-menu-toggle pf-m-plain"
96
96
  type="button"
97
97
  aria-expanded="false"
98
- aria-label="Menu toggle"
98
+ aria-label="Toggle options"
99
99
  id="toolbar-attribute-value-search-filter-desktop-example-overflow-toggle"
100
100
  >
101
101
  <span class="pf-v6-c-menu-toggle__icon">
@@ -114,7 +114,7 @@ section: components
114
114
  >
115
115
  <div class="pf-v6-c-pagination__page-menu">
116
116
  <button
117
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
117
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
118
118
  type="button"
119
119
  aria-expanded="false"
120
120
  aria-label="Menu toggle"
@@ -190,12 +190,31 @@ section: components
190
190
  <div class="pf-v6-c-masthead__main">
191
191
  <span class="pf-v6-c-masthead__toggle">
192
192
  <button
193
- class="pf-v6-c-button pf-m-plain"
193
+ class="pf-v6-c-button pf-m-hamburger pf-m-plain"
194
194
  type="button"
195
195
  aria-label="Global navigation"
196
196
  >
197
197
  <span class="pf-v6-c-button__icon">
198
- <i class="fas fa-bars" aria-hidden="true"></i>
198
+ <svg
199
+ viewBox="0 0 10 10"
200
+ class="pf-v6-c-button--hamburger-icon pf-v6-svg"
201
+ width="1em"
202
+ height="1em"
203
+ >
204
+ <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
205
+ <path
206
+ class="pf-v6-c-button--hamburger-icon--middle"
207
+ d="M1,5 L9,5"
208
+ />
209
+ <path
210
+ class="pf-v6-c-button--hamburger-icon--arrow"
211
+ d="M1,5 L1,5 L1,5"
212
+ />
213
+ <path
214
+ class="pf-v6-c-button--hamburger-icon--bottom"
215
+ d="M9,9 L1,9"
216
+ />
217
+ </svg>
199
218
  </span>
200
219
  </button>
201
220
  </span>
@@ -303,7 +322,7 @@ section: components
303
322
  </div>
304
323
  <div class="pf-v6-c-toolbar__item">
305
324
  <button
306
- class="pf-v6-c-menu-toggle pf-m-plain"
325
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
307
326
  type="button"
308
327
  aria-expanded="false"
309
328
  aria-label="Settings"
@@ -775,7 +794,7 @@ section: components
775
794
  class="pf-v6-c-menu-toggle pf-m-plain"
776
795
  type="button"
777
796
  aria-expanded="false"
778
- aria-label="Menu toggle"
797
+ aria-label="Table actions"
779
798
  >
780
799
  <span class="pf-v6-c-menu-toggle__icon">
781
800
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -851,7 +870,7 @@ section: components
851
870
  class="pf-v6-c-menu-toggle pf-m-plain"
852
871
  type="button"
853
872
  aria-expanded="false"
854
- aria-label="Menu toggle"
873
+ aria-label="Table actions"
855
874
  >
856
875
  <span class="pf-v6-c-menu-toggle__icon">
857
876
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -927,7 +946,7 @@ section: components
927
946
  class="pf-v6-c-menu-toggle pf-m-plain"
928
947
  type="button"
929
948
  aria-expanded="false"
930
- aria-label="Menu toggle"
949
+ aria-label="Table actions"
931
950
  >
932
951
  <span class="pf-v6-c-menu-toggle__icon">
933
952
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -1003,7 +1022,7 @@ section: components
1003
1022
  class="pf-v6-c-menu-toggle pf-m-plain"
1004
1023
  type="button"
1005
1024
  aria-expanded="false"
1006
- aria-label="Menu toggle"
1025
+ aria-label="Table actions"
1007
1026
  >
1008
1027
  <span class="pf-v6-c-menu-toggle__icon">
1009
1028
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -1078,7 +1097,7 @@ section: components
1078
1097
  class="pf-v6-c-menu-toggle pf-m-plain"
1079
1098
  type="button"
1080
1099
  aria-expanded="false"
1081
- aria-label="Menu toggle"
1100
+ aria-label="Table actions"
1082
1101
  >
1083
1102
  <span class="pf-v6-c-menu-toggle__icon">
1084
1103
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -1108,7 +1127,7 @@ section: components
1108
1127
  <div class="pf-v6-c-toolbar__group pf-m-toggle-group">
1109
1128
  <div class="pf-v6-c-toolbar__toggle">
1110
1129
  <button
1111
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-expanded"
1130
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-plain"
1112
1131
  type="button"
1113
1132
  aria-expanded="true"
1114
1133
  aria-label="Show filters"
@@ -1205,7 +1224,7 @@ section: components
1205
1224
  class="pf-v6-c-menu-toggle pf-m-plain"
1206
1225
  type="button"
1207
1226
  aria-expanded="false"
1208
- aria-label="Menu toggle"
1227
+ aria-label="Toggle options"
1209
1228
  id="toolbar-attribute-value-search-filter-mobile-example-overflow-toggle"
1210
1229
  >
1211
1230
  <span class="pf-v6-c-menu-toggle__icon">
@@ -1224,7 +1243,7 @@ section: components
1224
1243
  >
1225
1244
  <div class="pf-v6-c-pagination__page-menu">
1226
1245
  <button
1227
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
1246
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
1228
1247
  type="button"
1229
1248
  aria-expanded="false"
1230
1249
  aria-label="Menu toggle"
@@ -1388,7 +1407,7 @@ section: components
1388
1407
  class="pf-v6-c-menu-toggle pf-m-plain"
1389
1408
  type="button"
1390
1409
  aria-expanded="false"
1391
- aria-label="Menu toggle"
1410
+ aria-label="Toggle options"
1392
1411
  id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-overflow-toggle"
1393
1412
  >
1394
1413
  <span class="pf-v6-c-menu-toggle__icon">
@@ -1407,7 +1426,7 @@ section: components
1407
1426
  >
1408
1427
  <div class="pf-v6-c-pagination__page-menu">
1409
1428
  <button
1410
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
1429
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
1411
1430
  type="button"
1412
1431
  aria-expanded="false"
1413
1432
  aria-label="Menu toggle"
@@ -1476,7 +1495,7 @@ section: components
1476
1495
  <div class="pf-v6-c-toolbar__group pf-m-toggle-group">
1477
1496
  <div class="pf-v6-c-toolbar__toggle">
1478
1497
  <button
1479
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-expanded"
1498
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-plain"
1480
1499
  type="button"
1481
1500
  aria-expanded="true"
1482
1501
  aria-label="Show filters"
@@ -1573,7 +1592,7 @@ section: components
1573
1592
  class="pf-v6-c-menu-toggle pf-m-plain"
1574
1593
  type="button"
1575
1594
  aria-expanded="false"
1576
- aria-label="Menu toggle"
1595
+ aria-label="Toggle options"
1577
1596
  id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-overflow-toggle"
1578
1597
  >
1579
1598
  <span class="pf-v6-c-menu-toggle__icon">
@@ -1592,7 +1611,7 @@ section: components
1592
1611
  >
1593
1612
  <div class="pf-v6-c-pagination__page-menu">
1594
1613
  <button
1595
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
1614
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
1596
1615
  type="button"
1597
1616
  aria-expanded="false"
1598
1617
  aria-label="Menu toggle"
@@ -1747,7 +1766,7 @@ section: components
1747
1766
  class="pf-v6-c-menu-toggle pf-m-plain"
1748
1767
  type="button"
1749
1768
  aria-expanded="false"
1750
- aria-label="Menu toggle"
1769
+ aria-label="Toggle options"
1751
1770
  id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-overflow-toggle"
1752
1771
  >
1753
1772
  <span class="pf-v6-c-menu-toggle__icon">
@@ -1766,7 +1785,7 @@ section: components
1766
1785
  >
1767
1786
  <div class="pf-v6-c-pagination__page-menu">
1768
1787
  <button
1769
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
1788
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
1770
1789
  type="button"
1771
1790
  aria-expanded="false"
1772
1791
  aria-label="Menu toggle"
@@ -2039,7 +2058,7 @@ section: components
2039
2058
  <div class="pf-v6-c-toolbar__group pf-m-toggle-group">
2040
2059
  <div class="pf-v6-c-toolbar__toggle">
2041
2060
  <button
2042
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-expanded"
2061
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-plain"
2043
2062
  type="button"
2044
2063
  aria-expanded="true"
2045
2064
  aria-label="Show filters"
@@ -2136,7 +2155,7 @@ section: components
2136
2155
  class="pf-v6-c-menu-toggle pf-m-plain"
2137
2156
  type="button"
2138
2157
  aria-expanded="false"
2139
- aria-label="Menu toggle"
2158
+ aria-label="Toggle options"
2140
2159
  id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-overflow-toggle"
2141
2160
  >
2142
2161
  <span class="pf-v6-c-menu-toggle__icon">
@@ -2155,7 +2174,7 @@ section: components
2155
2174
  >
2156
2175
  <div class="pf-v6-c-pagination__page-menu">
2157
2176
  <button
2158
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
2177
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
2159
2178
  type="button"
2160
2179
  aria-expanded="false"
2161
2180
  aria-label="Menu toggle"
@@ -2466,12 +2485,31 @@ section: components
2466
2485
  <div class="pf-v6-c-masthead__main">
2467
2486
  <span class="pf-v6-c-masthead__toggle">
2468
2487
  <button
2469
- class="pf-v6-c-button pf-m-plain"
2488
+ class="pf-v6-c-button pf-m-hamburger pf-m-plain"
2470
2489
  type="button"
2471
2490
  aria-label="Global navigation"
2472
2491
  >
2473
2492
  <span class="pf-v6-c-button__icon">
2474
- <i class="fas fa-bars" aria-hidden="true"></i>
2493
+ <svg
2494
+ viewBox="0 0 10 10"
2495
+ class="pf-v6-c-button--hamburger-icon pf-v6-svg"
2496
+ width="1em"
2497
+ height="1em"
2498
+ >
2499
+ <path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
2500
+ <path
2501
+ class="pf-v6-c-button--hamburger-icon--middle"
2502
+ d="M1,5 L9,5"
2503
+ />
2504
+ <path
2505
+ class="pf-v6-c-button--hamburger-icon--arrow"
2506
+ d="M1,5 L1,5 L1,5"
2507
+ />
2508
+ <path
2509
+ class="pf-v6-c-button--hamburger-icon--bottom"
2510
+ d="M9,9 L1,9"
2511
+ />
2512
+ </svg>
2475
2513
  </span>
2476
2514
  </button>
2477
2515
  </span>
@@ -2579,7 +2617,7 @@ section: components
2579
2617
  </div>
2580
2618
  <div class="pf-v6-c-toolbar__item">
2581
2619
  <button
2582
- class="pf-v6-c-menu-toggle pf-m-plain"
2620
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
2583
2621
  type="button"
2584
2622
  aria-expanded="false"
2585
2623
  aria-label="Settings"
@@ -2790,7 +2828,7 @@ section: components
2790
2828
  class="pf-v6-c-menu-toggle pf-m-plain"
2791
2829
  type="button"
2792
2830
  aria-expanded="false"
2793
- aria-label="Menu toggle"
2831
+ aria-label="Toggle options"
2794
2832
  id="toolbar-pagination-management-example-toolbar-overflow-toggle"
2795
2833
  >
2796
2834
  <span class="pf-v6-c-menu-toggle__icon">
@@ -2809,7 +2847,7 @@ section: components
2809
2847
  >
2810
2848
  <div class="pf-v6-c-pagination__page-menu">
2811
2849
  <button
2812
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
2850
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
2813
2851
  type="button"
2814
2852
  aria-expanded="false"
2815
2853
  aria-label="Menu toggle"
@@ -3005,7 +3043,7 @@ section: components
3005
3043
  class="pf-v6-c-menu-toggle pf-m-plain"
3006
3044
  type="button"
3007
3045
  aria-expanded="false"
3008
- aria-label="Menu toggle"
3046
+ aria-label="Table actions"
3009
3047
  >
3010
3048
  <span class="pf-v6-c-menu-toggle__icon">
3011
3049
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -3083,7 +3121,7 @@ section: components
3083
3121
  class="pf-v6-c-menu-toggle pf-m-plain"
3084
3122
  type="button"
3085
3123
  aria-expanded="false"
3086
- aria-label="Menu toggle"
3124
+ aria-label="Table actions"
3087
3125
  >
3088
3126
  <span class="pf-v6-c-menu-toggle__icon">
3089
3127
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -3161,7 +3199,7 @@ section: components
3161
3199
  class="pf-v6-c-menu-toggle pf-m-plain"
3162
3200
  type="button"
3163
3201
  aria-expanded="false"
3164
- aria-label="Menu toggle"
3202
+ aria-label="Table actions"
3165
3203
  >
3166
3204
  <span class="pf-v6-c-menu-toggle__icon">
3167
3205
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -3239,7 +3277,7 @@ section: components
3239
3277
  class="pf-v6-c-menu-toggle pf-m-plain"
3240
3278
  type="button"
3241
3279
  aria-expanded="false"
3242
- aria-label="Menu toggle"
3280
+ aria-label="Table actions"
3243
3281
  >
3244
3282
  <span class="pf-v6-c-menu-toggle__icon">
3245
3283
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -3316,7 +3354,7 @@ section: components
3316
3354
  class="pf-v6-c-menu-toggle pf-m-plain"
3317
3355
  type="button"
3318
3356
  aria-expanded="false"
3319
- aria-label="Menu toggle"
3357
+ aria-label="Table actions"
3320
3358
  >
3321
3359
  <span class="pf-v6-c-menu-toggle__icon">
3322
3360
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
@@ -3329,7 +3367,7 @@ section: components
3329
3367
  <div class="pf-v6-c-pagination pf-m-bottom">
3330
3368
  <div class="pf-v6-c-pagination__page-menu">
3331
3369
  <button
3332
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text pf-m-top"
3370
+ class="pf-v6-c-menu-toggle pf-m-top pf-m-text pf-m-plain"
3333
3371
  type="button"
3334
3372
  aria-expanded="false"
3335
3373
  aria-label="Menu toggle"