@patternfly/patternfly 5.0.0-prerelease.13 → 5.0.0-prerelease.14

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 (42) hide show
  1. package/assets/images/pf-logo.svg +28 -0
  2. package/components/Badge/badge.css +1 -0
  3. package/components/Badge/badge.scss +1 -0
  4. package/components/Check/check.css +9 -11
  5. package/components/Check/check.scss +11 -11
  6. package/components/Dropdown/dropdown.css +14 -5
  7. package/components/Dropdown/dropdown.scss +17 -6
  8. package/components/MenuToggle/menu-toggle.css +10 -3
  9. package/components/MenuToggle/menu-toggle.scss +14 -3
  10. package/components/Radio/radio.css +8 -10
  11. package/components/Radio/radio.scss +10 -10
  12. package/components/Toolbar/toolbar.css +17 -10
  13. package/components/Toolbar/toolbar.scss +21 -10
  14. package/docs/components/Toolbar/examples/Toolbar.md +1 -2
  15. package/docs/demos/AboutModal/examples/AboutModal.md +6 -14
  16. package/docs/demos/Alert/examples/Alert.md +18 -42
  17. package/docs/demos/BackToTop/examples/BackToTop.md +6 -14
  18. package/docs/demos/Banner/examples/Banner.md +12 -28
  19. package/docs/demos/CardView/examples/CardView.md +6 -14
  20. package/docs/demos/ContextSelector/examples/ContextSelector.md +24 -56
  21. package/docs/demos/Dashboard/examples/Dashboard.md +6 -14
  22. package/docs/demos/DataList/examples/DataList.md +24 -56
  23. package/docs/demos/DescriptionList/examples/DescriptionList.md +18 -42
  24. package/docs/demos/Drawer/examples/Drawer.md +30 -70
  25. package/docs/demos/JumpLinks/examples/JumpLinks.md +36 -84
  26. package/docs/demos/Masthead/examples/Masthead.md +54 -126
  27. package/docs/demos/Modal/examples/Modal.md +36 -84
  28. package/docs/demos/Nav/examples/Nav.md +48 -112
  29. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +30 -70
  30. package/docs/demos/Page/examples/Page.md +54 -126
  31. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +42 -98
  32. package/docs/demos/Skeleton/examples/Skeleton.md +6 -14
  33. package/docs/demos/Table/examples/Table.md +90 -210
  34. package/docs/demos/Tabs/examples/Tabs.md +36 -84
  35. package/docs/demos/Toolbar/examples/Toolbar.md +12 -28
  36. package/docs/demos/Wizard/examples/Wizard.md +54 -126
  37. package/package.json +1 -1
  38. package/patternfly-no-globals.css +59 -39
  39. package/patternfly-theme-dark-unversioned.css +59 -39
  40. package/patternfly.css +59 -39
  41. package/patternfly.min.css +1 -1
  42. package/patternfly.min.css.map +1 -1
@@ -6749,6 +6749,7 @@ button) {
6749
6749
  font-weight: var(--pf-v5-c-badge--FontWeight);
6750
6750
  color: var(--pf-v5-c-badge--Color);
6751
6751
  text-align: center;
6752
+ white-space: nowrap;
6752
6753
  background-color: var(--pf-v5-c-badge--BackgroundColor);
6753
6754
  border-radius: var(--pf-v5-c-badge--BorderRadius);
6754
6755
  }
