@patternfly/patternfly 4.170.0 → 4.173.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 (43) hide show
  1. package/RELEASE-NOTES.md +41 -1
  2. package/components/ContextSelector/context-selector.css +7 -2
  3. package/components/ContextSelector/context-selector.scss +16 -11
  4. package/components/Dropdown/dropdown.css +7 -0
  5. package/components/Dropdown/dropdown.scss +6 -0
  6. package/components/Masthead/masthead.css +9 -6
  7. package/components/Masthead/masthead.scss +12 -5
  8. package/components/Menu/menu.css +1 -0
  9. package/components/Menu/menu.scss +1 -0
  10. package/components/MenuToggle/menu-toggle.css +13 -0
  11. package/components/MenuToggle/menu-toggle.scss +26 -12
  12. package/components/Nav/nav.css +2 -2
  13. package/components/Nav/nav.scss +4 -4
  14. package/components/NumberInput/number-input.css +9 -6
  15. package/components/NumberInput/number-input.scss +2 -10
  16. package/components/OptionsMenu/options-menu.css +13 -2
  17. package/components/OptionsMenu/options-menu.scss +19 -7
  18. package/components/Pagination/pagination.css +9 -1
  19. package/components/Pagination/pagination.scss +3 -1
  20. package/components/ProgressStepper/progress-stepper.css +5 -0
  21. package/components/ProgressStepper/progress-stepper.scss +6 -0
  22. package/components/Select/select.css +11 -0
  23. package/components/Select/select.scss +14 -0
  24. package/components/Sidebar/sidebar.css +1 -0
  25. package/components/Sidebar/sidebar.scss +1 -0
  26. package/components/Table/table-scrollable.css +2 -0
  27. package/components/Table/table-scrollable.scss +2 -0
  28. package/components/Table/table-tree-view.css +7 -0
  29. package/components/Table/table-tree-view.scss +8 -0
  30. package/components/Table/table.css +1 -1
  31. package/components/Table/table.scss +1 -1
  32. package/components/Toolbar/toolbar.css +1 -0
  33. package/components/Toolbar/toolbar.scss +1 -0
  34. package/docs/components/Table/examples/Table.md +242 -172
  35. package/docs/demos/DataList/examples/DataList.md +2 -3
  36. package/docs/demos/Table/examples/Table.md +21 -69
  37. package/docs/demos/Toolbar/examples/Toolbar.md +3 -10
  38. package/package.json +1 -1
  39. package/patternfly-no-reset.css +90 -20
  40. package/patternfly.css +90 -20
  41. package/patternfly.min.css +1 -1
  42. package/patternfly.min.css.map +1 -1
  43. package/sass-utilities/placeholders.scss +12 -0
package/patternfly.css CHANGED
@@ -104,6 +104,14 @@
104
104
  }
105
105
  }
106
106
 
