@patternfly/react-core 4.222.12 → 4.222.15

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 (66) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/dist/esm/components/CalendarMonth/CalendarMonth.d.ts +3 -1
  3. package/dist/esm/components/CalendarMonth/CalendarMonth.d.ts.map +1 -1
  4. package/dist/esm/components/CalendarMonth/CalendarMonth.js +21 -14
  5. package/dist/esm/components/CalendarMonth/CalendarMonth.js.map +1 -1
  6. package/dist/esm/components/DatePicker/DatePicker.d.ts +14 -4
  7. package/dist/esm/components/DatePicker/DatePicker.d.ts.map +1 -1
  8. package/dist/esm/components/DatePicker/DatePicker.js +20 -8
  9. package/dist/esm/components/DatePicker/DatePicker.js.map +1 -1
  10. package/dist/esm/components/Label/Label.js +3 -3
  11. package/dist/esm/components/Label/Label.js.map +1 -1
  12. package/dist/esm/components/LabelGroup/LabelGroup.d.ts +2 -0
  13. package/dist/esm/components/LabelGroup/LabelGroup.d.ts.map +1 -1
  14. package/dist/esm/components/LabelGroup/LabelGroup.js +4 -3
  15. package/dist/esm/components/LabelGroup/LabelGroup.js.map +1 -1
  16. package/dist/esm/components/Popover/Popover.js +2 -2
  17. package/dist/esm/components/Popover/Popover.js.map +1 -1
  18. package/dist/esm/components/TimePicker/TimePicker.d.ts +6 -1
  19. package/dist/esm/components/TimePicker/TimePicker.d.ts.map +1 -1
  20. package/dist/esm/components/TimePicker/TimePicker.js +32 -19
  21. package/dist/esm/components/TimePicker/TimePicker.js.map +1 -1
  22. package/dist/js/components/CalendarMonth/CalendarMonth.d.ts +3 -1
  23. package/dist/js/components/CalendarMonth/CalendarMonth.d.ts.map +1 -1
  24. package/dist/js/components/CalendarMonth/CalendarMonth.js +21 -14
  25. package/dist/js/components/CalendarMonth/CalendarMonth.js.map +1 -1
  26. package/dist/js/components/DatePicker/DatePicker.d.ts +14 -4
  27. package/dist/js/components/DatePicker/DatePicker.d.ts.map +1 -1
  28. package/dist/js/components/DatePicker/DatePicker.js +20 -8
  29. package/dist/js/components/DatePicker/DatePicker.js.map +1 -1
  30. package/dist/js/components/Label/Label.js +3 -3
  31. package/dist/js/components/Label/Label.js.map +1 -1
  32. package/dist/js/components/LabelGroup/LabelGroup.d.ts +2 -0
  33. package/dist/js/components/LabelGroup/LabelGroup.d.ts.map +1 -1
  34. package/dist/js/components/LabelGroup/LabelGroup.js +4 -3
  35. package/dist/js/components/LabelGroup/LabelGroup.js.map +1 -1
  36. package/dist/js/components/Popover/Popover.js +1 -1
  37. package/dist/js/components/Popover/Popover.js.map +1 -1
  38. package/dist/js/components/TimePicker/TimePicker.d.ts +6 -1
  39. package/dist/js/components/TimePicker/TimePicker.d.ts.map +1 -1
  40. package/dist/js/components/TimePicker/TimePicker.js +32 -19
  41. package/dist/js/components/TimePicker/TimePicker.js.map +1 -1
  42. package/dist/styles/base-no-reset.css +5 -0
  43. package/dist/styles/base.css +5 -0
  44. package/dist/umd/react-core.css +255 -28
  45. package/dist/umd/react-core.js +100 -51
  46. package/dist/umd/react-core.min.css +255 -28
  47. package/dist/umd/react-core.min.js +5 -5
  48. package/package.json +6 -6
  49. package/src/components/CalendarMonth/CalendarMonth.tsx +21 -13
  50. package/src/components/DatePicker/DatePicker.tsx +36 -11
  51. package/src/components/Label/Label.tsx +3 -3
  52. package/src/components/LabelGroup/LabelGroup.tsx +5 -1
  53. package/src/components/LabelGroup/examples/LabelGroup.md +7 -0
  54. package/src/components/LabelGroup/examples/LabelGroupEditableAdd.tsx +74 -0
  55. package/src/components/LabelGroup/examples/LabelGroupEditableAddDropdown.tsx +138 -0
  56. package/src/components/LabelGroup/examples/LabelGroupEditableAddModal.tsx +356 -0
  57. package/src/components/Modal/examples/Modal.md +2 -0
  58. package/src/components/OverflowMenu/examples/OverflowMenu.md +8 -0
  59. package/src/components/Popover/Popover.tsx +2 -2
  60. package/src/components/TimePicker/TimePicker.tsx +36 -19
  61. package/src/components/Toolbar/examples/Toolbar.md +4 -0
  62. package/src/demos/Card/Card.md +2 -0
  63. package/src/demos/{DatePicker.md → DatePicker/DatePicker.md} +8 -0
  64. package/src/demos/DatePicker/examples/DateTimePickerInModal.tsx +51 -0
  65. package/src/demos/LabelGroupDemos.md +18 -0
  66. package/src/demos/PrimaryDetail.md +10 -6