@@ -8224,9 +8225,8 @@ button.pf-v5-c-breadcrumb__link {
8224
8225
  --pf-v5-c-check__label--Color: var(--pf-v5-global--Color--100);
8225
8226
  --pf-v5-c-check__label--FontWeight: var(--pf-v5-global--FontWeight--normal);
8226
8227
  --pf-v5-c-check__label--FontSize: var(--pf-v5-global--FontSize--md);
8227
- --pf-v5-c-check__label--LineHeight: var(--pf-v5-global--LineHeight--sm);
8228
- --pf-v5-c-check__input--Height: var(--pf-v5-c-check__label--FontSize);
8229
- --pf-v5-c-check__input--MarginTop: calc(((var(--pf-v5-c-check__label--FontSize) * var(--pf-v5-c-check__label--LineHeight)) - var(--pf-v5-c-check__input--Height)) / 2);
8228
+ --pf-v5-c-check__label--LineHeight: var(--pf-v5-global--LineHeight--md);
8229
+ --pf-v5-c-check__input--TranslateY--moz: 5px;
8230
8230
  --pf-v5-c-check__description--FontSize: var(--pf-v5-global--FontSize--sm);
8231
8231
  --pf-v5-c-check__description--Color: var(--pf-v5-global--Color--200);
8232
8232
  --pf-v5-c-check__body--MarginTop: var(--pf-v5-global--spacer--sm);
@@ -8239,24 +8239,18 @@ button.pf-v5-c-breadcrumb__link {
8239
8239
  }
8240
8240
  .pf-v5-c-check.pf-m-standalone {
8241
8241
  --pf-v5-c-check--GridGap: 0;
8242
- --pf-v5-c-check__input--Height: auto;
8243
- --pf-v5-c-check__input--MarginTop: 0;
8242
+ --pf-v5-c-check__input--TranslateY--moz: 0;
8244
8243
  display: inline-grid;
8245
- line-height: 1;
8246
8244
  }
8247
8245
 
8248
8246
  .pf-v5-c-check__label {
8247
+ align-self: baseline;
8249
8248
  font-size: var(--pf-v5-c-check__label--FontSize);
8250
8249
  font-weight: var(--pf-v5-c-check__label--FontWeight);
8251
8250
  line-height: var(--pf-v5-c-check__label--LineHeight);
8252
8251
  color: var(--pf-v5-c-check__label--Color);
8253
8252
  }
8254
8253
 
8255
- .pf-v5-c-check__input {
8256
- height: var(--pf-v5-c-check__input--Height);
8257
- margin-top: var(--pf-v5-c-check__input--MarginTop);
8258
- }
8259
-
8260
8254
  .pf-v5-c-check__description {
8261
8255
  grid-column: 2;
8262
8256
  font-size: var(--pf-v5-c-check__description--FontSize);
@@ -8268,6 +8262,11 @@ button.pf-v5-c-breadcrumb__link {
8268
8262
  margin-top: var(--pf-v5-c-check__body--MarginTop);
8269
8263
  }
8270
8264
 
8265
+ .pf-v5-c-check__input {
8266
+ align-self: baseline;
8267
+ -moz-transform: translateY(var(--pf-v5-c-check__input--TranslateY--moz));
8268
+ }
8269
+
8271
8270
  .pf-v5-c-check__label,
8272
8271
  .pf-v5-c-check__input {
8273
8272
  justify-self: start;
@@ -10925,16 +10924,20 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10925
10924
  --pf-v5-c-toolbar--PaddingTop: var(--pf-v5-global--spacer--md);
10926
10925
  --pf-v5-c-toolbar--PaddingBottom: var(--pf-v5-global--spacer--md);
10927
10926
  --pf-v5-c-toolbar--item--RowGap--base: var(--pf-v5-global--spacer--xs);
10928
- --pf-v5-c-toolbar__item--Display: block;
10927
+ --pf-v5-c-toolbar__item--Display: flex;
10929
10928
  --pf-v5-c-toolbar__item--MinWidth--base: auto;
10930
- --pf-v5-c-toolbar__item--AlignSelf: auto;
10931
10929
  --pf-v5-c-toolbar__item--AlignItems: var(--pf-v5-c-toolbar--AlignItems--base);
10930
+ --pf-v5-c-toolbar__item--AlignSelf: var(--pf-v5-c-toolbar--AlignItems--base);
10932
10931
  --pf-v5-c-toolbar__group--Display: flex;
10932
+ --pf-v5-c-toolbar__group--RowGap: var(--pf-v5-c-toolbar--item--RowGap--base);
10933
10933
  --pf-v5-c-toolbar__group--AlignItems: var(--pf-v5-c-toolbar--AlignItems--base);
10934
10934
  --pf-v5-c-toolbar__group--AlignSelf: auto;
10935
- --pf-v5-c-toolbar__group--RowGap: var(--pf-v5-c-toolbar--item--RowGap--base);
10936
10935
  --pf-v5-c-toolbar--m-sticky--ZIndex: var(--pf-v5-global--ZIndex--xs);
10937
10936
  --pf-v5-c-toolbar--m-sticky--BoxShadow: var(--pf-v5-global--BoxShadow--sm-bottom);
10937
+ --pf-v5-c-toolbar--m-align-items-center--AlignItems: center;
10938
+ --pf-v5-c-toolbar--m-align-items-baseline--AlignItems: baseline;
10939
+ --pf-v5-c-toolbar--m-align-self-center--AlignSelf: center;
10940
+ --pf-v5-c-toolbar--m-align-self-baseline--AlignSelf: baseline;
10938
10941
  --pf-v5-c-toolbar__content--Display: flex;
10939
10942
  --pf-v5-c-toolbar__content--AlignItems: var(--pf-v5-c-toolbar--AlignItems--base);
10940
10943
  --pf-v5-c-toolbar__content--RowGap: var(--pf-v5-c-toolbar--RowGap--base);
@@ -10979,7 +10982,9 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10979
10982
  --pf-v5-c-toolbar__item--m-search-filter--spacer: var(--pf-v5-global--spacer--sm);
10980
10983
  --pf-v5-c-toolbar__item--m-chip-group--spacer: var(--pf-v5-global--spacer--sm);
10981
10984
  --pf-v5-c-toolbar__item--m-label--spacer: var(--pf-v5-c-toolbar__item--spacer);
10985
+ --pf-v5-c-toolbar__item--m-label--TranslateY: var(--pf-v5-global--spacer--form-element);
10982
10986
  --pf-v5-c-toolbar__item--m-label--FontWeight: var(--pf-v5-global--FontWeight--bold);
10987
+ --pf-v5-c-toolbar__item--m-form-control--TranslateY: var(--pf-v5-global--spacer--form-element);
10983
10988
  --pf-v5-c-toolbar__expandable-content__item--m-label--MarginBottom: calc(-1 * var(--pf-v5-c-toolbar__expandable-content--m-expanded--GridRowGap) + var(--pf-v5-global--spacer--sm));
10984
10989
  --pf-v5-c-toolbar__expandable-content__item--m-label--FontSize: var(--pf-v5-global--FontSize--sm);
10985
10990
  --pf-v5-c-toolbar__toggle--m-expanded__c-button--m-plain--Color: var(--pf-v5-global--Color--100);
@@ -10987,7 +10992,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10987
10992
  --pf-v5-c-toolbar--m-full-height--PaddingTop: 0;
10988
10993
  --pf-v5-c-toolbar--m-full-height--PaddingBottom: 0;
10989
10994
  --pf-v5-c-toolbar--m-full-height__item--Display: flex;
10990
- --pf-v5-c-toolbar--m-full-height__item--AlignItems: var(--pf-v5-c-toolbar__group--AlignItems);
10995
+ --pf-v5-c-toolbar--m-full-height__item--AlignItems: center;
10991
10996
  position: relative;
10992
10997
  display: grid;
10993
10998
  row-gap: var(--pf-v5-c-toolbar--RowGap);
@@ -11066,11 +11071,11 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11066
11071
  }
11067
11072
  .pf-v5-c-toolbar__content-section.pf-m-align-items-center,
11068
11073
  .pf-v5-c-toolbar__group.pf-m-align-items-center {
11069
- align-items: center;
11074
+ --pf-v5-c-toolbar__group--AlignItems: var(--pf-v5-c-toolbar--m-align-items-center--AlignItems);
11070
11075
  }
11071
11076
  .pf-v5-c-toolbar__content-section.pf-m-align-items-baseline,
11072
11077
  .pf-v5-c-toolbar__group.pf-m-align-items-baseline {
11073
- align-items: baseline;
11078
+ --pf-v5-c-toolbar__group--AlignItems: var(--pf-v5-c-toolbar--m-align-items-baseline--AlignItems);
11074
11079
  }
11075
11080
  .pf-v5-c-toolbar__content-section.pf-m-align-self-start,
11076
11081
  .pf-v5-c-toolbar__group.pf-m-align-self-start {
@@ -11078,11 +11083,11 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11078
11083
  }
11079
11084
  .pf-v5-c-toolbar__content-section.pf-m-align-self-center,
11080
11085
  .pf-v5-c-toolbar__group.pf-m-align-self-center {
11081
- align-self: center;
11086
+ --pf-v5-c-toolbar__group--AlignSelf: var(--pf-v5-c-toolbar--m-align-self-center--AlignItems);
11082
11087
  }
11083
11088
  .pf-v5-c-toolbar__content-section.pf-m-align-self-baseline,
11084
11089
  .pf-v5-c-toolbar__group.pf-m-align-self-baseline {
11085
- align-self: baseline;
11090
+ --pf-v5-c-toolbar__group--AlignSelf: var(--pf-v5-c-toolbar--m-align-self-baseline--AlignItems);
11086
11091
  }
11087
11092
 
11088
11093
  .pf-v5-c-toolbar__group {
@@ -11225,6 +11230,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11225
11230
  .pf-v5-c-toolbar__item.pf-m-label {
11226
11231
  --pf-v5-c-toolbar--spacer: var(--pf-v5-c-toolbar__item--m-label--spacer);
11227
11232
  font-weight: var(--pf-v5-c-toolbar__item--m-label--FontWeight);
11233
+ transform: translateY(var(--pf-v5-global--spacer--form-element));
11228
11234
  }
11229
11235
  .pf-v5-c-toolbar__item.pf-m-pagination {
11230
11236
  margin-left: auto;
@@ -11272,7 +11278,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11272
11278
  align-items: flex-start;
11273
11279
  }
11274
11280
  .pf-v5-c-toolbar__content-section.pf-m-align-items-center {
11275
- align-items: center;
11281
+ --pf-v5-c-toolbar__content-section--AlignItems: var(--pf-v5-c-toolbar--m-align-items-center--AlignItems);
11276
11282
  }
11277
11283
  .pf-v5-c-toolbar__content-section.pf-m-align-items-baseline {
11278
11284
  align-items: baseline;
@@ -11308,7 +11314,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11308
11314
  display: grid;
11309
11315
  grid-row-gap: var(--pf-v5-c-toolbar__expandable-content--m-expanded--GridRowGap);
11310
11316
  }
11311
- .pf-v5-c-toolbar__expandable-content .pf-m-label {
11317
+ .pf-v5-c-toolbar__expandable-content .pf-v5-c-toolbar__item.pf-m-label {
11312
11318
  margin-bottom: var(--pf-v5-c-toolbar__expandable-content__item--m-label--MarginBottom);
11313
11319
  font-size: var(--pf-v5-c-toolbar__expandable-content__item--m-label--FontSize);
11314
11320
  }
@@ -13347,7 +13353,6 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13347
13353
  --pf-v5-c-dropdown__toggle--m-split-button--m-action--child--PaddingLeft: var(--pf-v5-global--spacer--sm);
13348
13354
  --pf-v5-c-dropdown__toggle--m-split-button--m-action--child--PaddingRight: var(--pf-v5-global--spacer--sm);
13349
13355
  --pf-v5-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight: calc(-1 * var(--pf-v5-global--BorderWidth--sm));
13350
- --pf-v5-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY: -0.0625rem;
13351
13356
  --pf-v5-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft: var(--pf-v5-global--spacer--sm);
13352
13357
  --pf-v5-c-dropdown__toggle--m-split-button--child--BorderRadius: var(--pf-v5-global--BorderRadius--sm);
13353
13358
  --pf-v5-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius: var(--pf-v5-c-dropdown__toggle--m-split-button--child--BorderRadius);
@@ -13430,7 +13435,8 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13430
13435
  --pf-v5-c-dropdown--m-full-height__toggle--PaddingRight: var(--pf-v5-global--spacer--lg);
13431
13436
  --pf-v5-c-dropdown--m-full-height__toggle--PaddingLeft: var(--pf-v5-global--spacer--lg);
13432
13437
  position: relative;
13433
- display: inline-block;
13438
+ display: inline-flex;
13439
+ align-items: start;
13434
13440
  max-width: 100%;
13435
13441
  }
13436
13442
  .pf-v5-c-dropdown .pf-v5-c-divider {
@@ -13471,7 +13477,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13471
13477
 
13472
13478
  .pf-v5-c-dropdown__toggle {
13473
13479
  position: relative;
13474
- display: flex;
13480
+ display: inline-flex;
13475
13481
  column-gap: var(--pf-v5-c-dropdown__toggle--ColumnGap);
13476
13482
  align-items: center;
13477
13483
  min-width: var(--pf-v5-c-dropdown__toggle--MinWidth);
@@ -13547,6 +13553,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13547
13553
  .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check {
13548
13554
  display: flex;
13549
13555
  align-items: center;
13556
+ overflow: hidden;
13550
13557
  cursor: pointer;
13551
13558
  }
13552
13559
  .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check.pf-m-in-progress {
@@ -13555,9 +13562,13 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13555
13562
  }
13556
13563
  .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check > input,
13557
13564
  .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check .pf-v5-c-check {
13565
+ align-self: revert;
13566
+ width: auto;
13558
13567
  cursor: pointer;
13559
13568
  visibility: var(--pf-v5-c-dropdown__toggle--m-split-button__toggle-check__input--Visibility, unset);
13560
- transform: translateY(var(--pf-v5-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY));
13569
+ }
13570
+ .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check .pf-v5-c-check__input {
13571
+ -moz-transform: none;
13561
13572
  }
13562
13573
  .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-button {
13563
13574
  color: var(--pf-v5-c-dropdown__toggle-button--Color);
@@ -13727,6 +13738,10 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13727
13738
  white-space: nowrap;
13728
13739
  }
13729
13740
 
13741
+ .pf-v5-c-dropdown__toggle-button {
13742
+ align-self: baseline;
13743
+ }
13744
+
13730
13745
  .pf-v5-c-dropdown__toggle-text {
13731
13746
  flex: 1 1 auto;
13732
13747
  text-align: left;
@@ -13746,12 +13761,12 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13746
13761
  .pf-v5-c-dropdown__toggle-image {
13747
13762
  display: inline-flex;
13748
13763
  flex-shrink: 0;
13749
- align-self: center;
13750
13764
  line-height: 1;
13751
13765
  }
13752
13766
 
13753
13767
  .pf-v5-c-dropdown__toggle-progress {
13754
13768
  position: absolute;
13769
+ left: var(--pf-v5-c-dropdown__toggle--m-split-button--child--PaddingLeft);
13755
13770
  visibility: var(--pf-v5-c-dropdown__toggle-progress--Visibility);
13756
13771
  }
13757
13772
  .pf-v5-c-dropdown__toggle-progress .pf-v5-c-spinner {
@@ -18257,6 +18272,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18257
18272
  --pf-v5-c-menu-toggle--m-split-button--m-action--m-primary--m-expanded--child--BackgroundColor: var(--pf-v5-global--primary-color--200);
18258
18273
  --pf-v5-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderLeftColor: var(--pf-v5-global--primary-color--100);
18259
18274
  --pf-v5-c-menu-toggle__button--BackgroundColor: transparent;
18275
+ --pf-v5-c-menu-toggle__button--AlignSelf: baseline;
18260
18276
  --pf-v5-c-menu-toggle__button--PaddingLeft: var(--pf-v5-global--spacer--sm);
18261
18277
  --pf-v5-c-menu-toggle__button--PaddingRight: var(--pf-v5-global--spacer--sm);
18262
18278
  --pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-global--spacer--sm);
@@ -18264,6 +18280,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18264
18280
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-v5-global--spacer--sm);
18265
18281
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
18266
18282
  --pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
18283
+ --pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf: center;
18267
18284
  position: relative;
18268
18285
  display: inline-flex;
18269
18286
  align-items: center;
@@ -18356,6 +18373,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18356
18373
  --pf-v5-c-menu-toggle--hover--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--m-full-height--hover--after--BorderBottomWidth);
18357
18374
  --pf-v5-c-menu-toggle--focus--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--m-full-height--focus--after--BorderBottomWidth);
18358
18375
  --pf-v5-c-menu-toggle--active--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--m-full-height--active--after--BorderBottomWidth);
18376
+ align-items: center;
18359
18377
  height: 100%;
18360
18378
  }
18361
18379
  .pf-v5-c-menu-toggle:hover {
@@ -18399,6 +18417,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18399
18417
  .pf-v5-c-menu-toggle.pf-m-typeahead {
18400
18418
  --pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight);
18401
18419
  --pf-v5-c-menu-toggle__button__controls--MarginLeft: var(--pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft);
18420
+ --pf-v5-c-menu-toggle__button--AlignSelf: var(--pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf);
18402
18421
  align-items: stretch;
18403
18422
  padding: 0;
18404
18423
  }
@@ -18422,12 +18441,15 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18422
18441
  }
