@patternfly/patternfly 6.0.0-alpha.86 → 6.0.0-alpha.87

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 (34) hide show
  1. package/components/MenuToggle/menu-toggle.css +6 -22
  2. package/components/MenuToggle/menu-toggle.scss +7 -31
  3. package/docs/components/LogViewer/examples/LogViewer.md +30 -10
  4. package/docs/components/MenuToggle/examples/MenuToggle.md +113 -132
  5. package/docs/components/Toolbar/examples/Toolbar.md +21 -7
  6. package/docs/demos/AboutModal/examples/AboutModal.md +12 -4
  7. package/docs/demos/Alert/examples/Alert.md +36 -12
  8. package/docs/demos/BackToTop/examples/BackToTop.md +12 -4
  9. package/docs/demos/Banner/examples/Banner.md +24 -8
  10. package/docs/demos/CardView/examples/CardView.md +15 -5
  11. package/docs/demos/ContextSelector/examples/ContextSelector.md +36 -12
  12. package/docs/demos/Dashboard/examples/Dashboard.md +12 -4
  13. package/docs/demos/DataList/examples/DataList.md +57 -19
  14. package/docs/demos/DescriptionList/examples/DescriptionList.md +36 -12
  15. package/docs/demos/Drawer/examples/Drawer.md +60 -20
  16. package/docs/demos/JumpLinks/examples/JumpLinks.md +72 -24
  17. package/docs/demos/Masthead/examples/Masthead.md +48 -16
  18. package/docs/demos/Modal/examples/Modal.md +72 -24
  19. package/docs/demos/Nav/examples/Nav.md +72 -24
  20. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +60 -20
  21. package/docs/demos/Page/examples/Page.md +108 -36
  22. package/docs/demos/Page/examples/Penta.md +3 -1
  23. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +96 -32
  24. package/docs/demos/Skeleton/examples/Skeleton.md +12 -4
  25. package/docs/demos/Table/examples/Table.md +216 -72
  26. package/docs/demos/Tabs/examples/Tabs.md +75 -25
  27. package/docs/demos/Toolbar/examples/Toolbar.md +48 -16
  28. package/docs/demos/Wizard/examples/Wizard.md +108 -36
  29. package/package.json +1 -1
  30. package/patternfly-no-globals.css +6 -22
  31. package/patternfly-theme-dark-unversioned.css +6 -22
  32. package/patternfly.css +6 -22
  33. package/patternfly.min.css +1 -1
  34. package/patternfly.min.css.map +1 -1
@@ -148,7 +148,9 @@ wrapperTag: div
148
148
  aria-expanded="false"
149
149
  aria-label="Application launcher"
150
150
  >
151
- <i class="fas fa-th" aria-hidden="true"></i>
151
+ <span class="pf-v5-c-menu-toggle__icon">
152
+ <i class="fas fa-th" aria-hidden="true"></i>
153
+ </span>
152
154
  </button>
153
155
  </div>
154
156
  <div class="pf-v5-c-toolbar__item">
@@ -158,7 +160,9 @@ wrapperTag: div
158
160
  aria-expanded="false"
159
161
  aria-label="Settings"
160
162
  >
161
- <i class="fas fa-cog" aria-hidden="true"></i>
163
+ <span class="pf-v5-c-menu-toggle__icon">
164
+ <i class="fas fa-cog" aria-hidden="true"></i>
165
+ </span>
162
166
  </button>
163
167
  </div>
164
168
  <div class="pf-v5-c-toolbar__item">
@@ -168,7 +172,9 @@ wrapperTag: div
168
172
  aria-expanded="false"
169
173
  aria-label="Help"
170
174
  >
171
- <i class="fas fa-question-circle" aria-hidden="true"></i>
175
+ <span class="pf-v5-c-menu-toggle__icon">
176
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
177
+ </span>
172
178
  </button>
173
179
  </div>
174
180
  </div>
@@ -179,7 +185,9 @@ wrapperTag: div
179
185
  aria-expanded="false"
180
186
  aria-label="Actions"
181
187
  >
182
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
188
+ <span class="pf-v5-c-menu-toggle__icon">
189
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
190
+ </span>
183
191
  </button>
184
192
  </div>
185
193
  </div>
@@ -721,7 +729,9 @@ wrapperTag: div
721
729
  aria-expanded="false"
722
730
  aria-label="Application launcher"