@@ -2919,6 +2919,8 @@ button.pf-c-breadcrumb__link {
2919
2919
  --pf-c-card__header--m-toggle-right--toggle--MarginRight: calc(var(--pf-global--spacer--form-element) * -1);
2920
2920
  --pf-c-card__header--m-toggle-right--toggle--MarginLeft: var(--pf-global--spacer--xs);
2921
2921
  --pf-c-card__header--m-toggle-right--actions--MarginRight: 0;
2922
+ --pf-c-card__input--focus--BorderWidth: var(--pf-global--BorderWidth--md);
2923
+ --pf-c-card__input--focus--BorderColor: var(--pf-global--primary-color--100);
2922
2924
  display: flex;
2923
2925
  flex-direction: column;
2924
2926
  background-color: var(--pf-c-card--BackgroundColor);
@@ -3178,10 +3180,28 @@ button.pf-c-breadcrumb__link {
3178
3180
  font-size: var(--pf-c-card__footer--FontSize);
3179
3181
  }
3180
3182
 
3183
+ .pf-c-card__sr-input:focus + .pf-c-card::after {
3184
+ position: absolute;
3185
+ top: 0;
3186
+ right: 0;
3187
+ bottom: 0;
3188
+ left: 0;
3189
+ content: "";
3190
+ border: var(--pf-c-card__input--focus--BorderWidth) solid var(--pf-c-card__input--focus--BorderColor);
3191
+ }
3192
+
3181
3193
  .pf-m-overpass-font .pf-c-card .pf-c-card__title {
3182
3194
  font-weight: var(--pf-global--FontWeight--normal);
3183
3195
  }
3184
3196
 
3197
+ :where(.pf-theme-dark) .pf-c-card {
3198
+ --pf-c-card--BoxShadow: var(--pf-global--BoxShadow--md);
3199
+ --pf-c-card--m-hoverable-raised--hover--BoxShadow: var(--pf-global--BoxShadow--lg);
3200
+ --pf-c-card--m-selectable-raised--hover--BoxShadow: var(--pf-global--BoxShadow--lg);
3201
+ --pf-c-card--m-selectable-raised--focus--BoxShadow: var(--pf-global--BoxShadow--lg);
3202
+ --pf-c-card--m-selectable-raised--active--BoxShadow: var(--pf-global--BoxShadow--lg);
3203
+ }
3204
+
3185
3205
  .pf-c-check {
3186
3206
  --pf-c-check--GridGap: var(--pf-global--spacer--xs) var(--pf-global--spacer--sm);
3187
3207
  --pf-c-check__label--disabled--Color: var(--pf-global--disabled-color--100);
@@ -5459,6 +5479,7 @@ label.pf-c-check, .pf-c-check__label,
5459
5479
  --pf-c-description-list__group--RowGap: var(--pf-global--spacer--sm);
5460
5480
  --pf-c-description-list__group--ColumnGap: var(--pf-global--spacer--sm);
5461
5481
  --pf-c-description-list__group--GridTemplateColumns: auto;
5482
+ --pf-c-description-list__group--GridTemplateRows: auto 1fr;
5462
5483
  --pf-c-description-list__group--GridColumn: auto;
5463
5484
  --pf-c-description-list--m-compact--RowGap: var(--pf-global--gutter);
5464
5485
  --pf-c-description-list--m-compact--ColumnGap: var(--pf-global--spacer--sm);
@@ -5471,9 +5492,11 @@ label.pf-c-check, .pf-c-check__label,
5471
5492
  --pf-c-description-list__term-icon--MarginRight: var(--pf-global--spacer--sm);
5472
5493
  --pf-c-description-list__term-icon--Color: var(--pf-global--icon--Color--light);
5473
5494
  --pf-c-description-list--m-vertical__group--GridTemplateColumns: repeat(var(--pf-c-description-list--GridTemplateColumns--count));
5495
+ --pf-c-description-list--m-vertical__group--GridTemplateRows: auto 1fr;
5474
5496
  --pf-c-description-list--m-horizontal__term--width: 12ch;
5475
5497
  --pf-c-description-list--m-horizontal__description--width: minmax(10ch, auto);
5476
5498
  --pf-c-description-list--m-horizontal__group--GridTemplateColumns: var(--pf-c-description-list__term--width) var(--pf-c-description-list--m-horizontal__description--width);
5499
+ --pf-c-description-list--m-horizontal__group--GridTemplateRows: auto;
5477
5500
  --pf-c-description-list--m-1-col--GridTemplateColumns--count: 1;
5478
5501
  --pf-c-description-list--m-2-col--GridTemplateColumns--count: 2;
5479
5502
  --pf-c-description-list--m-3-col--GridTemplateColumns--count: 3;
@@ -5484,6 +5507,8 @@ label.pf-c-check, .pf-c-check__label,
5484
5507
  --pf-c-description-list__text--m-help-text--TextDecorationOffset: 0.25rem;
5485
5508
  --pf-c-description-list__text--m-help-text--hover--TextDecorationColor: var(--pf-global--Color--100);
5486
5509
  --pf-c-description-list__text--m-help-text--focus--TextDecorationColor: var(--pf-global--Color--100);
5510
+ --pf-c-description-list--m-display-lg__description--FontSize: var(--pf-global--FontSize--lg);
5511
+ --pf-c-description-list--m-display-2xl__description--FontSize: var(--pf-global--FontSize--2xl);
5487
5512
  display: grid;
5488
5513
  align-items: baseline;
5489
5514
  row-gap: var(--pf-c-description-list--RowGap);
@@ -5578,7 +5603,8 @@ label.pf-c-check, .pf-c-check__label,
5578
5603
  margin-bottom: calc(var(--pf-c-description-list--RowGap) * -1);
5579
5604
  }
5580
5605
 
5581
- .pf-c-description-list.pf-m-fill-columns .pf-c-description-list__group {
5606
+ .pf-c-description-list.pf-m-fill-columns .pf-c-description-list__group,
5607
+ .pf-c-description-list.pf-m-fill-columns > .pf-c-card {
5582
5608
  display: inline-grid;
5583
5609
  width: 100%;
5584
5610
  margin-bottom: var(--pf-c-description-list--RowGap);
@@ -5588,12 +5614,27 @@ label.pf-c-check, .pf-c-check__label,
5588
5614
  -moz-column-break-inside: avoid;
5589
5615
  }
5590
5616
 
5591
- .pf-c-description-list__group {
5617
+ .pf-c-description-list.pf-m-display-lg {
5618
+ --pf-c-description-list__description--FontSize: var(--pf-c-description-list--m-display-lg__description--FontSize);
5619
+ }
5620
+
5621
+ .pf-c-description-list.pf-m-display-2xl {
5622
+ --pf-c-description-list__description--FontSize: var(--pf-c-description-list--m-display-2xl__description--FontSize);
5623
+ }
5624
+
5625
+ .pf-c-description-list > .pf-c-card {
5626
+ align-self: stretch;
5627
+ padding: var(--pf-c-card--first-child--PaddingTop) var(--pf-c-card--child--PaddingRight) var(--pf-c-card--child--PaddingBottom) var(--pf-c-card--child--PaddingLeft);
5628
+ }
5629
+
5630
+ .pf-c-description-list__group,
5631
+ .pf-c-description-list > .pf-c-card {
5592
5632
  display: grid;
5593
5633
  grid-column: var(--pf-c-description-list__group--GridColumn);
5594
5634
  row-gap: var(--pf-c-description-list__group--RowGap);
5595
5635
  column-gap: var(--pf-c-description-list__group--ColumnGap);
5596
5636
  grid-template-columns: var(--pf-c-description-list__group--GridTemplateColumns);
5637
+ grid-template-rows: var(--pf-c-description-list__group--GridTemplateRows);
5597
5638
  align-items: baseline;
5598
5639
  }
5599
5640
 
@@ -5622,6 +5663,10 @@ label.pf-c-check, .pf-c-check__label,
5622
5663
  color: var(--pf-c-description-list__term-icon--Color);
5623
5664
  }
5624
5665
 
5666
+ .pf-c-description-list__description {
5667
+ font-size: var(--pf-c-description-list__description--FontSize, inherit);
5668
+ }
5669
+
5625
5670
  .pf-c-description-list__text {
5626
5671
  min-width: 0;
5627
5672
  }
@@ -5657,10 +5702,12 @@ label.pf-c-check, .pf-c-check__label,
5657
5702
 
5658
5703
  .pf-c-description-list.pf-m-horizontal {
5659
5704
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-horizontal__group--GridTemplateColumns);
5705
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-horizontal__group--GridTemplateRows);
5660
5706
  }
