@patternfly/react-core 4.237.6 → 4.237.9

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.
@@ -1673,7 +1673,7 @@ textarea.pf-c-form-control {
1673
1673
  --pf-c-badge--m-unread--BackgroundColor: var(--pf-global--primary-color--300);
1674
1674
  }
1675
1675
 
1676
- .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-info {
1676
+ .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-gold, .pf-c-banner.pf-m-info, .pf-c-banner.pf-m-blue {
1677
1677
  --pf-global--Color--100: var(--pf-global--Color--dark-100);
1678
1678
  --pf-global--Color--200: var(--pf-global--Color--dark-200);
1679
1679
  --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
@@ -1756,20 +1756,20 @@ textarea.pf-c-form-control {
1756
1756
  --pf-c-banner--PaddingLeft: var(--pf-c-banner--md--PaddingLeft);
1757
1757
  }
1758
1758
  }
1759
- .pf-c-banner.pf-m-info {
1759
+ .pf-c-banner.pf-m-info, .pf-c-banner.pf-m-blue {
1760
1760
  color: var(--pf-global--Color--100);
1761
1761
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-info--BackgroundColor);
1762
1762
  }
1763
1763
 
1764
- .pf-c-banner.pf-m-danger {
1764
+ .pf-c-banner.pf-m-danger, .pf-c-banner.pf-m-red {
1765
1765
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-danger--BackgroundColor);
1766
1766
  }
1767
1767
 
1768
- .pf-c-banner.pf-m-success {
1768
+ .pf-c-banner.pf-m-success, .pf-c-banner.pf-m-green {
1769
1769
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-success--BackgroundColor);
1770
1770
  }
1771
1771
 
1772
- .pf-c-banner.pf-m-warning {
1772
+ .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-gold {
1773
1773
  color: var(--pf-global--Color--100);
1774
1774
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-warning--BackgroundColor);
1775
1775
  }
@@ -1847,7 +1847,7 @@ textarea.pf-c-form-control {
1847
1847
  color: var(--pf-global--Color--100);
1848
1848
  }
1849
1849
 
1850
- :where(.pf-theme-dark) .pf-c-banner.pf-m-info, :where(.pf-theme-dark) .pf-c-banner.pf-m-danger, :where(.pf-theme-dark) .pf-c-banner.pf-m-success, :where(.pf-theme-dark) .pf-c-banner.pf-m-warning {
1850
+ :where(.pf-theme-dark) .pf-c-banner.pf-m-info, :where(.pf-theme-dark) .pf-c-banner.pf-m-blue, :where(.pf-theme-dark) .pf-c-banner.pf-m-danger, :where(.pf-theme-dark) .pf-c-banner.pf-m-red, :where(.pf-theme-dark) .pf-c-banner.pf-m-success, :where(.pf-theme-dark) .pf-c-banner.pf-m-green, :where(.pf-theme-dark) .pf-c-banner.pf-m-warning, :where(.pf-theme-dark) .pf-c-banner.pf-m-gold {
1851
1851
  color: var(--pf-global--palette--black-900);
1852
1852
  }
1853
1853
 
@@ -9519,327 +9519,6 @@ label.pf-c-input-group__text {
9519
9519
  --pf-c-input-group__text--BackgroundColor: transparent;
9520
9520
  }
9521
9521
 
9522
- .pf-c-jump-links {
9523
- --pf-c-jump-links__list--Display: flex;
9524
- --pf-c-jump-links__list--Visibility: visible;
9525
- --pf-c-jump-links__list--PaddingTop: 0;
9526
- --pf-c-jump-links__list--PaddingRight: var(--pf-global--spacer--md);
9527
- --pf-c-jump-links__list--PaddingBottom: 0;
9528
- --pf-c-jump-links__list--PaddingLeft: var(--pf-global--spacer--md);
9529
- --pf-c-jump-links--m-vertical__list--PaddingTop: var(--pf-global--spacer--md);
9530
- --pf-c-jump-links--m-vertical__list--PaddingRight: 0;
9531
- --pf-c-jump-links--m-vertical__list--PaddingBottom: var(--pf-global--spacer--md);
9532
- --pf-c-jump-links--m-vertical__list--PaddingLeft: 0;
9533
- --pf-c-jump-links__list--FlexDirection: row;
9534
- --pf-c-jump-links--m-vertical__list--FlexDirection: column;
9535
- --pf-c-jump-links__list--before--BorderColor: var(--pf-global--BorderColor--100);
9536
- --pf-c-jump-links__list--before--BorderTopWidth: var(--pf-global--BorderWidth--sm);
9537
- --pf-c-jump-links__list--before--BorderRightWidth: 0;
9538
- --pf-c-jump-links__list--before--BorderBottomWidth: 0;
9539
- --pf-c-jump-links__list--before--BorderLeftWidth: 0;
9540
- --pf-c-jump-links--m-vertical__list--before--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
9541
- --pf-c-jump-links--m-vertical__list--before--BorderTopWidth: 0;
9542
- --pf-c-jump-links__list__list--MarginTop: calc(var(--pf-global--spacer--sm) * -1);
9543
- --pf-c-jump-links__link--PaddingTop: var(--pf-global--spacer--md);
9544
- --pf-c-jump-links__link--PaddingRight: var(--pf-global--spacer--md);
9545
- --pf-c-jump-links__link--PaddingBottom: var(--pf-global--spacer--md);
9546
- --pf-c-jump-links__link--PaddingLeft: var(--pf-global--spacer--md);
9547
- --pf-c-jump-links__list__list__link--PaddingTop: var(--pf-global--spacer--sm);
9548
- --pf-c-jump-links__list__list__link--PaddingLeft: var(--pf-global--spacer--lg);
9549
- --pf-c-jump-links__list__list__link--PaddingBottom: var(--pf-global--spacer--sm);
9550
- --pf-c-jump-links__link--OutlineOffset: calc(-1 * var(--pf-global--spacer--sm));
9551
- --pf-c-jump-links__link--before--BorderTopWidth: 0;
9552
- --pf-c-jump-links__link--before--BorderRightWidth: 0;
9553
- --pf-c-jump-links__link--before--BorderBottomWidth: 0;
9554
- --pf-c-jump-links__link--before--BorderLeftWidth: 0;
9555
- --pf-c-jump-links__link--before--BorderColor: transparent;
9556
- --pf-c-jump-links__item--m-current__link--before--BorderTopWidth: var(--pf-global--BorderWidth--lg);
9557
- --pf-c-jump-links__item--m-current__link--before--BorderLeftWidth: 0;
9558
- --pf-c-jump-links__item--m-current__link--before--BorderColor: var(--pf-global--primary-color--100);
9559
- --pf-c-jump-links--m-vertical__item--m-current__link--before--BorderTopWidth: 0;
9560
- --pf-c-jump-links--m-vertical__item--m-current__link--before--BorderLeftWidth: var(--pf-global--BorderWidth--lg);
9561
- --pf-c-jump-links__link-text--Color: var(--pf-global--Color--200);
9562
- --pf-c-jump-links__link--hover__link-text--Color: var(--pf-global--Color--100);
9563
- --pf-c-jump-links__link--focus__link-text--Color: var(--pf-global--Color--100);
9564
- --pf-c-jump-links__item--m-current__link-text--Color: var(--pf-global--Color--100);
9565
- --pf-c-jump-links__label--MarginBottom: var(--pf-global--spacer--md);
9566
- --pf-c-jump-links__label--Display: block;
9567
- --pf-c-jump-links__label--Visibility: visible;
9568
- --pf-c-jump-links__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element));
9569
- --pf-c-jump-links__toggle--MarginBottom--base: calc(-1 * var(--pf-global--spacer--form-element));
9570
- --pf-c-jump-links__toggle--MarginBottom: var(--pf-c-jump-links__toggle--MarginBottom--base);
9571
- --pf-c-jump-links--m-expanded__toggle--MarginBottom: calc(var(--pf-c-jump-links__toggle--MarginBottom--base) + var(--pf-global--spacer--md));
9572
- --pf-c-jump-links__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
9573
- --pf-c-jump-links__toggle--Display: none;
9574
- --pf-c-jump-links__toggle--Visibility: hidden;
9575
- --pf-c-jump-links__toggle-icon--Color: currentcolor;
9576
- --pf-c-jump-links__toggle-icon--Transition: var(--pf-global--Transition);
9577
- --pf-c-jump-links__toggle-icon--Rotate: 0;
9578
- --pf-c-jump-links--m-expanded__toggle-icon--Color: var(--pf-global--Color--100);
9579
- --pf-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
9580
- --pf-c-jump-links__toggle-text--MarginLeft: var(--pf-global--spacer--md);
9581
- --pf-c-jump-links__toggle-text--Color: var(--pf-global--Color--100);
9582
- display: flex;
9583
- }
9584
-
9585
- .pf-c-jump-links.pf-m-center {
9586
- justify-content: center;
9587
- }
9588
-
9589
- .pf-c-jump-links.pf-m-center .pf-c-jump-links__main {
9590
- align-items: center;
9591
- }
9592
-
9593
- .pf-c-jump-links.pf-m-vertical, .pf-c-jump-links.pf-m-expandable {
9594
- --pf-c-jump-links__list--PaddingTop: var(--pf-c-jump-links--m-vertical__list--PaddingTop);
9595
- --pf-c-jump-links__list--PaddingRight: var(--pf-c-jump-links--m-vertical__list--PaddingRight);
9596
- --pf-c-jump-links__list--PaddingBottom: var(--pf-c-jump-links--m-vertical__list--PaddingBottom);
9597
- --pf-c-jump-links__list--PaddingLeft: var(--pf-c-jump-links--m-vertical__list--PaddingLeft);
9598
- --pf-c-jump-links__list--before--BorderTopWidth: var(--pf-c-jump-links--m-vertical__list--before--BorderTopWidth);
9599
- --pf-c-jump-links__list--before--BorderLeftWidth: var(--pf-c-jump-links--m-vertical__list--before--BorderLeftWidth);
9600
- --pf-c-jump-links__item--m-current__link--before--BorderTopWidth: var(--pf-c-jump-links--m-vertical__item--m-current__link--before--BorderTopWidth);
9601
- --pf-c-jump-links__item--m-current__link--before--BorderLeftWidth: var(--pf-c-jump-links--m-vertical__item--m-current__link--before--BorderLeftWidth);
9602
- --pf-c-jump-links__list--FlexDirection: var(--pf-c-jump-links--m-vertical__list--FlexDirection);
9603
- flex-direction: column;
9604
- }
9605
-
9606
- .pf-c-jump-links.pf-m-expandable {
9607
- --pf-c-jump-links__list--Display: none;
9608
- --pf-c-jump-links__list--Visibility: hidden;
9609
- --pf-c-jump-links__toggle--Display: block;
9610
- --pf-c-jump-links__toggle--Visibility: visible;
9611
- --pf-c-jump-links__label--Display: none;
9612
- --pf-c-jump-links__label--Visibility: hidden;
9613
- }
9614
-
9615
- .pf-c-jump-links.pf-m-non-expandable {
9616
- --pf-c-jump-links__list--Display: flex;
9617
- --pf-c-jump-links__list--Visibility: visible;
9618
- --pf-c-jump-links__toggle--Display: none;
9619
- --pf-c-jump-links__toggle--Visibility: hidden;
9620
- --pf-c-jump-links__label--Display: block;
9621
- --pf-c-jump-links__label--Visibility: visible;
9622
- }
9623
-
9624
- @media (min-width: 576px) {
9625
- .pf-c-jump-links.pf-m-expandable-on-sm {
9626
- --pf-c-jump-links__list--Display: none;
9627
- --pf-c-jump-links__list--Visibility: hidden;
9628
- --pf-c-jump-links__toggle--Display: block;
9629
- --pf-c-jump-links__toggle--Visibility: visible;
9630
- --pf-c-jump-links__label--Display: none;
9631
- --pf-c-jump-links__label--Visibility: hidden;
9632
- }
9633
-
9634
- .pf-c-jump-links.pf-m-non-expandable-on-sm {
9635
- --pf-c-jump-links__list--Display: flex;
9636
- --pf-c-jump-links__list--Visibility: visible;
9637
- --pf-c-jump-links__toggle--Display: none;
9638
- --pf-c-jump-links__toggle--Visibility: hidden;
9639
- --pf-c-jump-links__label--Display: block;
9640
- --pf-c-jump-links__label--Visibility: visible;
9641
- }
9642
- }
9643
- @media (min-width: 768px) {
9644
- .pf-c-jump-links.pf-m-expandable-on-md {
9645
- --pf-c-jump-links__list--Display: none;
9646
- --pf-c-jump-links__list--Visibility: hidden;
9647
- --pf-c-jump-links__toggle--Display: block;
9648
- --pf-c-jump-links__toggle--Visibility: visible;
9649
- --pf-c-jump-links__label--Display: none;
9650
- --pf-c-jump-links__label--Visibility: hidden;
9651
- }
9652
-
9653
- .pf-c-jump-links.pf-m-non-expandable-on-md {
9654
- --pf-c-jump-links__list--Display: flex;
9655
- --pf-c-jump-links__list--Visibility: visible;
9656
- --pf-c-jump-links__toggle--Display: none;
9657
- --pf-c-jump-links__toggle--Visibility: hidden;
9658
- --pf-c-jump-links__label--Display: block;
9659
- --pf-c-jump-links__label--Visibility: visible;
9660
- }
9661
- }
9662
- @media (min-width: 992px) {
9663
- .pf-c-jump-links.pf-m-expandable-on-lg {
9664
- --pf-c-jump-links__list--Display: none;
9665
- --pf-c-jump-links__list--Visibility: hidden;
9666
- --pf-c-jump-links__toggle--Display: block;
9667
- --pf-c-jump-links__toggle--Visibility: visible;
9668
- --pf-c-jump-links__label--Display: none;
9669
- --pf-c-jump-links__label--Visibility: hidden;
9670
- }
9671
-
9672
- .pf-c-jump-links.pf-m-non-expandable-on-lg {
9673
- --pf-c-jump-links__list--Display: flex;
9674
- --pf-c-jump-links__list--Visibility: visible;
9675
- --pf-c-jump-links__toggle--Display: none;
9676
- --pf-c-jump-links__toggle--Visibility: hidden;
9677
- --pf-c-jump-links__label--Display: block;
9678
- --pf-c-jump-links__label--Visibility: visible;
9679
- }
9680
- }
9681
- @media (min-width: 1200px) {
9682
- .pf-c-jump-links.pf-m-expandable-on-xl {
9683
- --pf-c-jump-links__list--Display: none;
9684
- --pf-c-jump-links__list--Visibility: hidden;
9685
- --pf-c-jump-links__toggle--Display: block;
9686
- --pf-c-jump-links__toggle--Visibility: visible;
9687
- --pf-c-jump-links__label--Display: none;
9688
- --pf-c-jump-links__label--Visibility: hidden;
9689
- }
9690
-
9691
- .pf-c-jump-links.pf-m-non-expandable-on-xl {
9692
- --pf-c-jump-links__list--Display: flex;
9693
- --pf-c-jump-links__list--Visibility: visible;
9694
- --pf-c-jump-links__toggle--Display: none;
9695
- --pf-c-jump-links__toggle--Visibility: hidden;
9696
- --pf-c-jump-links__label--Display: block;
9697
- --pf-c-jump-links__label--Visibility: visible;
9698
- }
9699
- }
9700
- @media (min-width: 1450px) {
9701
- .pf-c-jump-links.pf-m-expandable-on-2xl {
9702
- --pf-c-jump-links__list--Display: none;
9703
- --pf-c-jump-links__list--Visibility: hidden;
9704
- --pf-c-jump-links__toggle--Display: block;
9705
- --pf-c-jump-links__toggle--Visibility: visible;
9706
- --pf-c-jump-links__label--Display: none;
9707
- --pf-c-jump-links__label--Visibility: hidden;
9708
- }
9709
-
9710
- .pf-c-jump-links.pf-m-non-expandable-on-2xl {
9711
- --pf-c-jump-links__list--Display: flex;
9712
- --pf-c-jump-links__list--Visibility: visible;
9713
- --pf-c-jump-links__toggle--Display: none;
9714
- --pf-c-jump-links__toggle--Visibility: hidden;
9715
- --pf-c-jump-links__label--Display: block;
9716
- --pf-c-jump-links__label--Visibility: visible;
9717
- }
9718
- }
9719
- .pf-c-jump-links.pf-m-expanded {
9720
- --pf-c-jump-links__list--Display: flex;
9721
- --pf-c-jump-links__list--Visibility: visible;
9722
- --pf-c-jump-links__toggle--MarginBottom: var(--pf-c-jump-links--m-expanded__toggle--MarginBottom);
9723
- --pf-c-jump-links__toggle-icon--Rotate: var(--pf-c-jump-links--m-expanded__toggle-icon--Rotate);
9724
- --pf-c-jump-links__toggle-icon--Color: var(--pf-c-jump-links--m-expanded__toggle-icon--Color);
9725
- }
9726
-
9727
- .pf-c-jump-links__list {
9728
- position: relative;
9729
- display: var(--pf-c-jump-links__list--Display);
9730
- flex-direction: var(--pf-c-jump-links__list--FlexDirection);
9731
- padding-top: var(--pf-c-jump-links__list--PaddingTop);
9732
- padding-right: var(--pf-c-jump-links__list--PaddingRight);
9733
- padding-bottom: var(--pf-c-jump-links__list--PaddingBottom);
9734
- padding-left: var(--pf-c-jump-links__list--PaddingLeft);
9735
- visibility: var(--pf-c-jump-links__list--Visibility);
9736
- }
9737
-
9738
- .pf-c-jump-links__list::before {
9739
- position: absolute;
9740
- top: 0;
9741
- right: 0;
9742
- bottom: 0;
9743
- left: 0;
9744
- pointer-events: none;
9745
- content: "";
9746
- border: solid var(--pf-c-jump-links__list--before--BorderColor);
9747
- border-width: var(--pf-c-jump-links__list--before--BorderTopWidth) var(--pf-c-jump-links__list--before--BorderRightWidth) var(--pf-c-jump-links__list--before--BorderBottomWidth) var(--pf-c-jump-links__list--before--BorderLeftWidth);
9748
- }
9749
-
9750
- .pf-c-jump-links__list .pf-c-jump-links__list {
9751
- --pf-c-jump-links__list--PaddingTop: 0;
9752
- --pf-c-jump-links__list--PaddingBottom: 0;
9753
- --pf-c-jump-links__link--PaddingTop: var(--pf-c-jump-links__list__list__link--PaddingTop);
9754
- --pf-c-jump-links__link--PaddingBottom: var(--pf-c-jump-links__list__list__link--PaddingBottom);
9755
- --pf-c-jump-links__link--PaddingLeft: var(--pf-c-jump-links__list__list__link--PaddingLeft);
9756
- margin-top: var(--pf-c-jump-links__list__list--MarginTop);
9757
- }
9758
-
9759
- .pf-c-jump-links__link {
9760
- position: relative;
9761
- display: flex;
9762
- flex: 1;
9763
- padding-top: var(--pf-c-jump-links__link--PaddingTop);
9764
- padding-right: var(--pf-c-jump-links__link--PaddingRight);
9765
- padding-bottom: var(--pf-c-jump-links__link--PaddingBottom);
9766
- padding-left: var(--pf-c-jump-links__link--PaddingLeft);
9767
- text-decoration: none;
9768
- outline-offset: var(--pf-c-jump-links__link--OutlineOffset);
9769
- }
9770
-
9771
- .pf-c-jump-links__link:hover {
9772
- --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__link--hover__link-text--Color);
9773
- }
9774
-
9775
- .pf-c-jump-links__link:focus {
9776
- --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__link--focus__link-text--Color);
9777
- }
9778
-
9779
- .pf-c-jump-links__link::before {
9780
- position: absolute;
9781
- top: 0;
9782
- right: 0;
9783
- bottom: 0;
9784
- left: 0;
9785
- pointer-events: none;
9786
- content: "";
9787
- border-color: var(--pf-c-jump-links__link--before--BorderColor);
9788
- border-style: solid;
9789
- border-width: var(--pf-c-jump-links__link--before--BorderTopWidth) var(--pf-c-jump-links__link--before--BorderRightWidth) var(--pf-c-jump-links__link--before--BorderBottomWidth) var(--pf-c-jump-links__link--before--BorderLeftWidth);
9790
- }
9791
-
9792
- .pf-c-jump-links__item {
9793
- --pf-c-jump-links__list--before--BorderColor: transparent;
9794
- }
9795
-
9796
- .pf-c-jump-links__item.pf-m-current > .pf-c-jump-links__link {
9797
- --pf-c-jump-links__link--before--BorderTopWidth: var(--pf-c-jump-links__item--m-current__link--before--BorderTopWidth);
9798
- --pf-c-jump-links__link--before--BorderLeftWidth: var(--pf-c-jump-links__item--m-current__link--before--BorderLeftWidth);
9799
- --pf-c-jump-links__link--before--BorderColor: var(--pf-c-jump-links__item--m-current__link--before--BorderColor);
9800
- --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__item--m-current__link-text--Color);
9801
- }
9802
-
9803
- .pf-c-jump-links__link-text {
9804
- color: var(--pf-c-jump-links__link-text--Color);
9805
- }
9806
-
9807
- .pf-c-jump-links__label {
9808
- display: var(--pf-c-jump-links__label--Display);
9809
- margin-bottom: var(--pf-c-jump-links__label--MarginBottom);
9810
- visibility: var(--pf-c-jump-links__label--Visibility);
9811
- }
9812
-
9813
- .pf-c-jump-links__main {
9814
- display: flex;
9815
- flex-direction: column;
9816
- }
9817
-
9818
- .pf-c-jump-links__toggle {
9819
- display: var(--pf-c-jump-links__toggle--Display);
9820
- margin-top: var(--pf-c-jump-links__toggle--MarginTop);
9821
- margin-bottom: var(--pf-c-jump-links__toggle--MarginBottom);
9822
- margin-left: var(--pf-c-jump-links__toggle--MarginLeft);
9823
- visibility: var(--pf-c-jump-links__toggle--Visibility);
9824
- }
9825
-
9826
- .pf-c-jump-links__toggle .pf-c-button {
9827
- display: flex;
9828
- align-items: center;
9829
- }
9830
-
9831
- .pf-c-jump-links__toggle-icon {
9832
- display: inline-block;
9833
- color: var(--pf-c-jump-links__toggle-icon--Color);
9834
- transition: var(--pf-c-jump-links__toggle-icon--Transition);
9835
- transform: rotate(var(--pf-c-jump-links__toggle-icon--Rotate));
9836
- }
9837
-
9838
- .pf-c-jump-links__toggle-text {
9839
- margin-left: var(--pf-c-jump-links__toggle-text--MarginLeft);
9840
- color: var(--pf-c-jump-links__toggle-text--Color);
9841
- }
9842
-
9843
9522
  .pf-c-sidebar {
9844
9523
  --pf-c-sidebar--BackgroundColor: var(--pf-global--BackgroundColor--100);
9845
9524
  --pf-c-sidebar__main--FlexDirection: column;
@@ -9998,171 +9677,492 @@ label.pf-c-input-group__text {
9998
9677
  --pf-c-sidebar__panel--FlexBasis: 25%;
9999
9678
  }
10000
9679
 
10001
- .pf-c-sidebar__panel.pf-m-width-33 {
10002
- --pf-c-sidebar__panel--FlexBasis: 33%;
9680
+ .pf-c-sidebar__panel.pf-m-width-33 {
9681
+ --pf-c-sidebar__panel--FlexBasis: 33%;
9682
+ }
9683
+
9684
+ .pf-c-sidebar__panel.pf-m-width-50 {
9685
+ --pf-c-sidebar__panel--FlexBasis: 50%;
9686
+ }
9687
+
9688
+ .pf-c-sidebar__panel.pf-m-width-66 {
9689
+ --pf-c-sidebar__panel--FlexBasis: 66%;
9690
+ }
9691
+
9692
+ .pf-c-sidebar__panel.pf-m-width-75 {
9693
+ --pf-c-sidebar__panel--FlexBasis: 75%;
9694
+ }
9695
+
9696
+ .pf-c-sidebar__panel.pf-m-width-100 {
9697
+ --pf-c-sidebar__panel--FlexBasis: 100%;
9698
+ }
9699
+
9700
+ @media (min-width: 576px) {
9701
+ .pf-c-sidebar__panel.pf-m-width-default-on-sm {
9702
+ --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
9703
+ }
9704
+
9705
+ .pf-c-sidebar__panel.pf-m-width-25-on-sm {
9706
+ --pf-c-sidebar__panel--FlexBasis: 25%;
9707
+ }
9708
+
9709
+ .pf-c-sidebar__panel.pf-m-width-33-on-sm {
9710
+ --pf-c-sidebar__panel--FlexBasis: 33%;
9711
+ }
9712
+
9713
+ .pf-c-sidebar__panel.pf-m-width-50-on-sm {
9714
+ --pf-c-sidebar__panel--FlexBasis: 50%;
9715
+ }
9716
+
9717
+ .pf-c-sidebar__panel.pf-m-width-66-on-sm {
9718
+ --pf-c-sidebar__panel--FlexBasis: 66%;
9719
+ }
9720
+
9721
+ .pf-c-sidebar__panel.pf-m-width-75-on-sm {
9722
+ --pf-c-sidebar__panel--FlexBasis: 75%;
9723
+ }
9724
+
9725
+ .pf-c-sidebar__panel.pf-m-width-100-on-sm {
9726
+ --pf-c-sidebar__panel--FlexBasis: 100%;
9727
+ }
9728
+ }
9729
+ @media (min-width: 768px) {
9730
+ .pf-c-sidebar__panel.pf-m-width-default-on-md {
9731
+ --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
9732
+ }
9733
+
9734
+ .pf-c-sidebar__panel.pf-m-width-25-on-md {
9735
+ --pf-c-sidebar__panel--FlexBasis: 25%;
9736
+ }
9737
+
9738
+ .pf-c-sidebar__panel.pf-m-width-33-on-md {
9739
+ --pf-c-sidebar__panel--FlexBasis: 33%;
9740
+ }
9741
+
9742
+ .pf-c-sidebar__panel.pf-m-width-50-on-md {
9743
+ --pf-c-sidebar__panel--FlexBasis: 50%;
9744
+ }
9745
+
9746
+ .pf-c-sidebar__panel.pf-m-width-66-on-md {
9747
+ --pf-c-sidebar__panel--FlexBasis: 66%;
9748
+ }
9749
+
9750
+ .pf-c-sidebar__panel.pf-m-width-75-on-md {
9751
+ --pf-c-sidebar__panel--FlexBasis: 75%;
9752
+ }
9753
+
9754
+ .pf-c-sidebar__panel.pf-m-width-100-on-md {
9755
+ --pf-c-sidebar__panel--FlexBasis: 100%;
9756
+ }
9757
+ }
9758
+ @media (min-width: 992px) {
9759
+ .pf-c-sidebar__panel.pf-m-width-default-on-lg {
9760
+ --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
9761
+ }
9762
+
9763
+ .pf-c-sidebar__panel.pf-m-width-25-on-lg {
9764
+ --pf-c-sidebar__panel--FlexBasis: 25%;
9765
+ }
9766
+
9767
+ .pf-c-sidebar__panel.pf-m-width-33-on-lg {
9768
+ --pf-c-sidebar__panel--FlexBasis: 33%;
9769
+ }
9770
+
9771
+ .pf-c-sidebar__panel.pf-m-width-50-on-lg {
9772
+ --pf-c-sidebar__panel--FlexBasis: 50%;
9773
+ }
9774
+
9775
+ .pf-c-sidebar__panel.pf-m-width-66-on-lg {
9776
+ --pf-c-sidebar__panel--FlexBasis: 66%;
9777
+ }
9778
+
9779
+ .pf-c-sidebar__panel.pf-m-width-75-on-lg {
9780
+ --pf-c-sidebar__panel--FlexBasis: 75%;
9781
+ }
9782
+
9783
+ .pf-c-sidebar__panel.pf-m-width-100-on-lg {
9784
+ --pf-c-sidebar__panel--FlexBasis: 100%;
9785
+ }
9786
+ }
9787
+ @media (min-width: 1200px) {
9788
+ .pf-c-sidebar__panel.pf-m-width-default-on-xl {
9789
+ --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
9790
+ }
9791
+
9792
+ .pf-c-sidebar__panel.pf-m-width-25-on-xl {
9793
+ --pf-c-sidebar__panel--FlexBasis: 25%;
9794
+ }
9795
+
9796
+ .pf-c-sidebar__panel.pf-m-width-33-on-xl {
9797
+ --pf-c-sidebar__panel--FlexBasis: 33%;
9798
+ }
9799
+
9800
+ .pf-c-sidebar__panel.pf-m-width-50-on-xl {
9801
+ --pf-c-sidebar__panel--FlexBasis: 50%;
9802
+ }
9803
+
9804
+ .pf-c-sidebar__panel.pf-m-width-66-on-xl {
9805
+ --pf-c-sidebar__panel--FlexBasis: 66%;
9806
+ }
9807
+
9808
+ .pf-c-sidebar__panel.pf-m-width-75-on-xl {
9809
+ --pf-c-sidebar__panel--FlexBasis: 75%;
9810
+ }
9811
+
9812
+ .pf-c-sidebar__panel.pf-m-width-100-on-xl {
9813
+ --pf-c-sidebar__panel--FlexBasis: 100%;
9814
+ }
9815
+ }
9816
+ @media (min-width: 1450px) {
9817
+ .pf-c-sidebar__panel.pf-m-width-default-on-2xl {
9818
+ --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
9819
+ }
9820
+
9821
+ .pf-c-sidebar__panel.pf-m-width-25-on-2xl {
9822
+ --pf-c-sidebar__panel--FlexBasis: 25%;
9823
+ }
9824
+
9825
+ .pf-c-sidebar__panel.pf-m-width-33-on-2xl {
9826
+ --pf-c-sidebar__panel--FlexBasis: 33%;
9827
+ }
9828
+
9829
+ .pf-c-sidebar__panel.pf-m-width-50-on-2xl {
9830
+ --pf-c-sidebar__panel--FlexBasis: 50%;
9831
+ }
9832
+
9833
+ .pf-c-sidebar__panel.pf-m-width-66-on-2xl {
9834
+ --pf-c-sidebar__panel--FlexBasis: 66%;
9835
+ }
9836
+
9837
+ .pf-c-sidebar__panel.pf-m-width-75-on-2xl {
9838
+ --pf-c-sidebar__panel--FlexBasis: 75%;
9839
+ }
9840
+
9841
+ .pf-c-sidebar__panel.pf-m-width-100-on-2xl {
9842
+ --pf-c-sidebar__panel--FlexBasis: 100%;
9843
+ }
9844
+ }
9845
+ .pf-c-jump-links {
9846
+ --pf-c-jump-links__list--Display: flex;
9847
+ --pf-c-jump-links__list--Visibility: visible;
9848
+ --pf-c-jump-links__list--PaddingTop: 0;
9849
+ --pf-c-jump-links__list--PaddingRight: var(--pf-global--spacer--md);
9850
+ --pf-c-jump-links__list--PaddingBottom: 0;
9851
+ --pf-c-jump-links__list--PaddingLeft: var(--pf-global--spacer--md);
9852
+ --pf-c-jump-links--m-vertical__list--PaddingTop: var(--pf-global--spacer--md);
9853
+ --pf-c-jump-links--m-vertical__list--PaddingRight: 0;
9854
+ --pf-c-jump-links--m-vertical__list--PaddingBottom: var(--pf-global--spacer--md);
9855
+ --pf-c-jump-links--m-vertical__list--PaddingLeft: 0;
9856
+ --pf-c-jump-links__list--FlexDirection: row;
9857
+ --pf-c-jump-links--m-vertical__list--FlexDirection: column;
9858
+ --pf-c-jump-links__list--before--BorderColor: var(--pf-global--BorderColor--100);
9859
+ --pf-c-jump-links__list--before--BorderTopWidth: var(--pf-global--BorderWidth--sm);
9860
+ --pf-c-jump-links__list--before--BorderRightWidth: 0;
9861
+ --pf-c-jump-links__list--before--BorderBottomWidth: 0;
9862
+ --pf-c-jump-links__list--before--BorderLeftWidth: 0;
9863
+ --pf-c-jump-links--m-vertical__list--before--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
9864
+ --pf-c-jump-links--m-vertical__list--before--BorderTopWidth: 0;
9865
+ --pf-c-jump-links__list__list--MarginTop: calc(var(--pf-global--spacer--sm) * -1);
9866
+ --pf-c-jump-links__link--PaddingTop: var(--pf-global--spacer--md);
9867
+ --pf-c-jump-links__link--PaddingRight: var(--pf-global--spacer--md);
9868
+ --pf-c-jump-links__link--PaddingBottom: var(--pf-global--spacer--md);
9869
+ --pf-c-jump-links__link--PaddingLeft: var(--pf-global--spacer--md);
9870
+ --pf-c-jump-links__list__list__link--PaddingTop: var(--pf-global--spacer--sm);
9871
+ --pf-c-jump-links__list__list__link--PaddingLeft: var(--pf-global--spacer--lg);
9872
+ --pf-c-jump-links__list__list__link--PaddingBottom: var(--pf-global--spacer--sm);
9873
+ --pf-c-jump-links__link--OutlineOffset: calc(-1 * var(--pf-global--spacer--sm));
9874
+ --pf-c-jump-links__link--before--BorderTopWidth: 0;
9875
+ --pf-c-jump-links__link--before--BorderRightWidth: 0;
9876
+ --pf-c-jump-links__link--before--BorderBottomWidth: 0;
9877
+ --pf-c-jump-links__link--before--BorderLeftWidth: 0;
9878
+ --pf-c-jump-links__link--before--BorderColor: transparent;
9879
+ --pf-c-jump-links__item--m-current__link--before--BorderTopWidth: var(--pf-global--BorderWidth--lg);
9880
+ --pf-c-jump-links__item--m-current__link--before--BorderLeftWidth: 0;
9881
+ --pf-c-jump-links__item--m-current__link--before--BorderColor: var(--pf-global--primary-color--100);
9882
+ --pf-c-jump-links--m-vertical__item--m-current__link--before--BorderTopWidth: 0;
9883
+ --pf-c-jump-links--m-vertical__item--m-current__link--before--BorderLeftWidth: var(--pf-global--BorderWidth--lg);
9884
+ --pf-c-jump-links__link-text--Color: var(--pf-global--Color--200);
9885
+ --pf-c-jump-links__link--hover__link-text--Color: var(--pf-global--Color--100);
9886
+ --pf-c-jump-links__link--focus__link-text--Color: var(--pf-global--Color--100);
9887
+ --pf-c-jump-links__item--m-current__link-text--Color: var(--pf-global--Color--100);
9888
+ --pf-c-jump-links__label--MarginBottom: var(--pf-global--spacer--md);
9889
+ --pf-c-jump-links__label--Display: block;
9890
+ --pf-c-jump-links__label--Visibility: visible;
9891
+ --pf-c-jump-links__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element));
9892
+ --pf-c-jump-links__toggle--MarginBottom--base: calc(-1 * var(--pf-global--spacer--form-element));
9893
+ --pf-c-jump-links__toggle--MarginBottom: var(--pf-c-jump-links__toggle--MarginBottom--base);
9894
+ --pf-c-jump-links--m-expanded__toggle--MarginBottom: calc(var(--pf-c-jump-links__toggle--MarginBottom--base) + var(--pf-global--spacer--md));
9895
+ --pf-c-jump-links__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
9896
+ --pf-c-jump-links__toggle--Display: none;
9897
+ --pf-c-jump-links__toggle--Visibility: hidden;
9898
+ --pf-c-jump-links__toggle-icon--Color: currentcolor;
9899
+ --pf-c-jump-links__toggle-icon--Transition: var(--pf-global--Transition);
9900
+ --pf-c-jump-links__toggle-icon--Rotate: 0;
9901
+ --pf-c-jump-links--m-expanded__toggle-icon--Color: var(--pf-global--Color--100);
9902
+ --pf-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
9903
+ --pf-c-jump-links__toggle-text--MarginLeft: var(--pf-global--spacer--md);
9904
+ --pf-c-jump-links__toggle-text--Color: var(--pf-global--Color--100);
9905
+ display: flex;
9906
+ }
9907
+
9908
+ .pf-c-jump-links.pf-m-center {
9909
+ justify-content: center;
10003
9910
  }