723
731
  >
724
- <i class="fas fa-th" aria-hidden="true"></i>
732
+ <span class="pf-v5-c-menu-toggle__icon">
733
+ <i class="fas fa-th" aria-hidden="true"></i>
734
+ </span>
725
735
  </button>
726
736
  </div>
727
737
  <div class="pf-v5-c-toolbar__item">
@@ -731,7 +741,9 @@ wrapperTag: div
731
741
  aria-expanded="false"
732
742
  aria-label="Settings"
733
743
  >
734
- <i class="fas fa-cog" aria-hidden="true"></i>
744
+ <span class="pf-v5-c-menu-toggle__icon">
745
+ <i class="fas fa-cog" aria-hidden="true"></i>
746
+ </span>
735
747
  </button>
736
748
  </div>
737
749
  <div class="pf-v5-c-toolbar__item">
@@ -741,7 +753,9 @@ wrapperTag: div
741
753
  aria-expanded="false"
742
754
  aria-label="Help"
743
755
  >
744
- <i class="fas fa-question-circle" aria-hidden="true"></i>
756
+ <span class="pf-v5-c-menu-toggle__icon">
757
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
758
+ </span>
745
759
  </button>
746
760
  </div>
747
761
  </div>
@@ -752,7 +766,9 @@ wrapperTag: div
752
766
  aria-expanded="false"
753
767
  aria-label="Actions"
754
768
  >
755
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
769
+ <span class="pf-v5-c-menu-toggle__icon">
770
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
771
+ </span>
756
772
  </button>
757
773
  </div>
758
774
  </div>
@@ -1276,7 +1292,9 @@ wrapperTag: div
1276
1292
  aria-expanded="false"
1277
1293
  aria-label="Application launcher"
1278
1294
  >
1279
- <i class="fas fa-th" aria-hidden="true"></i>
1295
+ <span class="pf-v5-c-menu-toggle__icon">
1296
+ <i class="fas fa-th" aria-hidden="true"></i>
1297
+ </span>
1280
1298
  </button>
1281
1299
  </div>
1282
1300
  <div class="pf-v5-c-toolbar__item">
@@ -1286,7 +1304,9 @@ wrapperTag: div
1286
1304
  aria-expanded="false"
1287
1305
  aria-label="Settings"
1288
1306
  >
1289
- <i class="fas fa-cog" aria-hidden="true"></i>
1307
+ <span class="pf-v5-c-menu-toggle__icon">
1308
+ <i class="fas fa-cog" aria-hidden="true"></i>
1309
+ </span>
1290
1310
  </button>
1291
1311
  </div>
1292
1312
  <div class="pf-v5-c-toolbar__item">
@@ -1296,7 +1316,9 @@ wrapperTag: div
1296
1316
  aria-expanded="false"
1297
1317
  aria-label="Help"
1298
1318
  >
1299
- <i class="fas fa-question-circle" aria-hidden="true"></i>
1319
+ <span class="pf-v5-c-menu-toggle__icon">
1320
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
1321
+ </span>
1300
1322
  </button>
1301
1323
  </div>
1302
1324
  </div>
@@ -1307,7 +1329,9 @@ wrapperTag: div
1307
1329
  aria-expanded="false"
1308
1330
  aria-label="Actions"
1309
1331
  >
1310
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1332
+ <span class="pf-v5-c-menu-toggle__icon">
1333
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1334
+ </span>
1311
1335
  </button>
1312
1336
  </div>
1313
1337
  </div>
@@ -1915,7 +1939,9 @@ wrapperTag: div
1915
1939
  aria-expanded="false"
1916
1940
  aria-label="Application launcher"
1917
1941
  >
1918
- <i class="fas fa-th" aria-hidden="true"></i>
1942
+ <span class="pf-v5-c-menu-toggle__icon">
1943
+ <i class="fas fa-th" aria-hidden="true"></i>
1944
+ </span>
1919
1945
  </button>
1920
1946
  </div>
1921
1947
  <div class="pf-v5-c-toolbar__item">
@@ -1925,7 +1951,9 @@ wrapperTag: div
1925
1951
  aria-expanded="false"
1926
1952
  aria-label="Settings"
1927
1953
  >