5661
5707
 
5662
5708
  .pf-c-description-list.pf-m-vertical {
5663
5709
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-vertical__group--GridTemplateColumns);
5710
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-vertical__group--GridTemplateRows);
5664
5711
  }
5665
5712
 
5666
5713
  @media (min-width: 576px) {
@@ -5678,10 +5725,12 @@ label.pf-c-check, .pf-c-check__label,
5678
5725
 
5679
5726
  .pf-c-description-list.pf-m-horizontal-on-sm {
5680
5727
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-horizontal__group--GridTemplateColumns);
5728
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-horizontal__group--GridTemplateRows);
5681
5729
  }
5682
5730
 
5683
5731
  .pf-c-description-list.pf-m-vertical-on-sm {
5684
5732
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-vertical__group--GridTemplateColumns);
5733
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-vertical__group--GridTemplateRows);
5685
5734
  }
5686
5735
  }
5687
5736
  @media (min-width: 768px) {
@@ -5699,10 +5748,12 @@ label.pf-c-check, .pf-c-check__label,
5699
5748
 
5700
5749
  .pf-c-description-list.pf-m-horizontal-on-md {
5701
5750
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-horizontal__group--GridTemplateColumns);
5751
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-horizontal__group--GridTemplateRows);
5702
5752
  }
