@patternfly/patternfly 4.206.1 → 4.207.0

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 (62) hide show
  1. package/RELEASE-NOTES.md +41 -0
  2. package/components/Button/button.css +20 -0
  3. package/components/Button/button.scss +23 -0
  4. package/components/Button/themes/dark/button.scss +1 -0
  5. package/components/Check/check.css +9 -0
  6. package/components/Check/check.scss +11 -0
  7. package/components/ContextSelector/context-selector.css +6 -0
  8. package/components/ContextSelector/context-selector.scss +7 -1
  9. package/components/Dropdown/dropdown.css +6 -0
  10. package/components/Dropdown/dropdown.scss +7 -0
  11. package/components/ExpandableSection/expandable-section.css +18 -1
  12. package/components/ExpandableSection/expandable-section.scss +25 -1
  13. package/components/InputGroup/input-group.css +3 -0
  14. package/components/InputGroup/input-group.scss +4 -0
  15. package/components/Masthead/masthead.css +6 -3
  16. package/components/Masthead/masthead.scss +4 -0
  17. package/components/Menu/menu.css +0 -4
  18. package/components/Menu/menu.scss +0 -4
  19. package/components/Page/page.css +50 -0
  20. package/components/Page/page.scss +20 -6
  21. package/components/Select/select.css +6 -0
  22. package/components/Select/select.scss +7 -0
  23. package/components/Wizard/themes/dark/wizard.scss +2 -2
  24. package/components/Wizard/wizard.css +2 -2
  25. package/docs/components/Avatar/examples/Avatar.md +10 -10
  26. package/docs/components/Button/examples/Button.md +19 -0
  27. package/docs/components/Card/examples/Card.css +3 -3
  28. package/docs/components/Check/examples/Check.md +33 -12
  29. package/docs/components/CodeBlock/examples/CodeBlock.md +8 -6
  30. package/docs/components/Dropdown/examples/Dropdown.md +2 -1
  31. package/docs/components/ExpandableSection/examples/ExpandableSection.md +51 -13
  32. package/docs/components/InputGroup/examples/InputGroup.md +1 -0
  33. package/docs/components/Masthead/examples/masthead.md +5 -6
  34. package/docs/components/MenuToggle/examples/MenuToggle.md +6 -6
  35. package/docs/components/TextInputGroup/examples/TextInputGroup.md +38 -0
  36. package/docs/demos/AboutModal/examples/AboutModal.md +1 -1
  37. package/docs/demos/Alert/examples/Alert.md +3 -3
  38. package/docs/demos/BackToTop/examples/BackToTop.md +1 -1
  39. package/docs/demos/Banner/examples/Banner.md +2 -2
  40. package/docs/demos/CardView/examples/CardView.md +1 -1
  41. package/docs/demos/ContextSelector/examples/ContextSelector.md +3 -3
  42. package/docs/demos/Dashboard/examples/Dashboard.md +1 -1
  43. package/docs/demos/DataList/examples/DataList.md +4 -4
  44. package/docs/demos/DescriptionList/examples/DescriptionList.md +3 -3
  45. package/docs/demos/Drawer/examples/Drawer.md +5 -5
  46. package/docs/demos/JumpLinks/examples/JumpLinks.md +6 -6
  47. package/docs/demos/Masthead/examples/Masthead.md +388 -2
  48. package/docs/demos/Modal/examples/Modal.md +6 -6
  49. package/docs/demos/Nav/examples/Nav.md +8 -8
  50. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +5 -5
  51. package/docs/demos/Page/examples/Page.md +8 -8
  52. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +7 -7
  53. package/docs/demos/Skeleton/examples/Skeleton.md +1 -1
  54. package/docs/demos/Table/examples/Table.md +14 -14
  55. package/docs/demos/Tabs/examples/Tabs.md +8 -8
  56. package/docs/demos/Toolbar/examples/Toolbar.md +1 -1
  57. package/docs/demos/Wizard/examples/Wizard.md +8 -8
  58. package/package.json +1 -1
  59. package/patternfly-no-reset.css +126 -10
  60. package/patternfly.css +126 -10
  61. package/patternfly.min.css +1 -1
  62. package/patternfly.min.css.map +1 -1
@@ -9,7 +9,7 @@
9
9
  --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
10
10
  }
11
11
 