1928
- <i class="fas fa-cog" aria-hidden="true"></i>
1954
+ <span class="pf-v5-c-menu-toggle__icon">
1955
+ <i class="fas fa-cog" aria-hidden="true"></i>
1956
+ </span>
1929
1957
  </button>
1930
1958
  </div>
1931
1959
  <div class="pf-v5-c-toolbar__item">
@@ -1935,7 +1963,9 @@ wrapperTag: div
1935
1963
  aria-expanded="false"
1936
1964
  aria-label="Help"
1937
1965
  >
1938
- <i class="fas fa-question-circle" aria-hidden="true"></i>
1966
+ <span class="pf-v5-c-menu-toggle__icon">
1967
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
1968
+ </span>
1939
1969
  </button>
1940
1970
  </div>
1941
1971
  </div>
@@ -1946,7 +1976,9 @@ wrapperTag: div
1946
1976
  aria-expanded="false"
1947
1977
  aria-label="Actions"
1948
1978
  >
1949
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1979
+ <span class="pf-v5-c-menu-toggle__icon">
1980
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1981
+ </span>
1950
1982
  </button>
1951
1983
  </div>
1952
1984
  </div>
@@ -2553,7 +2585,9 @@ wrapperTag: div
2553
2585
  aria-expanded="false"
2554
2586
  aria-label="Application launcher"
2555
2587
  >
2556
- <i class="fas fa-th" aria-hidden="true"></i>
2588
+ <span class="pf-v5-c-menu-toggle__icon">
2589
+ <i class="fas fa-th" aria-hidden="true"></i>
2590
+ </span>
2557
2591
  </button>
2558
2592
  </div>
2559
2593
  <div class="pf-v5-c-toolbar__item">
@@ -2563,7 +2597,9 @@ wrapperTag: div
2563
2597
  aria-expanded="false"
2564
2598
  aria-label="Settings"
2565
2599
  >
2566
- <i class="fas fa-cog" aria-hidden="true"></i>
2600
+ <span class="pf-v5-c-menu-toggle__icon">
2601
+ <i class="fas fa-cog" aria-hidden="true"></i>
2602
+ </span>
2567
2603
  </button>
2568
2604
  </div>
2569
2605
  <div class="pf-v5-c-toolbar__item">
@@ -2573,7 +2609,9 @@ wrapperTag: div
2573
2609
  aria-expanded="false"
2574
2610
  aria-label="Help"
2575
2611
  >
2576
- <i class="fas fa-question-circle" aria-hidden="true"></i>
2612
+ <span class="pf-v5-c-menu-toggle__icon">
2613
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
2614
+ </span>
2577
2615
  </button>
2578
2616
  </div>
2579
2617
  </div>
@@ -2584,7 +2622,9 @@ wrapperTag: div
2584
2622
  aria-expanded="false"
2585
2623
  aria-label="Actions"
2586
2624
  >
2587
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
2625
+ <span class="pf-v5-c-menu-toggle__icon">
2626
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
2627
+ </span>
2588
2628
  </button>
2589
2629
  </div>
2590
2630
  </div>
@@ -3059,7 +3099,9 @@ wrapperTag: div
3059
3099
  aria-expanded="false"
3060
3100
  aria-label="Application launcher"
3061
3101
  >
3062
- <i class="fas fa-th" aria-hidden="true"></i>
3102
+ <span class="pf-v5-c-menu-toggle__icon">
3103
+ <i class="fas fa-th" aria-hidden="true"></i>
3104
+ </span>
3063
3105
  </button>
3064
3106
  </div>
3065
3107
  <div class="pf-v5-c-toolbar__item">
@@ -3069,7 +3111,9 @@ wrapperTag: div
3069
3111
  aria-expanded="false"
3070
3112
  aria-label="Settings"
3071
3113
  >
3072
- <i class="fas fa-cog" aria-hidden="true"></i>
3114
+ <span class="pf-v5-c-menu-toggle__icon">
3115
+ <i class="fas fa-cog" aria-hidden="true"></i>
3116
+ </span>
3073
3117
  </button>
3074
3118
  </div>
3075
3119
  <div class="pf-v5-c-toolbar__item">
@@ -3079,7 +3123,9 @@ wrapperTag: div
3079
3123
  aria-expanded="false"
3080
3124
  aria-label="Help"
3081
3125
  >
3082
- <i class="fas fa-question-circle" aria-hidden="true"></i>
3126
+ <span class="pf-v5-c-menu-toggle__icon">
3127
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
3128
+ </span>
3083
3129
  </button>