5703
5753
 
5704
5754
  .pf-c-description-list.pf-m-vertical-on-md {
5705
5755
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-vertical__group--GridTemplateColumns);
5756
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-vertical__group--GridTemplateRows);
5706
5757
  }
5707
5758
  }
5708
5759
  @media (min-width: 992px) {
@@ -5720,10 +5771,12 @@ label.pf-c-check, .pf-c-check__label,
5720
5771
 
5721
5772
  .pf-c-description-list.pf-m-horizontal-on-lg {
5722
5773
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-horizontal__group--GridTemplateColumns);
5774
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-horizontal__group--GridTemplateRows);
5723
5775
  }
5724
5776
 
5725
5777
  .pf-c-description-list.pf-m-vertical-on-lg {
5726
5778
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-vertical__group--GridTemplateColumns);
5779
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-vertical__group--GridTemplateRows);
5727
5780
  }
5728
5781
  }
5729
5782
  @media (min-width: 1200px) {
@@ -5741,10 +5794,12 @@ label.pf-c-check, .pf-c-check__label,
5741
5794
 
5742
5795
  .pf-c-description-list.pf-m-horizontal-on-xl {
5743
5796
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-horizontal__group--GridTemplateColumns);
5797
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-horizontal__group--GridTemplateRows);
5744
5798
  }
5745
5799
 
5746
5800
  .pf-c-description-list.pf-m-vertical-on-xl {
5747
5801
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-vertical__group--GridTemplateColumns);
5802
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-vertical__group--GridTemplateRows);
5748
5803
  }
5749
5804
  }
5750
5805
  @media (min-width: 1450px) {
@@ -5762,10 +5817,12 @@ label.pf-c-check, .pf-c-check__label,
5762
5817
 
5763
5818
  .pf-c-description-list.pf-m-horizontal-on-2xl {
5764
5819
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-horizontal__group--GridTemplateColumns);
5820
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-horizontal__group--GridTemplateRows);
5765
5821
  }
5766
5822
 
5767
5823
  .pf-c-description-list.pf-m-vertical-on-2xl {
5768
5824
  --pf-c-description-list__group--GridTemplateColumns: var(--pf-c-description-list--m-vertical__group--GridTemplateColumns);
5825
+ --pf-c-description-list__group--GridTemplateRows: var(--pf-c-description-list--m-vertical__group--GridTemplateRows);
5769
5826
  }
5770
5827
  }
5771
5828
  .pf-c-divider {
@@ -15703,32 +15760,6 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
15703
15760
  flex-shrink: 0;
15704
15761
  }