18423
18442
  .pf-v5-c-menu-toggle.pf-m-split-button > .pf-v5-c-check {
18424
18443
  --pf-v5-c-menu-toggle--PaddingRight: 0;
18425
- --pf-v5-c-check__input--MarginTop: 0;
18426
18444
  --pf-v5-c-check__label--Color: currentcolor;
18427
18445
  --pf-v5-c-check__label--disabled--Color: currentcolor;
18428
18446
  align-items: center;
18429
18447
  align-self: stretch;
18430
18448
  }
18449
+ .pf-v5-c-menu-toggle.pf-m-split-button > .pf-v5-c-check .pf-v5-c-check__input {
18450
+ align-self: revert;
18451
+ -moz-transform: none;
18452
+ }
18431
18453
  .pf-v5-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *::after {
18432
18454
  position: absolute;
18433
18455
  top: 0;
@@ -18513,6 +18535,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18513
18535
  --pf-v5-c-menu-toggle__controls--PaddingLeft: 0;
18514
18536
  --pf-v5-c-menu-toggle__controls--MarginRight: var(--pf-v5-c-menu-toggle__button__controls--MarginRight);
18515
18537
  --pf-v5-c-menu-toggle__controls--MarginLeft: var(--pf-v5-c-menu-toggle__button__controls--MarginLeft);
18538
+ align-self: var(--pf-v5-c-menu-toggle__button--AlignSelf);
18516
18539
  padding-right: var(--pf-v5-c-menu-toggle__button--PaddingRight);
18517
18540
  padding-left: var(--pf-v5-c-menu-toggle__button--PaddingLeft);
18518
18541
  color: inherit;
@@ -18521,7 +18544,6 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18521
18544
  }