3084
3130
  </div>
3085
3131
  </div>
@@ -3090,7 +3136,9 @@ wrapperTag: div
3090
3136
  aria-expanded="false"
3091
3137
  aria-label="Actions"
3092
3138
  >
3093
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
3139
+ <span class="pf-v5-c-menu-toggle__icon">
3140
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
3141
+ </span>
3094
3142
  </button>
3095
3143
  </div>
3096
3144
  </div>
@@ -3570,7 +3618,9 @@ wrapperTag: div
3570
3618
  aria-expanded="false"
3571
3619
  aria-label="Application launcher"
3572
3620
  >
3573
- <i class="fas fa-th" aria-hidden="true"></i>
3621
+ <span class="pf-v5-c-menu-toggle__icon">
3622
+ <i class="fas fa-th" aria-hidden="true"></i>
3623
+ </span>
3574
3624
  </button>
3575
3625
  </div>
3576
3626
  <div class="pf-v5-c-toolbar__item">
@@ -3580,7 +3630,9 @@ wrapperTag: div
3580
3630
  aria-expanded="false"
3581
3631
  aria-label="Settings"
3582
3632
  >
3583
- <i class="fas fa-cog" aria-hidden="true"></i>
3633
+ <span class="pf-v5-c-menu-toggle__icon">
3634
+ <i class="fas fa-cog" aria-hidden="true"></i>
3635
+ </span>
3584
3636
  </button>
3585
3637
  </div>
3586
3638
  <div class="pf-v5-c-toolbar__item">
@@ -3590,7 +3642,9 @@ wrapperTag: div
3590
3642
  aria-expanded="false"
3591
3643
  aria-label="Help"
3592
3644
  >
3593
- <i class="fas fa-question-circle" aria-hidden="true"></i>
3645
+ <span class="pf-v5-c-menu-toggle__icon">
3646
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
3647
+ </span>
3594
3648
  </button>
3595
3649
  </div>
3596
3650
  </div>
@@ -3601,7 +3655,9 @@ wrapperTag: div
3601
3655
  aria-expanded="false"
3602
3656
  aria-label="Actions"
3603
3657
  >
3604
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
3658
+ <span class="pf-v5-c-menu-toggle__icon">
3659
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
3660
+ </span>
3605
3661
  </button>
3606
3662
  </div>
3607
3663
  </div>
@@ -4063,7 +4119,9 @@ wrapperTag: div
4063
4119
  aria-expanded="false"
4064
4120
  aria-label="Application launcher"
4065
4121
  >
4066
- <i class="fas fa-th" aria-hidden="true"></i>
4122
+ <span class="pf-v5-c-menu-toggle__icon">
4123
+ <i class="fas fa-th" aria-hidden="true"></i>
4124
+ </span>
4067
4125
  </button>
4068
4126
  </div>
4069
4127
  <div class="pf-v5-c-toolbar__item">
@@ -4073,7 +4131,9 @@ wrapperTag: div
4073
4131
  aria-expanded="false"
4074
4132
  aria-label="Settings"
4075
4133
  >
4076
- <i class="fas fa-cog" aria-hidden="true"></i>
4134
+ <span class="pf-v5-c-menu-toggle__icon">
4135
+ <i class="fas fa-cog" aria-hidden="true"></i>
4136
+ </span>
4077
4137
  </button>
4078
4138
  </div>
4079
4139
  <div class="pf-v5-c-toolbar__item">
@@ -4083,7 +4143,9 @@ wrapperTag: div
4083
4143
  aria-expanded="false"
4084
4144
  aria-label="Help"
4085
4145
  >
4086
- <i class="fas fa-question-circle" aria-hidden="true"></i>
4146
+ <span class="pf-v5-c-menu-toggle__icon">
4147
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
4148
+ </span>
4087
4149
  </button>
4088
4150
  </div>
4089
4151
  </div>
@@ -4094,7 +4156,9 @@ wrapperTag: div
4094
4156
  aria-expanded="false"
4095
4157
  aria-label="Actions"
4096
4158
  >
4097
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4159
+ <span class="pf-v5-c-menu-toggle__icon">
4160
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4161
+ </span>
4098
4162
  </button>
4099
4163
  </div>
4100
4164
  </div>
