@patternfly/react-core 4.235.7 → 4.236.1

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 (30) hide show
  1. package/CHANGELOG.md +27 -0
  2. package/dist/esm/components/ApplicationLauncher/ApplicationLauncher.d.ts.map +1 -1
  3. package/dist/esm/components/ApplicationLauncher/ApplicationLauncher.js +1 -0
  4. package/dist/esm/components/ApplicationLauncher/ApplicationLauncher.js.map +1 -1
  5. package/dist/esm/components/MenuToggle/MenuToggle.d.ts.map +1 -1
  6. package/dist/esm/components/MenuToggle/MenuToggle.js +1 -1
  7. package/dist/esm/components/MenuToggle/MenuToggle.js.map +1 -1
  8. package/dist/esm/components/Page/PageSection.d.ts +2 -0
  9. package/dist/esm/components/Page/PageSection.d.ts.map +1 -1
  10. package/dist/esm/components/Page/PageSection.js +3 -2
  11. package/dist/esm/components/Page/PageSection.js.map +1 -1
  12. package/dist/js/components/ApplicationLauncher/ApplicationLauncher.d.ts.map +1 -1
  13. package/dist/js/components/ApplicationLauncher/ApplicationLauncher.js +1 -0
  14. package/dist/js/components/ApplicationLauncher/ApplicationLauncher.js.map +1 -1
  15. package/dist/js/components/MenuToggle/MenuToggle.d.ts.map +1 -1
  16. package/dist/js/components/MenuToggle/MenuToggle.js +1 -1
  17. package/dist/js/components/MenuToggle/MenuToggle.js.map +1 -1
  18. package/dist/js/components/Page/PageSection.d.ts +2 -0
  19. package/dist/js/components/Page/PageSection.d.ts.map +1 -1
  20. package/dist/js/components/Page/PageSection.js +3 -2
  21. package/dist/js/components/Page/PageSection.js.map +1 -1
  22. package/dist/umd/react-core.min.css +480 -480
  23. package/dist/umd/react-core.min.js +2 -2
  24. package/package.json +5 -5
  25. package/src/components/ApplicationLauncher/ApplicationLauncher.tsx +1 -0
  26. package/src/components/Dropdown/__tests__/Dropdown.test.tsx +1 -1
  27. package/src/components/Dropdown/examples/DropdownPrimaryToggle.tsx +1 -1
  28. package/src/components/MenuToggle/MenuToggle.tsx +7 -1
  29. package/src/components/Page/PageSection.tsx +7 -2
  30. package/src/components/Page/__tests__/PageSection.test.tsx +12 -0
@@ -9510,327 +9510,6 @@ label.pf-c-input-group__text {
9510
9510
  --pf-c-input-group__text--BackgroundColor: transparent;
9511
9511
  }
9512
9512
 