12
- .pf-c-wizard__header, .pf-c-page__main-section[class*=pf-m-dark-], .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector, .pf-c-page__header, .pf-c-masthead, .pf-c-login__footer, .pf-c-login__header, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main, .pf-c-banner, .pf-c-about-modal-box, .pf-t-dark {
12
+ .pf-c-wizard__header, .pf-c-page__main-section[class*=pf-m-dark-], .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector, .pf-c-page__header, .pf-c-masthead .pf-c-button.pf-m-plain, .pf-c-masthead, .pf-c-login__footer, .pf-c-login__header, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main, .pf-c-banner, .pf-c-about-modal-box, .pf-t-dark {
13
13
  --pf-global--Color--100: var(--pf-global--Color--light-100);
14
14
  --pf-global--Color--200: var(--pf-global--Color--light-200);
15
15
  --pf-global--BorderColor--100: var(--pf-global--BorderColor--light-100);
@@ -18,10 +18,10 @@
18
18
  --pf-global--link--Color--hover: var(--pf-global--link--Color--light);
19
19
  --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
20
20
  }
21
- .pf-c-wizard__header .pf-c-card, .pf-c-page__main-section[class*=pf-m-dark-] .pf-c-card, .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector .pf-c-card, .pf-c-page__header .pf-c-card, .pf-c-masthead .pf-c-card, .pf-c-login__footer .pf-c-card, .pf-c-login__header .pf-c-card, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main .pf-c-card, .pf-c-banner .pf-c-card, .pf-c-about-modal-box .pf-c-card, .pf-t-dark .pf-c-card {
21
+ .pf-c-wizard__header .pf-c-card, .pf-c-page__main-section[class*=pf-m-dark-] .pf-c-card, .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector .pf-c-card, .pf-c-page__header .pf-c-card, .pf-c-masthead .pf-c-button.pf-m-plain .pf-c-card, .pf-c-masthead .pf-c-card, .pf-c-login__footer .pf-c-card, .pf-c-login__header .pf-c-card, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main .pf-c-card, .pf-c-banner .pf-c-card, .pf-c-about-modal-box .pf-c-card, .pf-t-dark .pf-c-card {
22
22
  --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
23
23
  }
24
- .pf-c-wizard__header .pf-c-button, .pf-c-page__main-section[class*=pf-m-dark-] .pf-c-button, .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector .pf-c-button, .pf-c-page__header .pf-c-button, .pf-c-masthead .pf-c-button, .pf-c-login__footer .pf-c-button, .pf-c-login__header .pf-c-button, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main .pf-c-button, .pf-c-banner .pf-c-button, .pf-c-about-modal-box .pf-c-button, .pf-t-dark .pf-c-button {
24
+ .pf-c-wizard__header .pf-c-button, .pf-c-page__main-section[class*=pf-m-dark-] .pf-c-button, .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector .pf-c-button, .pf-c-page__header .pf-c-button, .pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button, .pf-c-masthead .pf-c-button, .pf-c-login__footer .pf-c-button, .pf-c-login__header .pf-c-button, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main .pf-c-button, .pf-c-banner .pf-c-button, .pf-c-about-modal-box .pf-c-button, .pf-t-dark .pf-c-button {
25
25
  --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
26
26
  --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
27
27
  --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
@@ -7516,6 +7516,11 @@ button.pf-c-breadcrumb__link {
7516
7516
  --pf-c-button--m-in-progress--m-plain--Color: var(--pf-global--primary-color--100);
7517
7517
  --pf-c-button--m-in-progress--m-plain__progress--Left: 50%;
7518
7518
  --pf-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
7519
+ --pf-c-button__count--MarginLeft: var(--pf-global--spacer--sm);
7520
+ --pf-c-button--disabled__c-badge--Color: var(--pf-global--Color--dark-100);
7521
+ --pf-c-button--disabled__c-badge--BackgroundColor: var(--pf-global--BackgroundColor--200);
7522
+ --pf-c-button--m-primary__c-badge--BorderColor: var(--pf-global--BorderColor--300);
7523
+ --pf-c-button--m-primary__c-badge--BorderWidth: var(--pf-global--BorderWidth--sm);
7519
7524
  position: relative;
7520
7525
  display: inline-block;
7521
7526
  padding: var(--pf-c-button--PaddingTop) var(--pf-c-button--PaddingRight) var(--pf-c-button--PaddingBottom) var(--pf-c-button--PaddingLeft);
@@ -7580,6 +7585,9 @@ button.pf-c-breadcrumb__link {
7580
7585
  --pf-c-button--m-primary--Color: var(--pf-c-button--m-primary--active--Color);
7581
7586
  --pf-c-button--m-primary--BackgroundColor: var(--pf-c-button--m-primary--active--BackgroundColor);
7582
7587
  }
7588
+ .pf-c-button.pf-m-primary .pf-c-badge.pf-m-unread {
7589
+ border: var(--pf-c-button--m-primary__c-badge--BorderWidth) solid var(--pf-c-button--m-primary__c-badge--BorderColor);
7590
+ }
7583
7591
  .pf-c-button.pf-m-secondary {
7584
7592
  --pf-c-button--after--BorderColor: var(--pf-c-button--m-secondary--after--BorderColor);
7585
7593
  color: var(--pf-c-button--m-secondary--Color);
@@ -7791,6 +7799,11 @@ button.pf-c-breadcrumb__link {
7791
7799
  .pf-c-button:disabled::after, .pf-c-button.pf-m-disabled::after, .pf-c-button.pf-m-aria-disabled::after {
7792
7800
  border-color: var(--pf-c-button--disabled--after--BorderColor);
7793
7801
  }
7802
+ .pf-c-button:disabled .pf-c-badge, .pf-c-button.pf-m-disabled .pf-c-badge, .pf-c-button.pf-m-aria-disabled .pf-c-badge {
7803
+ --pf-c-badge--m-unread--Color: var(--pf-c-button--disabled__c-badge--Color);
7804
+ --pf-c-badge--m-unread--BackgroundColor: var(--pf-c-button--disabled__c-badge--BackgroundColor);
7805
+ --pf-c-button--m-primary__c-badge--BorderWidth: 0;
7806
+ }
7794
7807
  .pf-c-button.pf-m-aria-disabled {
7795
7808
  --pf-c-button--after--BorderWidth: 0;
7796
7809
  --pf-c-button--m-link--m-inline--hover--TextDecoration: none;
@@ -7832,6 +7845,12 @@ button.pf-c-breadcrumb__link {
7832
7845
  --pf-c-spinner--Color: currentcolor;
7833
7846
  }
7834
7847
 
7848
+ .pf-c-button__count {
7849
+ display: inline-flex;
7850
+ align-items: center;
7851
+ margin-left: var(--pf-c-button__count--MarginLeft);
7852
+ }
7853
+
7835
7854
  .pf-m-overpass-font .pf-c-button {
7836
7855
  --pf-c-button--FontWeight: var(--pf-global--FontWeight--semi-bold);
7837
7856
  }
@@ -7904,6 +7923,7 @@ button.pf-c-breadcrumb__link {
7904
7923
  --pf-c-button--m-control--focus--after--BorderBottomColor: var(--pf-global--primary-color--100);
7905
7924
  --pf-c-button--m-control--m-expanded--after--BorderBottomColor: var(--pf-global--primary-color--100);
7906
7925
  --pf-c-button--m-control--disabled--BackgroundColor: var(--pf-global--disabled-color--200);
7926
+ --pf-c-button--m-primary__c-badge--BorderColor: var(--pf-global--Color--100);
7907
7927
  }
7908
7928
  :where(.pf-theme-dark) .pf-c-button.pf-m-control:disabled::after {
7909
7929
  border: 0;
@@ -8543,6 +8563,9 @@ button.pf-c-breadcrumb__link {
8543
8563
  --pf-c-check__description--FontSize: var(--pf-global--FontSize--sm);
8544
8564
  --pf-c-check__description--Color: var(--pf-global--Color--200);
8545
8565
  --pf-c-check__body--MarginTop: var(--pf-global--spacer--sm);
8566
+ --pf-c-check__label-required--MarginLeft: var(--pf-global--spacer--xs);
8567
+ --pf-c-check__label-required--FontSize: var(--pf-global--FontSize--sm);
8568
+ --pf-c-check__label-required--Color: var(--pf-global--danger-color--100);
8546
8569
  display: grid;
8547
8570
  grid-template-columns: auto 1fr;
8548
8571
  grid-gap: var(--pf-c-check--GridGap);
@@ -8592,6 +8615,12 @@ label.pf-c-check, .pf-c-check__label,
8592
8615
  cursor: not-allowed;
8593
8616
  }
8594
8617
 
8618
+ .pf-c-check__label-required {
8619
+ margin-left: var(--pf-c-check__label-required--MarginLeft);
8620
+ font-size: var(--pf-c-check__label-required--FontSize);
8621
+ color: var(--pf-c-check__label-required--Color);
8622
+ }
8623
+
8595
8624
  .pf-c-chip {
8596
8625
  --pf-c-chip--PaddingTop: var(--pf-global--spacer--xs);
8597
8626
  --pf-c-chip--PaddingRight: var(--pf-global--spacer--sm);
@@ -9645,6 +9674,12 @@ label.pf-c-check, .pf-c-check__label,
9645
9674
  background-clip: padding-box;
9646
9675
  box-shadow: var(--pf-c-context-selector__menu--BoxShadow);
9647
9676
  }
9677
+ .pf-c-context-selector__menu.pf-m-static {
9678
+ position: static;
9679
+ top: auto;
9680
+ z-index: auto;
9681
+ min-width: min-content;
9682
+ }
9648
9683
 
9649
9684
  .pf-c-context-selector__menu-search {
9650
9685
  position: relative;
@@ -14139,6 +14174,12 @@ label.pf-c-check, .pf-c-check__label,
14139
14174
  background-clip: padding-box;
14140
14175
  box-shadow: var(--pf-c-dropdown__menu--BoxShadow);
14141
14176
  }
14177
+ .pf-c-dropdown__menu.pf-m-static {
14178
+ position: static;
14179
+ top: auto;
14180
+ z-index: auto;
14181
+ min-width: min-content;
14182
+ }
14142
14183
 
14143
14184
  .pf-c-dropdown .pf-c-menu,
14144
14185
  .pf-c-dropdown__menu {
@@ -14475,6 +14516,7 @@ label.pf-c-check, .pf-c-check__label,
14475
14516
  --pf-c-expandable-section__toggle--PaddingRight: var(--pf-global--spacer--md);
14476
14517
  --pf-c-expandable-section__toggle--PaddingBottom: var(--pf-global--spacer--form-element);
14477
14518
  --pf-c-expandable-section__toggle--PaddingLeft: 0;
14519
+ --pf-c-expandable-section__toggle--MarginTop: 0;
14478
14520
  --pf-c-expandable-section__toggle--Color: var(--pf-global--link--Color);
14479
14521
  --pf-c-expandable-section__toggle--hover--Color: var(--pf-global--link--Color--hover);
14480
14522
  --pf-c-expandable-section__toggle--active--Color: var(--pf-global--link--Color--hover);
@@ -14504,6 +14546,8 @@ label.pf-c-check, .pf-c-check__label,
14504
14546
  --pf-c-expandable-section--m-display-lg--after--Width: var(--pf-global--BorderWidth--lg);
14505
14547
  --pf-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor: var(--pf-global--primary-color--100);
14506
14548
  --pf-c-expandable-section--m-indented__content--PaddingLeft: calc(var(--pf-c-expandable-section__toggle-text--MarginLeft) + var(--pf-c-expandable-section__toggle-icon--MinWidth));
14549
+ --pf-c-expandable-section--m-truncate__content--LineClamp: 3;
14550
+ --pf-c-expandable-section--m-truncate__toggle--MarginTop: var(--pf-global--spacer--xs);
14507
14551
  }
14508
14552
  .pf-c-expandable-section.pf-m-expanded {
14509
14553
  --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--m-expanded--Color);
@@ -14511,7 +14555,7 @@ label.pf-c-check, .pf-c-check__label,
14511
14555
  --pf-c-expandable-section__toggle-icon--m-expand-top--Rotate: var(--pf-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate);
14512
14556
  --pf-c-expandable-section--m-display-lg--after--BackgroundColor: var(--pf-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor);
14513
14557
  }
14514
- .pf-c-expandable-section.pf-m-detached {
14558
+ .pf-c-expandable-section.pf-m-detached, .pf-c-expandable-section.pf-m-truncate {
14515
14559
  --pf-c-expandable-section__content--MarginTop: 0;
14516
14560
  }
14517
14561
  .pf-c-expandable-section.pf-m-limit-width {
@@ -14541,10 +14585,24 @@ label.pf-c-check, .pf-c-check__label,
14541
14585
  .pf-c-expandable-section.pf-m-indented {
14542
14586
  --pf-c-expandable-section__content--PaddingLeft: var(--pf-c-expandable-section--m-indented__content--PaddingLeft);
14543
14587
  }
14588
+ .pf-c-expandable-section.pf-m-truncate {
14589
+ --pf-c-expandable-section__toggle--MarginTop: var(--pf-c-expandable-section--m-truncate__toggle--MarginTop);
14590
+ --pf-c-expandable-section__toggle--PaddingTop: 0;
14591
+ --pf-c-expandable-section__toggle--PaddingRight: 0;
14592
+ --pf-c-expandable-section__toggle--PaddingBottom: 0;
14593
+ --pf-c-expandable-section__toggle-text--MarginLeft: 0;
14594
+ }
14595
+ .pf-c-expandable-section.pf-m-truncate:not(.pf-m-expanded) .pf-c-expandable-section__content {
14596
+ display: -webkit-box;
14597
+ -webkit-box-orient: vertical;
14598
+ -webkit-line-clamp: var(--pf-c-expandable-section--m-truncate__content--LineClamp);
14599
+ overflow: hidden;
14600
+ }
14544
14601
 
14545
14602
  .pf-c-expandable-section__toggle {
14546
14603
  display: flex;
14547
14604
  padding: var(--pf-c-expandable-section__toggle--PaddingTop) var(--pf-c-expandable-section__toggle--PaddingRight) var(--pf-c-expandable-section__toggle--PaddingBottom) var(--pf-c-expandable-section__toggle--PaddingLeft);
14605
+ margin-top: var(--pf-c-expandable-section__toggle--MarginTop);
14548
14606
  color: var(--pf-c-expandable-section__toggle--Color);
14549
14607
  border: none;
14550
14608
  }
@@ -15893,6 +15951,9 @@ textarea.pf-c-form-control {
15893
15951
  width: 100%;
15894
15952
  background-color: var(--pf-c-input-group--BackgroundColor);
15895
15953
  }
15954
+ .pf-c-input-group.pf-m-plain {
15955
+ --pf-c-input-group--BackgroundColor: transparent;
15956
+ }
15896
15957
  .pf-c-input-group > * + * {
15897
15958
  margin-left: -1px;
15898
15959
  }
@@ -17687,6 +17748,9 @@ ul.pf-c-list {
17687
17748
  .pf-c-masthead .pf-c-nav {
17688
17749
  align-self: stretch;
17689
17750
  }
17751
+ .pf-c-masthead .pf-c-button.pf-m-plain {
17752
+ color: var(--pf-global--Color--200);
17753
+ }
17690
17754
 
17691
17755
  .pf-c-masthead__main {
17692
17756
  position: relative;
@@ -18280,8 +18344,6 @@ ul.pf-c-list {
18280
18344
  --pf-c-menu__footer--BoxShadow: none;
18281
18345
  --pf-c-menu__footer--after--BorderTopWidth: var(--pf-global--BorderWidth--sm);
18282
18346
  --pf-c-menu__footer--after--BorderTopColor: var(--pf-global--BorderColor--100);
18283
- --pf-c-menu__footer--after--BorderBottomWidth: 0;
18284
- --pf-c-menu__footer--after--BorderBottomColor: var(--pf-global--BorderColor--100);
18285
18347
  --pf-c-menu--m-scrollable__footer--BoxShadow: var(--pf-global--BoxShadow--sm-top);
18286
18348
  --pf-c-menu--m-scrollable__footer--after--BorderTopWidth: 0;
18287
18349
  --pf-c-menu--m-scrollable__footer--after--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
@@ -18413,7 +18475,6 @@ ul.pf-c-list {
18413
18475
  --pf-c-menu__content--MaxHeight: var(--pf-c-menu--m-scrollable__content--MaxHeight);
18414
18476
  --pf-c-menu__footer--BoxShadow: var(--pf-c-menu--m-scrollable__footer--BoxShadow);
18415
18477
  --pf-c-menu__footer--after--BorderTopWidth: var(--pf-c-menu--m-scrollable__footer--after--BorderTopWidth);
18416
- --pf-c-menu__footer--after--BorderBottomWidth: var(--pf-c-menu--m-scrollable__footer--after--BorderBottomWidth);
18417
18478
  }
18418
18479
  .pf-c-menu.pf-m-scrollable .pf-c-menu__content {
18419
18480
  overflow-y: auto;
@@ -18715,7 +18776,6 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18715
18776
  pointer-events: none;
18716
18777
  content: "";
18717
18778
  border-top: var(--pf-c-menu__footer--after--BorderTopWidth) solid var(--pf-c-menu__footer--after--BorderTopColor);
18718
- border-bottom: var(--pf-c-menu__footer--after--BorderBottomWidth) solid var(--pf-c-menu__footer--after--BorderBottomColor);
18719
18779
  }
18720
18780
 
18721
18781
  :where(.pf-theme-dark) .pf-c-wizard__header, :where(.pf-theme-dark) .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector,
@@ -22032,6 +22092,31 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22032
22092
  .pf-c-page__main-nav.pf-m-sticky-top, .pf-c-page__main-group.pf-m-sticky-top .pf-c-page__main-nav:last-child {
22033
22093
  padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22034
22094
  }
22095
+ @media (min-height: 0) {
22096
+ .pf-c-page__main-nav.pf-m-sticky-top-on-sm-height, .pf-c-page__main-group.pf-m-sticky-top-on-sm-height .pf-c-page__main-nav:last-child {
22097
+ padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22098
+ }
22099
+ }
22100
+ @media (min-height: 40rem) {
22101
+ .pf-c-page__main-nav.pf-m-sticky-top-on-md-height, .pf-c-page__main-group.pf-m-sticky-top-on-md-height .pf-c-page__main-nav:last-child {
22102
+ padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22103
+ }
22104
+ }
22105
+ @media (min-height: 48rem) {
22106
+ .pf-c-page__main-nav.pf-m-sticky-top-on-lg-height, .pf-c-page__main-group.pf-m-sticky-top-on-lg-height .pf-c-page__main-nav:last-child {
22107
+ padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22108
+ }
22109
+ }
22110
+ @media (min-height: 60rem) {
22111
+ .pf-c-page__main-nav.pf-m-sticky-top-on-xl-height, .pf-c-page__main-group.pf-m-sticky-top-on-xl-height .pf-c-page__main-nav:last-child {
22112
+ padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22113
+ }
22114
+ }
22115
+ @media (min-height: 80rem) {
22116
+ .pf-c-page__main-nav.pf-m-sticky-top-on-2xl-height, .pf-c-page__main-group.pf-m-sticky-top-on-2xl-height .pf-c-page__main-nav:last-child {
22117
+ padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22118
+ }
22119
+ }
22035
22120
 
22036
22121
  .pf-c-page__main-subnav {
22037
22122
  background-color: var(--pf-c-page__main-subnav--BackgroundColor);
@@ -22057,6 +22142,31 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22057
22142
  .pf-c-page__main-breadcrumb.pf-m-sticky-top, .pf-c-page__main-group.pf-m-sticky-top .pf-c-page__main-breadcrumb:last-child {
22058
22143
  --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22059
22144
  }
22145
+ @media (min-height: 0) {
22146
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-sm-height, .pf-c-page__main-group.pf-m-sticky-top-on-sm-height .pf-c-page__main-breadcrumb:last-child {
22147
+ --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22148
+ }
22149
+ }
22150
+ @media (min-height: 40rem) {
22151
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-md-height, .pf-c-page__main-group.pf-m-sticky-top-on-md-height .pf-c-page__main-breadcrumb:last-child {
22152
+ --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22153
+ }
22154
+ }
22155
+ @media (min-height: 48rem) {
22156
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-lg-height, .pf-c-page__main-group.pf-m-sticky-top-on-lg-height .pf-c-page__main-breadcrumb:last-child {
22157
+ --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22158
+ }
22159
+ }
22160
+ @media (min-height: 60rem) {
22161
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-xl-height, .pf-c-page__main-group.pf-m-sticky-top-on-xl-height .pf-c-page__main-breadcrumb:last-child {
22162
+ --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22163
+ }
22164
+ }
22165
+ @media (min-height: 80rem) {
22166
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-2xl-height, .pf-c-page__main-group.pf-m-sticky-top-on-2xl-height .pf-c-page__main-breadcrumb:last-child {
22167
+ --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22168
+ }
22169
+ }
22060
22170
 
22061
22171
  .pf-c-page__main-tabs {
22062
22172
  padding: var(--pf-c-page__main-tabs--PaddingTop) var(--pf-c-page__main-tabs--PaddingRight) var(--pf-c-page__main-tabs--PaddingBottom) var(--pf-c-page__main-tabs--PaddingLeft);
@@ -24441,6 +24551,12 @@ label.pf-c-radio, .pf-c-radio__label,
24441
24551
  top: 0;
24442
24552
  transform: translateY(var(--pf-c-select__menu--m-top--TranslateY));
24443
24553
  }
24554
+ .pf-c-select__menu.pf-m-static {
24555
+ position: static;
24556
+ top: auto;
24557
+ z-index: auto;
24558
+ min-width: min-content;
24559
+ }
24444
24560
 
24445
24561
  .pf-c-select__menu-fieldset {
24446
24562
  border: 0;
@@ -32179,10 +32295,10 @@ label.pf-c-tree-view__node-text {
32179
32295
  }
32180
32296
 
32181
32297
  :where(.pf-theme-dark) .pf-c-wizard {
32298
+ --pf-c-wizard__header--BackgroundColor: var(--pf-global--palette--black-1000);
32299
+ --pf-c-wizard__nav-link--before--BackgroundColor: var(--pf-global--palette--black-500);
32182
32300
  --pf-c-wizard__nav-link--m-disabled--Color: var(--pf-global--disabled-color--300);
32183
32301
  --pf-c-wizard__nav-link--m-disabled--before--Color: var(--pf-global--disabled-color--300);
32184
- --pf-c-wizard__nav--BackgroundColor: var(--pf-global--BackgroundColor--300);
32185
- --pf-c-wizard__outer-wrap--BackgroundColor: var(--pf-global--BackgroundColor--300);
32186
32302
  }
32187
32303
  :where(.pf-theme-dark) .pf-c-wizard__header {
32188
32304
  color: var(--pf-global--Color--100);
package/patternfly.css CHANGED
@@ -9,7 +9,7 @@
9
9
  --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
10
10
  }
11
11
 
12
- .pf-c-wizard__header, .pf-c-page__main-section[class*=pf-m-dark-], .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector, .pf-c-page__header, .pf-c-masthead, .pf-c-login__footer, .pf-c-login__header, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main, .pf-c-banner, .pf-c-about-modal-box, .pf-t-dark {
12
+ .pf-c-wizard__header, .pf-c-page__main-section[class*=pf-m-dark-], .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector, .pf-c-page__header, .pf-c-masthead .pf-c-button.pf-m-plain, .pf-c-masthead, .pf-c-login__footer, .pf-c-login__header, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main, .pf-c-banner, .pf-c-about-modal-box, .pf-t-dark {
13
13
  --pf-global--Color--100: var(--pf-global--Color--light-100);
14
14
  --pf-global--Color--200: var(--pf-global--Color--light-200);
15
15
  --pf-global--BorderColor--100: var(--pf-global--BorderColor--light-100);
@@ -18,10 +18,10 @@
18
18
  --pf-global--link--Color--hover: var(--pf-global--link--Color--light);
19
19
  --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--dark-100);
20
20
  }
21
- .pf-c-wizard__header .pf-c-card, .pf-c-page__main-section[class*=pf-m-dark-] .pf-c-card, .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector .pf-c-card, .pf-c-page__header .pf-c-card, .pf-c-masthead .pf-c-card, .pf-c-login__footer .pf-c-card, .pf-c-login__header .pf-c-card, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main .pf-c-card, .pf-c-banner .pf-c-card, .pf-c-about-modal-box .pf-c-card, .pf-t-dark .pf-c-card {
21
+ .pf-c-wizard__header .pf-c-card, .pf-c-page__main-section[class*=pf-m-dark-] .pf-c-card, .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector .pf-c-card, .pf-c-page__header .pf-c-card, .pf-c-masthead .pf-c-button.pf-m-plain .pf-c-card, .pf-c-masthead .pf-c-card, .pf-c-login__footer .pf-c-card, .pf-c-login__header .pf-c-card, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main .pf-c-card, .pf-c-banner .pf-c-card, .pf-c-about-modal-box .pf-c-card, .pf-t-dark .pf-c-card {
22
22
  --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--dark-transparent-200);
23
23
  }
24
- .pf-c-wizard__header .pf-c-button, .pf-c-page__main-section[class*=pf-m-dark-] .pf-c-button, .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector .pf-c-button, .pf-c-page__header .pf-c-button, .pf-c-masthead .pf-c-button, .pf-c-login__footer .pf-c-button, .pf-c-login__header .pf-c-button, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main .pf-c-button, .pf-c-banner .pf-c-button, .pf-c-about-modal-box .pf-c-button, .pf-t-dark .pf-c-button {
24
+ .pf-c-wizard__header .pf-c-button, .pf-c-page__main-section[class*=pf-m-dark-] .pf-c-button, .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector .pf-c-button, .pf-c-page__header .pf-c-button, .pf-c-masthead .pf-c-button.pf-m-plain .pf-c-button, .pf-c-masthead .pf-c-button, .pf-c-login__footer .pf-c-button, .pf-c-login__header .pf-c-button, .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main .pf-c-button, .pf-c-banner .pf-c-button, .pf-c-about-modal-box .pf-c-button, .pf-t-dark .pf-c-button {
25
25
  --pf-c-button--m-primary--Color: var(--pf-global--primary-color--dark-100);
26
26
  --pf-c-button--m-primary--hover--Color: var(--pf-global--primary-color--dark-100);
27
27
  --pf-c-button--m-primary--focus--Color: var(--pf-global--primary-color--dark-100);
@@ -7643,6 +7643,11 @@ button.pf-c-breadcrumb__link {
7643
7643
  --pf-c-button--m-in-progress--m-plain--Color: var(--pf-global--primary-color--100);
7644
7644
  --pf-c-button--m-in-progress--m-plain__progress--Left: 50%;
7645
7645
  --pf-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
7646
+ --pf-c-button__count--MarginLeft: var(--pf-global--spacer--sm);
7647
+ --pf-c-button--disabled__c-badge--Color: var(--pf-global--Color--dark-100);
7648
+ --pf-c-button--disabled__c-badge--BackgroundColor: var(--pf-global--BackgroundColor--200);
7649
+ --pf-c-button--m-primary__c-badge--BorderColor: var(--pf-global--BorderColor--300);
7650
+ --pf-c-button--m-primary__c-badge--BorderWidth: var(--pf-global--BorderWidth--sm);
7646
7651
  position: relative;
7647
7652
  display: inline-block;
7648
7653
  padding: var(--pf-c-button--PaddingTop) var(--pf-c-button--PaddingRight) var(--pf-c-button--PaddingBottom) var(--pf-c-button--PaddingLeft);
@@ -7707,6 +7712,9 @@ button.pf-c-breadcrumb__link {
7707
7712
  --pf-c-button--m-primary--Color: var(--pf-c-button--m-primary--active--Color);
7708
7713
  --pf-c-button--m-primary--BackgroundColor: var(--pf-c-button--m-primary--active--BackgroundColor);
7709
7714
  }
7715
+ .pf-c-button.pf-m-primary .pf-c-badge.pf-m-unread {
7716
+ border: var(--pf-c-button--m-primary__c-badge--BorderWidth) solid var(--pf-c-button--m-primary__c-badge--BorderColor);
7717
+ }
7710
7718
  .pf-c-button.pf-m-secondary {
7711
7719
  --pf-c-button--after--BorderColor: var(--pf-c-button--m-secondary--after--BorderColor);
7712
7720
  color: var(--pf-c-button--m-secondary--Color);
@@ -7918,6 +7926,11 @@ button.pf-c-breadcrumb__link {
7918
7926
  .pf-c-button:disabled::after, .pf-c-button.pf-m-disabled::after, .pf-c-button.pf-m-aria-disabled::after {
7919
7927
  border-color: var(--pf-c-button--disabled--after--BorderColor);
7920
7928
  }
7929
+ .pf-c-button:disabled .pf-c-badge, .pf-c-button.pf-m-disabled .pf-c-badge, .pf-c-button.pf-m-aria-disabled .pf-c-badge {
7930
+ --pf-c-badge--m-unread--Color: var(--pf-c-button--disabled__c-badge--Color);
7931
+ --pf-c-badge--m-unread--BackgroundColor: var(--pf-c-button--disabled__c-badge--BackgroundColor);
7932
+ --pf-c-button--m-primary__c-badge--BorderWidth: 0;
7933
+ }
7921
7934
  .pf-c-button.pf-m-aria-disabled {
7922
7935
  --pf-c-button--after--BorderWidth: 0;
7923
7936
  --pf-c-button--m-link--m-inline--hover--TextDecoration: none;
@@ -7959,6 +7972,12 @@ button.pf-c-breadcrumb__link {
7959
7972
  --pf-c-spinner--Color: currentcolor;
7960
7973
  }
7961
7974
 
7975
+ .pf-c-button__count {
7976
+ display: inline-flex;
7977
+ align-items: center;
7978
+ margin-left: var(--pf-c-button__count--MarginLeft);
7979
+ }
7980
+
7962
7981
  .pf-m-overpass-font .pf-c-button {
7963
7982
  --pf-c-button--FontWeight: var(--pf-global--FontWeight--semi-bold);
7964
7983
  }
@@ -8031,6 +8050,7 @@ button.pf-c-breadcrumb__link {
8031
8050
  --pf-c-button--m-control--focus--after--BorderBottomColor: var(--pf-global--primary-color--100);
8032
8051
  --pf-c-button--m-control--m-expanded--after--BorderBottomColor: var(--pf-global--primary-color--100);
8033
8052
  --pf-c-button--m-control--disabled--BackgroundColor: var(--pf-global--disabled-color--200);
8053
+ --pf-c-button--m-primary__c-badge--BorderColor: var(--pf-global--Color--100);
8034
8054
  }
8035
8055
  :where(.pf-theme-dark) .pf-c-button.pf-m-control:disabled::after {
8036
8056
  border: 0;
@@ -8670,6 +8690,9 @@ button.pf-c-breadcrumb__link {
8670
8690
  --pf-c-check__description--FontSize: var(--pf-global--FontSize--sm);
8671
8691
  --pf-c-check__description--Color: var(--pf-global--Color--200);
8672
8692
  --pf-c-check__body--MarginTop: var(--pf-global--spacer--sm);
8693
+ --pf-c-check__label-required--MarginLeft: var(--pf-global--spacer--xs);
8694
+ --pf-c-check__label-required--FontSize: var(--pf-global--FontSize--sm);
8695
+ --pf-c-check__label-required--Color: var(--pf-global--danger-color--100);
8673
8696
  display: grid;
8674
8697
  grid-template-columns: auto 1fr;
8675
8698
  grid-gap: var(--pf-c-check--GridGap);
@@ -8719,6 +8742,12 @@ label.pf-c-check, .pf-c-check__label,
8719
8742
  cursor: not-allowed;
8720
8743
  }
8721
8744
 
8745
+ .pf-c-check__label-required {
8746
+ margin-left: var(--pf-c-check__label-required--MarginLeft);
8747
+ font-size: var(--pf-c-check__label-required--FontSize);
8748
+ color: var(--pf-c-check__label-required--Color);
8749
+ }
8750
+
8722
8751
  .pf-c-chip {
8723
8752
  --pf-c-chip--PaddingTop: var(--pf-global--spacer--xs);
8724
8753
  --pf-c-chip--PaddingRight: var(--pf-global--spacer--sm);
@@ -9772,6 +9801,12 @@ label.pf-c-check, .pf-c-check__label,
9772
9801
  background-clip: padding-box;
9773
9802
  box-shadow: var(--pf-c-context-selector__menu--BoxShadow);
9774
9803
  }
9804
+ .pf-c-context-selector__menu.pf-m-static {
9805
+ position: static;
9806
+ top: auto;
9807
+ z-index: auto;
9808
+ min-width: min-content;
9809
+ }
9775
9810
 
9776
9811
  .pf-c-context-selector__menu-search {
9777
9812
  position: relative;
@@ -14266,6 +14301,12 @@ label.pf-c-check, .pf-c-check__label,
14266
14301
  background-clip: padding-box;
14267
14302
  box-shadow: var(--pf-c-dropdown__menu--BoxShadow);
14268
14303
  }
14304
+ .pf-c-dropdown__menu.pf-m-static {
14305
+ position: static;
14306
+ top: auto;
14307
+ z-index: auto;
14308
+ min-width: min-content;
14309
+ }
14269
14310
 
14270
14311
  .pf-c-dropdown .pf-c-menu,
14271
14312
  .pf-c-dropdown__menu {
@@ -14602,6 +14643,7 @@ label.pf-c-check, .pf-c-check__label,
14602
14643
  --pf-c-expandable-section__toggle--PaddingRight: var(--pf-global--spacer--md);
14603
14644
  --pf-c-expandable-section__toggle--PaddingBottom: var(--pf-global--spacer--form-element);
14604
14645
  --pf-c-expandable-section__toggle--PaddingLeft: 0;
14646
+ --pf-c-expandable-section__toggle--MarginTop: 0;
14605
14647
  --pf-c-expandable-section__toggle--Color: var(--pf-global--link--Color);
14606
14648
  --pf-c-expandable-section__toggle--hover--Color: var(--pf-global--link--Color--hover);
14607
14649
  --pf-c-expandable-section__toggle--active--Color: var(--pf-global--link--Color--hover);
@@ -14631,6 +14673,8 @@ label.pf-c-check, .pf-c-check__label,
14631
14673
  --pf-c-expandable-section--m-display-lg--after--Width: var(--pf-global--BorderWidth--lg);
14632
14674
  --pf-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor: var(--pf-global--primary-color--100);
14633
14675
  --pf-c-expandable-section--m-indented__content--PaddingLeft: calc(var(--pf-c-expandable-section__toggle-text--MarginLeft) + var(--pf-c-expandable-section__toggle-icon--MinWidth));
14676
+ --pf-c-expandable-section--m-truncate__content--LineClamp: 3;
14677
+ --pf-c-expandable-section--m-truncate__toggle--MarginTop: var(--pf-global--spacer--xs);
14634
14678
  }
14635
14679
  .pf-c-expandable-section.pf-m-expanded {
14636
14680
  --pf-c-expandable-section__toggle--Color: var(--pf-c-expandable-section__toggle--m-expanded--Color);
@@ -14638,7 +14682,7 @@ label.pf-c-check, .pf-c-check__label,
14638
14682
  --pf-c-expandable-section__toggle-icon--m-expand-top--Rotate: var(--pf-c-expandable-section--m-expanded__toggle-icon--m-expand-top--Rotate);
14639
14683
  --pf-c-expandable-section--m-display-lg--after--BackgroundColor: var(--pf-c-expandable-section--m-display-lg--m-expanded--after--BackgroundColor);
14640
14684
  }
14641
- .pf-c-expandable-section.pf-m-detached {
14685
+ .pf-c-expandable-section.pf-m-detached, .pf-c-expandable-section.pf-m-truncate {
14642
14686
  --pf-c-expandable-section__content--MarginTop: 0;
14643
14687
  }
14644
14688
  .pf-c-expandable-section.pf-m-limit-width {
@@ -14668,10 +14712,24 @@ label.pf-c-check, .pf-c-check__label,
14668
14712
  .pf-c-expandable-section.pf-m-indented {
14669
14713
  --pf-c-expandable-section__content--PaddingLeft: var(--pf-c-expandable-section--m-indented__content--PaddingLeft);
14670
14714
  }
14715
+ .pf-c-expandable-section.pf-m-truncate {
14716
+ --pf-c-expandable-section__toggle--MarginTop: var(--pf-c-expandable-section--m-truncate__toggle--MarginTop);
14717
+ --pf-c-expandable-section__toggle--PaddingTop: 0;
14718
+ --pf-c-expandable-section__toggle--PaddingRight: 0;
14719
+ --pf-c-expandable-section__toggle--PaddingBottom: 0;
14720
+ --pf-c-expandable-section__toggle-text--MarginLeft: 0;
14721
+ }
14722
+ .pf-c-expandable-section.pf-m-truncate:not(.pf-m-expanded) .pf-c-expandable-section__content {
14723
+ display: -webkit-box;
14724
+ -webkit-box-orient: vertical;
14725
+ -webkit-line-clamp: var(--pf-c-expandable-section--m-truncate__content--LineClamp);
14726
+ overflow: hidden;
14727
+ }
14671
14728
 
14672
14729
  .pf-c-expandable-section__toggle {
14673
14730
  display: flex;
14674
14731
  padding: var(--pf-c-expandable-section__toggle--PaddingTop) var(--pf-c-expandable-section__toggle--PaddingRight) var(--pf-c-expandable-section__toggle--PaddingBottom) var(--pf-c-expandable-section__toggle--PaddingLeft);
14732
+ margin-top: var(--pf-c-expandable-section__toggle--MarginTop);
14675
14733
  color: var(--pf-c-expandable-section__toggle--Color);
14676
14734
  border: none;
14677
14735
  }
@@ -16020,6 +16078,9 @@ textarea.pf-c-form-control {
16020
16078
  width: 100%;
16021
16079
  background-color: var(--pf-c-input-group--BackgroundColor);
16022
16080
  }
16081
+ .pf-c-input-group.pf-m-plain {
16082
+ --pf-c-input-group--BackgroundColor: transparent;
16083
+ }
16023
16084
  .pf-c-input-group > * + * {
16024
16085
  margin-left: -1px;
16025
16086
  }
@@ -17814,6 +17875,9 @@ ul.pf-c-list {
17814
17875
  .pf-c-masthead .pf-c-nav {
17815
17876
  align-self: stretch;
17816
17877
  }
17878
+ .pf-c-masthead .pf-c-button.pf-m-plain {
17879
+ color: var(--pf-global--Color--200);
17880
+ }
17817
17881
 
17818
17882
  .pf-c-masthead__main {
17819
17883
  position: relative;
@@ -18407,8 +18471,6 @@ ul.pf-c-list {
18407
18471
  --pf-c-menu__footer--BoxShadow: none;
18408
18472
  --pf-c-menu__footer--after--BorderTopWidth: var(--pf-global--BorderWidth--sm);
18409
18473
  --pf-c-menu__footer--after--BorderTopColor: var(--pf-global--BorderColor--100);
18410
- --pf-c-menu__footer--after--BorderBottomWidth: 0;
18411
- --pf-c-menu__footer--after--BorderBottomColor: var(--pf-global--BorderColor--100);
18412
18474
  --pf-c-menu--m-scrollable__footer--BoxShadow: var(--pf-global--BoxShadow--sm-top);
18413
18475
  --pf-c-menu--m-scrollable__footer--after--BorderTopWidth: 0;
18414
18476
  --pf-c-menu--m-scrollable__footer--after--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
@@ -18540,7 +18602,6 @@ ul.pf-c-list {
18540
18602
  --pf-c-menu__content--MaxHeight: var(--pf-c-menu--m-scrollable__content--MaxHeight);
18541
18603
  --pf-c-menu__footer--BoxShadow: var(--pf-c-menu--m-scrollable__footer--BoxShadow);
18542
18604
  --pf-c-menu__footer--after--BorderTopWidth: var(--pf-c-menu--m-scrollable__footer--after--BorderTopWidth);
18543
- --pf-c-menu__footer--after--BorderBottomWidth: var(--pf-c-menu--m-scrollable__footer--after--BorderBottomWidth);
18544
18605
  }
18545
18606
  .pf-c-menu.pf-m-scrollable .pf-c-menu__content {
18546
18607
  overflow-y: auto;
@@ -18842,7 +18903,6 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
18842
18903
  pointer-events: none;
18843
18904
  content: "";
18844
18905
  border-top: var(--pf-c-menu__footer--after--BorderTopWidth) solid var(--pf-c-menu__footer--after--BorderTopColor);
18845
- border-bottom: var(--pf-c-menu__footer--after--BorderBottomWidth) solid var(--pf-c-menu__footer--after--BorderBottomColor);
18846
18906
  }
18847
18907
 
18848
18908
  :where(.pf-theme-dark) .pf-c-wizard__header, :where(.pf-theme-dark) .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector,
@@ -22159,6 +22219,31 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22159
22219
  .pf-c-page__main-nav.pf-m-sticky-top, .pf-c-page__main-group.pf-m-sticky-top .pf-c-page__main-nav:last-child {
22160
22220
  padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22161
22221
  }
22222
+ @media (min-height: 0) {
22223
+ .pf-c-page__main-nav.pf-m-sticky-top-on-sm-height, .pf-c-page__main-group.pf-m-sticky-top-on-sm-height .pf-c-page__main-nav:last-child {
22224
+ padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22225
+ }
22226
+ }
22227
+ @media (min-height: 40rem) {
22228
+ .pf-c-page__main-nav.pf-m-sticky-top-on-md-height, .pf-c-page__main-group.pf-m-sticky-top-on-md-height .pf-c-page__main-nav:last-child {
22229
+ padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22230
+ }
22231
+ }
22232
+ @media (min-height: 48rem) {
22233
+ .pf-c-page__main-nav.pf-m-sticky-top-on-lg-height, .pf-c-page__main-group.pf-m-sticky-top-on-lg-height .pf-c-page__main-nav:last-child {
22234
+ padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22235
+ }
22236
+ }
22237
+ @media (min-height: 60rem) {
22238
+ .pf-c-page__main-nav.pf-m-sticky-top-on-xl-height, .pf-c-page__main-group.pf-m-sticky-top-on-xl-height .pf-c-page__main-nav:last-child {
22239
+ padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22240
+ }
22241
+ }
22242
+ @media (min-height: 80rem) {
22243
+ .pf-c-page__main-nav.pf-m-sticky-top-on-2xl-height, .pf-c-page__main-group.pf-m-sticky-top-on-2xl-height .pf-c-page__main-nav:last-child {
22244
+ padding-bottom: var(--pf-c-page__main-nav--m-sticky-top--PaddingBottom);
22245
+ }
22246
+ }
22162
22247
 
22163
22248
  .pf-c-page__main-subnav {
22164
22249
  background-color: var(--pf-c-page__main-subnav--BackgroundColor);
@@ -22184,6 +22269,31 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22184
22269
  .pf-c-page__main-breadcrumb.pf-m-sticky-top, .pf-c-page__main-group.pf-m-sticky-top .pf-c-page__main-breadcrumb:last-child {
22185
22270
  --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22186
22271
  }
22272
+ @media (min-height: 0) {
22273
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-sm-height, .pf-c-page__main-group.pf-m-sticky-top-on-sm-height .pf-c-page__main-breadcrumb:last-child {
22274
+ --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22275
+ }
22276
+ }
22277
+ @media (min-height: 40rem) {
22278
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-md-height, .pf-c-page__main-group.pf-m-sticky-top-on-md-height .pf-c-page__main-breadcrumb:last-child {
22279
+ --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22280
+ }
22281
+ }
22282
+ @media (min-height: 48rem) {
22283
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-lg-height, .pf-c-page__main-group.pf-m-sticky-top-on-lg-height .pf-c-page__main-breadcrumb:last-child {
22284
+ --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22285
+ }
22286
+ }
22287
+ @media (min-height: 60rem) {
22288
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-xl-height, .pf-c-page__main-group.pf-m-sticky-top-on-xl-height .pf-c-page__main-breadcrumb:last-child {
22289
+ --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22290
+ }
22291
+ }
22292
+ @media (min-height: 80rem) {
22293
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-2xl-height, .pf-c-page__main-group.pf-m-sticky-top-on-2xl-height .pf-c-page__main-breadcrumb:last-child {
22294
+ --pf-c-page__main-breadcrumb--PaddingBottom: var(--pf-c-page__main-breadcrumb--m-sticky-top--PaddingBottom);
22295
+ }
22296
+ }
22187
22297
 
22188
22298
  .pf-c-page__main-tabs {
22189
22299
  padding: var(--pf-c-page__main-tabs--PaddingTop) var(--pf-c-page__main-tabs--PaddingRight) var(--pf-c-page__main-tabs--PaddingBottom) var(--pf-c-page__main-tabs--PaddingLeft);
@@ -24568,6 +24678,12 @@ label.pf-c-radio, .pf-c-radio__label,
24568
24678
  top: 0;
24569
24679
  transform: translateY(var(--pf-c-select__menu--m-top--TranslateY));
24570
24680
  }
24681
+ .pf-c-select__menu.pf-m-static {
24682
+ position: static;
24683
+ top: auto;
24684
+ z-index: auto;
24685
+ min-width: min-content;
24686
+ }
24571
24687
 
24572
24688
  .pf-c-select__menu-fieldset {
24573
24689
  border: 0;
@@ -32306,10 +32422,10 @@ label.pf-c-tree-view__node-text {
32306
32422
  }
32307
32423
 
32308
32424
  :where(.pf-theme-dark) .pf-c-wizard {
32425
+ --pf-c-wizard__header--BackgroundColor: var(--pf-global--palette--black-1000);
32426
+ --pf-c-wizard__nav-link--before--BackgroundColor: var(--pf-global--palette--black-500);
32309
32427
  --pf-c-wizard__nav-link--m-disabled--Color: var(--pf-global--disabled-color--300);
32310
32428
  --pf-c-wizard__nav-link--m-disabled--before--Color: var(--pf-global--disabled-color--300);
32311
- --pf-c-wizard__nav--BackgroundColor: var(--pf-global--BackgroundColor--300);
32312
- --pf-c-wizard__outer-wrap--BackgroundColor: var(--pf-global--BackgroundColor--300);
32313
32429
  }
32314
32430
  :where(.pf-theme-dark) .pf-c-wizard__header {
32315
32431
  color: var(--pf-global--Color--100);