15705
15762
 
15706
- .pf-c-page__main-nav.pf-m-sticky-top,
15707
- .pf-c-page__main-breadcrumb.pf-m-sticky-top,
15708
- .pf-c-page__main-tabs.pf-m-sticky-top,
15709
- .pf-c-page__main-section.pf-m-sticky-top,
15710
- .pf-c-page__main-wizard.pf-m-sticky-top,
15711
- .pf-c-page__main-group.pf-m-sticky-top,
15712
- .pf-c-page__main-subnav.pf-m-sticky-top {
15713
- position: sticky;
15714
- top: 0;
15715
- z-index: var(--pf-c-page--section--m-sticky-top--ZIndex);
15716
- box-shadow: var(--pf-c-page--section--m-sticky-top--BoxShadow);
15717
- }
15718
-
15719
- .pf-c-page__main-nav.pf-m-sticky-bottom,
15720
- .pf-c-page__main-breadcrumb.pf-m-sticky-bottom,
15721
- .pf-c-page__main-tabs.pf-m-sticky-bottom,
15722
- .pf-c-page__main-section.pf-m-sticky-bottom,
15723
- .pf-c-page__main-wizard.pf-m-sticky-bottom,
15724
- .pf-c-page__main-group.pf-m-sticky-bottom,
15725
- .pf-c-page__main-subnav.pf-m-sticky-bottom {
15726
- position: sticky;
15727
- bottom: 0;
15728
- z-index: var(--pf-c-page--section--m-sticky-bottom--ZIndex);
15729
- box-shadow: var(--pf-c-page--section--m-sticky-bottom--BoxShadow);
15730
- }
15731
-
15732
15763
  .pf-c-page__main-nav.pf-m-overflow-scroll,
15733
15764
  .pf-c-page__main-breadcrumb.pf-m-overflow-scroll,
15734
15765
  .pf-c-page__main-tabs.pf-m-overflow-scroll,
@@ -15763,6 +15794,167 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
15763
15794
  box-shadow: var(--pf-c-page--section--m-shadow-top--BoxShadow);
15764
15795
  }
15765
15796
 