18522
18545
 
18523
18546
  .pf-v5-c-menu-toggle__icon {
18524
- display: inline-flex;
18525
18547
  flex-shrink: 0;
18526
18548
  align-self: center;
18527
18549
  margin-right: var(--pf-v5-c-menu-toggle__icon--MarginRight);
@@ -18537,7 +18559,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18537
18559
 
18538
18560
  .pf-v5-c-menu-toggle__count {
18539
18561
  display: flex;
18540
- align-items: center;
18562
+ flex-wrap: nowrap;
18541
18563
  margin-left: var(--pf-v5-c-menu-toggle__count--MarginLeft);
18542
18564
  }
18543
18565
 
@@ -23080,24 +23102,23 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
23080
23102
  --pf-v5-c-radio__label--Color: var(--pf-v5-global--Color--100);
23081
23103
  --pf-v5-c-radio__label--FontWeight: var(--pf-v5-global--FontWeight--normal);
23082
23104
  --pf-v5-c-radio__label--FontSize: var(--pf-v5-global--FontSize--md);
23083
- --pf-v5-c-radio__label--LineHeight: var(--pf-v5-global--LineHeight--sm);
23084
- --pf-v5-c-radio__input--Height: var(--pf-v5-c-radio__label--FontSize);
23085
- --pf-v5-c-radio__input--MarginTop: calc(((var(--pf-v5-c-radio__label--FontSize) * var(--pf-v5-c-radio__label--LineHeight)) - var(--pf-v5-c-radio__input--Height)) / 2);
23105
+ --pf-v5-c-radio__label--LineHeight: var(--pf-v5-global--LineHeight--md);
23106
+ --pf-v5-c-radio__input--TranslateY--moz: 5px;
23086
23107
  --pf-v5-c-radio__input--first-child--MarginLeft: 0.0625rem;
23087
23108
  --pf-v5-c-radio__input--last-child--MarginRight: 0.0625rem;
23088
23109
  --pf-v5-c-radio__description--FontSize: var(--pf-v5-global--FontSize--sm);
23089
23110
  --pf-v5-c-radio__description--Color: var(--pf-v5-global--Color--200);
23090
23111
  --pf-v5-c-radio__body--MarginTop: var(--pf-v5-global--spacer--sm);
23091
- display: grid;
23112
+ display: inline-grid;
23092
23113
  grid-template-columns: auto 1fr;
23093
23114
  grid-gap: var(--pf-v5-c-radio--GridGap);
23115
+ align-items: baseline;
23116
+ width: 100%;
23094
23117
  }