@@ -4628,7 +4692,9 @@ wrapperTag: div
4628
4692
  aria-expanded="false"
4629
4693
  aria-label="Application launcher"
4630
4694
  >
4631
- <i class="fas fa-th" aria-hidden="true"></i>
4695
+ <span class="pf-v5-c-menu-toggle__icon">
4696
+ <i class="fas fa-th" aria-hidden="true"></i>
4697
+ </span>
4632
4698
  </button>
4633
4699
  </div>
4634
4700
  <div class="pf-v5-c-toolbar__item">
@@ -4638,7 +4704,9 @@ wrapperTag: div
4638
4704
  aria-expanded="false"
4639
4705
  aria-label="Settings"
4640
4706
  >
4641
- <i class="fas fa-cog" aria-hidden="true"></i>
4707
+ <span class="pf-v5-c-menu-toggle__icon">
4708
+ <i class="fas fa-cog" aria-hidden="true"></i>
4709
+ </span>
4642
4710
  </button>
4643
4711
  </div>
4644
4712
  <div class="pf-v5-c-toolbar__item">
@@ -4648,7 +4716,9 @@ wrapperTag: div
4648
4716
  aria-expanded="false"
4649
4717
  aria-label="Help"
4650
4718
  >
4651
- <i class="fas fa-question-circle" aria-hidden="true"></i>
4719
+ <span class="pf-v5-c-menu-toggle__icon">
4720
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
4721
+ </span>
4652
4722
  </button>
4653
4723
  </div>
4654
4724
  </div>
@@ -4659,7 +4729,9 @@ wrapperTag: div
4659
4729
  aria-expanded="false"
4660
4730
  aria-label="Actions"
4661
4731
  >
4662
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4732
+ <span class="pf-v5-c-menu-toggle__icon">
4733
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4734
+ </span>
4663
4735
  </button>
4664
4736
  </div>
4665
4737
  </div>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "6.0.0-alpha.86",
4
+ "version": "6.0.0-alpha.87",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -20463,8 +20463,6 @@ ul.pf-v5-c-list {
20463
20463
  --pf-v5-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
20464
20464
  --pf-v5-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
20465
20465
  --pf-v5-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
20466
- --pf-v5-c-menu-toggle__icon--MarginRight: var(--pf-t--global--spacer--sm);
20467
- --pf-v5-c-menu-toggle__count--MarginLeft: var(--pf-t--global--spacer--sm);
20468
20466
  --pf-v5-c-menu-toggle__controls--MinWidth: calc(var(--pf-v5-c-menu-toggle--FontSize) + var(--pf-t--global--spacer--sm) + var(--pf-t--global--spacer--sm));
20469
20467
  --pf-v5-c-menu-toggle--m-full-height--PaddingRight: var(--pf-t--global--spacer--lg);
20470
20468
  --pf-v5-c-menu-toggle--m-full-height--PaddingLeft: var(--pf-t--global--spacer--lg);
@@ -20492,9 +20490,8 @@ ul.pf-v5-c-list {
20492
20490
  --pf-v5-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
20493
20491
  --pf-v5-c-menu-toggle--m-plain--active--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
20494
20492
  --pf-v5-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
20495
- --pf-v5-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--icon--color--on-disabled);
20496
- --pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-t--global--spacer--sm);
20497
- --pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-t--global--spacer--sm);
20493
+ --pf-v5-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--icon--color--disabled);
20494
+ --pf-v5-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
20498
20495
  --pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
20499
20496
  --pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
20500
20497
  }