10004
9911
 
10005
- .pf-c-sidebar__panel.pf-m-width-50 {
10006
- --pf-c-sidebar__panel--FlexBasis: 50%;
9912
+ .pf-c-jump-links.pf-m-center .pf-c-jump-links__main {
9913
+ align-items: center;
10007
9914
  }
10008
9915
 
10009
- .pf-c-sidebar__panel.pf-m-width-66 {
10010
- --pf-c-sidebar__panel--FlexBasis: 66%;
9916
+ .pf-c-jump-links.pf-m-vertical, .pf-c-jump-links.pf-m-expandable {
9917
+ --pf-c-jump-links__list--PaddingTop: var(--pf-c-jump-links--m-vertical__list--PaddingTop);
9918
+ --pf-c-jump-links__list--PaddingRight: var(--pf-c-jump-links--m-vertical__list--PaddingRight);
9919
+ --pf-c-jump-links__list--PaddingBottom: var(--pf-c-jump-links--m-vertical__list--PaddingBottom);
9920
+ --pf-c-jump-links__list--PaddingLeft: var(--pf-c-jump-links--m-vertical__list--PaddingLeft);
9921
+ --pf-c-jump-links__list--before--BorderTopWidth: var(--pf-c-jump-links--m-vertical__list--before--BorderTopWidth);
9922
+ --pf-c-jump-links__list--before--BorderLeftWidth: var(--pf-c-jump-links--m-vertical__list--before--BorderLeftWidth);
9923
+ --pf-c-jump-links__item--m-current__link--before--BorderTopWidth: var(--pf-c-jump-links--m-vertical__item--m-current__link--before--BorderTopWidth);
9924
+ --pf-c-jump-links__item--m-current__link--before--BorderLeftWidth: var(--pf-c-jump-links--m-vertical__item--m-current__link--before--BorderLeftWidth);
9925
+ --pf-c-jump-links__list--FlexDirection: var(--pf-c-jump-links--m-vertical__list--FlexDirection);
9926
+ flex-direction: column;
10011
9927
  }
10012
9928
 
10013
- .pf-c-sidebar__panel.pf-m-width-75 {
10014
- --pf-c-sidebar__panel--FlexBasis: 75%;
9929
+ .pf-c-jump-links.pf-m-expandable {
9930
+ --pf-c-jump-links__list--Display: none;
9931
+ --pf-c-jump-links__list--Visibility: hidden;
9932
+ --pf-c-jump-links__toggle--Display: block;
9933
+ --pf-c-jump-links__toggle--Visibility: visible;
9934
+ --pf-c-jump-links__label--Display: none;
9935
+ --pf-c-jump-links__label--Visibility: hidden;
10015
9936
  }
10016
9937
 
10017
- .pf-c-sidebar__panel.pf-m-width-100 {
10018
- --pf-c-sidebar__panel--FlexBasis: 100%;
9938
+ .pf-c-jump-links.pf-m-non-expandable {
9939
+ --pf-c-jump-links__list--Display: flex;
9940
+ --pf-c-jump-links__list--Visibility: visible;
9941
+ --pf-c-jump-links__toggle--Display: none;
9942
+ --pf-c-jump-links__toggle--Visibility: hidden;
9943
+ --pf-c-jump-links__label--Display: block;
9944
+ --pf-c-jump-links__label--Visibility: visible;
10019
9945
  }
10020
9946
 
10021
9947
  @media (min-width: 576px) {
10022
- .pf-c-sidebar__panel.pf-m-width-default-on-sm {
10023
- --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
10024
- }
10025
-
10026
- .pf-c-sidebar__panel.pf-m-width-25-on-sm {
10027
- --pf-c-sidebar__panel--FlexBasis: 25%;
10028
- }
10029
-
10030
- .pf-c-sidebar__panel.pf-m-width-33-on-sm {
10031
- --pf-c-sidebar__panel--FlexBasis: 33%;
10032
- }
10033
-
10034
- .pf-c-sidebar__panel.pf-m-width-50-on-sm {
10035
- --pf-c-sidebar__panel--FlexBasis: 50%;
10036
- }
10037
-
10038
- .pf-c-sidebar__panel.pf-m-width-66-on-sm {
10039
- --pf-c-sidebar__panel--FlexBasis: 66%;
10040
- }
10041
-
10042
- .pf-c-sidebar__panel.pf-m-width-75-on-sm {
10043
- --pf-c-sidebar__panel--FlexBasis: 75%;
9948
+ .pf-c-jump-links.pf-m-expandable-on-sm {
9949
+ --pf-c-jump-links__list--Display: none;
9950
+ --pf-c-jump-links__list--Visibility: hidden;
9951
+ --pf-c-jump-links__toggle--Display: block;
9952
+ --pf-c-jump-links__toggle--Visibility: visible;
9953
+ --pf-c-jump-links__label--Display: none;
9954
+ --pf-c-jump-links__label--Visibility: hidden;
10044
9955
  }
10045
9956
 
10046
- .pf-c-sidebar__panel.pf-m-width-100-on-sm {
10047
- --pf-c-sidebar__panel--FlexBasis: 100%;
9957
+ .pf-c-jump-links.pf-m-non-expandable-on-sm {
9958
+ --pf-c-jump-links__list--Display: flex;
9959
+ --pf-c-jump-links__list--Visibility: visible;
9960
+ --pf-c-jump-links__toggle--Display: none;
9961
+ --pf-c-jump-links__toggle--Visibility: hidden;
9962
+ --pf-c-jump-links__label--Display: block;
9963
+ --pf-c-jump-links__label--Visibility: visible;
10048
9964
  }
10049
9965
  }
10050
9966
  @media (min-width: 768px) {
10051
- .pf-c-sidebar__panel.pf-m-width-default-on-md {
10052
- --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
10053
- }
10054
-
10055
- .pf-c-sidebar__panel.pf-m-width-25-on-md {
10056
- --pf-c-sidebar__panel--FlexBasis: 25%;
9967
+ .pf-c-jump-links.pf-m-expandable-on-md {
9968
+ --pf-c-jump-links__list--Display: none;
9969
+ --pf-c-jump-links__list--Visibility: hidden;
9970
+ --pf-c-jump-links__toggle--Display: block;
9971
+ --pf-c-jump-links__toggle--Visibility: visible;
9972
+ --pf-c-jump-links__label--Display: none;
9973
+ --pf-c-jump-links__label--Visibility: hidden;
10057
9974
  }
10058
9975
 
10059
- .pf-c-sidebar__panel.pf-m-width-33-on-md {
10060
- --pf-c-sidebar__panel--FlexBasis: 33%;
9976
+ .pf-c-jump-links.pf-m-non-expandable-on-md {
9977
+ --pf-c-jump-links__list--Display: flex;
9978
+ --pf-c-jump-links__list--Visibility: visible;
9979
+ --pf-c-jump-links__toggle--Display: none;
9980
+ --pf-c-jump-links__toggle--Visibility: hidden;
9981
+ --pf-c-jump-links__label--Display: block;
9982
+ --pf-c-jump-links__label--Visibility: visible;
10061
9983
  }
10062
-
10063
- .pf-c-sidebar__panel.pf-m-width-50-on-md {
10064
- --pf-c-sidebar__panel--FlexBasis: 50%;
9984
+ }
9985
+ @media (min-width: 992px) {
9986
+ .pf-c-jump-links.pf-m-expandable-on-lg {
9987
+ --pf-c-jump-links__list--Display: none;
9988
+ --pf-c-jump-links__list--Visibility: hidden;
9989
+ --pf-c-jump-links__toggle--Display: block;
9990
+ --pf-c-jump-links__toggle--Visibility: visible;
9991
+ --pf-c-jump-links__label--Display: none;
9992
+ --pf-c-jump-links__label--Visibility: hidden;
10065
9993
  }
10066
9994
 
10067
- .pf-c-sidebar__panel.pf-m-width-66-on-md {
10068
- --pf-c-sidebar__panel--FlexBasis: 66%;
9995
+ .pf-c-jump-links.pf-m-non-expandable-on-lg {
9996
+ --pf-c-jump-links__list--Display: flex;
9997
+ --pf-c-jump-links__list--Visibility: visible;
9998
+ --pf-c-jump-links__toggle--Display: none;
9999
+ --pf-c-jump-links__toggle--Visibility: hidden;
10000
+ --pf-c-jump-links__label--Display: block;
10001
+ --pf-c-jump-links__label--Visibility: visible;
10069
10002
  }
10070
-
10071
- .pf-c-sidebar__panel.pf-m-width-75-on-md {
10072
- --pf-c-sidebar__panel--FlexBasis: 75%;
10003
+ }
10004
+ @media (min-width: 1200px) {
10005
+ .pf-c-jump-links.pf-m-expandable-on-xl {
10006
+ --pf-c-jump-links__list--Display: none;
10007
+ --pf-c-jump-links__list--Visibility: hidden;
10008
+ --pf-c-jump-links__toggle--Display: block;
10009
+ --pf-c-jump-links__toggle--Visibility: visible;
10010
+ --pf-c-jump-links__label--Display: none;
10011
+ --pf-c-jump-links__label--Visibility: hidden;
10073
10012
  }
10074
10013
 
10075
- .pf-c-sidebar__panel.pf-m-width-100-on-md {
10076
- --pf-c-sidebar__panel--FlexBasis: 100%;
10014
+ .pf-c-jump-links.pf-m-non-expandable-on-xl {
10015
+ --pf-c-jump-links__list--Display: flex;
10016
+ --pf-c-jump-links__list--Visibility: visible;
10017
+ --pf-c-jump-links__toggle--Display: none;
10018
+ --pf-c-jump-links__toggle--Visibility: hidden;
10019
+ --pf-c-jump-links__label--Display: block;
10020
+ --pf-c-jump-links__label--Visibility: visible;
10077
10021
  }
10078
10022
  }
10079
- @media (min-width: 992px) {
10080
- .pf-c-sidebar__panel.pf-m-width-default-on-lg {
10081
- --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
10082
- }
10083
-
10084
- .pf-c-sidebar__panel.pf-m-width-25-on-lg {
10085
- --pf-c-sidebar__panel--FlexBasis: 25%;
10023
+ @media (min-width: 1450px) {
10024
+ .pf-c-jump-links.pf-m-expandable-on-2xl {
10025
+ --pf-c-jump-links__list--Display: none;
10026
+ --pf-c-jump-links__list--Visibility: hidden;
10027
+ --pf-c-jump-links__toggle--Display: block;
10028
+ --pf-c-jump-links__toggle--Visibility: visible;
10029
+ --pf-c-jump-links__label--Display: none;
10030
+ --pf-c-jump-links__label--Visibility: hidden;
10086
10031
  }
10087
10032
 
10088
- .pf-c-sidebar__panel.pf-m-width-33-on-lg {
10089
- --pf-c-sidebar__panel--FlexBasis: 33%;
10033
+ .pf-c-jump-links.pf-m-non-expandable-on-2xl {
10034
+ --pf-c-jump-links__list--Display: flex;
10035
+ --pf-c-jump-links__list--Visibility: visible;
10036
+ --pf-c-jump-links__toggle--Display: none;
10037
+ --pf-c-jump-links__toggle--Visibility: hidden;
10038
+ --pf-c-jump-links__label--Display: block;
10039
+ --pf-c-jump-links__label--Visibility: visible;
10090
10040
  }
10041
+ }
10042
+ .pf-c-jump-links.pf-m-expanded {
10043
+ --pf-c-jump-links__list--Display: flex;
10044
+ --pf-c-jump-links__list--Visibility: visible;
10045
+ --pf-c-jump-links__toggle--MarginBottom: var(--pf-c-jump-links--m-expanded__toggle--MarginBottom);
10046
+ --pf-c-jump-links__toggle-icon--Rotate: var(--pf-c-jump-links--m-expanded__toggle-icon--Rotate);
10047
+ --pf-c-jump-links__toggle-icon--Color: var(--pf-c-jump-links--m-expanded__toggle-icon--Color);
10048
+ }
10091
10049
 
10092
- .pf-c-sidebar__panel.pf-m-width-50-on-lg {
10093
- --pf-c-sidebar__panel--FlexBasis: 50%;
10094
- }
10050
+ .pf-c-jump-links__list {
10051
+ position: relative;
10052
+ display: var(--pf-c-jump-links__list--Display);
10053
+ flex-direction: var(--pf-c-jump-links__list--FlexDirection);
10054
+ padding-top: var(--pf-c-jump-links__list--PaddingTop);
10055
+ padding-right: var(--pf-c-jump-links__list--PaddingRight);
10056
+ padding-bottom: var(--pf-c-jump-links__list--PaddingBottom);
10057
+ padding-left: var(--pf-c-jump-links__list--PaddingLeft);
10058
+ visibility: var(--pf-c-jump-links__list--Visibility);
10059
+ }
10095
10060
 
10096
- .pf-c-sidebar__panel.pf-m-width-66-on-lg {
10097
- --pf-c-sidebar__panel--FlexBasis: 66%;
10098
- }
10061
+ .pf-c-jump-links__list::before {
10062
+ position: absolute;
10063
+ top: 0;
10064
+ right: 0;
10065
+ bottom: 0;
10066
+ left: 0;
10067
+ pointer-events: none;
10068
+ content: "";
10069
+ border: solid var(--pf-c-jump-links__list--before--BorderColor);
10070
+ border-width: var(--pf-c-jump-links__list--before--BorderTopWidth) var(--pf-c-jump-links__list--before--BorderRightWidth) var(--pf-c-jump-links__list--before--BorderBottomWidth) var(--pf-c-jump-links__list--before--BorderLeftWidth);
10071
+ }
10099
10072
 
10100
- .pf-c-sidebar__panel.pf-m-width-75-on-lg {
10101
- --pf-c-sidebar__panel--FlexBasis: 75%;
10102
- }
10073
+ .pf-c-jump-links__list .pf-c-jump-links__list {
10074
+ --pf-c-jump-links__list--PaddingTop: 0;
10075
+ --pf-c-jump-links__list--PaddingBottom: 0;
10076
+ --pf-c-jump-links__link--PaddingTop: var(--pf-c-jump-links__list__list__link--PaddingTop);
10077
+ --pf-c-jump-links__link--PaddingBottom: var(--pf-c-jump-links__list__list__link--PaddingBottom);
10078
+ --pf-c-jump-links__link--PaddingLeft: var(--pf-c-jump-links__list__list__link--PaddingLeft);
10079
+ margin-top: var(--pf-c-jump-links__list__list--MarginTop);
10080
+ }
10103
10081
 
10104
- .pf-c-sidebar__panel.pf-m-width-100-on-lg {
10105
- --pf-c-sidebar__panel--FlexBasis: 100%;
10106
- }
10082
+ .pf-c-jump-links__link {
10083
+ position: relative;
10084
+ display: flex;
10085
+ flex: 1;
10086
+ padding-top: var(--pf-c-jump-links__link--PaddingTop);
10087
+ padding-right: var(--pf-c-jump-links__link--PaddingRight);
10088
+ padding-bottom: var(--pf-c-jump-links__link--PaddingBottom);
10089
+ padding-left: var(--pf-c-jump-links__link--PaddingLeft);
10090
+ text-decoration: none;
10091
+ outline-offset: var(--pf-c-jump-links__link--OutlineOffset);
10107
10092
  }
10108
- @media (min-width: 1200px) {
10109
- .pf-c-sidebar__panel.pf-m-width-default-on-xl {
10110
- --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
10111
- }
10112
10093
 
10113
- .pf-c-sidebar__panel.pf-m-width-25-on-xl {
10114
- --pf-c-sidebar__panel--FlexBasis: 25%;
10115
- }
10094
+ .pf-c-jump-links__link:hover {
10095
+ --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__link--hover__link-text--Color);
10096
+ }
10116
10097
 
10117
- .pf-c-sidebar__panel.pf-m-width-33-on-xl {
10118
- --pf-c-sidebar__panel--FlexBasis: 33%;
10119
- }
10098
+ .pf-c-jump-links__link:focus {
10099
+ --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__link--focus__link-text--Color);
10100
+ }
10120
10101
 
10121
- .pf-c-sidebar__panel.pf-m-width-50-on-xl {
10122
- --pf-c-sidebar__panel--FlexBasis: 50%;
10123
- }
10102
+ .pf-c-jump-links__link::before {
10103
+ position: absolute;
10104
+ top: 0;
10105
+ right: 0;
10106
+ bottom: 0;
10107
+ left: 0;
10108
+ pointer-events: none;
10109
+ content: "";
10110
+ border-color: var(--pf-c-jump-links__link--before--BorderColor);
10111
+ border-style: solid;
10112
+ border-width: var(--pf-c-jump-links__link--before--BorderTopWidth) var(--pf-c-jump-links__link--before--BorderRightWidth) var(--pf-c-jump-links__link--before--BorderBottomWidth) var(--pf-c-jump-links__link--before--BorderLeftWidth);
10113
+ }
10124
10114
 
10125
- .pf-c-sidebar__panel.pf-m-width-66-on-xl {
10126
- --pf-c-sidebar__panel--FlexBasis: 66%;
10127
- }
10115
+ .pf-c-jump-links__item {
10116
+ --pf-c-jump-links__list--before--BorderColor: transparent;
10117
+ }
10128
10118
 
10129
- .pf-c-sidebar__panel.pf-m-width-75-on-xl {
10130
- --pf-c-sidebar__panel--FlexBasis: 75%;
10131
- }
10119
+ .pf-c-jump-links__item.pf-m-current > .pf-c-jump-links__link {
10120
+ --pf-c-jump-links__link--before--BorderTopWidth: var(--pf-c-jump-links__item--m-current__link--before--BorderTopWidth);
10121
+ --pf-c-jump-links__link--before--BorderLeftWidth: var(--pf-c-jump-links__item--m-current__link--before--BorderLeftWidth);
10122
+ --pf-c-jump-links__link--before--BorderColor: var(--pf-c-jump-links__item--m-current__link--before--BorderColor);
10123
+ --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__item--m-current__link-text--Color);
10124
+ }
10132
10125
 
10133
- .pf-c-sidebar__panel.pf-m-width-100-on-xl {
10134
- --pf-c-sidebar__panel--FlexBasis: 100%;
10135
- }
10126
+ .pf-c-jump-links__link-text {
10127
+ color: var(--pf-c-jump-links__link-text--Color);
10136
10128
  }
10137
- @media (min-width: 1450px) {
10138
- .pf-c-sidebar__panel.pf-m-width-default-on-2xl {
10139
- --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
10140
- }
10141
10129
 
10142
- .pf-c-sidebar__panel.pf-m-width-25-on-2xl {
10143
- --pf-c-sidebar__panel--FlexBasis: 25%;
10144
- }
10130
+ .pf-c-jump-links__label {
10131
+ display: var(--pf-c-jump-links__label--Display);
10132
+ margin-bottom: var(--pf-c-jump-links__label--MarginBottom);
10133
+ visibility: var(--pf-c-jump-links__label--Visibility);
10134
+ }
10145
10135
 
10146
- .pf-c-sidebar__panel.pf-m-width-33-on-2xl {
10147
- --pf-c-sidebar__panel--FlexBasis: 33%;
10148
- }
10136
+ .pf-c-jump-links__main {
10137
+ display: flex;
10138
+ flex-direction: column;
10139
+ }
10149
10140
 
10150
- .pf-c-sidebar__panel.pf-m-width-50-on-2xl {
10151
- --pf-c-sidebar__panel--FlexBasis: 50%;
10152
- }
10141
+ .pf-c-jump-links__toggle {
10142
+ display: var(--pf-c-jump-links__toggle--Display);
10143
+ margin-top: var(--pf-c-jump-links__toggle--MarginTop);
10144
+ margin-bottom: var(--pf-c-jump-links__toggle--MarginBottom);
10145
+ margin-left: var(--pf-c-jump-links__toggle--MarginLeft);
10146
+ visibility: var(--pf-c-jump-links__toggle--Visibility);
10147
+ }
10153
10148
 
10154
- .pf-c-sidebar__panel.pf-m-width-66-on-2xl {
10155
- --pf-c-sidebar__panel--FlexBasis: 66%;
10156
- }
10149
+ .pf-c-jump-links__toggle .pf-c-button {
10150
+ display: flex;
10151
+ align-items: center;
10152
+ }
10157
10153
 
10158
- .pf-c-sidebar__panel.pf-m-width-75-on-2xl {
10159
- --pf-c-sidebar__panel--FlexBasis: 75%;
10160
- }
10154
+ .pf-c-jump-links__toggle-icon {
10155
+ display: inline-block;
10156
+ color: var(--pf-c-jump-links__toggle-icon--Color);
10157
+ transition: var(--pf-c-jump-links__toggle-icon--Transition);
10158
+ transform: rotate(var(--pf-c-jump-links__toggle-icon--Rotate));
10159
+ }
10161
10160
 
10162
- .pf-c-sidebar__panel.pf-m-width-100-on-2xl {
10163
- --pf-c-sidebar__panel--FlexBasis: 100%;
10164
- }
10161
+ .pf-c-jump-links__toggle-text {
10162
+ margin-left: var(--pf-c-jump-links__toggle-text--MarginLeft);
10163
+ color: var(--pf-c-jump-links__toggle-text--Color);
10165
10164
  }
10165
+
10166
10166
  .pf-c-label {
10167
10167
  --pf-c-label--PaddingTop: var(--pf-global--spacer--xs);
10168
10168
  --pf-c-label--PaddingRight: var(--pf-global--spacer--sm);
@@ -20920,44 +20920,6 @@ svg.pf-c-spinner.pf-m-xl {
20920
20920
  --pf-c-tile--m-disabled__body--Color: var(--pf-global--disabled-color--300);
20921
20921
  }
20922
20922
 
20923
- .pf-c-timestamp {
20924
- --pf-c-timestamp--FontSize: var(--pf-global--FontSize--sm);
20925
- --pf-c-timestamp--Color: var(--pf-global--Color--200);
20926
- --pf-c-timestamp--OutlineOffset: 0.1875rem;
20927
- --pf-c-timestamp--m-help-text--TextDecorationLine: underline;
20928
- --pf-c-timestamp--m-help-text--TextDecorationStyle: dashed;
20929
- --pf-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
20930
- --pf-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
20931
- --pf-c-timestamp--m-help-text--TextDecorationColor: var(--pf-global--BorderColor--200);
20932
- --pf-c-timestamp--m-help-text--hover--Color: var(--pf-global--Color--100);
20933
- --pf-c-timestamp--m-help-text--focus--Color: var(--pf-global--Color--100);
20934
- --pf-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-global--Color--100);
20935
- --pf-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-global--Color--100);
20936
- display: inline-block;
20937
- font-size: var(--pf-c-timestamp--FontSize);
20938
- color: var(--pf-c-timestamp--Color);
20939
- outline-offset: var(--pf-c-timestamp--OutlineOffset);
20940
- }
20941
-
20942
- .pf-c-timestamp.pf-m-help-text {
20943
- cursor: pointer;
20944
- text-decoration-line: var(--pf-c-timestamp--m-help-text--TextDecorationLine);
20945
- text-decoration-style: var(--pf-c-timestamp--m-help-text--TextDecorationStyle);
20946
- text-decoration-thickness: var(--pf-c-timestamp--m-help-text--TextDecorationThickness);
20947
- text-underline-offset: var(--pf-c-timestamp--m-help-text--TextUnderlineOffset);
20948
- text-decoration-color: var(--pf-c-timestamp--m-help-text--TextDecorationColor);
20949
- }
20950
-
20951
- .pf-c-timestamp.pf-m-help-text:hover {
20952
- --pf-c-timestamp--Color: var(--pf-c-timestamp--m-help-text--hover--Color);
20953
- --pf-c-timestamp--m-help-text--TextDecorationColor: var(--pf-c-timestamp--m-help-text--hover--TextDecorationColor);
20954
- }
20955
-
20956
- .pf-c-timestamp.pf-m-help-text:focus {
20957
- --pf-c-timestamp--Color: var(--pf-c-timestamp--m-help-text--focus--Color);
20958
- --pf-c-timestamp--m-help-text--TextDecorationColor: var(--pf-c-timestamp--m-help-text--focus--TextDecorationColor);
20959
- }
20960
-
20961
20923
  .pf-c-title {
20962
20924
  --pf-c-title--FontFamily: var(--pf-global--FontFamily--heading--sans-serif);
20963
20925
  --pf-c-title--m-4xl--LineHeight: var(--pf-global--LineHeight--sm);
@@ -21023,6 +20985,44 @@ svg.pf-c-spinner.pf-m-xl {
21023
20985
  --pf-c-title--m-lg--FontWeight: var(--pf-global--FontWeight--semi-bold);
21024
20986
  }
21025
20987
 
20988
+ .pf-c-timestamp {
20989
+ --pf-c-timestamp--FontSize: var(--pf-global--FontSize--sm);
20990
+ --pf-c-timestamp--Color: var(--pf-global--Color--200);
20991
+ --pf-c-timestamp--OutlineOffset: 0.1875rem;
20992
+ --pf-c-timestamp--m-help-text--TextDecorationLine: underline;
20993
+ --pf-c-timestamp--m-help-text--TextDecorationStyle: dashed;
20994
+ --pf-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
20995
+ --pf-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
20996
+ --pf-c-timestamp--m-help-text--TextDecorationColor: var(--pf-global--BorderColor--200);
20997
+ --pf-c-timestamp--m-help-text--hover--Color: var(--pf-global--Color--100);
20998
+ --pf-c-timestamp--m-help-text--focus--Color: var(--pf-global--Color--100);
20999
+ --pf-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-global--Color--100);
21000
+ --pf-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-global--Color--100);
21001
+ display: inline-block;
21002
+ font-size: var(--pf-c-timestamp--FontSize);
21003
+ color: var(--pf-c-timestamp--Color);
21004
+ outline-offset: var(--pf-c-timestamp--OutlineOffset);
21005
+ }
21006
+
21007
+ .pf-c-timestamp.pf-m-help-text {
21008
+ cursor: pointer;
21009
+ text-decoration-line: var(--pf-c-timestamp--m-help-text--TextDecorationLine);
21010
+ text-decoration-style: var(--pf-c-timestamp--m-help-text--TextDecorationStyle);
21011
+ text-decoration-thickness: var(--pf-c-timestamp--m-help-text--TextDecorationThickness);
21012
+ text-underline-offset: var(--pf-c-timestamp--m-help-text--TextUnderlineOffset);
21013
+ text-decoration-color: var(--pf-c-timestamp--m-help-text--TextDecorationColor);
21014
+ }
21015
+
21016
+ .pf-c-timestamp.pf-m-help-text:hover {
21017
+ --pf-c-timestamp--Color: var(--pf-c-timestamp--m-help-text--hover--Color);
21018
+ --pf-c-timestamp--m-help-text--TextDecorationColor: var(--pf-c-timestamp--m-help-text--hover--TextDecorationColor);
21019
+ }
21020
+
21021
+ .pf-c-timestamp.pf-m-help-text:focus {
21022
+ --pf-c-timestamp--Color: var(--pf-c-timestamp--m-help-text--focus--Color);
21023
+ --pf-c-timestamp--m-help-text--TextDecorationColor: var(--pf-c-timestamp--m-help-text--focus--TextDecorationColor);
21024
+ }
21025
+
21026
21026
  .pf-c-toggle-group {
21027
21027
  --pf-c-toggle-group__button--PaddingTop: var(--pf-global--spacer--form-element);
21028
21028
  --pf-c-toggle-group__button--PaddingRight: var(--pf-global--spacer--md);
@@ -26258,52 +26258,6 @@ label.pf-c-tree-view__node-text {
26258
26258
  --pf-l-gallery--GridTemplateColumns--minmax--max: var(--pf-l-gallery--GridTemplateColumns--max-on-2xl, var(--pf-l-gallery--GridTemplateColumns--max-on-xl, var(--pf-l-gallery--GridTemplateColumns--max-on-lg, var(--pf-l-gallery--GridTemplateColumns--max-on-md, var(--pf-l-gallery--GridTemplateColumns--max-on-sm, var(--pf-l-gallery--GridTemplateColumns--max))))));
26259
26259
  }
26260
26260
  }
26261
- .pf-l-level {
26262
- --pf-l-level--m-gutter--MarginRight: var(--pf-global--gutter);
26263
- display: flex;
26264
- flex-wrap: wrap;
26265
- align-items: center;
26266
- justify-content: space-between;
26267
- }
26268
-
26269
- .pf-l-level.pf-m-gutter > *:not(:last-child) {
26270
- margin-right: var(--pf-l-level--m-gutter--MarginRight);
26271
- }
26272
-
26273
- .pf-l-split {
26274
- --pf-l-split--m-gutter--MarginRight: var(--pf-global--gutter);
26275
- display: flex;
26276
- padding: 0;
26277
- margin: 0;
26278
- }
26279
-
26280
- .pf-l-split.pf-m-wrap {
26281
- flex-wrap: wrap;
26282
- }
26283
-
26284
- .pf-l-split__item.pf-m-fill {
26285
- flex-grow: 1;
26286
- }
26287
-
26288
- .pf-l-split.pf-m-gutter > *:not(:last-child) {
26289
- margin-right: var(--pf-l-split--m-gutter--MarginRight);
26290
- }
26291
-
26292
- .pf-l-stack {
26293
- --pf-l-stack--m-gutter--MarginBottom: var(--pf-global--gutter);
26294
- display: flex;
26295
- flex-direction: column;
26296
- height: 100%;
26297
- }
26298
-
26299
- .pf-l-stack__item.pf-m-fill {
26300
- flex-grow: 1;
26301
- }
26302
-
26303
- .pf-l-stack.pf-m-gutter > *:not(:last-child) {
26304
- margin-bottom: var(--pf-l-stack--m-gutter--MarginBottom);
26305
- }
26306
-
26307
26261
  .pf-l-grid {
26308
26262
  --pf-l-grid--m-gutter--GridGap: var(--pf-global--gutter);
26309
26263
  --pf-l-grid__item--GridColumnStart: auto;
@@ -27518,6 +27472,52 @@ label.pf-c-tree-view__node-text {
27518
27472
  grid-gap: var(--pf-l-grid--m-gutter--GridGap);
27519
27473
  }
27520
27474
 
27475
+ .pf-l-level {
27476
+ --pf-l-level--m-gutter--MarginRight: var(--pf-global--gutter);
27477
+ display: flex;
27478
+ flex-wrap: wrap;
27479
+ align-items: center;
27480
+ justify-content: space-between;
27481
+ }
27482
+
27483
+ .pf-l-level.pf-m-gutter > *:not(:last-child) {
27484
+ margin-right: var(--pf-l-level--m-gutter--MarginRight);
27485
+ }
27486
+
27487
+ .pf-l-split {
27488
+ --pf-l-split--m-gutter--MarginRight: var(--pf-global--gutter);
27489
+ display: flex;
27490
+ padding: 0;
27491
+ margin: 0;
27492
+ }
27493
+
27494
+ .pf-l-split.pf-m-wrap {
27495
+ flex-wrap: wrap;
27496
+ }
27497
+
27498
+ .pf-l-split__item.pf-m-fill {
27499
+ flex-grow: 1;
27500
+ }
27501
+
27502
+ .pf-l-split.pf-m-gutter > *:not(:last-child) {
27503
+ margin-right: var(--pf-l-split--m-gutter--MarginRight);
27504
+ }
27505
+
27506
+ .pf-l-stack {
27507
+ --pf-l-stack--m-gutter--MarginBottom: var(--pf-global--gutter);
27508
+ display: flex;
27509
+ flex-direction: column;
27510
+ height: 100%;
27511
+ }
27512
+
27513
+ .pf-l-stack__item.pf-m-fill {
27514
+ flex-grow: 1;
27515
+ }
27516
+
27517
+ .pf-l-stack.pf-m-gutter > *:not(:last-child) {
27518
+ margin-bottom: var(--pf-l-stack--m-gutter--MarginBottom);
27519
+ }
27520
+
27521
27521
  .pf-c-alert-group {
27522
27522
  --pf-c-alert-group__item--MarginTop: var(--pf-global--spacer--sm);
27523
27523
  --pf-c-alert-group--m-toast--Top: var(--pf-global--spacer--2xl);