23095
23118
  .pf-v5-c-radio.pf-m-standalone {
23096
23119
  --pf-v5-c-radio--GridGap: 0;
23097
- --pf-v5-c-radio__input--Height: auto;
23098
- --pf-v5-c-radio__input--MarginTop: 0;
23099
- display: inline-grid;
23100
- line-height: 1;
23120
+ --pf-v5-c-radio__input--TranslateY--moz: 0;
23121
+ width: auto;
23101
23122
  }
23102
23123
 
23103
23124
  .pf-v5-c-radio__label {
@@ -23108,8 +23129,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
23108
23129
  }
23109
23130
 
23110
23131
  .pf-v5-c-radio__input {
23111
- height: var(--pf-v5-c-radio__input--Height);
23112
- margin-top: var(--pf-v5-c-radio__input--MarginTop);
23132
+ -moz-transform: translateY(var(--pf-v5-c-radio__input--TranslateY--moz));
23113
23133
  }
23114
23134
  .pf-v5-c-radio__input:first-child {
23115
23135
  margin-left: var(--pf-v5-c-radio__input--first-child--MarginLeft);
package/patternfly.css CHANGED
@@ -6749,6 +6749,7 @@ button) {
6749
6749
  font-weight: var(--pf-v5-c-badge--FontWeight);
6750
6750
  color: var(--pf-v5-c-badge--Color);
6751
6751
  text-align: center;
6752
+ white-space: nowrap;
6752
6753
  background-color: var(--pf-v5-c-badge--BackgroundColor);
6753
6754
  border-radius: var(--pf-v5-c-badge--BorderRadius);
6754
6755
  }