107
+ .pf-c-number-input .pf-c-form-control, .pf-c-pagination__nav-page-select .pf-c-form-control {
108
+ appearance: textfield;
109
+ }
110
+ .pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button, .pf-c-pagination__nav-page-select .pf-c-form-control::-webkit-inner-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button, .pf-c-pagination__nav-page-select .pf-c-form-control::-webkit-outer-spin-button {
111
+ appearance: none;
112
+ margin: 0;
113
+ }
114
+
107
115
  :root {
108
116
  --pf-global--palette--black-100: #fafafa;
109
117
  --pf-global--palette--black-150: #f5f5f5;
@@ -8511,6 +8519,8 @@ label.pf-c-check, .pf-c-check__label,
8511
8519
  --pf-c-context-selector__toggle-text--LineHeight: var(--pf-global--LineHeight--md);
8512
8520
  --pf-c-context-selector__toggle-icon--MarginRight: var(--pf-global--spacer--sm);
8513
8521
  --pf-c-context-selector__toggle-icon--MarginLeft: var(--pf-global--spacer--md);
8522
+ --pf-c-context-selector--m-plain__toggle-icon--Color: var(--pf-global--Color--200);
8523
+ --pf-c-context-selector--m-plain--hover__toggle-icon--Color: var(--pf-global--Color--100);
8514
8524
  --pf-c-context-selector__menu--Top: calc(100% + var(--pf-global--spacer--xs));
8515
8525
  --pf-c-context-selector__menu--ZIndex: var(--pf-global--ZIndex--sm);
8516
8526
  --pf-c-context-selector__menu--PaddingTop: var(--pf-global--spacer--sm);
@@ -8673,6 +8683,7 @@ label.pf-c-check, .pf-c-check__label,
8673
8683
  .pf-c-context-selector__toggle.pf-m-plain {
8674
8684
  --pf-c-context-selector__toggle--PaddingRight: var(--pf-c-context-selector__toggle--m-plain--PaddingRight);
8675
8685
  --pf-c-context-selector__toggle--PaddingLeft: var(--pf-c-context-selector__toggle--m-plain--PaddingLeft);
8686
+ --pf-c-context-selector__toggle-icon--Color: var(--pf-c-context-selector--m-plain__toggle-icon--Color);
8676
8687
  }
8677
8688
  .pf-c-context-selector__toggle.pf-m-plain.pf-m-text {
8678
8689
  --pf-c-context-selector__toggle--PaddingRight: var(--pf-c-context-selector__toggle--m-plain--m-text--PaddingRight);
@@ -8683,11 +8694,12 @@ label.pf-c-check, .pf-c-check__label,
8683
8694
  width: auto;
8684
8695
  color: var(--pf-c-context-selector__toggle--m-plain--Color);
8685
8696
  }
8686
- .pf-c-context-selector__toggle.pf-m-plain:not(.pf-m-text).pf-m-disabled, .pf-c-context-selector__toggle.pf-m-plain:not(.pf-m-text):disabled {
8697
+ .pf-c-context-selector__toggle.pf-m-plain.pf-m-disabled, .pf-c-context-selector__toggle.pf-m-plain:disabled {
8687
8698
  --pf-c-context-selector__toggle--m-plain--Color: var(--pf-c-context-selector__toggle--m-plain--disabled--Color);
8688
8699
  }
8689
- .pf-c-context-selector__toggle.pf-m-plain:not(.pf-m-text):hover, .pf-c-context-selector__toggle.pf-m-plain:not(.pf-m-text):active, .pf-c-context-selector__toggle.pf-m-plain:not(.pf-m-text).pf-m-active, .pf-c-context-selector__toggle.pf-m-plain:not(.pf-m-text):focus, .pf-c-context-selector.pf-m-expanded > .pf-c-context-selector__toggle.pf-m-plain:not(.pf-m-text) {
8700
+ .pf-c-context-selector__toggle.pf-m-plain:hover, .pf-c-context-selector__toggle.pf-m-plain:active, .pf-c-context-selector__toggle.pf-m-plain.pf-m-active, .pf-c-context-selector__toggle.pf-m-plain:focus, .pf-c-context-selector.pf-m-expanded > .pf-c-context-selector__toggle.pf-m-plain {
8690
8701
  --pf-c-context-selector__toggle--m-plain--Color: var(--pf-c-context-selector__toggle--m-plain--hover--Color);
8702
+ --pf-c-context-selector--m-plain__toggle-icon--Color: var(--pf-c-context-selector--m-plain--hover__toggle-icon--Color);
8691
8703
  }
8692
8704
  .pf-c-context-selector__toggle.pf-m-plain::before {
8693
8705
  border: 0;
@@ -8704,6 +8716,7 @@ label.pf-c-check, .pf-c-check__label,
8704
8716
  .pf-c-context-selector__toggle-icon {
8705
8717
  margin-right: var(--pf-c-context-selector__toggle-icon--MarginRight);
8706
8718
  margin-left: var(--pf-c-context-selector__toggle-icon--MarginLeft);
8719
+ color: var(--pf-c-context-selector__toggle-icon--Color, inherit);
8707
8720
  }
8708
8721
 
8709
8722
  .pf-c-context-selector__menu {
@@ -10230,6 +10243,7 @@ label.pf-c-check, .pf-c-check__label,
10230
10243
  --pf-c-toolbar--PaddingTop: var(--pf-global--spacer--md);
10231
10244
  --pf-c-toolbar--PaddingBottom: var(--pf-global--spacer--md);
10232
10245
  --pf-c-toolbar__item--Display: block;
10246
+ --pf-c-toolbar__item--MinWidth--base: auto;
10233
10247
  --pf-c-toolbar__group--Display: flex;
10234
10248
  --pf-c-toolbar--m-sticky--ZIndex: var(--pf-global--ZIndex--xs);
10235
10249
  --pf-c-toolbar--m-sticky--BoxShadow: var(--pf-global--BoxShadow--sm-bottom);
@@ -12482,6 +12496,8 @@ label.pf-c-check, .pf-c-check__label,
12482
12496
  --pf-c-dropdown__toggle-icon--MarginRight: var(--pf-global--spacer--sm);
12483
12497
  --pf-c-dropdown__toggle-icon--MarginLeft: var(--pf-global--spacer--md);
12484
12498
  --pf-c-dropdown--m-top--m-expanded__toggle-icon--Rotate: 180deg;
12499
+ --pf-c-dropdown--m-plain__toggle-icon--Color: var(--pf-global--Color--200);
12500
+ --pf-c-dropdown--m-plain--hover__toggle-icon--Color: var(--pf-global--Color--100);
12485
12501
  --pf-c-dropdown__menu--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
12486
12502
  --pf-c-dropdown__menu--BoxShadow: var(--pf-global--BoxShadow--md);
12487
12503
  --pf-c-dropdown__menu--PaddingTop: var(--pf-global--spacer--sm);
@@ -12704,6 +12720,9 @@ label.pf-c-check, .pf-c-check__label,
12704
12720
  --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomColor);
12705
12721
  border-bottom-width: var(--pf-c-dropdown--m-expanded__toggle--before--BorderBottomWidth);
12706
12722
  }
12723
+ .pf-c-dropdown__toggle.pf-m-plain {
12724
+ --pf-c-dropdown__toggle-icon--Color: var(--pf-c-dropdown--m-plain__toggle-icon--Color);
12725
+ }
12707
12726
  .pf-c-dropdown__toggle.pf-m-plain:not(.pf-m-text) {
12708
12727
  --pf-c-dropdown__toggle--PaddingRight: var(--pf-c-dropdown__toggle--m-plain--PaddingRight);
12709
12728
  --pf-c-dropdown__toggle--PaddingLeft: var(--pf-c-dropdown__toggle--m-plain--PaddingLeft);
@@ -12718,6 +12737,7 @@ label.pf-c-check, .pf-c-check__label,
12718
12737
  }
12719
12738
  .pf-c-dropdown__toggle.pf-m-plain:hover, .pf-c-dropdown__toggle.pf-m-plain:focus, .pf-c-dropdown__toggle.pf-m-plain:active, .pf-c-dropdown__toggle.pf-m-plain.pf-m-active, .pf-m-expanded > .pf-c-dropdown__toggle.pf-m-plain {
12720
12739
  --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--hover--Color);
12740
+ --pf-c-dropdown--m-plain__toggle-icon--Color: var(--pf-c-dropdown--m-plain--hover__toggle-icon--Color);
12721
12741
  }
12722
12742
  .pf-c-dropdown__toggle.pf-m-plain.pf-m-disabled, .pf-c-dropdown__toggle.pf-m-plain:disabled {
12723
12743
  --pf-c-dropdown__toggle--m-plain--Color: var(--pf-c-dropdown__toggle--m-plain--disabled--Color);
@@ -12787,6 +12807,7 @@ label.pf-c-check, .pf-c-check__label,
12787
12807
  margin-right: var(--pf-c-dropdown__toggle-icon--MarginRight);
12788
12808
  margin-left: var(--pf-c-dropdown__toggle-icon--MarginLeft);
12789
12809
  line-height: var(--pf-c-dropdown__toggle-icon--LineHeight);
12810
+ color: var(--pf-c-dropdown__toggle-icon--Color, inherit);
12790
12811
  }
12791
12812
  .pf-c-dropdown.pf-m-top.pf-m-expanded .pf-c-dropdown__toggle-icon {
12792
12813
  transform: rotate(var(--pf-c-dropdown--m-top--m-expanded__toggle-icon--Rotate));
@@ -15725,13 +15746,8 @@ ul.pf-c-list {
15725
15746
  padding-left: var(--pf-c-masthead--PaddingLeft);
15726
15747
  background-color: var(--pf-c-masthead--BackgroundColor);
15727
15748
  }
15728
- @media screen and (min-width: 1200px) {
15729
- .pf-c-masthead {
15730
- --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
15731
- }
15732
- }
15733
15749
  @media screen and (min-width: 768px) {
15734
- .pf-c-masthead {
15750
+ .pf-c-page:where(:not(.pf-m-resize-observer)) .pf-c-masthead {
15735
15751
  --pf-c-masthead--GridTemplateColumns: var(--pf-c-masthead--m-display-inline--GridTemplateColumns);
15736
15752
  --pf-c-masthead__main--GridColumn: var(--pf-c-masthead--m-display-inline__main--GridColumn);
15737
15753
  --pf-c-masthead__main--MinHeight: var(--pf-c-masthead--m-display-inline__main--MinHeight);
@@ -15751,6 +15767,14 @@ ul.pf-c-list {
15751
15767
  --pf-c-masthead__content--c-nav--m-horizontal--MarginLeft: var(--pf-c-masthead--m-display-inline__content--c-nav--m-horizontal--MarginLeft);
15752
15768
  }
15753
15769
  }
15770
+ @media screen and (min-width: 1200px) {
15771
+ .pf-c-page:where(:not(.pf-m-resize-observer)) .pf-c-masthead {
15772
+ --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
15773
+ }
15774
+ }
15775
+ .pf-c-page:where(.pf-m-breakpoint-xl) .pf-c-masthead {
15776
+ --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
15777
+ }
15754
15778
  .pf-c-masthead.pf-m-light {
15755
15779
  color: var(--pf-global--Color--100);
15756
15780
  --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light--BackgroundColor);
@@ -16389,6 +16413,7 @@ ul.pf-c-list {
16389
16413
  --pf-c-menu--m-nav__item__list-item--first-child__item--hover--after--Top: 0;
16390
16414
  --pf-c-menu--m-nav__item-description--Color: var(--pf-global--Color--light-200);
16391
16415
  --pf-c-menu--m-nav--c-menu--left-offset: 0.25rem;
16416
+ --pf-c-menu--m-nav--c-menu--m-top--bottom-offset: 0;
16392
16417
  --pf-c-menu--m-nav--c-menu--m-left--right-offset: 0.25rem;
16393
16418
  --pf-c-menu--m-nav--c-menu--Top: calc(var(--pf-c-menu--m-nav__item--before--BorderBottomWidth) * -1);
16394
16419
  --pf-c-menu--m-nav--c-menu--Left: calc(100% - var(--pf-c-menu--m-nav--c-menu--left-offset));
@@ -16855,6 +16880,11 @@ ul.pf-c-list {
16855
16880
  --pf-c-menu-toggle__count--MarginLeft: var(--pf-global--spacer--sm);
16856
16881
  --pf-c-menu-toggle__controls--PaddingLeft: var(--pf-global--spacer--md);
16857
16882
  --pf-c-menu-toggle__toggle-icon--MarginRight: var(--pf-global--spacer--sm);
16883
+ --pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-global--Color--200);
16884
+ --pf-c-menu-toggle--m-plain--hover__toggle-icon--Color: var(--pf-global--Color--100);
16885
+ --pf-c-menu-toggle--m-plain--active__toggle-icon--Color: var(--pf-global--Color--100);
16886
+ --pf-c-menu-toggle--m-plain--focus__toggle-icon--Color: var(--pf-global--Color--100);
16887
+ --pf-c-menu-toggle--m-plain--m-expanded__toggle-icon--Color: var(--pf-global--Color--100);
16858
16888
  --pf-c-menu-toggle--m-full-height--PaddingRight: var(--pf-global--spacer--lg);
16859
16889
  --pf-c-menu-toggle--m-full-height--PaddingLeft: var(--pf-global--spacer--lg);
16860
16890
  --pf-c-menu-toggle--m-full-height__toggle--before--BorderTopWidth: 0;
@@ -16934,6 +16964,9 @@ ul.pf-c-list {
16934
16964
  --pf-c-menu-toggle--m-secondary--before--BorderColor: var(--pf-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderColor);
16935
16965
  --pf-c-menu-toggle--m-secondary--before--BorderWidth: var(--pf-c-menu-toggle--m-expanded__toggle--m-secondary--before--BorderWidth);
16936
16966
  }
16967
+ .pf-c-menu-toggle.pf-m-plain {
16968
+ --pf-c-menu-toggle__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain__toggle-icon--Color);
16969
+ }
16937
16970
  .pf-c-menu-toggle.pf-m-plain:not(.pf-m-text) {
16938
16971
  --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-plain--Color);
16939
16972
  --pf-c-menu-toggle--hover--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
@@ -16950,22 +16983,26 @@ ul.pf-c-list {
16950
16983
  --pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--hover--BackgroundColor);
16951
16984
  --pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--hover--after--BorderBottomWidth);
16952
16985
  --pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--hover--after--BorderBottomColor);
16986
+ --pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--hover__toggle-icon--Color);
16953
16987
  }
16954
16988
  .pf-c-menu-toggle:focus {
16955
16989
  --pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--focus--BackgroundColor);
16956
16990
  --pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--focus--after--BorderBottomWidth);
