@patternfly/patternfly 5.0.0-alpha.1 → 5.0.0-alpha.3

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/RELEASE-NOTES.md +30 -0
  2. package/components/Dropdown/dropdown.css +15 -0
  3. package/components/Dropdown/dropdown.scss +20 -0
  4. package/components/FormControl/form-control.css +1 -1
  5. package/components/FormControl/themes/dark/form-control.scss +1 -1
  6. package/components/InputGroup/input-group.css +14 -0
  7. package/components/InputGroup/input-group.scss +9 -0
  8. package/components/InputGroup/themes/dark/input-group.scss +8 -0
  9. package/components/Menu/menu.css +4 -0
  10. package/components/Menu/menu.scss +5 -0
  11. package/components/Pagination/pagination.css +120 -0
  12. package/components/Pagination/pagination.scss +24 -1
  13. package/components/Slider/slider.css +0 -7
  14. package/components/Slider/slider.scss +0 -9
  15. package/docs/components/Dropdown/examples/Dropdown.md +216 -0
  16. package/docs/components/InputGroup/examples/InputGroup.md +1 -0
  17. package/docs/components/Pagination/examples/Pagination.md +129 -30
  18. package/docs/components/Slider/examples/Slider.md +6 -6
  19. package/docs/components/Tabs/examples/Tabs.md +1 -1
  20. package/docs/demos/Banner/examples/Banner.md +2 -2
  21. package/docs/demos/Dashboard/examples/Dashboard.md +0 -1
  22. package/docs/demos/Nav/examples/Nav.md +671 -718
  23. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +0 -2
  24. package/docs/demos/Tabs/examples/Tabs.md +42 -539
  25. package/docs/demos/Wizard/examples/Wizard.md +0 -4
  26. package/package.json +5 -5
  27. package/patternfly-no-reset.css +154 -8
  28. package/patternfly.css +154 -8
  29. package/patternfly.min.css +1 -1
  30. package/patternfly.min.css.map +1 -1
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "5.0.0-alpha.1",
4
+ "version": "5.0.0-alpha.3",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -34,9 +34,9 @@
34
34
  "@fortawesome/fontawesome": "^1.1.8",
35
35
  "@octokit/rest": "^16.40.1",
36
36
  "@patternfly/patternfly-a11y": "4.3.1",
37
- "@patternfly/react-code-editor": "4.82.55",
38
- "@patternfly/react-core": "4.250.1",
39
- "@patternfly/react-table": "4.111.33",
37
+ "@patternfly/react-code-editor": "4.82.67",
38
+ "@patternfly/react-core": "4.264.0",
39
+ "@patternfly/react-table": "4.111.45",
40
40
  "@starptech/prettyhtml": "^0.10.0",
41
41
  "babel-eslint": "^8.2.3",
42
42
  "cheerio": "^1.0.0-rc.3",
@@ -79,7 +79,7 @@
79
79
  "stylelint-scss": "^4.3.0",
80
80
  "stylelint-value-no-unknown-custom-properties": "^4.0.0",
81
81
  "surge": "^0.21.3",
82
- "@patternfly/documentation-framework": "1.2.61",
82
+ "@patternfly/documentation-framework": "1.2.67",
83
83
  "unified": "^9.2.0",
84
84
  "webpack": "^4.43.0"
85
85
  },
package/patternfly-no-reset.css CHANGED
@@ -13599,6 +13599,8 @@ label.pf-c-check, .pf-c-check__label,
13599
13599
  --pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth: var(--pf-global--BorderWidth--md);
13600
13600
  --pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor: var(--pf-global--primary-color--100);
13601
13601
  --pf-c-dropdown__toggle-button--Color: var(--pf-global--Color--100);
13602
+ --pf-c-dropdown__toggle-progress--Visibility: hidden;
13603
+ --pf-c-dropdown__toggle-progress--c-spinner--diameter: var(--pf-global--FontSize--sm);
13602
13604
  --pf-c-dropdown__toggle--m-split-button--child--PaddingTop: var(--pf-global--spacer--form-element);
13603
13605
  --pf-c-dropdown__toggle--m-split-button--child--PaddingRight: var(--pf-global--spacer--xs);
13604
13606
  --pf-c-dropdown__toggle--m-split-button--child--PaddingBottom: var(--pf-global--spacer--form-element);
@@ -13810,9 +13812,14 @@ label.pf-c-check, .pf-c-check__label,
13810
13812
  align-items: center;
13811
13813
  cursor: pointer;
13812
13814
  }
13815
+ .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check.pf-m-in-progress {
13816
+ --pf-c-dropdown__toggle--m-split-button__toggle-check__input--Visibility: hidden;
13817
+ --pf-c-dropdown__toggle-progress--Visibility: visible;
13818
+ }
13813
13819
  .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check > input,