9513
- .pf-c-jump-links {
9514
- --pf-c-jump-links__list--Display: flex;
9515
- --pf-c-jump-links__list--Visibility: visible;
9516
- --pf-c-jump-links__list--PaddingTop: 0;
9517
- --pf-c-jump-links__list--PaddingRight: var(--pf-global--spacer--md);
9518
- --pf-c-jump-links__list--PaddingBottom: 0;
9519
- --pf-c-jump-links__list--PaddingLeft: var(--pf-global--spacer--md);
9520
- --pf-c-jump-links--m-vertical__list--PaddingTop: var(--pf-global--spacer--md);
9521
- --pf-c-jump-links--m-vertical__list--PaddingRight: 0;
9522
- --pf-c-jump-links--m-vertical__list--PaddingBottom: var(--pf-global--spacer--md);
9523
- --pf-c-jump-links--m-vertical__list--PaddingLeft: 0;
9524
- --pf-c-jump-links__list--FlexDirection: row;
9525
- --pf-c-jump-links--m-vertical__list--FlexDirection: column;
9526
- --pf-c-jump-links__list--before--BorderColor: var(--pf-global--BorderColor--100);
9527
- --pf-c-jump-links__list--before--BorderTopWidth: var(--pf-global--BorderWidth--sm);
9528
- --pf-c-jump-links__list--before--BorderRightWidth: 0;
9529
- --pf-c-jump-links__list--before--BorderBottomWidth: 0;
9530
- --pf-c-jump-links__list--before--BorderLeftWidth: 0;
9531
- --pf-c-jump-links--m-vertical__list--before--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
9532
- --pf-c-jump-links--m-vertical__list--before--BorderTopWidth: 0;
9533
- --pf-c-jump-links__list__list--MarginTop: calc(var(--pf-global--spacer--sm) * -1);
9534
- --pf-c-jump-links__link--PaddingTop: var(--pf-global--spacer--md);
9535
- --pf-c-jump-links__link--PaddingRight: var(--pf-global--spacer--md);
9536
- --pf-c-jump-links__link--PaddingBottom: var(--pf-global--spacer--md);
9537
- --pf-c-jump-links__link--PaddingLeft: var(--pf-global--spacer--md);
9538
- --pf-c-jump-links__list__list__link--PaddingTop: var(--pf-global--spacer--sm);
9539
- --pf-c-jump-links__list__list__link--PaddingLeft: var(--pf-global--spacer--lg);
9540
- --pf-c-jump-links__list__list__link--PaddingBottom: var(--pf-global--spacer--sm);
9541
- --pf-c-jump-links__link--OutlineOffset: calc(-1 * var(--pf-global--spacer--sm));
9542
- --pf-c-jump-links__link--before--BorderTopWidth: 0;
9543
- --pf-c-jump-links__link--before--BorderRightWidth: 0;
9544
- --pf-c-jump-links__link--before--BorderBottomWidth: 0;
9545
- --pf-c-jump-links__link--before--BorderLeftWidth: 0;
9546
- --pf-c-jump-links__link--before--BorderColor: transparent;
9547
- --pf-c-jump-links__item--m-current__link--before--BorderTopWidth: var(--pf-global--BorderWidth--lg);
9548
- --pf-c-jump-links__item--m-current__link--before--BorderLeftWidth: 0;
9549
- --pf-c-jump-links__item--m-current__link--before--BorderColor: var(--pf-global--primary-color--100);
9550
- --pf-c-jump-links--m-vertical__item--m-current__link--before--BorderTopWidth: 0;
9551
- --pf-c-jump-links--m-vertical__item--m-current__link--before--BorderLeftWidth: var(--pf-global--BorderWidth--lg);
9552
- --pf-c-jump-links__link-text--Color: var(--pf-global--Color--200);
9553
- --pf-c-jump-links__link--hover__link-text--Color: var(--pf-global--Color--100);
9554
- --pf-c-jump-links__link--focus__link-text--Color: var(--pf-global--Color--100);
9555
- --pf-c-jump-links__item--m-current__link-text--Color: var(--pf-global--Color--100);
9556
- --pf-c-jump-links__label--MarginBottom: var(--pf-global--spacer--md);
9557
- --pf-c-jump-links__label--Display: block;
9558
- --pf-c-jump-links__label--Visibility: visible;
9559
- --pf-c-jump-links__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element));
9560
- --pf-c-jump-links__toggle--MarginBottom--base: calc(-1 * var(--pf-global--spacer--form-element));
9561
- --pf-c-jump-links__toggle--MarginBottom: var(--pf-c-jump-links__toggle--MarginBottom--base);
9562
- --pf-c-jump-links--m-expanded__toggle--MarginBottom: calc(var(--pf-c-jump-links__toggle--MarginBottom--base) + var(--pf-global--spacer--md));
9563
- --pf-c-jump-links__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
9564
- --pf-c-jump-links__toggle--Display: none;
9565
- --pf-c-jump-links__toggle--Visibility: hidden;
9566
- --pf-c-jump-links__toggle-icon--Color: currentcolor;
9567
- --pf-c-jump-links__toggle-icon--Transition: var(--pf-global--Transition);
9568
- --pf-c-jump-links__toggle-icon--Rotate: 0;
9569
- --pf-c-jump-links--m-expanded__toggle-icon--Color: var(--pf-global--Color--100);
9570
- --pf-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
9571
- --pf-c-jump-links__toggle-text--MarginLeft: var(--pf-global--spacer--md);
9572
- --pf-c-jump-links__toggle-text--Color: var(--pf-global--Color--100);
9573
- display: flex;
9574
- }
9575
-
9576
- .pf-c-jump-links.pf-m-center {
9577
- justify-content: center;
9578
- }
9579
-
9580
- .pf-c-jump-links.pf-m-center .pf-c-jump-links__main {
9581
- align-items: center;
9582
- }
9583
-
9584
- .pf-c-jump-links.pf-m-vertical, .pf-c-jump-links.pf-m-expandable {
9585
- --pf-c-jump-links__list--PaddingTop: var(--pf-c-jump-links--m-vertical__list--PaddingTop);
9586
- --pf-c-jump-links__list--PaddingRight: var(--pf-c-jump-links--m-vertical__list--PaddingRight);
9587
- --pf-c-jump-links__list--PaddingBottom: var(--pf-c-jump-links--m-vertical__list--PaddingBottom);
9588
- --pf-c-jump-links__list--PaddingLeft: var(--pf-c-jump-links--m-vertical__list--PaddingLeft);
9589
- --pf-c-jump-links__list--before--BorderTopWidth: var(--pf-c-jump-links--m-vertical__list--before--BorderTopWidth);
9590
- --pf-c-jump-links__list--before--BorderLeftWidth: var(--pf-c-jump-links--m-vertical__list--before--BorderLeftWidth);
9591
- --pf-c-jump-links__item--m-current__link--before--BorderTopWidth: var(--pf-c-jump-links--m-vertical__item--m-current__link--before--BorderTopWidth);
9592
- --pf-c-jump-links__item--m-current__link--before--BorderLeftWidth: var(--pf-c-jump-links--m-vertical__item--m-current__link--before--BorderLeftWidth);
9593
- --pf-c-jump-links__list--FlexDirection: var(--pf-c-jump-links--m-vertical__list--FlexDirection);
9594
- flex-direction: column;
9595
- }
9596
-
9597
- .pf-c-jump-links.pf-m-expandable {
9598
- --pf-c-jump-links__list--Display: none;
9599
- --pf-c-jump-links__list--Visibility: hidden;
9600
- --pf-c-jump-links__toggle--Display: block;
9601
- --pf-c-jump-links__toggle--Visibility: visible;
9602
- --pf-c-jump-links__label--Display: none;
9603
- --pf-c-jump-links__label--Visibility: hidden;
9604
- }
9605
-
9606
- .pf-c-jump-links.pf-m-non-expandable {
9607
- --pf-c-jump-links__list--Display: flex;
9608
- --pf-c-jump-links__list--Visibility: visible;
9609
- --pf-c-jump-links__toggle--Display: none;
9610
- --pf-c-jump-links__toggle--Visibility: hidden;
9611
- --pf-c-jump-links__label--Display: block;
9612
- --pf-c-jump-links__label--Visibility: visible;
9613
- }
9614
-
9615
- @media (min-width: 576px) {
9616
- .pf-c-jump-links.pf-m-expandable-on-sm {
9617
- --pf-c-jump-links__list--Display: none;
9618
- --pf-c-jump-links__list--Visibility: hidden;
9619
- --pf-c-jump-links__toggle--Display: block;
9620
- --pf-c-jump-links__toggle--Visibility: visible;
9621
- --pf-c-jump-links__label--Display: none;
9622
- --pf-c-jump-links__label--Visibility: hidden;
9623
- }
9624
-
9625
- .pf-c-jump-links.pf-m-non-expandable-on-sm {
9626
- --pf-c-jump-links__list--Display: flex;
9627
- --pf-c-jump-links__list--Visibility: visible;
9628
- --pf-c-jump-links__toggle--Display: none;
9629
- --pf-c-jump-links__toggle--Visibility: hidden;
9630
- --pf-c-jump-links__label--Display: block;
9631
- --pf-c-jump-links__label--Visibility: visible;
9632
- }
9633
- }
9634
- @media (min-width: 768px) {
9635
- .pf-c-jump-links.pf-m-expandable-on-md {
9636
- --pf-c-jump-links__list--Display: none;
9637
- --pf-c-jump-links__list--Visibility: hidden;
9638
- --pf-c-jump-links__toggle--Display: block;
9639
- --pf-c-jump-links__toggle--Visibility: visible;
9640
- --pf-c-jump-links__label--Display: none;
9641
- --pf-c-jump-links__label--Visibility: hidden;
9642
- }
9643
-
9644
- .pf-c-jump-links.pf-m-non-expandable-on-md {
9645
- --pf-c-jump-links__list--Display: flex;
9646
- --pf-c-jump-links__list--Visibility: visible;
9647
- --pf-c-jump-links__toggle--Display: none;
9648
- --pf-c-jump-links__toggle--Visibility: hidden;
9649
- --pf-c-jump-links__label--Display: block;
9650
- --pf-c-jump-links__label--Visibility: visible;
9651
- }
9652
- }
9653
- @media (min-width: 992px) {
9654
- .pf-c-jump-links.pf-m-expandable-on-lg {
9655
- --pf-c-jump-links__list--Display: none;
9656
- --pf-c-jump-links__list--Visibility: hidden;
9657
- --pf-c-jump-links__toggle--Display: block;
9658
- --pf-c-jump-links__toggle--Visibility: visible;
9659
- --pf-c-jump-links__label--Display: none;
9660
- --pf-c-jump-links__label--Visibility: hidden;
9661
- }
9662
-
9663
- .pf-c-jump-links.pf-m-non-expandable-on-lg {
9664
- --pf-c-jump-links__list--Display: flex;
9665
- --pf-c-jump-links__list--Visibility: visible;
9666
- --pf-c-jump-links__toggle--Display: none;
9667
- --pf-c-jump-links__toggle--Visibility: hidden;
9668
- --pf-c-jump-links__label--Display: block;
9669
- --pf-c-jump-links__label--Visibility: visible;
9670
- }
9671
- }
9672
- @media (min-width: 1200px) {
9673
- .pf-c-jump-links.pf-m-expandable-on-xl {
9674
- --pf-c-jump-links__list--Display: none;
9675
- --pf-c-jump-links__list--Visibility: hidden;
9676
- --pf-c-jump-links__toggle--Display: block;
9677
- --pf-c-jump-links__toggle--Visibility: visible;
9678
- --pf-c-jump-links__label--Display: none;
9679
- --pf-c-jump-links__label--Visibility: hidden;
9680
- }
9681
-
9682
- .pf-c-jump-links.pf-m-non-expandable-on-xl {
9683
- --pf-c-jump-links__list--Display: flex;
9684
- --pf-c-jump-links__list--Visibility: visible;
9685
- --pf-c-jump-links__toggle--Display: none;
9686
- --pf-c-jump-links__toggle--Visibility: hidden;
9687
- --pf-c-jump-links__label--Display: block;
9688
- --pf-c-jump-links__label--Visibility: visible;
9689
- }
9690
- }
9691
- @media (min-width: 1450px) {
9692
- .pf-c-jump-links.pf-m-expandable-on-2xl {
9693
- --pf-c-jump-links__list--Display: none;
9694
- --pf-c-jump-links__list--Visibility: hidden;
9695
- --pf-c-jump-links__toggle--Display: block;
9696
- --pf-c-jump-links__toggle--Visibility: visible;
9697
- --pf-c-jump-links__label--Display: none;
9698
- --pf-c-jump-links__label--Visibility: hidden;
9699
- }
9700
-
9701
- .pf-c-jump-links.pf-m-non-expandable-on-2xl {
9702
- --pf-c-jump-links__list--Display: flex;
9703
- --pf-c-jump-links__list--Visibility: visible;
9704
- --pf-c-jump-links__toggle--Display: none;
9705
- --pf-c-jump-links__toggle--Visibility: hidden;
9706
- --pf-c-jump-links__label--Display: block;
9707
- --pf-c-jump-links__label--Visibility: visible;
9708
- }
9709
- }
9710
- .pf-c-jump-links.pf-m-expanded {
9711
- --pf-c-jump-links__list--Display: flex;
9712
- --pf-c-jump-links__list--Visibility: visible;
9713
- --pf-c-jump-links__toggle--MarginBottom: var(--pf-c-jump-links--m-expanded__toggle--MarginBottom);
9714
- --pf-c-jump-links__toggle-icon--Rotate: var(--pf-c-jump-links--m-expanded__toggle-icon--Rotate);
9715
- --pf-c-jump-links__toggle-icon--Color: var(--pf-c-jump-links--m-expanded__toggle-icon--Color);
9716
- }
9717
-
9718
- .pf-c-jump-links__list {
9719
- position: relative;
9720
- display: var(--pf-c-jump-links__list--Display);
9721
- flex-direction: var(--pf-c-jump-links__list--FlexDirection);
9722
- padding-top: var(--pf-c-jump-links__list--PaddingTop);
9723
- padding-right: var(--pf-c-jump-links__list--PaddingRight);
9724
- padding-bottom: var(--pf-c-jump-links__list--PaddingBottom);
9725
- padding-left: var(--pf-c-jump-links__list--PaddingLeft);
9726
- visibility: var(--pf-c-jump-links__list--Visibility);
9727
- }
9728
-
9729
- .pf-c-jump-links__list::before {
9730
- position: absolute;
9731
- top: 0;
9732
- right: 0;
9733
- bottom: 0;
9734
- left: 0;
9735
- pointer-events: none;
9736
- content: "";
9737
- border: solid var(--pf-c-jump-links__list--before--BorderColor);
9738
- 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);
9739
- }
9740
-
9741
- .pf-c-jump-links__list .pf-c-jump-links__list {
9742
- --pf-c-jump-links__list--PaddingTop: 0;
9743
- --pf-c-jump-links__list--PaddingBottom: 0;
9744
- --pf-c-jump-links__link--PaddingTop: var(--pf-c-jump-links__list__list__link--PaddingTop);
9745
- --pf-c-jump-links__link--PaddingBottom: var(--pf-c-jump-links__list__list__link--PaddingBottom);
9746
- --pf-c-jump-links__link--PaddingLeft: var(--pf-c-jump-links__list__list__link--PaddingLeft);
9747
- margin-top: var(--pf-c-jump-links__list__list--MarginTop);
9748
- }
9749
-
9750
- .pf-c-jump-links__link {
9751
- position: relative;
9752
- display: flex;
9753
- flex: 1;
9754
- padding-top: var(--pf-c-jump-links__link--PaddingTop);
9755
- padding-right: var(--pf-c-jump-links__link--PaddingRight);
9756
- padding-bottom: var(--pf-c-jump-links__link--PaddingBottom);
9757
- padding-left: var(--pf-c-jump-links__link--PaddingLeft);
9758
- text-decoration: none;
9759
- outline-offset: var(--pf-c-jump-links__link--OutlineOffset);
9760
- }
9761
-
9762
- .pf-c-jump-links__link:hover {
9763
- --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__link--hover__link-text--Color);
9764
- }
9765
-
9766
- .pf-c-jump-links__link:focus {
9767
- --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__link--focus__link-text--Color);
9768
- }
9769
-
9770
- .pf-c-jump-links__link::before {
9771
- position: absolute;
9772
- top: 0;
9773
- right: 0;
9774
- bottom: 0;
9775
- left: 0;
9776
- pointer-events: none;
9777
- content: "";
9778
- border-color: var(--pf-c-jump-links__link--before--BorderColor);
9779
- border-style: solid;
9780
- 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);
9781
- }
9782
-
9783
- .pf-c-jump-links__item {
9784
- --pf-c-jump-links__list--before--BorderColor: transparent;
9785
- }
9786
-
9787
- .pf-c-jump-links__item.pf-m-current > .pf-c-jump-links__link {
9788
- --pf-c-jump-links__link--before--BorderTopWidth: var(--pf-c-jump-links__item--m-current__link--before--BorderTopWidth);
9789
- --pf-c-jump-links__link--before--BorderLeftWidth: var(--pf-c-jump-links__item--m-current__link--before--BorderLeftWidth);
9790
- --pf-c-jump-links__link--before--BorderColor: var(--pf-c-jump-links__item--m-current__link--before--BorderColor);
9791
- --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__item--m-current__link-text--Color);
9792
- }
9793
-
9794
- .pf-c-jump-links__link-text {
9795
- color: var(--pf-c-jump-links__link-text--Color);
9796
- }
9797
-
9798
- .pf-c-jump-links__label {
9799
- display: var(--pf-c-jump-links__label--Display);
9800
- margin-bottom: var(--pf-c-jump-links__label--MarginBottom);
9801
- visibility: var(--pf-c-jump-links__label--Visibility);
9802
- }
9803
-
9804
- .pf-c-jump-links__main {
9805
- display: flex;
9806
- flex-direction: column;
9807
- }
9808
-
9809
- .pf-c-jump-links__toggle {
9810
- display: var(--pf-c-jump-links__toggle--Display);
9811
- margin-top: var(--pf-c-jump-links__toggle--MarginTop);
9812
- margin-bottom: var(--pf-c-jump-links__toggle--MarginBottom);
9813
- margin-left: var(--pf-c-jump-links__toggle--MarginLeft);
9814
- visibility: var(--pf-c-jump-links__toggle--Visibility);
9815
- }
9816
-
9817
- .pf-c-jump-links__toggle .pf-c-button {
9818
- display: flex;
9819
- align-items: center;
9820
- }
9821
-
9822
- .pf-c-jump-links__toggle-icon {
9823
- display: inline-block;
9824
- color: var(--pf-c-jump-links__toggle-icon--Color);
9825
- transition: var(--pf-c-jump-links__toggle-icon--Transition);
9826
- transform: rotate(var(--pf-c-jump-links__toggle-icon--Rotate));
9827
- }
9828
-
9829
- .pf-c-jump-links__toggle-text {
9830
- margin-left: var(--pf-c-jump-links__toggle-text--MarginLeft);
9831
- color: var(--pf-c-jump-links__toggle-text--Color);
9832
- }
9833
-
9834
9513
  .pf-c-sidebar {
9835
9514
  --pf-c-sidebar--BackgroundColor: var(--pf-global--BackgroundColor--100);
9836
9515
  --pf-c-sidebar__main--FlexDirection: column;
@@ -10084,218 +9763,395 @@ label.pf-c-input-group__text {
10084
9763
  --pf-c-sidebar__panel--FlexBasis: 50%;
10085
9764
  }
10086
9765
 
10087
- .pf-c-sidebar__panel.pf-m-width-66-on-lg {
10088
- --pf-c-sidebar__panel--FlexBasis: 66%;
10089
- }
9766
+ .pf-c-sidebar__panel.pf-m-width-66-on-lg {
9767
+ --pf-c-sidebar__panel--FlexBasis: 66%;
9768
+ }
9769
+
9770
+ .pf-c-sidebar__panel.pf-m-width-75-on-lg {
9771
+ --pf-c-sidebar__panel--FlexBasis: 75%;
9772
+ }
9773
+
9774
+ .pf-c-sidebar__panel.pf-m-width-100-on-lg {
9775
+ --pf-c-sidebar__panel--FlexBasis: 100%;
9776
+ }
9777
+ }
9778
+ @media (min-width: 1200px) {
9779
+ .pf-c-sidebar__panel.pf-m-width-default-on-xl {
9780
+ --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
9781
+ }
9782
+
9783
+ .pf-c-sidebar__panel.pf-m-width-25-on-xl {
9784
+ --pf-c-sidebar__panel--FlexBasis: 25%;
9785
+ }
9786
+
9787
+ .pf-c-sidebar__panel.pf-m-width-33-on-xl {
9788
+ --pf-c-sidebar__panel--FlexBasis: 33%;
9789
+ }
9790
+
9791
+ .pf-c-sidebar__panel.pf-m-width-50-on-xl {
9792
+ --pf-c-sidebar__panel--FlexBasis: 50%;
9793
+ }
9794
+
9795
+ .pf-c-sidebar__panel.pf-m-width-66-on-xl {
9796
+ --pf-c-sidebar__panel--FlexBasis: 66%;
9797
+ }
9798
+
9799
+ .pf-c-sidebar__panel.pf-m-width-75-on-xl {
9800
+ --pf-c-sidebar__panel--FlexBasis: 75%;
9801
+ }
9802
+
9803
+ .pf-c-sidebar__panel.pf-m-width-100-on-xl {
9804
+ --pf-c-sidebar__panel--FlexBasis: 100%;
9805
+ }
9806
+ }
9807
+ @media (min-width: 1450px) {
9808
+ .pf-c-sidebar__panel.pf-m-width-default-on-2xl {
9809
+ --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
9810
+ }
9811
+
9812
+ .pf-c-sidebar__panel.pf-m-width-25-on-2xl {
9813
+ --pf-c-sidebar__panel--FlexBasis: 25%;
9814
+ }
9815
+
9816
+ .pf-c-sidebar__panel.pf-m-width-33-on-2xl {
9817
+ --pf-c-sidebar__panel--FlexBasis: 33%;
9818
+ }
9819
+
9820
+ .pf-c-sidebar__panel.pf-m-width-50-on-2xl {
9821
+ --pf-c-sidebar__panel--FlexBasis: 50%;
9822
+ }
9823
+
9824
+ .pf-c-sidebar__panel.pf-m-width-66-on-2xl {
9825
+ --pf-c-sidebar__panel--FlexBasis: 66%;
9826
+ }
9827
+
9828
+ .pf-c-sidebar__panel.pf-m-width-75-on-2xl {
9829
+ --pf-c-sidebar__panel--FlexBasis: 75%;
9830
+ }
9831
+
9832
+ .pf-c-sidebar__panel.pf-m-width-100-on-2xl {
9833
+ --pf-c-sidebar__panel--FlexBasis: 100%;
9834
+ }
9835
+ }
9836
+ .pf-c-jump-links {
9837
+ --pf-c-jump-links__list--Display: flex;
9838
+ --pf-c-jump-links__list--Visibility: visible;
9839
+ --pf-c-jump-links__list--PaddingTop: 0;
9840
+ --pf-c-jump-links__list--PaddingRight: var(--pf-global--spacer--md);
9841
+ --pf-c-jump-links__list--PaddingBottom: 0;
9842
+ --pf-c-jump-links__list--PaddingLeft: var(--pf-global--spacer--md);
9843
+ --pf-c-jump-links--m-vertical__list--PaddingTop: var(--pf-global--spacer--md);
9844
+ --pf-c-jump-links--m-vertical__list--PaddingRight: 0;
9845
+ --pf-c-jump-links--m-vertical__list--PaddingBottom: var(--pf-global--spacer--md);
9846
+ --pf-c-jump-links--m-vertical__list--PaddingLeft: 0;
9847
+ --pf-c-jump-links__list--FlexDirection: row;
9848
+ --pf-c-jump-links--m-vertical__list--FlexDirection: column;
9849
+ --pf-c-jump-links__list--before--BorderColor: var(--pf-global--BorderColor--100);
9850
+ --pf-c-jump-links__list--before--BorderTopWidth: var(--pf-global--BorderWidth--sm);
9851
+ --pf-c-jump-links__list--before--BorderRightWidth: 0;
9852
+ --pf-c-jump-links__list--before--BorderBottomWidth: 0;
9853
+ --pf-c-jump-links__list--before--BorderLeftWidth: 0;
9854
+ --pf-c-jump-links--m-vertical__list--before--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
9855
+ --pf-c-jump-links--m-vertical__list--before--BorderTopWidth: 0;
9856
+ --pf-c-jump-links__list__list--MarginTop: calc(var(--pf-global--spacer--sm) * -1);
9857
+ --pf-c-jump-links__link--PaddingTop: var(--pf-global--spacer--md);
9858
+ --pf-c-jump-links__link--PaddingRight: var(--pf-global--spacer--md);
9859
+ --pf-c-jump-links__link--PaddingBottom: var(--pf-global--spacer--md);
9860
+ --pf-c-jump-links__link--PaddingLeft: var(--pf-global--spacer--md);
9861
+ --pf-c-jump-links__list__list__link--PaddingTop: var(--pf-global--spacer--sm);
9862
+ --pf-c-jump-links__list__list__link--PaddingLeft: var(--pf-global--spacer--lg);
9863
+ --pf-c-jump-links__list__list__link--PaddingBottom: var(--pf-global--spacer--sm);
9864
+ --pf-c-jump-links__link--OutlineOffset: calc(-1 * var(--pf-global--spacer--sm));
9865
+ --pf-c-jump-links__link--before--BorderTopWidth: 0;
9866
+ --pf-c-jump-links__link--before--BorderRightWidth: 0;
9867
+ --pf-c-jump-links__link--before--BorderBottomWidth: 0;
9868
+ --pf-c-jump-links__link--before--BorderLeftWidth: 0;
9869
+ --pf-c-jump-links__link--before--BorderColor: transparent;
9870
+ --pf-c-jump-links__item--m-current__link--before--BorderTopWidth: var(--pf-global--BorderWidth--lg);
9871
+ --pf-c-jump-links__item--m-current__link--before--BorderLeftWidth: 0;
9872
+ --pf-c-jump-links__item--m-current__link--before--BorderColor: var(--pf-global--primary-color--100);
9873
+ --pf-c-jump-links--m-vertical__item--m-current__link--before--BorderTopWidth: 0;
9874
+ --pf-c-jump-links--m-vertical__item--m-current__link--before--BorderLeftWidth: var(--pf-global--BorderWidth--lg);
9875
+ --pf-c-jump-links__link-text--Color: var(--pf-global--Color--200);
9876
+ --pf-c-jump-links__link--hover__link-text--Color: var(--pf-global--Color--100);
9877
+ --pf-c-jump-links__link--focus__link-text--Color: var(--pf-global--Color--100);
9878
+ --pf-c-jump-links__item--m-current__link-text--Color: var(--pf-global--Color--100);
9879
+ --pf-c-jump-links__label--MarginBottom: var(--pf-global--spacer--md);
9880
+ --pf-c-jump-links__label--Display: block;
9881
+ --pf-c-jump-links__label--Visibility: visible;
9882
+ --pf-c-jump-links__toggle--MarginTop: calc(-1 * var(--pf-global--spacer--form-element));
9883
+ --pf-c-jump-links__toggle--MarginBottom--base: calc(-1 * var(--pf-global--spacer--form-element));
9884
+ --pf-c-jump-links__toggle--MarginBottom: var(--pf-c-jump-links__toggle--MarginBottom--base);
9885
+ --pf-c-jump-links--m-expanded__toggle--MarginBottom: calc(var(--pf-c-jump-links__toggle--MarginBottom--base) + var(--pf-global--spacer--md));
9886
+ --pf-c-jump-links__toggle--MarginLeft: calc(-1 * var(--pf-global--spacer--md));
9887
+ --pf-c-jump-links__toggle--Display: none;
9888
+ --pf-c-jump-links__toggle--Visibility: hidden;
9889
+ --pf-c-jump-links__toggle-icon--Color: currentcolor;
9890
+ --pf-c-jump-links__toggle-icon--Transition: var(--pf-global--Transition);
9891
+ --pf-c-jump-links__toggle-icon--Rotate: 0;
9892
+ --pf-c-jump-links--m-expanded__toggle-icon--Color: var(--pf-global--Color--100);
9893
+ --pf-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
9894
+ --pf-c-jump-links__toggle-text--MarginLeft: var(--pf-global--spacer--md);
9895
+ --pf-c-jump-links__toggle-text--Color: var(--pf-global--Color--100);
9896
+ display: flex;
9897
+ }
9898
+
9899
+ .pf-c-jump-links.pf-m-center {
9900
+ justify-content: center;
9901
+ }
10090
9902
 