@@ -8224,9 +8225,8 @@ button.pf-v5-c-breadcrumb__link {
8224
8225
  --pf-v5-c-check__label--Color: var(--pf-v5-global--Color--100);
8225
8226
  --pf-v5-c-check__label--FontWeight: var(--pf-v5-global--FontWeight--normal);
8226
8227
  --pf-v5-c-check__label--FontSize: var(--pf-v5-global--FontSize--md);
8227
- --pf-v5-c-check__label--LineHeight: var(--pf-v5-global--LineHeight--sm);
8228
- --pf-v5-c-check__input--Height: var(--pf-v5-c-check__label--FontSize);
8229
- --pf-v5-c-check__input--MarginTop: calc(((var(--pf-v5-c-check__label--FontSize) * var(--pf-v5-c-check__label--LineHeight)) - var(--pf-v5-c-check__input--Height)) / 2);
8228
+ --pf-v5-c-check__label--LineHeight: var(--pf-v5-global--LineHeight--md);
8229
+ --pf-v5-c-check__input--TranslateY--moz: 5px;
8230
8230
  --pf-v5-c-check__description--FontSize: var(--pf-v5-global--FontSize--sm);
8231
8231
  --pf-v5-c-check__description--Color: var(--pf-v5-global--Color--200);
8232
8232
  --pf-v5-c-check__body--MarginTop: var(--pf-v5-global--spacer--sm);
@@ -8239,24 +8239,18 @@ button.pf-v5-c-breadcrumb__link {
8239
8239
  }
8240
8240
  .pf-v5-c-check.pf-m-standalone {
8241
8241
  --pf-v5-c-check--GridGap: 0;
8242
- --pf-v5-c-check__input--Height: auto;
8243
- --pf-v5-c-check__input--MarginTop: 0;
8242
+ --pf-v5-c-check__input--TranslateY--moz: 0;
8244
8243
  display: inline-grid;
8245
- line-height: 1;
8246
8244
  }
8247
8245
 
8248
8246
  .pf-v5-c-check__label {
8247
+ align-self: baseline;
8249
8248
  font-size: var(--pf-v5-c-check__label--FontSize);
8250
8249
  font-weight: var(--pf-v5-c-check__label--FontWeight);
8251
8250
  line-height: var(--pf-v5-c-check__label--LineHeight);
8252
8251
  color: var(--pf-v5-c-check__label--Color);
8253
8252
  }
8254
8253
 
8255
- .pf-v5-c-check__input {
8256
- height: var(--pf-v5-c-check__input--Height);
8257
- margin-top: var(--pf-v5-c-check__input--MarginTop);
8258
- }
8259
-
8260
8254
  .pf-v5-c-check__description {
8261
8255
  grid-column: 2;
8262
8256
  font-size: var(--pf-v5-c-check__description--FontSize);
@@ -8268,6 +8262,11 @@ button.pf-v5-c-breadcrumb__link {
8268
8262
  margin-top: var(--pf-v5-c-check__body--MarginTop);
8269
8263
  }
8270
8264
 
8265
+ .pf-v5-c-check__input {
8266
+ align-self: baseline;
8267
+ -moz-transform: translateY(var(--pf-v5-c-check__input--TranslateY--moz));
8268
+ }
8269
+
8271
8270
  .pf-v5-c-check__label,
8272
8271
  .pf-v5-c-check__input {
8273
8272
  justify-self: start;
@@ -10925,16 +10924,20 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10925
10924
  --pf-v5-c-toolbar--PaddingTop: var(--pf-v5-global--spacer--md);
10926
10925
  --pf-v5-c-toolbar--PaddingBottom: var(--pf-v5-global--spacer--md);
10927
10926
  --pf-v5-c-toolbar--item--RowGap--base: var(--pf-v5-global--spacer--xs);
10928
- --pf-v5-c-toolbar__item--Display: block;
10927
+ --pf-v5-c-toolbar__item--Display: flex;
10929
10928
  --pf-v5-c-toolbar__item--MinWidth--base: auto;
10930
- --pf-v5-c-toolbar__item--AlignSelf: auto;
10931
10929
  --pf-v5-c-toolbar__item--AlignItems: var(--pf-v5-c-toolbar--AlignItems--base);
10930
+ --pf-v5-c-toolbar__item--AlignSelf: var(--pf-v5-c-toolbar--AlignItems--base);
10932
10931
  --pf-v5-c-toolbar__group--Display: flex;
10932
+ --pf-v5-c-toolbar__group--RowGap: var(--pf-v5-c-toolbar--item--RowGap--base);
10933
10933
  --pf-v5-c-toolbar__group--AlignItems: var(--pf-v5-c-toolbar--AlignItems--base);
10934
10934
  --pf-v5-c-toolbar__group--AlignSelf: auto;
10935
- --pf-v5-c-toolbar__group--RowGap: var(--pf-v5-c-toolbar--item--RowGap--base);
10936
10935
  --pf-v5-c-toolbar--m-sticky--ZIndex: var(--pf-v5-global--ZIndex--xs);
10937
10936
  --pf-v5-c-toolbar--m-sticky--BoxShadow: var(--pf-v5-global--BoxShadow--sm-bottom);
10937
+ --pf-v5-c-toolbar--m-align-items-center--AlignItems: center;
10938
+ --pf-v5-c-toolbar--m-align-items-baseline--AlignItems: baseline;
10939
+ --pf-v5-c-toolbar--m-align-self-center--AlignSelf: center;
10940
+ --pf-v5-c-toolbar--m-align-self-baseline--AlignSelf: baseline;
10938
10941
  --pf-v5-c-toolbar__content--Display: flex;
10939
10942
  --pf-v5-c-toolbar__content--AlignItems: var(--pf-v5-c-toolbar--AlignItems--base);
10940
10943
  --pf-v5-c-toolbar__content--RowGap: var(--pf-v5-c-toolbar--RowGap--base);
@@ -10979,7 +10982,9 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10979
10982
  --pf-v5-c-toolbar__item--m-search-filter--spacer: var(--pf-v5-global--spacer--sm);
10980
10983
  --pf-v5-c-toolbar__item--m-chip-group--spacer: var(--pf-v5-global--spacer--sm);
10981
10984
  --pf-v5-c-toolbar__item--m-label--spacer: var(--pf-v5-c-toolbar__item--spacer);
10985
+ --pf-v5-c-toolbar__item--m-label--TranslateY: var(--pf-v5-global--spacer--form-element);
10982
10986
  --pf-v5-c-toolbar__item--m-label--FontWeight: var(--pf-v5-global--FontWeight--bold);
10987
+ --pf-v5-c-toolbar__item--m-form-control--TranslateY: var(--pf-v5-global--spacer--form-element);
10983
10988
  --pf-v5-c-toolbar__expandable-content__item--m-label--MarginBottom: calc(-1 * var(--pf-v5-c-toolbar__expandable-content--m-expanded--GridRowGap) + var(--pf-v5-global--spacer--sm));
10984
10989
  --pf-v5-c-toolbar__expandable-content__item--m-label--FontSize: var(--pf-v5-global--FontSize--sm);
10985
10990
  --pf-v5-c-toolbar__toggle--m-expanded__c-button--m-plain--Color: var(--pf-v5-global--Color--100);
@@ -10987,7 +10992,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10987
10992
  --pf-v5-c-toolbar--m-full-height--PaddingTop: 0;
10988
10993
  --pf-v5-c-toolbar--m-full-height--PaddingBottom: 0;
10989
10994
  --pf-v5-c-toolbar--m-full-height__item--Display: flex;
10990
- --pf-v5-c-toolbar--m-full-height__item--AlignItems: var(--pf-v5-c-toolbar__group--AlignItems);
10995
+ --pf-v5-c-toolbar--m-full-height__item--AlignItems: center;
10991
10996
  position: relative;
10992
10997
  display: grid;
10993
10998
  row-gap: var(--pf-v5-c-toolbar--RowGap);
@@ -11066,11 +11071,11 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11066
11071
  }
11067
11072
  .pf-v5-c-toolbar__content-section.pf-m-align-items-center,
11068
11073
  .pf-v5-c-toolbar__group.pf-m-align-items-center {
11069
- align-items: center;
11074
+ --pf-v5-c-toolbar__group--AlignItems: var(--pf-v5-c-toolbar--m-align-items-center--AlignItems);
11070
11075
  }
11071
11076
  .pf-v5-c-toolbar__content-section.pf-m-align-items-baseline,
11072
11077
  .pf-v5-c-toolbar__group.pf-m-align-items-baseline {
11073
- align-items: baseline;
11078
+ --pf-v5-c-toolbar__group--AlignItems: var(--pf-v5-c-toolbar--m-align-items-baseline--AlignItems);
11074
11079
  }
11075
11080
  .pf-v5-c-toolbar__content-section.pf-m-align-self-start,
11076
11081
  .pf-v5-c-toolbar__group.pf-m-align-self-start {
@@ -11078,11 +11083,11 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11078
11083
  }
11079
11084
  .pf-v5-c-toolbar__content-section.pf-m-align-self-center,
11080
11085
  .pf-v5-c-toolbar__group.pf-m-align-self-center {
11081
- align-self: center;
11086
+ --pf-v5-c-toolbar__group--AlignSelf: var(--pf-v5-c-toolbar--m-align-self-center--AlignItems);
11082
11087
  }
11083
11088
  .pf-v5-c-toolbar__content-section.pf-m-align-self-baseline,
11084
11089
  .pf-v5-c-toolbar__group.pf-m-align-self-baseline {
11085
- align-self: baseline;
11090
+ --pf-v5-c-toolbar__group--AlignSelf: var(--pf-v5-c-toolbar--m-align-self-baseline--AlignItems);
11086
11091
  }
11087
11092
 
11088
11093
  .pf-v5-c-toolbar__group {
@@ -11225,6 +11230,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11225
11230
  .pf-v5-c-toolbar__item.pf-m-label {
11226
11231
  --pf-v5-c-toolbar--spacer: var(--pf-v5-c-toolbar__item--m-label--spacer);
11227
11232
  font-weight: var(--pf-v5-c-toolbar__item--m-label--FontWeight);
11233
+ transform: translateY(var(--pf-v5-global--spacer--form-element));
11228
11234
  }
11229
11235
  .pf-v5-c-toolbar__item.pf-m-pagination {
11230
11236
  margin-left: auto;
@@ -11272,7 +11278,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11272
11278
  align-items: flex-start;
11273
11279
  }
11274
11280
  .pf-v5-c-toolbar__content-section.pf-m-align-items-center {
11275
- align-items: center;
11281
+ --pf-v5-c-toolbar__content-section--AlignItems: var(--pf-v5-c-toolbar--m-align-items-center--AlignItems);
11276
11282
  }
11277
11283
  .pf-v5-c-toolbar__content-section.pf-m-align-items-baseline {
11278
11284
  align-items: baseline;
@@ -11308,7 +11314,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11308
11314
  display: grid;
11309
11315
  grid-row-gap: var(--pf-v5-c-toolbar__expandable-content--m-expanded--GridRowGap);
11310
11316
  }
11311
- .pf-v5-c-toolbar__expandable-content .pf-m-label {
11317
+ .pf-v5-c-toolbar__expandable-content .pf-v5-c-toolbar__item.pf-m-label {
11312
11318
  margin-bottom: var(--pf-v5-c-toolbar__expandable-content__item--m-label--MarginBottom);
11313
11319
  font-size: var(--pf-v5-c-toolbar__expandable-content__item--m-label--FontSize);
11314
11320
  }
@@ -13347,7 +13353,6 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13347
13353
  --pf-v5-c-dropdown__toggle--m-split-button--m-action--child--PaddingLeft: var(--pf-v5-global--spacer--sm);
13348
13354
  --pf-v5-c-dropdown__toggle--m-split-button--m-action--child--PaddingRight: var(--pf-v5-global--spacer--sm);
13349
13355
  --pf-v5-c-dropdown__toggle--m-split-button--m-action__toggle-button--MarginRight: calc(-1 * var(--pf-v5-global--BorderWidth--sm));
13350
- --pf-v5-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY: -0.0625rem;
13351
13356
  --pf-v5-c-dropdown__toggle--m-split-button__toggle-text--MarginLeft: var(--pf-v5-global--spacer--sm);
13352
13357
  --pf-v5-c-dropdown__toggle--m-split-button--child--BorderRadius: var(--pf-v5-global--BorderRadius--sm);
13353
13358
  --pf-v5-c-dropdown__toggle--m-split-button--m-primary--child--BorderRadius: var(--pf-v5-c-dropdown__toggle--m-split-button--child--BorderRadius);
@@ -13430,7 +13435,8 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13430
13435
  --pf-v5-c-dropdown--m-full-height__toggle--PaddingRight: var(--pf-v5-global--spacer--lg);
13431
13436
  --pf-v5-c-dropdown--m-full-height__toggle--PaddingLeft: var(--pf-v5-global--spacer--lg);
13432
13437
  position: relative;
13433
- display: inline-block;
13438
+ display: inline-flex;
13439
+ align-items: start;
13434
13440
  max-width: 100%;
13435
13441
  }
13436
13442
  .pf-v5-c-dropdown .pf-v5-c-divider {
@@ -13471,7 +13477,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13471
13477
 
13472
13478
  .pf-v5-c-dropdown__toggle {
13473
13479
  position: relative;
13474
- display: flex;
13480
+ display: inline-flex;
13475
13481
  column-gap: var(--pf-v5-c-dropdown__toggle--ColumnGap);
13476
13482
  align-items: center;
13477
13483
  min-width: var(--pf-v5-c-dropdown__toggle--MinWidth);
@@ -13547,6 +13553,7 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13547
13553
  .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check {
13548
13554
  display: flex;
13549
13555
  align-items: center;
13556
+ overflow: hidden;
13550
13557
  cursor: pointer;
13551
13558
  }
13552
13559
  .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check.pf-m-in-progress {
@@ -13555,9 +13562,13 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13555
13562
  }
13556
13563
  .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check > input,
13557
13564
  .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check .pf-v5-c-check {
13565
+ align-self: revert;
13566
+ width: auto;
13558
13567
  cursor: pointer;
13559
13568
  visibility: var(--pf-v5-c-dropdown__toggle--m-split-button__toggle-check__input--Visibility, unset);
13560
- transform: translateY(var(--pf-v5-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY));
13569
+ }
13570
+ .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-check .pf-v5-c-check__input {
13571
+ -moz-transform: none;
13561
13572
  }
13562
13573
  .pf-v5-c-dropdown__toggle.pf-m-split-button .pf-v5-c-dropdown__toggle-button {
13563
13574
  color: var(--pf-v5-c-dropdown__toggle-button--Color);
@@ -13727,6 +13738,10 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13727
13738
  white-space: nowrap;
13728
13739
  }
13729
13740
 
13741
+ .pf-v5-c-dropdown__toggle-button {
13742
+ align-self: baseline;
13743
+ }
13744
+
13730
13745
  .pf-v5-c-dropdown__toggle-text {
13731
13746
  flex: 1 1 auto;
13732
13747
  text-align: left;
@@ -13746,12 +13761,12 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
13746
13761
  .pf-v5-c-dropdown__toggle-image {
13747
13762
  display: inline-flex;
13748
13763
  flex-shrink: 0;
13749
- align-self: center;
13750
13764
  line-height: 1;
13751
13765
  }
13752
13766
 
13753
13767
  .pf-v5-c-dropdown__toggle-progress {
13754
13768
  position: absolute;
13769
+ left: var(--pf-v5-c-dropdown__toggle--m-split-button--child--PaddingLeft);
13755
13770
  visibility: var(--pf-v5-c-dropdown__toggle-progress--Visibility);
13756
13771
  }
13757
13772
  .pf-v5-c-dropdown__toggle-progress .pf-v5-c-spinner {
@@ -18257,6 +18272,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18257
18272
  --pf-v5-c-menu-toggle--m-split-button--m-action--m-primary--m-expanded--child--BackgroundColor: var(--pf-v5-global--primary-color--200);
18258
18273
  --pf-v5-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderLeftColor: var(--pf-v5-global--primary-color--100);
18259
18274
  --pf-v5-c-menu-toggle__button--BackgroundColor: transparent;
18275
+ --pf-v5-c-menu-toggle__button--AlignSelf: baseline;
18260
18276
  --pf-v5-c-menu-toggle__button--PaddingLeft: var(--pf-v5-global--spacer--sm);
18261
18277
  --pf-v5-c-menu-toggle__button--PaddingRight: var(--pf-v5-global--spacer--sm);
18262
18278
  --pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-global--spacer--sm);
@@ -18264,6 +18280,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18264
18280
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-v5-global--spacer--sm);
18265
18281
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
18266
18282
  --pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
18283
+ --pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf: center;
18267
18284
  position: relative;
18268
18285
  display: inline-flex;
18269
18286
  align-items: center;
@@ -18356,6 +18373,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18356
18373
  --pf-v5-c-menu-toggle--hover--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--m-full-height--hover--after--BorderBottomWidth);
18357
18374
  --pf-v5-c-menu-toggle--focus--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--m-full-height--focus--after--BorderBottomWidth);
18358
18375
  --pf-v5-c-menu-toggle--active--after--BorderBottomWidth: var(--pf-v5-c-menu-toggle--m-full-height--active--after--BorderBottomWidth);
18376
+ align-items: center;
18359
18377
  height: 100%;
18360
18378
  }
18361
18379
  .pf-v5-c-menu-toggle:hover {
@@ -18399,6 +18417,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18399
18417
  .pf-v5-c-menu-toggle.pf-m-typeahead {
18400
18418
  --pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight);
18401
18419
  --pf-v5-c-menu-toggle__button__controls--MarginLeft: var(--pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft);
18420
+ --pf-v5-c-menu-toggle__button--AlignSelf: var(--pf-v5-c-menu-toggle--m-typeahead__button--AlignSelf);
18402
18421
  align-items: stretch;
18403
18422
  padding: 0;
18404
18423
  }
@@ -18422,12 +18441,15 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18422
18441
  }
18423
18442
  .pf-v5-c-menu-toggle.pf-m-split-button > .pf-v5-c-check {
18424
18443
  --pf-v5-c-menu-toggle--PaddingRight: 0;
18425
- --pf-v5-c-check__input--MarginTop: 0;
18426
18444
  --pf-v5-c-check__label--Color: currentcolor;
18427
18445
  --pf-v5-c-check__label--disabled--Color: currentcolor;
18428
18446
  align-items: center;
18429
18447
  align-self: stretch;
18430
18448
  }
18449
+ .pf-v5-c-menu-toggle.pf-m-split-button > .pf-v5-c-check .pf-v5-c-check__input {
18450
+ align-self: revert;
18451
+ -moz-transform: none;
18452
+ }
18431
18453
  .pf-v5-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *::after {
18432
18454
  position: absolute;
18433
18455
  top: 0;
@@ -18513,6 +18535,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18513
18535
  --pf-v5-c-menu-toggle__controls--PaddingLeft: 0;
18514
18536
  --pf-v5-c-menu-toggle__controls--MarginRight: var(--pf-v5-c-menu-toggle__button__controls--MarginRight);
18515
18537
  --pf-v5-c-menu-toggle__controls--MarginLeft: var(--pf-v5-c-menu-toggle__button__controls--MarginLeft);
18538
+ align-self: var(--pf-v5-c-menu-toggle__button--AlignSelf);
18516
18539
  padding-right: var(--pf-v5-c-menu-toggle__button--PaddingRight);
18517
18540
  padding-left: var(--pf-v5-c-menu-toggle__button--PaddingLeft);
18518
18541
  color: inherit;
@@ -18521,7 +18544,6 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18521
18544
  }
18522
18545
 
18523
18546
  .pf-v5-c-menu-toggle__icon {
18524
- display: inline-flex;
18525
18547
  flex-shrink: 0;
18526
18548
  align-self: center;
18527
18549
  margin-right: var(--pf-v5-c-menu-toggle__icon--MarginRight);
@@ -18537,7 +18559,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18537
18559
 
18538
18560
  .pf-v5-c-menu-toggle__count {
18539
18561
  display: flex;
18540
- align-items: center;
18562
+ flex-wrap: nowrap;
18541
18563
  margin-left: var(--pf-v5-c-menu-toggle__count--MarginLeft);
18542
18564
  }
18543
18565
 
@@ -23080,24 +23102,23 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
23080
23102
  --pf-v5-c-radio__label--Color: var(--pf-v5-global--Color--100);
23081
23103
  --pf-v5-c-radio__label--FontWeight: var(--pf-v5-global--FontWeight--normal);
23082
23104
  --pf-v5-c-radio__label--FontSize: var(--pf-v5-global--FontSize--md);
23083
- --pf-v5-c-radio__label--LineHeight: var(--pf-v5-global--LineHeight--sm);
23084
- --pf-v5-c-radio__input--Height: var(--pf-v5-c-radio__label--FontSize);
23085
- --pf-v5-c-radio__input--MarginTop: calc(((var(--pf-v5-c-radio__label--FontSize) * var(--pf-v5-c-radio__label--LineHeight)) - var(--pf-v5-c-radio__input--Height)) / 2);
23105
+ --pf-v5-c-radio__label--LineHeight: var(--pf-v5-global--LineHeight--md);
23106
+ --pf-v5-c-radio__input--TranslateY--moz: 5px;
23086
23107
  --pf-v5-c-radio__input--first-child--MarginLeft: 0.0625rem;
23087
23108
  --pf-v5-c-radio__input--last-child--MarginRight: 0.0625rem;
23088
23109
  --pf-v5-c-radio__description--FontSize: var(--pf-v5-global--FontSize--sm);
23089
23110
  --pf-v5-c-radio__description--Color: var(--pf-v5-global--Color--200);
23090
23111
  --pf-v5-c-radio__body--MarginTop: var(--pf-v5-global--spacer--sm);
23091
- display: grid;
23112
+ display: inline-grid;
23092
23113
  grid-template-columns: auto 1fr;
23093
23114
  grid-gap: var(--pf-v5-c-radio--GridGap);
23115
+ align-items: baseline;
23116
+ width: 100%;
23094
23117
  }
23095
23118
  .pf-v5-c-radio.pf-m-standalone {
23096
23119
  --pf-v5-c-radio--GridGap: 0;
23097
- --pf-v5-c-radio__input--Height: auto;
23098
- --pf-v5-c-radio__input--MarginTop: 0;
23099
- display: inline-grid;
23100
- line-height: 1;
23120
+ --pf-v5-c-radio__input--TranslateY--moz: 0;
23121
+ width: auto;
23101
23122
  }
23102
23123
 
23103
23124
  .pf-v5-c-radio__label {
@@ -23108,8 +23129,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
23108
23129
  }
23109
23130
 
23110
23131
  .pf-v5-c-radio__input {
23111
- height: var(--pf-v5-c-radio__input--Height);
23112
- margin-top: var(--pf-v5-c-radio__input--MarginTop);
23132
+ -moz-transform: translateY(var(--pf-v5-c-radio__input--TranslateY--moz));
23113
23133
  }
23114
23134
  .pf-v5-c-radio__input:first-child {
23115
23135
  margin-left: var(--pf-v5-c-radio__input--first-child--MarginLeft);