13814
13820
  .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check .pf-c-check {
13815
13821
  cursor: pointer;
13822
+ visibility: var(--pf-c-dropdown__toggle--m-split-button__toggle-check__input--Visibility, unset);
13816
13823
  transform: translateY(var(--pf-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY));
13817
13824
  }
13818
13825
  .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-button {
@@ -14008,6 +14015,14 @@ label.pf-c-check, .pf-c-check__label,
14008
14015
  --pf-c-dropdown__toggle-image--MarginRight: 0;
14009
14016
  }
14010
14017
 
14018
+ .pf-c-dropdown__toggle-progress {
14019
+ position: absolute;
14020
+ visibility: var(--pf-c-dropdown__toggle-progress--Visibility);
14021
+ }
14022
+ .pf-c-dropdown__toggle-progress .pf-c-spinner {
14023
+ --pf-c-spinner--diameter: var(--pf-c-dropdown__toggle-progress--c-spinner--diameter);
14024
+ }
14025
+
14011
14026
  .pf-c-dropdown__menu {
14012
14027
  position: absolute;
14013
14028
  top: var(--pf-c-dropdown__menu--Top);
@@ -15453,7 +15468,7 @@ textarea.pf-c-form-control {
15453
15468
  }
15454
15469
 
15455
15470
  :where(.pf-theme-dark) .pf-c-form-control {
15456
- --pf-c-form-control__select--BackgroundUrl: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%235ba352' d='M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z'/%3E%3C/svg%3E");
15471
+ --pf-c-form-control__select--BackgroundUrl: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23e0e0e0' d='M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z'/%3E%3C/svg%3E");
15457
15472
  --pf-c-form-control--BorderTopColor: transparent;
15458
15473
  --pf-c-form-control--BorderRightColor: transparent;
15459
15474
  --pf-c-form-control--BorderBottomColor: var(--pf-global--BorderColor--400);
@@ -15903,6 +15918,9 @@ textarea.pf-c-form-control {
15903
15918
  --pf-c-input-group__text--BorderLeftColor: var(--pf-global--BorderColor--300);
15904
15919
  --pf-c-input-group__text--BackgroundColor: var(--pf-global--BackgroundColor--100);
15905
15920
  --pf-c-input-group__textarea--MinHeight: var(--pf-global--spacer--xl);
15921
+ --pf-c-input-group__text--m-disabled--Color: var(--pf-global--disabled-color--100);
15922
+ --pf-c-input-group__text--m-disabled--BackgroundColor: var(--pf-global--disabled-color--300);
15923
+ --pf-c-input-group__text--m-disabled--BorderBottomColor: transparent;
15906
15924
  --pf-c-input-group--c-form-control--invalid--ZIndex: var(--pf-global--ZIndex--xs);
15907
15925
  --pf-c-input-group--c-form-control--MarginRight: 0;
15908
15926
  color: var(--pf-global--Color--100);
@@ -15952,6 +15970,11 @@ label.pf-c-input-group__text {
15952
15970
  --pf-c-input-group__text--BorderWidth: 0;
15953
15971
  margin-left: 0;
15954
15972
  }
15973
+ .pf-c-input-group__text.pf-m-disabled {
15974
+ --pf-c-input-group__text--Color: var(--pf-c-input-group__text--m-disabled--Color);
15975
+ --pf-c-input-group__text--BackgroundColor: var(--pf-c-input-group__text--m-disabled--BackgroundColor);
15976
+ --pf-c-input-group__text--BorderBottomColor: var(--pf-c-input-group__text--m-disabled--BorderBottomColor);
15977
+ }
15955
15978
 
15956
15979
  :where(.pf-theme-dark) .pf-c-wizard__header, :where(.pf-theme-dark) .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector,
15957
15980
  :where(.pf-theme-dark) .pf-c-page__main-section[class*=pf-m-dark-],
@@ -15996,6 +16019,8 @@ label.pf-c-input-group__text {
15996
16019
  --pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
15997
16020
  --pf-c-input-group__text--BorderLeftColor: transparent;
15998
16021
  --pf-c-input-group__text--BackgroundColor: var(--pf-global--palette--black-600);
16022
+ --pf-c-input-group__text--m-disabled--Color: var(--pf-global--palette--black-100);
16023
+ --pf-c-input-group__text--m-disabled--BackgroundColor: var(--pf-global--disabled-color--200);
15999
16024
  }
16000
16025
  :where(.pf-theme-dark) .pf-c-input-group > * + * {
16001
16026
  margin-left: 0;
@@ -16010,6 +16035,10 @@ label.pf-c-input-group__text {
16010
16035
  :where(.pf-theme-dark) .pf-c-input-group__text.pf-m-plain {
16011
16036
  --pf-c-input-group__text--BackgroundColor: transparent;
16012
16037
  }
16038
+ :where(.pf-theme-dark) .pf-c-input-group__text.pf-m-disabled {
16039
+ --pf-c-input-group__text--BackgroundColor: var(--pf-c-input-group__text--m-disabled--BackgroundColor);
16040
+ color: var(--pf-c-input-group__text--m-disabled--Color);
16041
+ }
16013
16042
 
16014
16043
  .pf-c-jump-links {
16015
16044
  --pf-c-jump-links__list--Display: flex;
@@ -18383,11 +18412,15 @@ ul.pf-c-list {
18383
18412
  }
18384
18413
  .pf-c-menu.pf-m-drilled-in > .pf-c-menu__content > .pf-c-menu__list {
18385
18414
  overflow: visible;
18415
+ visibility: hidden;
18386
18416
  }
18387
18417
  .pf-c-menu.pf-m-drilled-in > .pf-c-menu__content > .pf-c-menu__list > .pf-c-divider,
18388
18418
  .pf-c-menu.pf-m-drilled-in > .pf-c-menu__content > .pf-c-menu__list > .pf-c-menu__list-item:not(.pf-m-current-path) {
18389
18419
  display: none;
18390
18420
  }
18421
+ .pf-c-menu.pf-m-drilled-in > .pf-c-menu__content > .pf-c-menu__list > .pf-c-menu__list-item.pf-m-current-path {
18422
+ visibility: hidden;
18423
+ }
18391
18424
  .pf-c-menu.pf-m-plain {
18392
18425
  --pf-c-menu--BoxShadow: var(--pf-c-menu--m-plain--BoxShadow);
18393
18426
  }
@@ -22363,6 +22396,11 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22363
22396
  }
22364
22397
 
22365
22398
  .pf-c-pagination {
22399
+ --pf-c-pagination--inset: 0;
22400
+ --pf-c-pagination--PaddingRight: var(--pf-c-pagination--inset);
22401
+ --pf-c-pagination--PaddingLeft: var(--pf-c-pagination--inset);
22402
+ --pf-c-pagination--m-page-insets--inset: var(--pf-global--spacer--md);
22403
+ --pf-c-pagination--m-page-insets--xl--inset: var(--pf-global--spacer--lg);
22366
22404
  --pf-c-pagination--child--MarginRight: var(--pf-global--spacer--lg);
22367
22405
  --pf-c-pagination--m-bottom--child--MarginRight: 0;
22368
22406
  --pf-c-pagination--m-bottom--child--md--MarginRight: var(--pf-global--spacer--lg);
@@ -22418,6 +22456,8 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22418
22456
  flex-wrap: wrap;
22419
22457
  align-items: center;
22420
22458
  justify-content: flex-end;
22459
+ padding-right: var(--pf-c-pagination--PaddingRight);
22460
+ padding-left: var(--pf-c-pagination--PaddingLeft);
22421
22461
  }
22422
22462
  @media screen and (min-width: 768px) {
22423
22463
  .pf-c-pagination {
@@ -22437,6 +22477,8 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22437
22477
  .pf-c-pagination {
22438
22478
  --pf-c-pagination--m-bottom--md--PaddingRight: var(--pf-c-pagination--m-bottom--xl--PaddingRight);
22439
22479
  --pf-c-pagination--m-bottom--md--PaddingLeft: var(--pf-c-pagination--m-bottom--xl--PaddingLeft);
22480
+ --pf-c-pagination__scroll-button--Width: var(--pf-c-pagination__scroll-button--xl--Width);
22481
+ --pf-c-pagination--m-page-insets--inset: var(--pf-c-pagination--m-page-insets--xl--inset);
22440
22482
  }
22441
22483
  }
22442
22484
  .pf-c-pagination > *:not(:last-child):not(.pf-c-pagination__total-items) {
@@ -22527,6 +22569,9 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22527
22569
  .pf-c-pagination.pf-m-compact {
22528
22570
  --pf-c-pagination--child--MarginRight: var(--pf-c-pagination--m-compact--child--MarginRight);
22529
22571
  }
22572
+ .pf-c-pagination.pf-m-page-insets {
22573
+ --pf-c-pagination--inset: var(--pf-c-pagination--m-page-insets--inset);
22574
+ }
22530
22575
 
22531
22576
  .pf-c-pagination__nav {
22532
22577
  display: var(--pf-c-pagination__nav--Display);
@@ -22573,6 +22618,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22573
22618
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22574
22619
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22575
22620
  }
22621
+ .pf-c-pagination.pf-m-inset-none {
22622
+ --pf-c-pagination--inset: 0;
22623
+ }
22624
+ .pf-c-pagination.pf-m-inset-sm {
22625
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22626
+ }
22627
+ .pf-c-pagination.pf-m-inset-md {
22628
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22629
+ }
22630
+ .pf-c-pagination.pf-m-inset-lg {
22631
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22632
+ }
22633
+ .pf-c-pagination.pf-m-inset-xl {
22634
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22635
+ }
22636
+ .pf-c-pagination.pf-m-inset-2xl {
22637
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22638
+ }
22576
22639
  @media (min-width: 576px) {
22577
22640
  .pf-c-pagination.pf-m-display-summary-on-sm {
22578
22641
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
@@ -22584,6 +22647,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22584
22647
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22585
22648
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22586
22649
  }
22650
+ .pf-c-pagination.pf-m-inset-none-on-sm {
22651
+ --pf-c-pagination--inset: 0;
22652
+ }
22653
+ .pf-c-pagination.pf-m-inset-sm-on-sm {
22654
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22655
+ }
22656
+ .pf-c-pagination.pf-m-inset-md-on-sm {
22657
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22658
+ }
22659
+ .pf-c-pagination.pf-m-inset-lg-on-sm {
22660
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22661
+ }
22662
+ .pf-c-pagination.pf-m-inset-xl-on-sm {
22663
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22664
+ }
22665
+ .pf-c-pagination.pf-m-inset-2xl-on-sm {
22666
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22667
+ }
22587
22668
  }
22588
22669
  @media (min-width: 768px) {
22589
22670
  .pf-c-pagination.pf-m-display-summary-on-md {
@@ -22596,6 +22677,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22596
22677
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22597
22678
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22598
22679
  }
22680
+ .pf-c-pagination.pf-m-inset-none-on-md {
22681
+ --pf-c-pagination--inset: 0;
22682
+ }
22683
+ .pf-c-pagination.pf-m-inset-sm-on-md {
22684
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22685
+ }
22686
+ .pf-c-pagination.pf-m-inset-md-on-md {
22687
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22688
+ }
22689
+ .pf-c-pagination.pf-m-inset-lg-on-md {
22690
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22691
+ }
22692
+ .pf-c-pagination.pf-m-inset-xl-on-md {
22693
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22694
+ }
22695
+ .pf-c-pagination.pf-m-inset-2xl-on-md {
22696
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22697
+ }
22599
22698
  }
22600
22699
  @media (min-width: 992px) {
22601
22700
  .pf-c-pagination.pf-m-display-summary-on-lg {
@@ -22608,6 +22707,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22608
22707
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22609
22708
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22610
22709
  }
22710
+ .pf-c-pagination.pf-m-inset-none-on-lg {
22711
+ --pf-c-pagination--inset: 0;
22712
+ }
22713
+ .pf-c-pagination.pf-m-inset-sm-on-lg {
22714
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22715
+ }
22716
+ .pf-c-pagination.pf-m-inset-md-on-lg {
22717
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22718
+ }
22719
+ .pf-c-pagination.pf-m-inset-lg-on-lg {
22720
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22721
+ }
22722
+ .pf-c-pagination.pf-m-inset-xl-on-lg {
22723
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22724
+ }
22725
+ .pf-c-pagination.pf-m-inset-2xl-on-lg {
22726
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22727
+ }
22611
22728
  }
22612
22729
  @media (min-width: 1200px) {
22613
22730
  .pf-c-pagination.pf-m-display-summary-on-xl {
@@ -22620,6 +22737,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22620
22737
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22621
22738
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22622
22739
  }
22740
+ .pf-c-pagination.pf-m-inset-none-on-xl {
22741
+ --pf-c-pagination--inset: 0;
22742
+ }
22743
+ .pf-c-pagination.pf-m-inset-sm-on-xl {
22744
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22745
+ }
22746
+ .pf-c-pagination.pf-m-inset-md-on-xl {
22747
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22748
+ }
22749
+ .pf-c-pagination.pf-m-inset-lg-on-xl {
22750
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22751
+ }
22752
+ .pf-c-pagination.pf-m-inset-xl-on-xl {
22753
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22754
+ }
22755
+ .pf-c-pagination.pf-m-inset-2xl-on-xl {
22756
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22757
+ }
22623
22758
  }
22624
22759
  @media (min-width: 1450px) {
22625
22760
  .pf-c-pagination.pf-m-display-summary-on-2xl {
@@ -22632,6 +22767,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22632
22767
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22633
22768
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22634
22769
  }
22770
+ .pf-c-pagination.pf-m-inset-none-on-2xl {
22771
+ --pf-c-pagination--inset: 0;
22772
+ }
22773
+ .pf-c-pagination.pf-m-inset-sm-on-2xl {
22774
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22775
+ }
22776
+ .pf-c-pagination.pf-m-inset-md-on-2xl {
22777
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22778
+ }
22779
+ .pf-c-pagination.pf-m-inset-lg-on-2xl {
22780
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22781
+ }
22782
+ .pf-c-pagination.pf-m-inset-xl-on-2xl {
22783
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22784
+ }
22785
+ .pf-c-pagination.pf-m-inset-2xl-on-2xl {
22786
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22787
+ }
22635
22788
  }
22636
22789
 
22637
22790
  :where(.pf-theme-dark) .pf-c-wizard__header, :where(.pf-theme-dark) .pf-c-about-modal-box, :where(.pf-theme-dark) .pf-c-banner, :where(.pf-theme-dark) .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main, :where(.pf-theme-dark) .pf-c-login__header,
@@ -25517,13 +25670,6 @@ label.pf-c-radio, .pf-c-radio__label,
25517
25670
  z-index: var(--pf-c-slider__value--m-floating--ZIndex);
25518
25671
  transform: translate(var(--pf-c-slider__value--m-floating--TranslateX), var(--pf-c-slider__value--m-floating--TranslateY));
25519
25672
  }
25520
- .pf-c-slider__value.pf-m-floating .pf-c-input-group {
25521
- align-items: center;
25522
- }
25523
- .pf-c-slider__value.pf-m-floating .pf-c-input-group__text {
25524
- position: absolute;
25525
- left: 100%;
25526
- }
25527
25673
  .pf-c-slider__value .pf-c-form-control {
25528
25674
  width: var(--pf-c-slider__value--c-form-control--Width);
25529
25675
  }
package/patternfly.css CHANGED
@@ -13722,6 +13722,8 @@ label.pf-c-check, .pf-c-check__label,
13722
13722
  --pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderWidth: var(--pf-global--BorderWidth--md);
13723
13723
  --pf-c-dropdown--m-expanded__toggle--m-secondary--before--BorderColor: var(--pf-global--primary-color--100);
13724
13724
  --pf-c-dropdown__toggle-button--Color: var(--pf-global--Color--100);
13725
+ --pf-c-dropdown__toggle-progress--Visibility: hidden;
13726
+ --pf-c-dropdown__toggle-progress--c-spinner--diameter: var(--pf-global--FontSize--sm);
13725
13727
  --pf-c-dropdown__toggle--m-split-button--child--PaddingTop: var(--pf-global--spacer--form-element);
13726
13728
  --pf-c-dropdown__toggle--m-split-button--child--PaddingRight: var(--pf-global--spacer--xs);
13727
13729
  --pf-c-dropdown__toggle--m-split-button--child--PaddingBottom: var(--pf-global--spacer--form-element);
@@ -13933,9 +13935,14 @@ label.pf-c-check, .pf-c-check__label,
13933
13935
  align-items: center;
13934
13936
  cursor: pointer;
13935
13937
  }
13938
+ .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check.pf-m-in-progress {
13939
+ --pf-c-dropdown__toggle--m-split-button__toggle-check__input--Visibility: hidden;
13940
+ --pf-c-dropdown__toggle-progress--Visibility: visible;
13941
+ }
13936
13942
  .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check > input,
13937
13943
  .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-check .pf-c-check {
13938
13944
  cursor: pointer;
13945
+ visibility: var(--pf-c-dropdown__toggle--m-split-button__toggle-check__input--Visibility, unset);
13939
13946
  transform: translateY(var(--pf-c-dropdown__toggle--m-split-button__toggle-check__input--TranslateY));
13940
13947
  }
13941
13948
  .pf-c-dropdown__toggle.pf-m-split-button .pf-c-dropdown__toggle-button {
@@ -14131,6 +14138,14 @@ label.pf-c-check, .pf-c-check__label,
14131
14138
  --pf-c-dropdown__toggle-image--MarginRight: 0;
14132
14139
  }
14133
14140
 
14141
+ .pf-c-dropdown__toggle-progress {
14142
+ position: absolute;
14143
+ visibility: var(--pf-c-dropdown__toggle-progress--Visibility);
14144
+ }
14145
+ .pf-c-dropdown__toggle-progress .pf-c-spinner {
14146
+ --pf-c-spinner--diameter: var(--pf-c-dropdown__toggle-progress--c-spinner--diameter);
14147
+ }
14148
+
14134
14149
  .pf-c-dropdown__menu {
14135
14150
  position: absolute;
14136
14151
  top: var(--pf-c-dropdown__menu--Top);
@@ -15576,7 +15591,7 @@ textarea.pf-c-form-control {
15576
15591
  }
15577
15592
 
15578
15593
  :where(.pf-theme-dark) .pf-c-form-control {
15579
- --pf-c-form-control__select--BackgroundUrl: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%235ba352' d='M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z'/%3E%3C/svg%3E");
15594
+ --pf-c-form-control__select--BackgroundUrl: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%23e0e0e0' d='M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z'/%3E%3C/svg%3E");
15580
15595
  --pf-c-form-control--BorderTopColor: transparent;
15581
15596
  --pf-c-form-control--BorderRightColor: transparent;
15582
15597
  --pf-c-form-control--BorderBottomColor: var(--pf-global--BorderColor--400);
@@ -16026,6 +16041,9 @@ textarea.pf-c-form-control {
16026
16041
  --pf-c-input-group__text--BorderLeftColor: var(--pf-global--BorderColor--300);
16027
16042
  --pf-c-input-group__text--BackgroundColor: var(--pf-global--BackgroundColor--100);
16028
16043
  --pf-c-input-group__textarea--MinHeight: var(--pf-global--spacer--xl);
16044
+ --pf-c-input-group__text--m-disabled--Color: var(--pf-global--disabled-color--100);
16045
+ --pf-c-input-group__text--m-disabled--BackgroundColor: var(--pf-global--disabled-color--300);
16046
+ --pf-c-input-group__text--m-disabled--BorderBottomColor: transparent;
16029
16047
  --pf-c-input-group--c-form-control--invalid--ZIndex: var(--pf-global--ZIndex--xs);
16030
16048
  --pf-c-input-group--c-form-control--MarginRight: 0;
16031
16049
  color: var(--pf-global--Color--100);
@@ -16075,6 +16093,11 @@ label.pf-c-input-group__text {
16075
16093
  --pf-c-input-group__text--BorderWidth: 0;
16076
16094
  margin-left: 0;
16077
16095
  }
16096
+ .pf-c-input-group__text.pf-m-disabled {
16097
+ --pf-c-input-group__text--Color: var(--pf-c-input-group__text--m-disabled--Color);
16098
+ --pf-c-input-group__text--BackgroundColor: var(--pf-c-input-group__text--m-disabled--BackgroundColor);
16099
+ --pf-c-input-group__text--BorderBottomColor: var(--pf-c-input-group__text--m-disabled--BorderBottomColor);
16100
+ }
16078
16101
 
16079
16102
  :where(.pf-theme-dark) .pf-c-wizard__header, :where(.pf-theme-dark) .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector,
16080
16103
  :where(.pf-theme-dark) .pf-c-page__main-section[class*=pf-m-dark-],
@@ -16119,6 +16142,8 @@ label.pf-c-input-group__text {
16119
16142
  --pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
16120
16143
  --pf-c-input-group__text--BorderLeftColor: transparent;
16121
16144
  --pf-c-input-group__text--BackgroundColor: var(--pf-global--palette--black-600);
16145
+ --pf-c-input-group__text--m-disabled--Color: var(--pf-global--palette--black-100);
16146
+ --pf-c-input-group__text--m-disabled--BackgroundColor: var(--pf-global--disabled-color--200);
16122
16147
  }
16123
16148
  :where(.pf-theme-dark) .pf-c-input-group > * + * {
16124
16149
  margin-left: 0;
@@ -16133,6 +16158,10 @@ label.pf-c-input-group__text {
16133
16158
  :where(.pf-theme-dark) .pf-c-input-group__text.pf-m-plain {
16134
16159
  --pf-c-input-group__text--BackgroundColor: transparent;
16135
16160
  }
16161
+ :where(.pf-theme-dark) .pf-c-input-group__text.pf-m-disabled {
16162
+ --pf-c-input-group__text--BackgroundColor: var(--pf-c-input-group__text--m-disabled--BackgroundColor);
16163
+ color: var(--pf-c-input-group__text--m-disabled--Color);
16164
+ }
16136
16165
 
16137
16166
  .pf-c-jump-links {
16138
16167
  --pf-c-jump-links__list--Display: flex;
@@ -18506,11 +18535,15 @@ ul.pf-c-list {
18506
18535
  }
18507
18536
  .pf-c-menu.pf-m-drilled-in > .pf-c-menu__content > .pf-c-menu__list {
18508
18537
  overflow: visible;
18538
+ visibility: hidden;
18509
18539
  }
18510
18540
  .pf-c-menu.pf-m-drilled-in > .pf-c-menu__content > .pf-c-menu__list > .pf-c-divider,
18511
18541
  .pf-c-menu.pf-m-drilled-in > .pf-c-menu__content > .pf-c-menu__list > .pf-c-menu__list-item:not(.pf-m-current-path) {
18512
18542
  display: none;
18513
18543
  }
18544
+ .pf-c-menu.pf-m-drilled-in > .pf-c-menu__content > .pf-c-menu__list > .pf-c-menu__list-item.pf-m-current-path {
18545
+ visibility: hidden;
18546
+ }
18514
18547
  .pf-c-menu.pf-m-plain {
18515
18548
  --pf-c-menu--BoxShadow: var(--pf-c-menu--m-plain--BoxShadow);
18516
18549
  }
@@ -22486,6 +22519,11 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22486
22519
  }
22487
22520
 
22488
22521
  .pf-c-pagination {
22522
+ --pf-c-pagination--inset: 0;
22523
+ --pf-c-pagination--PaddingRight: var(--pf-c-pagination--inset);
22524
+ --pf-c-pagination--PaddingLeft: var(--pf-c-pagination--inset);
22525
+ --pf-c-pagination--m-page-insets--inset: var(--pf-global--spacer--md);
22526
+ --pf-c-pagination--m-page-insets--xl--inset: var(--pf-global--spacer--lg);
22489
22527
  --pf-c-pagination--child--MarginRight: var(--pf-global--spacer--lg);
22490
22528
  --pf-c-pagination--m-bottom--child--MarginRight: 0;
22491
22529
  --pf-c-pagination--m-bottom--child--md--MarginRight: var(--pf-global--spacer--lg);
@@ -22541,6 +22579,8 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22541
22579
  flex-wrap: wrap;
22542
22580
  align-items: center;
22543
22581
  justify-content: flex-end;
22582
+ padding-right: var(--pf-c-pagination--PaddingRight);
22583
+ padding-left: var(--pf-c-pagination--PaddingLeft);
22544
22584
  }
22545
22585
  @media screen and (min-width: 768px) {
22546
22586
  .pf-c-pagination {
@@ -22560,6 +22600,8 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22560
22600
  .pf-c-pagination {
22561
22601
  --pf-c-pagination--m-bottom--md--PaddingRight: var(--pf-c-pagination--m-bottom--xl--PaddingRight);
22562
22602
  --pf-c-pagination--m-bottom--md--PaddingLeft: var(--pf-c-pagination--m-bottom--xl--PaddingLeft);
22603
+ --pf-c-pagination__scroll-button--Width: var(--pf-c-pagination__scroll-button--xl--Width);
22604
+ --pf-c-pagination--m-page-insets--inset: var(--pf-c-pagination--m-page-insets--xl--inset);
22563
22605
  }
22564
22606
  }
22565
22607
  .pf-c-pagination > *:not(:last-child):not(.pf-c-pagination__total-items) {
@@ -22650,6 +22692,9 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22650
22692
  .pf-c-pagination.pf-m-compact {
22651
22693
  --pf-c-pagination--child--MarginRight: var(--pf-c-pagination--m-compact--child--MarginRight);
22652
22694
  }
22695
+ .pf-c-pagination.pf-m-page-insets {
22696
+ --pf-c-pagination--inset: var(--pf-c-pagination--m-page-insets--inset);
22697
+ }
22653
22698
 
22654
22699
  .pf-c-pagination__nav {
22655
22700
  display: var(--pf-c-pagination__nav--Display);
@@ -22696,6 +22741,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22696
22741
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22697
22742
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22698
22743
  }
22744
+ .pf-c-pagination.pf-m-inset-none {
22745
+ --pf-c-pagination--inset: 0;
22746
+ }
22747
+ .pf-c-pagination.pf-m-inset-sm {
22748
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22749
+ }
22750
+ .pf-c-pagination.pf-m-inset-md {
22751
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22752
+ }
22753
+ .pf-c-pagination.pf-m-inset-lg {
22754
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22755
+ }
22756
+ .pf-c-pagination.pf-m-inset-xl {
22757
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22758
+ }
22759
+ .pf-c-pagination.pf-m-inset-2xl {
22760
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22761
+ }
22699
22762
  @media (min-width: 576px) {
22700
22763
  .pf-c-pagination.pf-m-display-summary-on-sm {
22701
22764
  --pf-c-pagination__nav--Display: var(--pf-c-pagination--m-display-summary__nav--Display);
@@ -22707,6 +22770,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22707
22770
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22708
22771
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22709
22772
  }
22773
+ .pf-c-pagination.pf-m-inset-none-on-sm {
22774
+ --pf-c-pagination--inset: 0;
22775
+ }
22776
+ .pf-c-pagination.pf-m-inset-sm-on-sm {
22777
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22778
+ }
22779
+ .pf-c-pagination.pf-m-inset-md-on-sm {
22780
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22781
+ }
22782
+ .pf-c-pagination.pf-m-inset-lg-on-sm {
22783
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22784
+ }
22785
+ .pf-c-pagination.pf-m-inset-xl-on-sm {
22786
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22787
+ }
22788
+ .pf-c-pagination.pf-m-inset-2xl-on-sm {
22789
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22790
+ }
22710
22791
  }
22711
22792
  @media (min-width: 768px) {
22712
22793
  .pf-c-pagination.pf-m-display-summary-on-md {
@@ -22719,6 +22800,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22719
22800
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22720
22801
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22721
22802
  }
22803
+ .pf-c-pagination.pf-m-inset-none-on-md {
22804
+ --pf-c-pagination--inset: 0;
22805
+ }
22806
+ .pf-c-pagination.pf-m-inset-sm-on-md {
22807
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22808
+ }
22809
+ .pf-c-pagination.pf-m-inset-md-on-md {
22810
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22811
+ }
22812
+ .pf-c-pagination.pf-m-inset-lg-on-md {
22813
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22814
+ }
22815
+ .pf-c-pagination.pf-m-inset-xl-on-md {
22816
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22817
+ }
22818
+ .pf-c-pagination.pf-m-inset-2xl-on-md {
22819
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22820
+ }
22722
22821
  }
22723
22822
  @media (min-width: 992px) {
22724
22823
  .pf-c-pagination.pf-m-display-summary-on-lg {
@@ -22731,6 +22830,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22731
22830
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22732
22831
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22733
22832
  }
22833
+ .pf-c-pagination.pf-m-inset-none-on-lg {
22834
+ --pf-c-pagination--inset: 0;
22835
+ }
22836
+ .pf-c-pagination.pf-m-inset-sm-on-lg {
22837
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22838
+ }
22839
+ .pf-c-pagination.pf-m-inset-md-on-lg {
22840
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22841
+ }
22842
+ .pf-c-pagination.pf-m-inset-lg-on-lg {
22843
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22844
+ }
22845
+ .pf-c-pagination.pf-m-inset-xl-on-lg {
22846
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22847
+ }
22848
+ .pf-c-pagination.pf-m-inset-2xl-on-lg {
22849
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22850
+ }
22734
22851
  }
22735
22852
  @media (min-width: 1200px) {
22736
22853
  .pf-c-pagination.pf-m-display-summary-on-xl {
@@ -22743,6 +22860,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22743
22860
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22744
22861
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22745
22862
  }
22863
+ .pf-c-pagination.pf-m-inset-none-on-xl {
22864
+ --pf-c-pagination--inset: 0;
22865
+ }
22866
+ .pf-c-pagination.pf-m-inset-sm-on-xl {
22867
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22868
+ }
22869
+ .pf-c-pagination.pf-m-inset-md-on-xl {
22870
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22871
+ }
22872
+ .pf-c-pagination.pf-m-inset-lg-on-xl {
22873
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22874
+ }
22875
+ .pf-c-pagination.pf-m-inset-xl-on-xl {
22876
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22877
+ }
22878
+ .pf-c-pagination.pf-m-inset-2xl-on-xl {
22879
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22880
+ }
22746
22881
  }
22747
22882
  @media (min-width: 1450px) {
22748
22883
  .pf-c-pagination.pf-m-display-summary-on-2xl {
@@ -22755,6 +22890,24 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
22755
22890
  --pf-c-pagination--c-options-menu--Display: var(--pf-c-pagination--m-display-full--c-options-menu--Display);
22756
22891
  --pf-c-pagination__total-items--Display: var(--pf-c-pagination--m-display-full__total-items--Display);
22757
22892
  }
22893
+ .pf-c-pagination.pf-m-inset-none-on-2xl {
22894
+ --pf-c-pagination--inset: 0;
22895
+ }
22896
+ .pf-c-pagination.pf-m-inset-sm-on-2xl {
22897
+ --pf-c-pagination--inset: var(--pf-global--spacer--sm);
22898
+ }
22899
+ .pf-c-pagination.pf-m-inset-md-on-2xl {
22900
+ --pf-c-pagination--inset: var(--pf-global--spacer--md);
22901
+ }
22902
+ .pf-c-pagination.pf-m-inset-lg-on-2xl {
22903
+ --pf-c-pagination--inset: var(--pf-global--spacer--lg);
22904
+ }
22905
+ .pf-c-pagination.pf-m-inset-xl-on-2xl {
22906
+ --pf-c-pagination--inset: var(--pf-global--spacer--xl);
22907
+ }
22908
+ .pf-c-pagination.pf-m-inset-2xl-on-2xl {
22909
+ --pf-c-pagination--inset: var(--pf-global--spacer--2xl);
22910
+ }
22758
22911
  }
22759
22912
 
22760
22913
  :where(.pf-theme-dark) .pf-c-wizard__header, :where(.pf-theme-dark) .pf-c-about-modal-box, :where(.pf-theme-dark) .pf-c-banner, :where(.pf-theme-dark) .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main, :where(.pf-theme-dark) .pf-c-login__header,
@@ -25640,13 +25793,6 @@ label.pf-c-radio, .pf-c-radio__label,
25640
25793
  z-index: var(--pf-c-slider__value--m-floating--ZIndex);
25641
25794
  transform: translate(var(--pf-c-slider__value--m-floating--TranslateX), var(--pf-c-slider__value--m-floating--TranslateY));
25642
25795
  }
25643
- .pf-c-slider__value.pf-m-floating .pf-c-input-group {
25644
- align-items: center;
25645
- }
25646
- .pf-c-slider__value.pf-m-floating .pf-c-input-group__text {
25647
- position: absolute;
25648
- left: 100%;
25649
- }
25650
25796
  .pf-c-slider__value .pf-c-form-control {
25651
25797
  width: var(--pf-c-slider__value--c-form-control--Width);
25652
25798
  }