10091
- .pf-c-sidebar__panel.pf-m-width-75-on-lg {
10092
- --pf-c-sidebar__panel--FlexBasis: 75%;
10093
- }
9903
+ .pf-c-jump-links.pf-m-center .pf-c-jump-links__main {
9904
+ align-items: center;
9905
+ }
10094
9906
 
10095
- .pf-c-sidebar__panel.pf-m-width-100-on-lg {
10096
- --pf-c-sidebar__panel--FlexBasis: 100%;
10097
- }
9907
+ .pf-c-jump-links.pf-m-vertical, .pf-c-jump-links.pf-m-expandable {
9908
+ --pf-c-jump-links__list--PaddingTop: var(--pf-c-jump-links--m-vertical__list--PaddingTop);
9909
+ --pf-c-jump-links__list--PaddingRight: var(--pf-c-jump-links--m-vertical__list--PaddingRight);
9910
+ --pf-c-jump-links__list--PaddingBottom: var(--pf-c-jump-links--m-vertical__list--PaddingBottom);
9911
+ --pf-c-jump-links__list--PaddingLeft: var(--pf-c-jump-links--m-vertical__list--PaddingLeft);
9912
+ --pf-c-jump-links__list--before--BorderTopWidth: var(--pf-c-jump-links--m-vertical__list--before--BorderTopWidth);
9913
+ --pf-c-jump-links__list--before--BorderLeftWidth: var(--pf-c-jump-links--m-vertical__list--before--BorderLeftWidth);
9914
+ --pf-c-jump-links__item--m-current__link--before--BorderTopWidth: var(--pf-c-jump-links--m-vertical__item--m-current__link--before--BorderTopWidth);
9915
+ --pf-c-jump-links__item--m-current__link--before--BorderLeftWidth: var(--pf-c-jump-links--m-vertical__item--m-current__link--before--BorderLeftWidth);
9916
+ --pf-c-jump-links__list--FlexDirection: var(--pf-c-jump-links--m-vertical__list--FlexDirection);
9917
+ flex-direction: column;
10098
9918
  }