15797
+ .pf-c-page__main-nav.pf-m-sticky-top,
15798
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top,
15799
+ .pf-c-page__main-tabs.pf-m-sticky-top,
15800
+ .pf-c-page__main-section.pf-m-sticky-top,
15801
+ .pf-c-page__main-wizard.pf-m-sticky-top,
15802
+ .pf-c-page__main-group.pf-m-sticky-top,
15803
+ .pf-c-page__main-subnav.pf-m-sticky-top {
15804
+ position: sticky;
15805
+ top: 0;
15806
+ z-index: var(--pf-c-page--section--m-sticky-top--ZIndex);
15807
+ box-shadow: var(--pf-c-page--section--m-sticky-top--BoxShadow);
15808
+ }
15809
+
15810
+ .pf-c-page__main-nav.pf-m-sticky-bottom,
15811
+ .pf-c-page__main-breadcrumb.pf-m-sticky-bottom,
15812
+ .pf-c-page__main-tabs.pf-m-sticky-bottom,
15813
+ .pf-c-page__main-section.pf-m-sticky-bottom,
15814
+ .pf-c-page__main-wizard.pf-m-sticky-bottom,
15815
+ .pf-c-page__main-group.pf-m-sticky-bottom,
15816
+ .pf-c-page__main-subnav.pf-m-sticky-bottom {
15817
+ position: sticky;
15818
+ bottom: 0;
15819
+ z-index: var(--pf-c-page--section--m-sticky-bottom--ZIndex);
15820
+ box-shadow: var(--pf-c-page--section--m-sticky-bottom--BoxShadow);
15821
+ }
15822
+
15823
+ @media (min-height: 0) {
15824
+ .pf-c-page__main-nav.pf-m-sticky-top-on-sm-height,
15825
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-sm-height,
15826
+ .pf-c-page__main-tabs.pf-m-sticky-top-on-sm-height,
15827
+ .pf-c-page__main-section.pf-m-sticky-top-on-sm-height,
15828
+ .pf-c-page__main-wizard.pf-m-sticky-top-on-sm-height,
15829
+ .pf-c-page__main-group.pf-m-sticky-top-on-sm-height,
15830
+ .pf-c-page__main-subnav.pf-m-sticky-top-on-sm-height {
15831
+ position: sticky;
15832
+ top: 0;
15833
+ z-index: var(--pf-c-page--section--m-sticky-top--ZIndex);
15834
+ box-shadow: var(--pf-c-page--section--m-sticky-top--BoxShadow);
15835
+ }
15836
+
15837
+ .pf-c-page__main-nav.pf-m-sticky-bottom-on-sm-height,
15838
+ .pf-c-page__main-breadcrumb.pf-m-sticky-bottom-on-sm-height,
15839
+ .pf-c-page__main-tabs.pf-m-sticky-bottom-on-sm-height,
15840
+ .pf-c-page__main-section.pf-m-sticky-bottom-on-sm-height,
15841
+ .pf-c-page__main-wizard.pf-m-sticky-bottom-on-sm-height,
15842
+ .pf-c-page__main-group.pf-m-sticky-bottom-on-sm-height,
15843
+ .pf-c-page__main-subnav.pf-m-sticky-bottom-on-sm-height {
15844
+ position: sticky;
15845
+ bottom: 0;
15846
+ z-index: var(--pf-c-page--section--m-sticky-bottom--ZIndex);
15847
+ box-shadow: var(--pf-c-page--section--m-sticky-bottom--BoxShadow);
15848
+ }
15849
+ }
15850
+ @media (min-height: 40rem) {
15851
+ .pf-c-page__main-nav.pf-m-sticky-top-on-md-height,
15852
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-md-height,
15853
+ .pf-c-page__main-tabs.pf-m-sticky-top-on-md-height,
15854
+ .pf-c-page__main-section.pf-m-sticky-top-on-md-height,
15855
+ .pf-c-page__main-wizard.pf-m-sticky-top-on-md-height,
15856
+ .pf-c-page__main-group.pf-m-sticky-top-on-md-height,
15857
+ .pf-c-page__main-subnav.pf-m-sticky-top-on-md-height {
15858
+ position: sticky;
15859
+ top: 0;
15860
+ z-index: var(--pf-c-page--section--m-sticky-top--ZIndex);
15861
+ box-shadow: var(--pf-c-page--section--m-sticky-top--BoxShadow);
15862
+ }
15863
+
15864
+ .pf-c-page__main-nav.pf-m-sticky-bottom-on-md-height,
15865
+ .pf-c-page__main-breadcrumb.pf-m-sticky-bottom-on-md-height,
15866
+ .pf-c-page__main-tabs.pf-m-sticky-bottom-on-md-height,
15867
+ .pf-c-page__main-section.pf-m-sticky-bottom-on-md-height,
15868
+ .pf-c-page__main-wizard.pf-m-sticky-bottom-on-md-height,
15869
+ .pf-c-page__main-group.pf-m-sticky-bottom-on-md-height,
15870
+ .pf-c-page__main-subnav.pf-m-sticky-bottom-on-md-height {
15871
+ position: sticky;
15872
+ bottom: 0;
15873
+ z-index: var(--pf-c-page--section--m-sticky-bottom--ZIndex);
15874
+ box-shadow: var(--pf-c-page--section--m-sticky-bottom--BoxShadow);
15875
+ }
15876
+ }
15877
+ @media (min-height: 48rem) {
15878
+ .pf-c-page__main-nav.pf-m-sticky-top-on-lg-height,
15879
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-lg-height,
15880
+ .pf-c-page__main-tabs.pf-m-sticky-top-on-lg-height,
15881
+ .pf-c-page__main-section.pf-m-sticky-top-on-lg-height,
15882
+ .pf-c-page__main-wizard.pf-m-sticky-top-on-lg-height,
15883
+ .pf-c-page__main-group.pf-m-sticky-top-on-lg-height,
15884
+ .pf-c-page__main-subnav.pf-m-sticky-top-on-lg-height {
15885
+ position: sticky;
15886
+ top: 0;
15887
+ z-index: var(--pf-c-page--section--m-sticky-top--ZIndex);
15888
+ box-shadow: var(--pf-c-page--section--m-sticky-top--BoxShadow);
15889
+ }
15890
+
15891
+ .pf-c-page__main-nav.pf-m-sticky-bottom-on-lg-height,
15892
+ .pf-c-page__main-breadcrumb.pf-m-sticky-bottom-on-lg-height,
15893
+ .pf-c-page__main-tabs.pf-m-sticky-bottom-on-lg-height,
15894
+ .pf-c-page__main-section.pf-m-sticky-bottom-on-lg-height,
15895
+ .pf-c-page__main-wizard.pf-m-sticky-bottom-on-lg-height,
15896
+ .pf-c-page__main-group.pf-m-sticky-bottom-on-lg-height,
15897
+ .pf-c-page__main-subnav.pf-m-sticky-bottom-on-lg-height {
15898
+ position: sticky;
15899
+ bottom: 0;
15900
+ z-index: var(--pf-c-page--section--m-sticky-bottom--ZIndex);
15901
+ box-shadow: var(--pf-c-page--section--m-sticky-bottom--BoxShadow);
15902
+ }
15903
+ }
15904
+ @media (min-height: 60rem) {
15905
+ .pf-c-page__main-nav.pf-m-sticky-top-on-xl-height,
15906
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-xl-height,
15907
+ .pf-c-page__main-tabs.pf-m-sticky-top-on-xl-height,
15908
+ .pf-c-page__main-section.pf-m-sticky-top-on-xl-height,
15909
+ .pf-c-page__main-wizard.pf-m-sticky-top-on-xl-height,
15910
+ .pf-c-page__main-group.pf-m-sticky-top-on-xl-height,
15911
+ .pf-c-page__main-subnav.pf-m-sticky-top-on-xl-height {
15912
+ position: sticky;
15913
+ top: 0;
15914
+ z-index: var(--pf-c-page--section--m-sticky-top--ZIndex);
15915
+ box-shadow: var(--pf-c-page--section--m-sticky-top--BoxShadow);
15916
+ }
15917
+
15918
+ .pf-c-page__main-nav.pf-m-sticky-bottom-on-xl-height,
15919
+ .pf-c-page__main-breadcrumb.pf-m-sticky-bottom-on-xl-height,
15920
+ .pf-c-page__main-tabs.pf-m-sticky-bottom-on-xl-height,
15921
+ .pf-c-page__main-section.pf-m-sticky-bottom-on-xl-height,
15922
+ .pf-c-page__main-wizard.pf-m-sticky-bottom-on-xl-height,
15923
+ .pf-c-page__main-group.pf-m-sticky-bottom-on-xl-height,
15924
+ .pf-c-page__main-subnav.pf-m-sticky-bottom-on-xl-height {
15925
+ position: sticky;
15926
+ bottom: 0;
15927
+ z-index: var(--pf-c-page--section--m-sticky-bottom--ZIndex);
15928
+ box-shadow: var(--pf-c-page--section--m-sticky-bottom--BoxShadow);
15929
+ }
15930
+ }
15931
+ @media (min-height: 80rem) {
15932
+ .pf-c-page__main-nav.pf-m-sticky-top-on-2xl-height,
15933
+ .pf-c-page__main-breadcrumb.pf-m-sticky-top-on-2xl-height,
15934
+ .pf-c-page__main-tabs.pf-m-sticky-top-on-2xl-height,
15935
+ .pf-c-page__main-section.pf-m-sticky-top-on-2xl-height,
15936
+ .pf-c-page__main-wizard.pf-m-sticky-top-on-2xl-height,
15937
+ .pf-c-page__main-group.pf-m-sticky-top-on-2xl-height,
15938
+ .pf-c-page__main-subnav.pf-m-sticky-top-on-2xl-height {
15939
+ position: sticky;
15940
+ top: 0;
15941
+ z-index: var(--pf-c-page--section--m-sticky-top--ZIndex);
15942
+ box-shadow: var(--pf-c-page--section--m-sticky-top--BoxShadow);
15943
+ }
15944
+
15945
+ .pf-c-page__main-nav.pf-m-sticky-bottom-on-2xl-height,
15946
+ .pf-c-page__main-breadcrumb.pf-m-sticky-bottom-on-2xl-height,
15947
+ .pf-c-page__main-tabs.pf-m-sticky-bottom-on-2xl-height,
15948
+ .pf-c-page__main-section.pf-m-sticky-bottom-on-2xl-height,
15949
+ .pf-c-page__main-wizard.pf-m-sticky-bottom-on-2xl-height,
15950
+ .pf-c-page__main-group.pf-m-sticky-bottom-on-2xl-height,
15951
+ .pf-c-page__main-subnav.pf-m-sticky-bottom-on-2xl-height {
15952
+ position: sticky;
15953
+ bottom: 0;
15954
+ z-index: var(--pf-c-page--section--m-sticky-bottom--ZIndex);
15955
+ box-shadow: var(--pf-c-page--section--m-sticky-bottom--BoxShadow);
15956
+ }
15957
+ }
15766
15958
  .pf-c-page__main,