16957
16991
  --pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--focus--after--BorderBottomColor);
16992
+ --pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--focus__toggle-icon--Color);
16958
16993
  }
16959
16994
  .pf-c-menu-toggle:active {
16960
16995
  --pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--active--BackgroundColor);
16961
16996
  --pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--active--after--BorderBottomWidth);
16962
16997
  --pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--active--after--BorderBottomColor);
16998
+ --pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--active__toggle-icon--Color);
16963
16999
  }
16964
17000
  .pf-c-menu-toggle.pf-m-expanded {
16965
17001
  --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-expanded--Color);
16966
17002
  --pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--m-expanded--BackgroundColor);
16967
17003
  --pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-expanded--after--BorderBottomWidth);
16968
17004
  --pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--m-expanded--after--BorderBottomColor);
17005
+ --pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--m-expanded__toggle-icon--Color);
16969
17006
  }
16970
17007
  .pf-c-menu-toggle:disabled {
16971
17008
  --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--disabled--Color);
@@ -17010,6 +17047,7 @@ ul.pf-c-list {
17010
17047
 
17011
17048
  .pf-c-menu-toggle__toggle-icon {
17012
17049
  margin-right: var(--pf-c-menu-toggle__toggle-icon--MarginRight);
17050
+ color: var(--pf-c-menu-toggle__toggle-icon--Color, inherit);
17013
17051
  }
17014
17052
 
17015
17053
  .pf-c-modal-box {
@@ -17726,7 +17764,7 @@ ul.pf-c-list {
17726
17764
  --pf-c-menu__list--PaddingTop: 0;
17727
17765
  --pf-c-menu__list--PaddingBottom: 0;
17728
17766
  --pf-c-menu__item--FontSize: var(--pf-c-nav--c-menu__item--FontSize);
17729
- --pf-c-menu__item--Color: var(--pf-c-nav--c-menu__item--Color);
17767
+ --pf-c-menu__item--Color: var(--pf-c-nav--c-menu__item--Color, inherit);
17730
17768
  --pf-c-menu__item--PaddingTop: var(--pf-c-nav--c-menu--m-flyout__item--PaddingTop);
17731
17769
  --pf-c-menu__item--PaddingRight: var(--pf-c-nav--c-menu--m-flyout__item--PaddingRight);
17732
17770
  --pf-c-menu__item--PaddingBottom: var(--pf-c-nav--c-menu--m-flyout__item--PaddingBottom);
@@ -17910,9 +17948,9 @@ ul.pf-c-list {
17910
17948
  --pf-c-nav__link--PaddingRight: var(--pf-c-nav--m-horizontal-subnav__link--PaddingRight);
17911
17949
  --pf-c-nav__link--PaddingBottom: var(--pf-c-nav--m-horizontal-subnav__link--PaddingBottom);
17912
17950
  --pf-c-nav__link--PaddingLeft: var(--pf-c-nav--m-horizontal-subnav__link--PaddingLeft);
17951
+ --pf-c-nav__link--Color: var(--pf-c-nav--m-horizontal-subnav__link--Color);
17913
17952
  --pf-c-nav__link--Right: var(--pf-c-nav--m-horizontal-subnav__link--Right);
17914
17953
  --pf-c-nav__link--Left: var(--pf-c-nav--m-horizontal-subnav__link--Left);
17915
- --pf-c-nav__link--Color: var(--pf-c-nav--m-horizontal-subnav__link--Color);
17916
17954
  --pf-c-nav__link--hover--Color: var(--pf-c-nav--m-horizontal-subnav__link--hover--Color);
17917
17955
  --pf-c-nav__link--active--Color: var(--pf-c-nav--m-horizontal-subnav__link--active--Color);
17918
17956
  --pf-c-nav__link--focus--Color: var(--pf-c-nav--m-horizontal-subnav__link--focus--Color);
@@ -18674,6 +18712,8 @@ ul.pf-c-list {
18674
18712
  --pf-c-options-menu__toggle-icon--MarginRight: var(--pf-global--spacer--sm);
18675
18713
  --pf-c-options-menu__toggle-icon--MarginLeft: var(--pf-global--spacer--md);
18676
18714
  --pf-c-options-menu--m-top--m-expanded__toggle-icon--Rotate: 180deg;
18715
+ --pf-c-options-menu--m-plain__toggle-icon--Color: var(--pf-global--Color--200);
18716
+ --pf-c-options-menu--m-plain--hover__toggle-icon--Color: var(--pf-global--Color--100);
18677
18717
  --pf-c-options-menu__toggle-button--BackgroundColor: transparent;
18678
18718
  --pf-c-options-menu__toggle-button--PaddingTop: var(--pf-global--spacer--form-element);
18679
18719
  --pf-c-options-menu__toggle-button--PaddingRight: var(--pf-global--spacer--sm);
@@ -18766,6 +18806,9 @@ ul.pf-c-list {
18766
18806
  --pf-c-options-menu__toggle--BorderBottomColor: var(--pf-c-options-menu__toggle--expanded--BorderBottomColor);
18767
18807
  border-bottom-width: var(--pf-c-options-menu__toggle--expanded--BorderBottomWidth);
18768
18808
  }
18809
+ .pf-c-options-menu__toggle.pf-m-plain {
18810
+ --pf-c-options-menu__toggle-icon--Color: var(--pf-c-options-menu--m-plain__toggle-icon--Color);
18811
+ }
18769
18812
  .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) {
18770
18813
  --pf-c-options-menu__toggle--PaddingRight: var(--pf-c-options-menu__toggle--m-plain--PaddingRight);
18771
18814
  --pf-c-options-menu__toggle--PaddingLeft: var(--pf-c-options-menu__toggle--m-plain--PaddingLeft);
@@ -18775,10 +18818,11 @@ ul.pf-c-list {
18775
18818
  .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) .pf-c-options-menu__toggle-button-icon {
18776
18819
  line-height: var(--pf-c-options-menu__toggle--LineHeight);
18777
18820
  }
18778
- .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):hover, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):active, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text).pf-m-active, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):focus, .pf-c-options-menu.pf-m-expanded > .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) {
18821
+ .pf-c-options-menu__toggle.pf-m-plain:hover, .pf-c-options-menu__toggle.pf-m-plain:active, .pf-c-options-menu__toggle.pf-m-plain.pf-m-active, .pf-c-options-menu__toggle.pf-m-plain:focus, .pf-c-options-menu.pf-m-expanded > .pf-c-options-menu__toggle.pf-m-plain {
18779
18822
  --pf-c-options-menu__toggle--m-plain--Color: var(--pf-c-options-menu__toggle--m-plain--hover--Color);
18823
+ --pf-c-options-menu--m-plain__toggle-icon--Color: var(--pf-c-options-menu--m-plain--hover__toggle-icon--Color);
18780
18824
  }
18781
- .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text).pf-m-disabled, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):disabled {
18825
+ .pf-c-options-menu__toggle.pf-m-plain.pf-m-disabled, .pf-c-options-menu__toggle.pf-m-plain:disabled {
18782
18826
  --pf-c-options-menu__toggle--m-plain--Color: var(--pf-c-options-menu__toggle--m-plain--disabled--Color);
18783
18827
  }
18784
18828
  .pf-c-options-menu__toggle.pf-m-disabled, .pf-c-options-menu__toggle:disabled {
@@ -18807,6 +18851,11 @@ ul.pf-c-list {
18807
18851
  white-space: nowrap;
18808
18852
  }
18809
18853
 
18854
+ .pf-c-options-menu__toggle-icon,
18855
+ .pf-c-options-menu__toggle-button-icon {
18856
+ color: var(--pf-c-options-menu__toggle-icon--Color, inherit);
18857
+ }
18858
+
18810
18859
  .pf-c-options-menu__toggle-icon {
18811
18860
  margin-right: var(--pf-c-options-menu__toggle-icon--MarginRight);
18812
18861
  margin-left: var(--pf-c-options-menu__toggle-icon--MarginLeft);
@@ -19641,7 +19690,7 @@ ul.pf-c-list {
19641
19690
  --pf-c-pagination__nav-page-select--PaddingLeft: var(--pf-global--spacer--md);
19642
19691
  --pf-c-pagination__nav-page-select--PaddingRight: var(--pf-global--spacer--md);
19643
19692
  --pf-c-pagination__nav-page-select--child--MarginRight: var(--pf-global--spacer--xs);
19644
- --pf-c-pagination__nav-page-select--c-form-control--width-base: 3.5ch;
19693
+ --pf-c-pagination__nav-page-select--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
19645
19694
  --pf-c-pagination__nav-page-select--c-form-control--width-chars: 2;
19646
19695
  --pf-c-pagination__nav-page-select--c-form-control--Width: calc(var(--pf-c-pagination__nav-page-select--c-form-control--width-base) + (var(--pf-c-pagination__nav-page-select--c-form-control--width-chars) * 1ch));
19647
19696
  --pf-c-pagination__total-items--Display: block;
@@ -20432,6 +20481,8 @@ ul.pf-c-list {
20432
20481
  --pf-c-progress-stepper__step-description--Color: var(--pf-global--Color--200);
20433
20482
  --pf-c-progress-stepper__step-description--TextAlign: left;
20434
20483
  --pf-c-progress-stepper--m-center__step-description--TextAlign: center;
20484
+ --pf-c-progress-stepper--m-center__step-description--MarginRight: 0;
20485
+ --pf-c-progress-stepper--m-center__step-description--MarginLeft: 0;
20435
20486
  position: relative;
20436
20487
  display: grid;
20437
20488
  grid-auto-flow: var(--pf-c-progress-stepper--GridAutoFlow);
@@ -20522,6 +20573,9 @@ ul.pf-c-list {
20522
20573
  .pf-c-progress-stepper__step.pf-m-info {
20523
20574
  --pf-c-progress-stepper__step-icon--Color: var(--pf-global--info-color--100);
20524
20575
  }
20576
+ .pf-c-progress-stepper__step:last-child {
20577
+ --pf-c-progress-stepper__step-main--MarginBottom: 0;
20578
+ }
20525
20579
 
20526
20580
  .pf-c-progress-stepper__step-connector {
20527
20581
  position: relative;
@@ -20914,6 +20968,8 @@ label.pf-c-radio, .pf-c-radio__label,
20914
20968
  --pf-c-select__toggle-arrow--MarginRight: var(--pf-global--spacer--sm);
20915
20969
  --pf-c-select__toggle-arrow--with-clear--MarginLeft: var(--pf-global--spacer--sm);
20916
20970
  --pf-c-select__toggle-arrow--m-top--m-expanded__toggle-arrow--Rotate: 180deg;
20971
+ --pf-c-select--m-plain__toggle-arrow--Color: var(--pf-global--Color--200);
20972
+ --pf-c-select--m-plain--hover__toggle-arrow--Color: var(--pf-global--Color--100);
20917
20973
  --pf-c-select__toggle-clear--PaddingRight: var(--pf-global--spacer--sm);
20918
20974
  --pf-c-select__toggle-clear--PaddingLeft: var(--pf-global--spacer--md);
20919
20975
  --pf-c-select__toggle-clear--toggle-button--PaddingLeft: var(--pf-global--spacer--sm);
@@ -21091,9 +21147,15 @@ label.pf-c-radio, .pf-c-radio__label,
21091
21147
  --pf-c-select__toggle--before--BorderBottomColor: var(--pf-c-select__toggle--m-expanded--before--BorderBottomColor);
21092
21148
  --pf-c-select__toggle--before--BorderBottomWidth: var(--pf-c-select__toggle--m-expanded--before--BorderBottomWidth);
21093
21149
  }
21150
+ .pf-c-select__toggle.pf-m-plain {
21151
+ --pf-c-select__toggle-arrow--Color: var(--pf-c-select--m-plain__toggle-arrow--Color);
21152
+ }
21094
21153
  .pf-c-select__toggle.pf-m-plain::before {
21095
21154
  border-color: var(--pf-c-select__toggle--m-plain--before--BorderColor);
21096
21155
  }
21156
+ .pf-c-select__toggle.pf-m-plain:hover, .pf-c-select__toggle.pf-m-plain:active, .pf-c-select__toggle.pf-m-plain.pf-m-active, .pf-c-select__toggle.pf-m-plain:focus, .pf-c-select.pf-m-expanded > .pf-c-select__toggle.pf-m-plain {
21157
+ --pf-c-select--m-plain__toggle-arrow--Color: var(--pf-c-select--m-plain--hover__toggle-arrow--Color);
21158
+ }
21097
21159
  .pf-c-select__toggle.pf-m-typeahead {
21098
21160
  --pf-c-select__toggle--PaddingTop: 0;
21099
21161
  --pf-c-select__toggle--PaddingRight: 0;
@@ -21122,6 +21184,9 @@ label.pf-c-radio, .pf-c-radio__label,
21122
21184
  --pf-c-select__toggle-text--Color: var(--pf-c-select__toggle--m-placeholder__toggle-text--Color);
21123
21185
  }
21124
21186
 
21187
+ .pf-c-select__toggle-arrow {
21188
+ color: var(--pf-c-select__toggle-arrow--Color, inherit);
21189
+ }
21125
21190
  * + .pf-c-select__toggle-arrow {
21126
21191
  margin-right: var(--pf-c-select__toggle-arrow--MarginRight);
21127
21192
  margin-left: var(--pf-c-select__toggle-arrow--MarginLeft);
@@ -21415,6 +21480,7 @@ label.pf-c-radio, .pf-c-radio__label,
21415
21480
  --pf-c-sidebar--m-split__panel--Position: static;
21416
21481
  --pf-c-sidebar--m-split__panel--Top: auto;
21417
21482
  --pf-c-sidebar--m-split--m-panel-right__panel--Order: 1;
21483
+ --pf-c-sidebar__panel--FlexBasis--base: auto;
21418
21484
  --pf-c-sidebar__panel--BoxShadow--base: 0 0.25rem 0.25rem -0.25rem rgba(3, 3, 3, 0.16);
21419
21485
  --pf-c-sidebar__panel--BoxShadow: var(--pf-c-sidebar__panel--BoxShadow--base);
21420
21486
  --pf-c-sidebar__panel--Top: 0;
@@ -24504,7 +24570,7 @@ svg.pf-c-spinner.pf-m-xl {
24504
24570
  border-right: var(--pf-c-table--cell--m-border-right--before--BorderRightWidth) solid var(--pf-c-table--cell--m-border-right--before--BorderRightColor);
24505
24571
  }
24506
24572
  .pf-c-table tr > *.pf-m-border-left::before {
24507
- border-left: var(--pf-c-table--cell--m-border-right--before--BorderLeftWidth) solid var(--pf-c-table--cell--m-border-left--before--BorderLeftColor);
24573
+ border-left: var(--pf-c-table--cell--m-border-left--before--BorderLeftWidth) solid var(--pf-c-table--cell--m-border-left--before--BorderLeftColor);
24508
24574
  }
24509
24575
  .pf-c-table caption {
24510
24576
  padding-top: var(--pf-c-table-caption--PaddingTop);
@@ -25191,6 +25257,8 @@ svg.pf-c-spinner.pf-m-xl {
25191
25257
  --pf-c-table__sticky-column--BackgroundColor: var(--pf-global--BackgroundColor--100);
25192
25258
  --pf-c-table__sticky-column--m-border-right--before--BorderRightWidth: var(--pf-global--BorderWidth--sm);
25193
25259
  --pf-c-table__sticky-column--m-border-right--before--BorderRightColor: var(--pf-global--BorderColor--100);
25260
+ --pf-c-table__sticky-column--m-border-left--before--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
25261
+ --pf-c-table__sticky-column--m-border-left--before--BorderLeftColor: var(--pf-global--BorderColor--100);
25194
25262
  --pf-c-table--m-sticky-header--thead__sticky-column--ZIndex: calc(var(--pf-c-table__sticky-column--ZIndex) + 1);
25195
25263
  }
25196
25264
  .pf-c-table .pf-c-table__sticky-column {
@@ -25239,6 +25307,8 @@ svg.pf-c-spinner.pf-m-xl {
25239
25307
  --pf-c-table__tree-view-main--nested-indent--base: calc(var(--pf-c-table__tree-view-main--indent--base) - var(--pf-global--spacer--md));
25240
25308
  --pf-c-table__tree-view-main--PaddingLeft: var(--pf-c-table__tree-view-main--indent--base);
25241
25309
  --pf-c-table__tree-view-main--MarginLeft: calc(var(--pf-c-table--cell--PaddingLeft) * -1);
25310
+ --pf-c-table__tree-view-main--c-table__check--PaddingRight: var(--pf-global--spacer--sm);
25311
+ --pf-c-table__tree-view-main--c-table__check--PaddingLeft: var(--pf-global--spacer--sm);
25242
25312
  --pf-c-table__tree-view-main--c-table__check--MarginRight: var(--pf-global--spacer--sm);
25243
25313
  --pf-c-table__tree-view-icon--MinWidth: var(--pf-global--FontSize--md);
25244
25314
  --pf-c-table__tree-view-icon--MarginRight: var(--pf-global--spacer--sm);
@@ -25299,6 +25369,11 @@ svg.pf-c-spinner.pf-m-xl {
25299
25369
  .pf-c-table__tree-view-main > .pf-c-table__check {
25300
25370
  margin-right: var(--pf-c-table__tree-view-main--c-table__check--MarginRight);
25301
25371
  }
25372
+ .pf-c-table__tree-view-main > .pf-c-table__check label {
25373
+ padding-right: var(--pf-c-table__tree-view-main--c-table__check--PaddingRight);
25374
+ padding-left: var(--pf-c-table__tree-view-main--c-table__check--PaddingLeft);
25375
+ margin: 0 calc(var(--pf-c-table__tree-view-main--c-table__check--MarginRight) * -1) 0 0;
25376
+ }
25302
25377
 
25303
25378
  .pf-c-table__tree-view-text {
25304
25379
  display: flex;
@@ -27333,7 +27408,7 @@ svg.pf-c-spinner.pf-m-xl {
27333
27408
  .pf-c-number-input {
27334
27409
  --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
27335
27410
  --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);
27336
- --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2);
27411
+ --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
27337
27412
  --pf-c-number-input--c-form-control--width-chars: 4;
27338
27413
  --pf-c-number-input--c-form-control--Width: calc(var(--pf-c-number-input--c-form-control--width-base) + var(--pf-c-number-input--c-form-control--width-chars) * 1ch);
27339
27414
  display: inline-flex;
@@ -27343,11 +27418,6 @@ svg.pf-c-spinner.pf-m-xl {
27343
27418
  display: inline-flex;
27344
27419
  width: var(--pf-c-number-input--c-form-control--Width);
27345
27420
  text-align: right;
27346
- -moz-appearance: textfield;
27347
- }
27348
- .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button {
27349
- -webkit-appearance: none;
27350
- margin: 0;
27351
27421
  }
27352
27422
 
27353
27423
  .pf-c-input-group + .pf-c-number-input__unit,