@@ -20502,6 +20499,7 @@ ul.pf-v5-c-list {
20502
20499
  .pf-v5-c-menu-toggle {
20503
20500
  position: relative;
20504
20501
  display: inline-flex;
20502
+ column-gap: var(--pf-v5-c-menu-toggle--ColumnGap);
20505
20503
  align-items: center;
20506
20504
  justify-content: center;
20507
20505
  min-width: var(--pf-v5-c-menu-toggle--MinWidth);
@@ -20586,22 +20584,12 @@ ul.pf-v5-c-list {
20586
20584
  --pf-v5-c-menu-toggle--active--BackgroundColor: var(--pf-v5-c-menu-toggle--m-plain--active--BackgroundColor);
20587
20585
  --pf-v5-c-menu-toggle--expanded--BackgroundColor: var(--pf-v5-c-menu-toggle--m-plain--expanded--BackgroundColor);
20588
20586
  --pf-v5-c-menu-toggle--disabled--Color: var(--pf-v5-c-menu-toggle--m-plain--disabled--Color);
20587
+ --pf-v5-c-menu-toggle--disabled--BackgroundColor: var(--pf-v5-c-menu-toggle--m-plain--disabled--BackgroundColor);
20589
20588
  mix-blend-mode: var(--pf-v5-c-menu-toggle--m-plain--MixBlendMode);
20590
20589
  }
20591
20590
  .pf-v5-c-menu-toggle.pf-m-plain::before {
20592
20591
  border: none;
20593
20592
  }
20594
- .pf-v5-c-menu-toggle:has(.pf-v5-c-button:only-child) {
20595
- padding: revert;
20596
- }
20597
- .pf-v5-c-menu-toggle:is(button),
20598
- .pf-v5-c-menu-toggle .pf-v5-c-button {
20599
- background-color: var(--pf-v5-c-menu-toggle--BackgroundColor);
20600
- }
20601
- .pf-v5-c-menu-toggle:is(button):has(> i:only-child),
20602
- .pf-v5-c-menu-toggle .pf-v5-c-button:has(> i:only-child) {
20603
- aspect-ratio: 1/1;
20604
- }
20605
20593
  .pf-v5-c-menu-toggle:is(:hover, :focus) {
20606
20594
  --pf-v5-c-menu-toggle--Color: var(--pf-v5-c-menu-toggle--hover--Color);
20607
20595
  --pf-v5-c-menu-toggle--BackgroundColor: var(--pf-v5-c-menu-toggle--hover--BackgroundColor);
@@ -20639,6 +20627,7 @@ ul.pf-v5-c-list {
20639
20627
  }
20640
20628
 
20641
20629
  .pf-v5-c-menu-toggle.pf-m-split-button {
20630
+ --pf-v5-c-menu-toggle--ColumnGap: 0;
20642
20631
  padding: 0;
20643
20632
  }
20644
20633
  .pf-v5-c-menu-toggle.pf-m-split-button > * {
@@ -20672,7 +20661,6 @@ ul.pf-v5-c-list {
20672
20661
  }
20673
20662
 
20674
20663
  .pf-v5-c-menu-toggle.pf-m-split-button.pf-m-action {
20675
- --pf-v5-c-menu-toggle--ColumnGap: 0;
20676
20664
  --pf-v5-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: var(--pf-v5-c-menu-toggle--BorderColor);
20677
20665
  }
20678
20666
  .pf-v5-c-menu-toggle.pf-m-split-button.pf-m-action > :not(:first-child) {
@@ -20713,6 +20701,7 @@ ul.pf-v5-c-list {
20713
20701
 
20714
20702
  .pf-v5-c-menu-toggle.pf-m-typeahead {
20715
20703
  --pf-v5-c-menu-toggle__button--AlignSelf: var(--pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf);
20704
+ --pf-v5-c-menu-toggle--ColumnGap: 0;
20716
20705
  align-items: stretch;
20717
20706
  padding: 0;
20718
20707
  }
@@ -20720,7 +20709,6 @@ ul.pf-v5-c-list {
20720
20709
  --pf-v5-c-menu-toggle__button--PaddingRight: 0;
20721
20710
  }
20722
20711
  .pf-v5-c-menu-toggle.pf-m-typeahead .pf-v5-c-menu-toggle__controls {
20723
- --pf-v5-c-menu-toggle--ColumnGap: 0;
20724
20712
  --pf-v5-c-menu-toggle__button--PaddingRight: 0;
20725
20713
  display: flex;
20726
20714
  align-items: stretch;
@@ -20747,8 +20735,6 @@ ul.pf-v5-c-list {
20747
20735
  .pf-v5-c-menu-toggle__icon {
20748
20736
  flex-shrink: 0;
20749
20737
  align-self: center;
20750
- margin-inline-end: var(--pf-v5-c-menu-toggle__icon--MarginRight);
20751
- line-height: 1;
20752
20738
  }
20753
20739
 
20754
20740
  .pf-v5-c-menu-toggle__text {
@@ -20761,7 +20747,6 @@ ul.pf-v5-c-list {
20761
20747
  .pf-v5-c-menu-toggle__count {
20762
20748
  display: flex;
20763
20749
  flex-wrap: nowrap;
20764
- margin-inline-start: var(--pf-v5-c-menu-toggle__count--MarginLeft);
20765
20750
  }
20766
20751
 
20767
20752
  .pf-v5-c-menu-toggle__controls {
@@ -20769,7 +20754,6 @@ ul.pf-v5-c-list {
20769
20754
  align-items: center;
20770
20755
  justify-content: center;
20771
20756
  min-width: var(--pf-v5-c-menu-toggle__controls--MinWidth);
20772
- margin-inline-start: var(--pf-v5-c-menu-toggle--ColumnGap);
20773
20757
  }
20774
20758
 
20775
20759
  .pf-v5-c-menu-toggle__toggle-icon {
@@ -20580,8 +20580,6 @@ ul.pf-v5-c-list {
20580
20580
  --pf-v5-c-menu-toggle--m-secondary__toggle-icon--Color: var(--pf-t--global--icon--color--brand--default);
20581
20581
  --pf-v5-c-menu-toggle--m-secondary--hover__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
20582
20582
  --pf-v5-c-menu-toggle--m-secondary--expanded__toggle-icon--Color: var(--pf-t--global--icon--color--brand--clicked);
20583
- --pf-v5-c-menu-toggle__icon--MarginRight: var(--pf-t--global--spacer--sm);
20584
- --pf-v5-c-menu-toggle__count--MarginLeft: var(--pf-t--global--spacer--sm);
20585
20583
  --pf-v5-c-menu-toggle__controls--MinWidth: calc(var(--pf-v5-c-menu-toggle--FontSize) + var(--pf-t--global--spacer--sm) + var(--pf-t--global--spacer--sm));
20586
20584
  --pf-v5-c-menu-toggle--m-full-height--PaddingRight: var(--pf-t--global--spacer--lg);
20587
20585
  --pf-v5-c-menu-toggle--m-full-height--PaddingLeft: var(--pf-t--global--spacer--lg);
@@ -20609,9 +20607,8 @@ ul.pf-v5-c-list {
20609
20607
  --pf-v5-c-menu-toggle--m-plain--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
20610
20608
  --pf-v5-c-menu-toggle--m-plain--active--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
20611
20609
  --pf-v5-c-menu-toggle--m-plain--expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
20612
- --pf-v5-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--icon--color--on-disabled);
20613
- --pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-t--global--spacer--sm);
20614
- --pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-t--global--spacer--sm);
20610
+ --pf-v5-c-menu-toggle--m-plain--disabled--Color: var(--pf-t--global--icon--color--disabled);
20611
+ --pf-v5-c-menu-toggle--m-plain--disabled--BackgroundColor: transparent;
20615
20612
  --pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-t--global--spacer--sm);
20616
20613
  --pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf: stretch;
20617
20614
  }
@@ -20619,6 +20616,7 @@ ul.pf-v5-c-list {
20619
20616
  .pf-v5-c-menu-toggle {
20620
20617
  position: relative;
20621
20618
  display: inline-flex;
20619
+ column-gap: var(--pf-v5-c-menu-toggle--ColumnGap);
20622
20620
  align-items: center;
20623
20621
  justify-content: center;
20624
20622
  min-width: var(--pf-v5-c-menu-toggle--MinWidth);
@@ -20703,22 +20701,12 @@ ul.pf-v5-c-list {
20703
20701
  --pf-v5-c-menu-toggle--active--BackgroundColor: var(--pf-v5-c-menu-toggle--m-plain--active--BackgroundColor);
20704
20702
  --pf-v5-c-menu-toggle--expanded--BackgroundColor: var(--pf-v5-c-menu-toggle--m-plain--expanded--BackgroundColor);
20705
20703
  --pf-v5-c-menu-toggle--disabled--Color: var(--pf-v5-c-menu-toggle--m-plain--disabled--Color);
20704
+ --pf-v5-c-menu-toggle--disabled--BackgroundColor: var(--pf-v5-c-menu-toggle--m-plain--disabled--BackgroundColor);
20706
20705
  mix-blend-mode: var(--pf-v5-c-menu-toggle--m-plain--MixBlendMode);
20707
20706
  }
20708
20707
  .pf-v5-c-menu-toggle.pf-m-plain::before {
20709
20708
  border: none;
20710
20709
  }
20711
- .pf-v5-c-menu-toggle:has(.pf-v5-c-button:only-child) {
20712
- padding: revert;
20713
- }
20714
- .pf-v5-c-menu-toggle:is(button),
20715
- .pf-v5-c-menu-toggle .pf-v5-c-button {
20716
- background-color: var(--pf-v5-c-menu-toggle--BackgroundColor);
20717
- }
20718
- .pf-v5-c-menu-toggle:is(button):has(> i:only-child),
20719
- .pf-v5-c-menu-toggle .pf-v5-c-button:has(> i:only-child) {
20720
- aspect-ratio: 1/1;
20721
- }
20722
20710
  .pf-v5-c-menu-toggle:is(:hover, :focus) {
20723
20711
  --pf-v5-c-menu-toggle--Color: var(--pf-v5-c-menu-toggle--hover--Color);
20724
20712
  --pf-v5-c-menu-toggle--BackgroundColor: var(--pf-v5-c-menu-toggle--hover--BackgroundColor);
@@ -20756,6 +20744,7 @@ ul.pf-v5-c-list {
20756
20744
  }
20757
20745
 
20758
20746
  .pf-v5-c-menu-toggle.pf-m-split-button {
20747
+ --pf-v5-c-menu-toggle--ColumnGap: 0;
20759
20748
  padding: 0;
20760
20749
  }
20761
20750
  .pf-v5-c-menu-toggle.pf-m-split-button > * {
@@ -20789,7 +20778,6 @@ ul.pf-v5-c-list {
20789
20778
  }
20790
20779
 
20791
20780
  .pf-v5-c-menu-toggle.pf-m-split-button.pf-m-action {
20792
- --pf-v5-c-menu-toggle--ColumnGap: 0;
20793
20781
  --pf-v5-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: var(--pf-v5-c-menu-toggle--BorderColor);
20794
20782
  }
20795
20783
  .pf-v5-c-menu-toggle.pf-m-split-button.pf-m-action > :not(:first-child) {
@@ -20830,6 +20818,7 @@ ul.pf-v5-c-list {
20830
20818
 
20831
20819
  .pf-v5-c-menu-toggle.pf-m-typeahead {
20832
20820
  --pf-v5-c-menu-toggle__button--AlignSelf: var(--pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf);
20821
+ --pf-v5-c-menu-toggle--ColumnGap: 0;
20833
20822
  align-items: stretch;
20834
20823
  padding: 0;
20835
20824
  }
@@ -20837,7 +20826,6 @@ ul.pf-v5-c-list {
20837
20826
  --pf-v5-c-menu-toggle__button--PaddingRight: 0;
20838
20827
  }
20839
20828
  .pf-v5-c-menu-toggle.pf-m-typeahead .pf-v5-c-menu-toggle__controls {
20840
- --pf-v5-c-menu-toggle--ColumnGap: 0;
20841
20829
  --pf-v5-c-menu-toggle__button--PaddingRight: 0;
20842
20830
  display: flex;
20843
20831
  align-items: stretch;
@@ -20864,8 +20852,6 @@ ul.pf-v5-c-list {
20864
20852
  .pf-v5-c-menu-toggle__icon {
20865
20853
  flex-shrink: 0;
20866
20854
  align-self: center;
20867
- margin-inline-end: var(--pf-v5-c-menu-toggle__icon--MarginRight);
20868
- line-height: 1;
20869
20855
  }
20870
20856
 
20871
20857
  .pf-v5-c-menu-toggle__text {
@@ -20878,7 +20864,6 @@ ul.pf-v5-c-list {
20878
20864
  .pf-v5-c-menu-toggle__count {
20879
20865
  display: flex;
20880
20866
  flex-wrap: nowrap;
20881
- margin-inline-start: var(--pf-v5-c-menu-toggle__count--MarginLeft);
20882
20867
  }
20883
20868
 
20884
20869
  .pf-v5-c-menu-toggle__controls {
@@ -20886,7 +20871,6 @@ ul.pf-v5-c-list {
20886
20871
  align-items: center;
20887
20872
  justify-content: center;
20888
20873
  min-width: var(--pf-v5-c-menu-toggle__controls--MinWidth);
20889
- margin-inline-start: var(--pf-v5-c-menu-toggle--ColumnGap);
20890
20874
  }
20891
20875
 
20892
20876
  .pf-v5-c-menu-toggle__toggle-icon {