10099
- @media (min-width: 1200px) {
10100
- .pf-c-sidebar__panel.pf-m-width-default-on-xl {
10101
- --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
10102
- }
10103
9919
 
10104
- .pf-c-sidebar__panel.pf-m-width-25-on-xl {
10105
- --pf-c-sidebar__panel--FlexBasis: 25%;
10106
- }
9920
+ .pf-c-jump-links.pf-m-expandable {
9921
+ --pf-c-jump-links__list--Display: none;
9922
+ --pf-c-jump-links__list--Visibility: hidden;
9923
+ --pf-c-jump-links__toggle--Display: block;
9924
+ --pf-c-jump-links__toggle--Visibility: visible;
9925
+ --pf-c-jump-links__label--Display: none;
9926
+ --pf-c-jump-links__label--Visibility: hidden;
9927
+ }
10107
9928
 
10108
- .pf-c-sidebar__panel.pf-m-width-33-on-xl {
10109
- --pf-c-sidebar__panel--FlexBasis: 33%;
10110
- }
9929
+ .pf-c-jump-links.pf-m-non-expandable {
9930
+ --pf-c-jump-links__list--Display: flex;
9931
+ --pf-c-jump-links__list--Visibility: visible;
9932
+ --pf-c-jump-links__toggle--Display: none;
9933
+ --pf-c-jump-links__toggle--Visibility: hidden;
9934
+ --pf-c-jump-links__label--Display: block;
9935
+ --pf-c-jump-links__label--Visibility: visible;
9936
+ }
10111
9937
 
10112
- .pf-c-sidebar__panel.pf-m-width-50-on-xl {
10113
- --pf-c-sidebar__panel--FlexBasis: 50%;
9938
+ @media (min-width: 576px) {
9939
+ .pf-c-jump-links.pf-m-expandable-on-sm {
9940
+ --pf-c-jump-links__list--Display: none;
9941
+ --pf-c-jump-links__list--Visibility: hidden;
9942
+ --pf-c-jump-links__toggle--Display: block;
9943
+ --pf-c-jump-links__toggle--Visibility: visible;
9944
+ --pf-c-jump-links__label--Display: none;
9945
+ --pf-c-jump-links__label--Visibility: hidden;
10114
9946
  }
10115
9947
 
10116
- .pf-c-sidebar__panel.pf-m-width-66-on-xl {
10117
- --pf-c-sidebar__panel--FlexBasis: 66%;
9948
+ .pf-c-jump-links.pf-m-non-expandable-on-sm {
9949
+ --pf-c-jump-links__list--Display: flex;
9950
+ --pf-c-jump-links__list--Visibility: visible;
9951
+ --pf-c-jump-links__toggle--Display: none;
9952
+ --pf-c-jump-links__toggle--Visibility: hidden;
9953
+ --pf-c-jump-links__label--Display: block;
9954
+ --pf-c-jump-links__label--Visibility: visible;
10118
9955
  }
10119
-
10120
- .pf-c-sidebar__panel.pf-m-width-75-on-xl {
10121
- --pf-c-sidebar__panel--FlexBasis: 75%;
9956
+ }
9957
+ @media (min-width: 768px) {
9958
+ .pf-c-jump-links.pf-m-expandable-on-md {
9959
+ --pf-c-jump-links__list--Display: none;
9960
+ --pf-c-jump-links__list--Visibility: hidden;
9961
+ --pf-c-jump-links__toggle--Display: block;
9962
+ --pf-c-jump-links__toggle--Visibility: visible;
9963
+ --pf-c-jump-links__label--Display: none;
9964
+ --pf-c-jump-links__label--Visibility: hidden;
10122
9965
  }
10123
9966
 
10124
- .pf-c-sidebar__panel.pf-m-width-100-on-xl {
10125
- --pf-c-sidebar__panel--FlexBasis: 100%;
9967
+ .pf-c-jump-links.pf-m-non-expandable-on-md {
9968
+ --pf-c-jump-links__list--Display: flex;
9969
+ --pf-c-jump-links__list--Visibility: visible;
9970
+ --pf-c-jump-links__toggle--Display: none;
9971
+ --pf-c-jump-links__toggle--Visibility: hidden;
9972
+ --pf-c-jump-links__label--Display: block;
9973
+ --pf-c-jump-links__label--Visibility: visible;
10126
9974
  }
10127
9975
  }
10128
- @media (min-width: 1450px) {
10129
- .pf-c-sidebar__panel.pf-m-width-default-on-2xl {
10130
- --pf-c-sidebar__panel--FlexBasis: var(--pf-c-sidebar__panel--FlexBasis--base);
9976
+ @media (min-width: 992px) {
9977
+ .pf-c-jump-links.pf-m-expandable-on-lg {
9978
+ --pf-c-jump-links__list--Display: none;
9979
+ --pf-c-jump-links__list--Visibility: hidden;
9980
+ --pf-c-jump-links__toggle--Display: block;
9981
+ --pf-c-jump-links__toggle--Visibility: visible;
9982
+ --pf-c-jump-links__label--Display: none;
9983
+ --pf-c-jump-links__label--Visibility: hidden;
10131
9984
  }
10132
9985
 
10133
- .pf-c-sidebar__panel.pf-m-width-25-on-2xl {
10134
- --pf-c-sidebar__panel--FlexBasis: 25%;
9986
+ .pf-c-jump-links.pf-m-non-expandable-on-lg {
9987
+ --pf-c-jump-links__list--Display: flex;
9988
+ --pf-c-jump-links__list--Visibility: visible;
9989
+ --pf-c-jump-links__toggle--Display: none;
9990
+ --pf-c-jump-links__toggle--Visibility: hidden;
9991
+ --pf-c-jump-links__label--Display: block;
9992
+ --pf-c-jump-links__label--Visibility: visible;
10135
9993
  }
10136
-
10137
- .pf-c-sidebar__panel.pf-m-width-33-on-2xl {
10138
- --pf-c-sidebar__panel--FlexBasis: 33%;
9994
+ }
9995
+ @media (min-width: 1200px) {
9996
+ .pf-c-jump-links.pf-m-expandable-on-xl {
9997
+ --pf-c-jump-links__list--Display: none;
9998
+ --pf-c-jump-links__list--Visibility: hidden;
9999
+ --pf-c-jump-links__toggle--Display: block;
10000
+ --pf-c-jump-links__toggle--Visibility: visible;
10001
+ --pf-c-jump-links__label--Display: none;
10002
+ --pf-c-jump-links__label--Visibility: hidden;
10139
10003
  }
10140
10004
 
10141
- .pf-c-sidebar__panel.pf-m-width-50-on-2xl {
10142
- --pf-c-sidebar__panel--FlexBasis: 50%;
10005
+ .pf-c-jump-links.pf-m-non-expandable-on-xl {
10006
+ --pf-c-jump-links__list--Display: flex;
10007
+ --pf-c-jump-links__list--Visibility: visible;
10008
+ --pf-c-jump-links__toggle--Display: none;
10009
+ --pf-c-jump-links__toggle--Visibility: hidden;
10010
+ --pf-c-jump-links__label--Display: block;
10011
+ --pf-c-jump-links__label--Visibility: visible;
10143
10012
  }
10144
-
10145
- .pf-c-sidebar__panel.pf-m-width-66-on-2xl {
10146
- --pf-c-sidebar__panel--FlexBasis: 66%;
10013
+ }
10014
+ @media (min-width: 1450px) {
10015
+ .pf-c-jump-links.pf-m-expandable-on-2xl {
10016
+ --pf-c-jump-links__list--Display: none;
10017
+ --pf-c-jump-links__list--Visibility: hidden;
10018
+ --pf-c-jump-links__toggle--Display: block;
10019
+ --pf-c-jump-links__toggle--Visibility: visible;
10020
+ --pf-c-jump-links__label--Display: none;
10021
+ --pf-c-jump-links__label--Visibility: hidden;
10147
10022
  }
10148
10023
 
10149
- .pf-c-sidebar__panel.pf-m-width-75-on-2xl {
10150
- --pf-c-sidebar__panel--FlexBasis: 75%;
10024
+ .pf-c-jump-links.pf-m-non-expandable-on-2xl {
10025
+ --pf-c-jump-links__list--Display: flex;
10026
+ --pf-c-jump-links__list--Visibility: visible;
10027
+ --pf-c-jump-links__toggle--Display: none;
10028
+ --pf-c-jump-links__toggle--Visibility: hidden;
10029
+ --pf-c-jump-links__label--Display: block;
10030
+ --pf-c-jump-links__label--Visibility: visible;
10151
10031
  }
10032
+ }
10033
+ .pf-c-jump-links.pf-m-expanded {
10034
+ --pf-c-jump-links__list--Display: flex;
10035
+ --pf-c-jump-links__list--Visibility: visible;
10036
+ --pf-c-jump-links__toggle--MarginBottom: var(--pf-c-jump-links--m-expanded__toggle--MarginBottom);
10037
+ --pf-c-jump-links__toggle-icon--Rotate: var(--pf-c-jump-links--m-expanded__toggle-icon--Rotate);
10038
+ --pf-c-jump-links__toggle-icon--Color: var(--pf-c-jump-links--m-expanded__toggle-icon--Color);
10039
+ }
10152
10040
 
10153
- .pf-c-sidebar__panel.pf-m-width-100-on-2xl {
10154
- --pf-c-sidebar__panel--FlexBasis: 100%;
10155
- }
10041
+ .pf-c-jump-links__list {
10042
+ position: relative;
10043
+ display: var(--pf-c-jump-links__list--Display);
10044
+ flex-direction: var(--pf-c-jump-links__list--FlexDirection);
10045
+ padding-top: var(--pf-c-jump-links__list--PaddingTop);
10046
+ padding-right: var(--pf-c-jump-links__list--PaddingRight);
10047
+ padding-bottom: var(--pf-c-jump-links__list--PaddingBottom);
10048
+ padding-left: var(--pf-c-jump-links__list--PaddingLeft);
10049
+ visibility: var(--pf-c-jump-links__list--Visibility);
10156
10050
  }
10157
- .pf-c-label-group {
10158
- --pf-c-label-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
10159
- --pf-c-label-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
10160
- --pf-c-label-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
10161
- --pf-c-label-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
10162
- --pf-c-label-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
10163
- --pf-c-label-group--m-category--PaddingLeft: var(--pf-global--spacer--sm);
10164
- --pf-c-label-group--m-vertical--m-category--PaddingRight: var(--pf-global--spacer--sm);
10165
- --pf-c-label-group--m-category--BorderRadius: var(--pf-global--BorderRadius--sm);
10166
- --pf-c-label-group--m-category--BorderWidth: var(--pf-global--BorderWidth--sm);
10167
- --pf-c-label-group--m-category--BorderColor: var(--pf-global--BorderColor--300);
10168
- --pf-c-label-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--100);
10169
- --pf-c-label-group__label--MarginRight: var(--pf-global--spacer--sm);
10170
- --pf-c-label-group__label--MarginBottom: 0;
10171
- --pf-c-label-group--m-vertical__label--MarginBottom: var(--pf-global--spacer--sm);
10172
- --pf-c-label-group__label--FontSize: var(--pf-global--FontSize--sm);
10173
- --pf-c-label-group__label--MaxWidth: 18ch;
10174
- --pf-c-label-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
10175
- --pf-c-label-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
10176
- --pf-c-label-group--m-vertical__close--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
10177
- --pf-c-label-group--m-vertical__close--MarginRight: calc(var(--pf-global--spacer--form-element) * -1);
10178
- --pf-c-label-group--m-vertical__close--MarginLeft: var(--pf-global--spacer--sm);
10179
- --pf-c-label-group--m-vertical__close--c-button--PaddingRight: var(--pf-global--spacer--sm);
10180
- --pf-c-label-group--m-vertical__close--c-button--PaddingLeft: var(--pf-global--spacer--sm);
10181
- --pf-c-label-group__list-item--MarginRight: var(--pf-global--spacer--xs);
10182
- --pf-c-label-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
10183
- --pf-c-label-group__textarea--MinWidth: 12.5rem;
10184
- --pf-c-label-group__textarea--PaddingTop: 0.125rem;
10185
- --pf-c-label-group__textarea--PaddingRight: var(--pf-global--spacer--xs);
10186
- --pf-c-label-group__textarea--PaddingBottom: 0;
10187
- --pf-c-label-group__textarea--PaddingLeft: var(--pf-global--spacer--xs);
10188
- display: inline-flex;
10189
- align-items: center;
10051
+
10052
+ .pf-c-jump-links__list::before {
10053
+ position: absolute;
10054
+ top: 0;
10055
+ right: 0;
10056
+ bottom: 0;
10057
+ left: 0;
10058
+ pointer-events: none;
10059
+ content: "";
10060
+ border: solid var(--pf-c-jump-links__list--before--BorderColor);
10061
+ 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);
10190
10062
  }
10191
10063
 
10192
- .pf-c-label-group.pf-m-category {
10193
- padding-top: var(--pf-c-label-group--m-category--PaddingTop);
10194
- padding-right: var(--pf-c-label-group--m-category--PaddingRight);
10195
- padding-bottom: var(--pf-c-label-group--m-category--PaddingBottom);
10196
- padding-left: var(--pf-c-label-group--m-category--PaddingLeft);
10197
- background-color: var(--pf-c-label-group--m-category--BackgroundColor);
10198
- border: var(--pf-c-label-group--m-category--BorderWidth) solid var(--pf-c-label-group--m-category--BorderColor);
10199
- border-radius: var(--pf-c-label-group--m-category--BorderRadius);
10064
+ .pf-c-jump-links__list .pf-c-jump-links__list {
10065
+ --pf-c-jump-links__list--PaddingTop: 0;
10066
+ --pf-c-jump-links__list--PaddingBottom: 0;
10067
+ --pf-c-jump-links__link--PaddingTop: var(--pf-c-jump-links__list__list__link--PaddingTop);
10068
+ --pf-c-jump-links__link--PaddingBottom: var(--pf-c-jump-links__list__list__link--PaddingBottom);
10069
+ --pf-c-jump-links__link--PaddingLeft: var(--pf-c-jump-links__list__list__link--PaddingLeft);
10070
+ margin-top: var(--pf-c-jump-links__list__list--MarginTop);
10200
10071
  }
10201
10072
 
10202
- .pf-c-label-group.pf-m-vertical {
10203
- --pf-c-label-group__list--MarginRight: 0;
10204
- --pf-c-label-group__list--MarginBottom: 0;
10205
- --pf-c-label-group__list-item--MarginRight: 0;
10206
- --pf-c-label-group__label--MarginRight: 0;
10207
- --pf-c-label-group__label--MarginBottom: var(--pf-c-label-group--m-vertical__label--MarginBottom);
10208
- --pf-c-label-group__close--MarginTop: var(--pf-c-label-group--m-vertical__close--MarginTop);
10209
- --pf-c-label-group__close--MarginLeft: var(--pf-c-label-group--m-vertical__close--MarginLeft);
10210
- --pf-c-label-group__close--MarginBottom: 0;
10211
- --pf-c-label-group__close--MarginRight: var(--pf-c-label-group--m-vertical__close--MarginRight);
10212
- --pf-c-label-group--m-category--PaddingRight: var(--pf-c-label-group--m-vertical--m-category--PaddingRight);
10073
+ .pf-c-jump-links__link {
10074
+ position: relative;
10075
+ display: flex;
10076
+ flex: 1;
10077
+ padding-top: var(--pf-c-jump-links__link--PaddingTop);
10078
+ padding-right: var(--pf-c-jump-links__link--PaddingRight);
10079
+ padding-bottom: var(--pf-c-jump-links__link--PaddingBottom);
10080
+ padding-left: var(--pf-c-jump-links__link--PaddingLeft);
10081
+ text-decoration: none;
10082
+ outline-offset: var(--pf-c-jump-links__link--OutlineOffset);
10213
10083
  }
10214
10084
 
10215
- .pf-c-label-group.pf-m-vertical.pf-c-label-group {
10216
- align-items: flex-start;
10085
+ .pf-c-jump-links__link:hover {
10086
+ --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__link--hover__link-text--Color);
10217
10087
  }
10218
10088
 
10219
- .pf-c-label-group.pf-m-vertical .pf-c-label-group__list {
10220
- flex-direction: column;
10221
- align-items: flex-start;
10089
+ .pf-c-jump-links__link:focus {
10090
+ --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__link--focus__link-text--Color);
10222
10091
  }
10223
10092
 
10224
- .pf-c-label-group.pf-m-vertical .pf-c-label-group__main {
10225
- flex-direction: column;
10093
+ .pf-c-jump-links__link::before {
10094
+ position: absolute;
10095
+ top: 0;
10096
+ right: 0;
10097
+ bottom: 0;
10098
+ left: 0;
10099
+ pointer-events: none;
10100
+ content: "";
10101
+ border-color: var(--pf-c-jump-links__link--before--BorderColor);
10102
+ border-style: solid;
10103
+ 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);
10226
10104
  }
10227
10105
 
10228
- .pf-c-label-group.pf-m-vertical .pf-c-label-group__list-item:last-child {
10229
- --pf-c-label-group__list-item--MarginBottom: 0;
10106
+ .pf-c-jump-links__item {
10107
+ --pf-c-jump-links__list--before--BorderColor: transparent;
10230
10108
  }
10231
10109
 
10232
- .pf-c-label-group.pf-m-vertical .pf-c-label-group__close .pf-c-button {
10233
- --pf-c-button--PaddingLeft: var(--pf-c-label-group--m-vertical__close--c-button--PaddingLeft);
10234
- --pf-c-button--PaddingRight: var(--pf-c-label-group--m-vertical__close--c-button--PaddingRight);
10110
+ .pf-c-jump-links__item.pf-m-current > .pf-c-jump-links__link {
10111
+ --pf-c-jump-links__link--before--BorderTopWidth: var(--pf-c-jump-links__item--m-current__link--before--BorderTopWidth);
10112
+ --pf-c-jump-links__link--before--BorderLeftWidth: var(--pf-c-jump-links__item--m-current__link--before--BorderLeftWidth);
10113
+ --pf-c-jump-links__link--before--BorderColor: var(--pf-c-jump-links__item--m-current__link--before--BorderColor);
10114
+ --pf-c-jump-links__link-text--Color: var(--pf-c-jump-links__item--m-current__link-text--Color);
10235
10115
  }
10236
10116
 
10237
- .pf-c-label-group.pf-m-editable,
10238
- .pf-c-label-group.pf-m-editable .pf-c-label-group__main,
10239
- .pf-c-label-group.pf-m-editable .pf-c-label-group__list {
10240
- display: flex;
10117
+ .pf-c-jump-links__link-text {
10118
+ color: var(--pf-c-jump-links__link-text--Color);
10241
10119
  }
10242
10120
 
10243
- .pf-c-label-group.pf-m-editable .pf-c-label-group__main,
10244
- .pf-c-label-group.pf-m-editable .pf-c-label-group__list,
10245
- .pf-c-label-group.pf-m-editable .pf-c-label-group__list-item.pf-m-textarea,
10246
- .pf-c-label-group.pf-m-editable .pf-c-label-group__textarea {
10247
- flex: 1;
10121
+ .pf-c-jump-links__label {
10122
+ display: var(--pf-c-jump-links__label--Display);
10123
+ margin-bottom: var(--pf-c-jump-links__label--MarginBottom);
10124
+ visibility: var(--pf-c-jump-links__label--Visibility);
10248
10125
  }
10249
10126
 
10250
- .pf-c-label-group__main {
10127
+ .pf-c-jump-links__main {
10251
10128
  display: flex;
10252
- flex: 1;
10253
- flex-wrap: wrap;
10254
- align-items: baseline;
10255
- }
10256
-
10257
- .pf-c-label-group__list {
10258
- display: inline-flex;
10259
- flex-wrap: wrap;
10260
- margin-right: var(--pf-c-label-group__list--MarginRight);
10261
- margin-bottom: var(--pf-c-label-group__list--MarginBottom);
10262
- }
10263
-
10264
- .pf-c-label-group__list-item {
10265
- display: inline-flex;
10266
- margin-right: var(--pf-c-label-group__list-item--MarginRight);
10267
- margin-bottom: var(--pf-c-label-group__list-item--MarginBottom);
10129
+ flex-direction: column;
10268
10130
  }
10269
10131
 
10270
- .pf-c-label-group__label {
10271
- overflow: hidden;
10272
- text-overflow: ellipsis;
10273
- white-space: nowrap;
10274
- max-width: var(--pf-c-label-group__label--MaxWidth);
10275
- margin-right: var(--pf-c-label-group__label--MarginRight);
10276
- margin-bottom: var(--pf-c-label-group__label--MarginBottom);
10277
- font-size: var(--pf-c-label-group__label--FontSize);
10132
+ .pf-c-jump-links__toggle {
10133
+ display: var(--pf-c-jump-links__toggle--Display);
10134
+ margin-top: var(--pf-c-jump-links__toggle--MarginTop);
10135
+ margin-bottom: var(--pf-c-jump-links__toggle--MarginBottom);
10136
+ margin-left: var(--pf-c-jump-links__toggle--MarginLeft);
10137
+ visibility: var(--pf-c-jump-links__toggle--Visibility);
10278
10138
  }
10279
10139
 
10280
- .pf-c-label-group__close {
10281
- margin-top: var(--pf-c-label-group__close--MarginTop);
10282
- margin-right: var(--pf-c-label-group__close--MarginRight);
10283
- margin-bottom: var(--pf-c-label-group__close--MarginBottom);
10284
- margin-left: var(--pf-c-label-group__close--MarginLeft);
10140
+ .pf-c-jump-links__toggle .pf-c-button {
10141
+ display: flex;
10142
+ align-items: center;
10285
10143
  }
10286
10144
 
10287
- .pf-c-label-group__textarea {
10288
- min-width: var(--pf-c-label-group__textarea--MinWidth);
10289
- padding: var(--pf-c-label-group__textarea--PaddingTop) var(--pf-c-label-group__textarea--PaddingRight) var(--pf-c-label-group__textarea--PaddingBottom) var(--pf-c-label-group__textarea--PaddingLeft);
10290
- white-space: nowrap;
10291
- resize: none;
10292
- border: 0;
10293
- -ms-overflow-style: none;
10294
- scrollbar-width: none;
10145
+ .pf-c-jump-links__toggle-icon {
10146
+ display: inline-block;
10147
+ color: var(--pf-c-jump-links__toggle-icon--Color);
10148
+ transition: var(--pf-c-jump-links__toggle-icon--Transition);
10149
+ transform: rotate(var(--pf-c-jump-links__toggle-icon--Rotate));
10295
10150
  }
10296
10151
 
10297
- .pf-c-label-group__textarea::-webkit-scrollbar {
10298
- display: none;
10152
+ .pf-c-jump-links__toggle-text {
10153
+ margin-left: var(--pf-c-jump-links__toggle-text--MarginLeft);
10154
+ color: var(--pf-c-jump-links__toggle-text--Color);
10299
10155
  }
10300
10156
 
10301
10157
  .pf-c-label {
@@ -10761,6 +10617,150 @@ button.pf-c-label__content:focus {
10761
10617
  --pf-c-label--m-outline--m-cyan__content--link--focus--before--BorderColor: var(--pf-global--palette--cyan-100);
10762
10618
  }
10763
10619
 
10620
+ .pf-c-label-group {
10621
+ --pf-c-label-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
10622
+ --pf-c-label-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
10623
+ --pf-c-label-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
10624
+ --pf-c-label-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
10625
+ --pf-c-label-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
10626
+ --pf-c-label-group--m-category--PaddingLeft: var(--pf-global--spacer--sm);
10627
+ --pf-c-label-group--m-vertical--m-category--PaddingRight: var(--pf-global--spacer--sm);
10628
+ --pf-c-label-group--m-category--BorderRadius: var(--pf-global--BorderRadius--sm);
10629
+ --pf-c-label-group--m-category--BorderWidth: var(--pf-global--BorderWidth--sm);
10630
+ --pf-c-label-group--m-category--BorderColor: var(--pf-global--BorderColor--300);
10631
+ --pf-c-label-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--100);
10632
+ --pf-c-label-group__label--MarginRight: var(--pf-global--spacer--sm);
10633
+ --pf-c-label-group__label--MarginBottom: 0;
10634
+ --pf-c-label-group--m-vertical__label--MarginBottom: var(--pf-global--spacer--sm);
10635
+ --pf-c-label-group__label--FontSize: var(--pf-global--FontSize--sm);
10636
+ --pf-c-label-group__label--MaxWidth: 18ch;
10637
+ --pf-c-label-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
10638
+ --pf-c-label-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
10639
+ --pf-c-label-group--m-vertical__close--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
10640
+ --pf-c-label-group--m-vertical__close--MarginRight: calc(var(--pf-global--spacer--form-element) * -1);
10641
+ --pf-c-label-group--m-vertical__close--MarginLeft: var(--pf-global--spacer--sm);
10642
+ --pf-c-label-group--m-vertical__close--c-button--PaddingRight: var(--pf-global--spacer--sm);
10643
+ --pf-c-label-group--m-vertical__close--c-button--PaddingLeft: var(--pf-global--spacer--sm);
10644
+ --pf-c-label-group__list-item--MarginRight: var(--pf-global--spacer--xs);
10645
+ --pf-c-label-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
10646
+ --pf-c-label-group__textarea--MinWidth: 12.5rem;
10647
+ --pf-c-label-group__textarea--PaddingTop: 0.125rem;
10648
+ --pf-c-label-group__textarea--PaddingRight: var(--pf-global--spacer--xs);
10649
+ --pf-c-label-group__textarea--PaddingBottom: 0;
10650
+ --pf-c-label-group__textarea--PaddingLeft: var(--pf-global--spacer--xs);
10651
+ display: inline-flex;
10652
+ align-items: center;
10653
+ }
10654
+
10655
+ .pf-c-label-group.pf-m-category {
10656
+ padding-top: var(--pf-c-label-group--m-category--PaddingTop);
10657
+ padding-right: var(--pf-c-label-group--m-category--PaddingRight);
10658
+ padding-bottom: var(--pf-c-label-group--m-category--PaddingBottom);
10659
+ padding-left: var(--pf-c-label-group--m-category--PaddingLeft);
10660
+ background-color: var(--pf-c-label-group--m-category--BackgroundColor);
10661
+ border: var(--pf-c-label-group--m-category--BorderWidth) solid var(--pf-c-label-group--m-category--BorderColor);
10662
+ border-radius: var(--pf-c-label-group--m-category--BorderRadius);
10663
+ }
10664
+
10665
+ .pf-c-label-group.pf-m-vertical {
10666
+ --pf-c-label-group__list--MarginRight: 0;
10667
+ --pf-c-label-group__list--MarginBottom: 0;
10668
+ --pf-c-label-group__list-item--MarginRight: 0;
10669
+ --pf-c-label-group__label--MarginRight: 0;
10670
+ --pf-c-label-group__label--MarginBottom: var(--pf-c-label-group--m-vertical__label--MarginBottom);
10671
+ --pf-c-label-group__close--MarginTop: var(--pf-c-label-group--m-vertical__close--MarginTop);
10672
+ --pf-c-label-group__close--MarginLeft: var(--pf-c-label-group--m-vertical__close--MarginLeft);
10673
+ --pf-c-label-group__close--MarginBottom: 0;
10674
+ --pf-c-label-group__close--MarginRight: var(--pf-c-label-group--m-vertical__close--MarginRight);
10675
+ --pf-c-label-group--m-category--PaddingRight: var(--pf-c-label-group--m-vertical--m-category--PaddingRight);
10676
+ }
10677
+
10678
+ .pf-c-label-group.pf-m-vertical.pf-c-label-group {
10679
+ align-items: flex-start;
10680
+ }
10681
+
10682
+ .pf-c-label-group.pf-m-vertical .pf-c-label-group__list {
10683
+ flex-direction: column;
10684
+ align-items: flex-start;
10685
+ }
10686
+
10687
+ .pf-c-label-group.pf-m-vertical .pf-c-label-group__main {
10688
+ flex-direction: column;
10689
+ }
10690
+
10691
+ .pf-c-label-group.pf-m-vertical .pf-c-label-group__list-item:last-child {
10692
+ --pf-c-label-group__list-item--MarginBottom: 0;
10693
+ }
10694
+
10695
+ .pf-c-label-group.pf-m-vertical .pf-c-label-group__close .pf-c-button {
10696
+ --pf-c-button--PaddingLeft: var(--pf-c-label-group--m-vertical__close--c-button--PaddingLeft);
10697
+ --pf-c-button--PaddingRight: var(--pf-c-label-group--m-vertical__close--c-button--PaddingRight);
10698
+ }
10699
+
10700
+ .pf-c-label-group.pf-m-editable,
10701
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__main,
10702
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__list {
10703
+ display: flex;
10704
+ }
10705
+
10706
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__main,
10707
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__list,
10708
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__list-item.pf-m-textarea,
10709
+ .pf-c-label-group.pf-m-editable .pf-c-label-group__textarea {
10710
+ flex: 1;
10711
+ }
10712
+
10713
+ .pf-c-label-group__main {
10714
+ display: flex;
10715
+ flex: 1;
10716
+ flex-wrap: wrap;
10717
+ align-items: baseline;
10718
+ }
10719
+
10720
+ .pf-c-label-group__list {
10721
+ display: inline-flex;
10722
+ flex-wrap: wrap;
10723
+ margin-right: var(--pf-c-label-group__list--MarginRight);
10724
+ margin-bottom: var(--pf-c-label-group__list--MarginBottom);
10725
+ }
10726
+
10727
+ .pf-c-label-group__list-item {
10728
+ display: inline-flex;
10729
+ margin-right: var(--pf-c-label-group__list-item--MarginRight);
10730
+ margin-bottom: var(--pf-c-label-group__list-item--MarginBottom);
10731
+ }
10732
+
10733
+ .pf-c-label-group__label {
10734
+ overflow: hidden;
10735
+ text-overflow: ellipsis;
10736
+ white-space: nowrap;
10737
+ max-width: var(--pf-c-label-group__label--MaxWidth);
10738
+ margin-right: var(--pf-c-label-group__label--MarginRight);
10739
+ margin-bottom: var(--pf-c-label-group__label--MarginBottom);
10740
+ font-size: var(--pf-c-label-group__label--FontSize);
10741
+ }
10742
+
10743
+ .pf-c-label-group__close {
10744
+ margin-top: var(--pf-c-label-group__close--MarginTop);
10745
+ margin-right: var(--pf-c-label-group__close--MarginRight);
10746
+ margin-bottom: var(--pf-c-label-group__close--MarginBottom);
10747
+ margin-left: var(--pf-c-label-group__close--MarginLeft);
10748
+ }
10749
+
10750
+ .pf-c-label-group__textarea {
10751
+ min-width: var(--pf-c-label-group__textarea--MinWidth);
10752
+ padding: var(--pf-c-label-group__textarea--PaddingTop) var(--pf-c-label-group__textarea--PaddingRight) var(--pf-c-label-group__textarea--PaddingBottom) var(--pf-c-label-group__textarea--PaddingLeft);
10753
+ white-space: nowrap;
10754
+ resize: none;
10755
+ border: 0;
10756
+ -ms-overflow-style: none;
10757
+ scrollbar-width: none;
10758
+ }
10759
+
10760
+ .pf-c-label-group__textarea::-webkit-scrollbar {
10761
+ display: none;
10762
+ }
10763
+
10764
10764
  .pf-c-list {
10765
10765
  --pf-c-list--PaddingLeft: var(--pf-global--spacer--lg);
10766
10766
  --pf-c-list--nested--MarginTop: var(--pf-global--spacer--sm);