15767
15959
  .pf-c-page__drawer {
15768
15960
  grid-area: main;
@@ -17092,6 +17284,7 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17092
17284
  font-weight: var(--pf-c-progress-stepper__step-title--FontWeight);
17093
17285
  color: var(--pf-c-progress-stepper__step-title--Color);
17094
17286
  text-align: var(--pf-c-progress-stepper__step-title--TextAlign);
17287
+ border: 0;
17095
17288
  }
17096
17289
 
17097
17290
  .pf-c-progress-stepper__step-title.pf-m-help-text {
@@ -19058,6 +19251,15 @@ svg.pf-c-spinner.pf-m-xl {
19058
19251
  --pf-c-tabs__add--c-button--PaddingTop: var(--pf-c-tabs__link--PaddingTop);
19059
19252
  --pf-c-tabs__add--c-button--PaddingBottom: var(--pf-c-tabs__link--PaddingBottom);
19060
19253
  --pf-c-tabs__add--c-button--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
19254
+ --pf-c-tabs__link-toggle-icon--Color: var(--pf-global--Color--200);
19255
+ --pf-c-tabs__link-toggle-icon--Transition: .2s ease-in 0s;
19256
+ --pf-c-tabs__link-toggle-icon--Rotate: 0;
19257
+ --pf-c-tabs__link-toggle-icon--FontSize: var(--pf-global--FontSize--sm);
19258
+ --pf-c-tabs__link--m-expanded__toggle-icon--Color: var(--pf-global--Color--100);
19259
+ --pf-c-tabs__link--m-expanded__toggle-icon--Rotate: 90deg;
19260
+ --pf-c-tabs__link--hover__toggle-icon--Color: var(--pf-global--Color--100);
19261
+ --pf-c-tabs__link--active__toggle-icon--Color: var(--pf-global--Color--100);
19262
+ --pf-c-tabs__link--focus__toggle-icon--Color: var(--pf-global--Color--100);
19061
19263
  position: relative;
19062
19264
  display: flex;
19063
19265
  width: var(--pf-c-tabs--Width);
@@ -19541,6 +19743,18 @@ svg.pf-c-spinner.pf-m-xl {
19541
19743
  --pf-c-tabs__link--after--BorderWidth: var(--pf-c-tabs__link--active--after--BorderWidth);
19542
19744
  }
19543
19745
 
19746
+ .pf-c-tabs__link:hover {
19747
+ --pf-c-tabs__link-toggle-icon--Color: var(--pf-c-tabs__link--hover__toggle-icon--Color);
19748
+ }
19749
+
19750
+ .pf-c-tabs__link:focus {
19751
+ --pf-c-tabs__link-toggle-icon--Color: var(--pf-c-tabs__link--focus__toggle-icon--Color);
19752
+ }
19753
+
19754
+ .pf-c-tabs__link:active, .pf-c-tabs__link.pf-m-active {
19755
+ --pf-c-tabs__link-toggle-icon--Color: var(--pf-c-tabs__link--active__toggle-icon--Color);
19756
+ }
19757
+
19544
19758
  .pf-c-tabs__link:disabled, .pf-c-tabs__link.pf-m-disabled {
19545
19759
  pointer-events: none;
19546
19760
  }
@@ -19568,6 +19782,19 @@ svg.pf-c-spinner.pf-m-xl {
19568
19782
  --pf-c-tabs__link--child--MarginRight: 0;
19569
19783
  }
19570
19784
 
19785
+ .pf-c-tabs__link.pf-m-expanded {
19786
+ --pf-c-tabs__link-toggle-icon--Color: var(--pf-c-tabs__link--m-expanded__toggle-icon--Color);
19787
+ --pf-c-tabs__link-toggle-icon--Rotate: var(--pf-c-tabs__link--m-expanded__toggle-icon--Rotate);
19788
+ }
19789
+
19790
+ .pf-c-tabs__link-toggle-icon {
19791
+ align-self: end;
19792
+ font-size: var(--pf-c-tabs__link-toggle-icon--FontSize);
19793
+ color: var(--pf-c-tabs__link-toggle-icon--Color);
19794
+ transition: var(--pf-c-tabs__link-toggle-icon--Transition);
19795
+ transform: rotate(var(--pf-c-tabs__link-toggle-icon--Rotate));
19796
+ }
19797
+
19571
19798
  .pf-c-tabs__item-close {
19572
19799
  display: flex;
19573
19800
  }