@patternfly/react-templates 1.1.0-prerelease.16 → 1.1.0-prerelease.18

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 (79) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/components/package.json +1 -1
  3. package/dist/dynamic/components/Dropdown/package.json +1 -1
  4. package/dist/dynamic/components/Select/package.json +1 -1
  5. package/dist/dynamic-modules.json +10 -10
  6. package/dist/esm/components/Dropdown/{DropdownSimple.d.ts → SimpleDropdown.d.ts} +11 -6
  7. package/dist/esm/components/Dropdown/SimpleDropdown.d.ts.map +1 -0
  8. package/dist/esm/components/Dropdown/{DropdownSimple.js → SimpleDropdown.js} +13 -7
  9. package/dist/esm/components/Dropdown/SimpleDropdown.js.map +1 -0
  10. package/dist/esm/components/Dropdown/index.d.ts +1 -1
  11. package/dist/esm/components/Dropdown/index.js +1 -1
  12. package/dist/esm/components/Select/CheckboxSelect.d.ts +7 -3
  13. package/dist/esm/components/Select/CheckboxSelect.d.ts.map +1 -1
  14. package/dist/esm/components/Select/CheckboxSelect.js +9 -6
  15. package/dist/esm/components/Select/CheckboxSelect.js.map +1 -1
  16. package/dist/{js/components/Select/SelectSimple.d.ts → esm/components/Select/SimpleSelect.d.ts} +10 -7
  17. package/dist/esm/components/Select/SimpleSelect.d.ts.map +1 -0
  18. package/dist/esm/components/Select/{SelectSimple.js → SimpleSelect.js} +13 -9
  19. package/dist/esm/components/Select/SimpleSelect.js.map +1 -0
  20. package/dist/esm/components/Select/{SelectTypeahead.d.ts → TypeaheadSelect.d.ts} +11 -7
  21. package/dist/esm/components/Select/TypeaheadSelect.d.ts.map +1 -0
  22. package/dist/esm/components/Select/{SelectTypeahead.js → TypeaheadSelect.js} +16 -14
  23. package/dist/esm/components/Select/TypeaheadSelect.js.map +1 -0
  24. package/dist/esm/components/Select/index.d.ts +2 -2
  25. package/dist/esm/components/Select/index.js +2 -2
  26. package/dist/js/components/Dropdown/{DropdownSimple.d.ts → SimpleDropdown.d.ts} +11 -6
  27. package/dist/js/components/Dropdown/SimpleDropdown.d.ts.map +1 -0
  28. package/dist/js/components/Dropdown/{DropdownSimple.js → SimpleDropdown.js} +14 -8
  29. package/dist/js/components/Dropdown/SimpleDropdown.js.map +1 -0
  30. package/dist/js/components/Dropdown/index.d.ts +1 -1
  31. package/dist/js/components/Dropdown/index.js +1 -1
  32. package/dist/js/components/Select/CheckboxSelect.d.ts +7 -3
  33. package/dist/js/components/Select/CheckboxSelect.d.ts.map +1 -1
  34. package/dist/js/components/Select/CheckboxSelect.js +9 -6
  35. package/dist/js/components/Select/CheckboxSelect.js.map +1 -1
  36. package/dist/{esm/components/Select/SelectSimple.d.ts → js/components/Select/SimpleSelect.d.ts} +10 -7
  37. package/dist/js/components/Select/SimpleSelect.d.ts.map +1 -0
  38. package/dist/js/components/Select/{SelectSimple.js → SimpleSelect.js} +14 -10
  39. package/dist/js/components/Select/SimpleSelect.js.map +1 -0
  40. package/dist/js/components/Select/{SelectTypeahead.d.ts → TypeaheadSelect.d.ts} +11 -7
  41. package/dist/js/components/Select/TypeaheadSelect.d.ts.map +1 -0
  42. package/dist/js/components/Select/{SelectTypeahead.js → TypeaheadSelect.js} +18 -16
  43. package/dist/js/components/Select/TypeaheadSelect.js.map +1 -0
  44. package/dist/js/components/Select/index.d.ts +2 -2
  45. package/dist/js/components/Select/index.js +2 -2
  46. package/dist/umd/assets/{output-OOaZReOZ.css → output-DSt0rygw.css} +1116 -1107
  47. package/dist/umd/react-templates.min.js +1 -1
  48. package/package.json +6 -6
  49. package/src/components/Dropdown/{DropdownSimple.tsx → SimpleDropdown.tsx} +28 -11
  50. package/src/components/Dropdown/__tests__/{DropdownSimple.test.tsx → SimpleDropdown.test.tsx} +35 -23
  51. package/src/components/Dropdown/__tests__/__snapshots__/{DropdownSimple.test.tsx.snap → SimpleDropdown.test.tsx.snap} +2 -2
  52. package/src/components/Dropdown/examples/DropdownTemplates.md +4 -16
  53. package/src/components/Dropdown/examples/{DropdownSimpleExample.tsx → SimpleDropdownExample.tsx} +7 -7
  54. package/src/components/Dropdown/index.ts +1 -1
  55. package/src/components/Select/CheckboxSelect.tsx +18 -7
  56. package/src/components/Select/{SelectSimple.tsx → SimpleSelect.tsx} +27 -14
  57. package/src/components/Select/{SelectTypeahead.tsx → TypeaheadSelect.tsx} +32 -27
  58. package/src/components/Select/{CheckboxSelect.test.tsx → __tests__/CheckboxSelect.test.tsx} +29 -1
  59. package/src/components/Select/{CheckboxSelectSnapshots.test.tsx → __tests__/CheckboxSelectSnapshots.test.tsx} +1 -1
  60. package/src/components/Select/__tests__/SimpleSelect.test.tsx +243 -0
  61. package/src/components/Select/{__snapshots__ → __tests__/__snapshots__}/CheckboxSelectSnapshots.test.tsx.snap +0 -1
  62. package/src/components/Select/__tests__/__snapshots__/SimpleSelect.test.tsx.snap +170 -0
  63. package/src/components/Select/examples/CheckboxSelectDemo.tsx +1 -1
  64. package/src/components/Select/examples/SelectTemplates.md +5 -5
  65. package/src/components/Select/examples/{SelectSimpleDemo.tsx → SimpleSelectDemo.tsx} +6 -6
  66. package/src/components/Select/examples/{SelectTypeaheadDemo.tsx → TypeaheadSelectDemo.tsx} +3 -3
  67. package/src/components/Select/index.ts +2 -2
  68. package/dist/esm/components/Dropdown/DropdownSimple.d.ts.map +0 -1
  69. package/dist/esm/components/Dropdown/DropdownSimple.js.map +0 -1
  70. package/dist/esm/components/Select/SelectSimple.d.ts.map +0 -1
  71. package/dist/esm/components/Select/SelectSimple.js.map +0 -1
  72. package/dist/esm/components/Select/SelectTypeahead.d.ts.map +0 -1
  73. package/dist/esm/components/Select/SelectTypeahead.js.map +0 -1
  74. package/dist/js/components/Dropdown/DropdownSimple.d.ts.map +0 -1
  75. package/dist/js/components/Dropdown/DropdownSimple.js.map +0 -1
  76. package/dist/js/components/Select/SelectSimple.d.ts.map +0 -1
  77. package/dist/js/components/Select/SelectSimple.js.map +0 -1
  78. package/dist/js/components/Select/SelectTypeahead.d.ts.map +0 -1
  79. package/dist/js/components/Select/SelectTypeahead.js.map +0 -1
@@ -4,6 +4,80 @@
4
4
  pointer-events: none;
5
5
  }
6
6
 
7
+ .pf-v5-c-check {
8
+ --pf-v5-c-check--GridGap: var(--pf-v5-global--spacer--xs) var(--pf-v5-global--spacer--sm);
9
+ --pf-v5-c-check__label--disabled--Color: var(--pf-v5-global--disabled-color--100);
10
+ --pf-v5-c-check__label--Color: var(--pf-v5-global--Color--100);
11
+ --pf-v5-c-check__label--FontWeight: var(--pf-v5-global--FontWeight--normal);
12
+ --pf-v5-c-check__label--FontSize: var(--pf-v5-global--FontSize--md);
13
+ --pf-v5-c-check__label--LineHeight: var(--pf-v5-global--LineHeight--md);
14
+ --pf-v5-c-check__input--TranslateY: calc((var(--pf-v5-c-check__label--LineHeight) * var(--pf-v5-c-check__label--FontSize) / 2 ) - 50%);
15
+ --pf-v5-c-check__input--TranslateY--moz: var(--pf-v5-c-check__input--TranslateY);
16
+ --pf-v5-c-check__description--FontSize: var(--pf-v5-global--FontSize--sm);
17
+ --pf-v5-c-check__description--Color: var(--pf-v5-global--Color--200);
18
+ --pf-v5-c-check__body--MarginTop: var(--pf-v5-global--spacer--sm);
19
+ --pf-v5-c-check__label-required--MarginLeft: var(--pf-v5-global--spacer--xs);
20
+ --pf-v5-c-check__label-required--FontSize: var(--pf-v5-global--FontSize--sm);
21
+ --pf-v5-c-check__label-required--Color: var(--pf-v5-global--danger-color--100);
22
+ display: grid;
23
+ grid-template-columns: auto 1fr;
24
+ grid-gap: var(--pf-v5-c-check--GridGap);
25
+ align-items: baseline;
26
+ }
27
+
28
+ .pf-v5-c-check.pf-m-standalone {
29
+ --pf-v5-c-check--GridGap: 0;
30
+ --pf-v5-c-check__input--TranslateY: none;
31
+ display: inline-grid;
32
+ }
33
+
34
+ .pf-v5-c-check__input {
35
+ align-self: start;
36
+ -moz-transform: translateY(var(--pf-v5-c-check__input--TranslateY--moz));
37
+ transform: translateY(var(--pf-v5-c-check__input--TranslateY));
38
+ }
39
+
40
+ .pf-v5-c-check__label {
41
+ font-size: var(--pf-v5-c-check__label--FontSize);
42
+ font-weight: var(--pf-v5-c-check__label--FontWeight);
43
+ line-height: var(--pf-v5-c-check__label--LineHeight);
44
+ color: var(--pf-v5-c-check__label--Color);
45
+ }
46
+
47
+ .pf-v5-c-check__description {
48
+ grid-column: 2;
49
+ font-size: var(--pf-v5-c-check__description--FontSize);
50
+ color: var(--pf-v5-c-check__description--Color);
51
+ }
52
+
53
+ .pf-v5-c-check__body {
54
+ grid-column: 2;
55
+ margin-block-start: var(--pf-v5-c-check__body--MarginTop);
56
+ }
57
+
58
+ .pf-v5-c-check__label,
59
+ .pf-v5-c-check__input {
60
+ justify-self: start;
61
+ }
62
+
63
+ label.pf-v5-c-check, .pf-v5-c-check__label,
64
+ .pf-v5-c-check__input {
65
+ cursor: pointer;
66
+ }
67
+
68
+ .pf-v5-c-check__label:disabled, .pf-v5-c-check__label.pf-m-disabled,
69
+ .pf-v5-c-check__input:disabled,
70
+ .pf-v5-c-check__input.pf-m-disabled {
71
+ --pf-v5-c-check__label--Color: var(--pf-v5-c-check__label--disabled--Color);
72
+ cursor: not-allowed;
73
+ }
74
+
75
+ .pf-v5-c-check__label-required {
76
+ margin-inline-start: var(--pf-v5-c-check__label-required--MarginLeft);
77
+ font-size: var(--pf-v5-c-check__label-required--FontSize);
78
+ color: var(--pf-v5-c-check__label-required--Color);
79
+ }
80
+
7
81
  .pf-v5-c-menu-toggle {
8
82
  --pf-v5-c-menu-toggle--BorderRadius: 0;
9
83
  --pf-v5-c-menu-toggle--PaddingTop: var(--pf-v5-global--spacer--form-element);
@@ -119,6 +193,7 @@
119
193
  --pf-v5-c-menu-toggle__button--PaddingRight: var(--pf-v5-global--spacer--sm);
120
194
  --pf-v5-c-menu-toggle__button__controls--MarginRight: var(--pf-v5-global--spacer--sm);
121
195
  --pf-v5-c-menu-toggle__button__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
196
+ --pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart: var(--pf-v5-global--spacer--xs);
122
197
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginRight: var(--pf-v5-global--spacer--sm);
123
198
  --pf-v5-c-menu-toggle--m-typeahead__controls--MarginLeft: var(--pf-v5-global--spacer--sm);
124
199
  --pf-v5-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
@@ -476,6 +551,13 @@
476
551
  border: 0;
477
552
  }
478
553
 
554
+ .pf-v5-c-menu-toggle__button.pf-m-text {
555
+ --pf-v5-c-menu-toggle--m-split-button--last-child--PaddingLeft: var(--pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart);
556
+ display: inline-flex;
557
+ align-items: baseline;
558
+ padding-inline-start: var(--pf-v5-c-menu-toggle__button--m-text--PaddingInlineStart);
559
+ }
560
+
479
561
  .pf-v5-c-menu-toggle__icon {
480
562
  flex-shrink: 0;
481
563
  align-self: center;
@@ -536,80 +618,6 @@
536
618
  background: transparent;
537
619
  }
538
620
 
539
- .pf-v5-c-check {
540
- --pf-v5-c-check--GridGap: var(--pf-v5-global--spacer--xs) var(--pf-v5-global--spacer--sm);
541
- --pf-v5-c-check__label--disabled--Color: var(--pf-v5-global--disabled-color--100);
542
- --pf-v5-c-check__label--Color: var(--pf-v5-global--Color--100);
543
- --pf-v5-c-check__label--FontWeight: var(--pf-v5-global--FontWeight--normal);
544
- --pf-v5-c-check__label--FontSize: var(--pf-v5-global--FontSize--md);
545
- --pf-v5-c-check__label--LineHeight: var(--pf-v5-global--LineHeight--md);
546
- --pf-v5-c-check__input--TranslateY: calc((var(--pf-v5-c-check__label--LineHeight) * var(--pf-v5-c-check__label--FontSize) / 2 ) - 50%);
547
- --pf-v5-c-check__input--TranslateY--moz: var(--pf-v5-c-check__input--TranslateY);
548
- --pf-v5-c-check__description--FontSize: var(--pf-v5-global--FontSize--sm);
549
- --pf-v5-c-check__description--Color: var(--pf-v5-global--Color--200);
550
- --pf-v5-c-check__body--MarginTop: var(--pf-v5-global--spacer--sm);
551
- --pf-v5-c-check__label-required--MarginLeft: var(--pf-v5-global--spacer--xs);
552
- --pf-v5-c-check__label-required--FontSize: var(--pf-v5-global--FontSize--sm);
553
- --pf-v5-c-check__label-required--Color: var(--pf-v5-global--danger-color--100);
554
- display: grid;
555
- grid-template-columns: auto 1fr;
556
- grid-gap: var(--pf-v5-c-check--GridGap);
557
- align-items: baseline;
558
- }
559
-
560
- .pf-v5-c-check.pf-m-standalone {
561
- --pf-v5-c-check--GridGap: 0;
562
- --pf-v5-c-check__input--TranslateY: none;
563
- display: inline-grid;
564
- }
565
-
566
- .pf-v5-c-check__input {
567
- align-self: start;
568
- -moz-transform: translateY(var(--pf-v5-c-check__input--TranslateY--moz));
569
- transform: translateY(var(--pf-v5-c-check__input--TranslateY));
570
- }
571
-
572
- .pf-v5-c-check__label {
573
- font-size: var(--pf-v5-c-check__label--FontSize);
574
- font-weight: var(--pf-v5-c-check__label--FontWeight);
575
- line-height: var(--pf-v5-c-check__label--LineHeight);
576
- color: var(--pf-v5-c-check__label--Color);
577
- }
578
-
579
- .pf-v5-c-check__description {
580
- grid-column: 2;
581
- font-size: var(--pf-v5-c-check__description--FontSize);
582
- color: var(--pf-v5-c-check__description--Color);
583
- }
584
-
585
- .pf-v5-c-check__body {
586
- grid-column: 2;
587
- margin-block-start: var(--pf-v5-c-check__body--MarginTop);
588
- }
589
-
590
- .pf-v5-c-check__label,
591
- .pf-v5-c-check__input {
592
- justify-self: start;
593
- }
594
-
595
- label.pf-v5-c-check, .pf-v5-c-check__label,
596
- .pf-v5-c-check__input {
597
- cursor: pointer;
598
- }
599
-
600
- .pf-v5-c-check__label:disabled, .pf-v5-c-check__label.pf-m-disabled,
601
- .pf-v5-c-check__input:disabled,
602
- .pf-v5-c-check__input.pf-m-disabled {
603
- --pf-v5-c-check__label--Color: var(--pf-v5-c-check__label--disabled--Color);
604
- cursor: not-allowed;
605
- }
606
-
607
- .pf-v5-c-check__label-required {
608
- margin-inline-start: var(--pf-v5-c-check__label-required--MarginLeft);
609
- font-size: var(--pf-v5-c-check__label-required--FontSize);
610
- color: var(--pf-v5-c-check__label-required--Color);
611
- }
612
-
613
621
  .pf-v5-c-divider {
614
622
  --pf-v5-hidden-visible--hidden--Display: none;
615
623
  --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--visible--Display);
@@ -1285,6 +1293,37 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
1285
1293
  --pf-v5-c-accordion__toggle--active--BackgroundColor: var(--pf-v5-global--BackgroundColor--300);
1286
1294
  }
1287
1295
 
1296
+ .pf-v5-c-action-list {
1297
+ --pf-v5-c-action-list--m-icon--spacer: 0;
1298
+ --pf-v5-c-action-list--child--spacer-base: var(--pf-v5-global--spacer--md);
1299
+ --pf-v5-c-action-list--group--spacer-base: var(--pf-v5-global--spacer--2xl);
1300
+ }
1301
+
1302
+ .pf-v5-c-action-list,
1303
+ .pf-v5-c-action-list__group {
1304
+ --pf-v5-c-action-list--child--spacer: var(--pf-v5-c-action-list--child--spacer-base);
1305
+ --pf-v5-c-action-list--group--spacer: var(--pf-v5-c-action-list--group--spacer-base);
1306
+ display: flex;
1307
+ align-items: center;
1308
+ }
1309
+
1310
+ .pf-v5-c-action-list > * + *,
1311
+ .pf-v5-c-action-list__group > * + * {
1312
+ margin-inline-start: var(--pf-v5-c-action-list--child--spacer);
1313
+ }
1314
+
1315
+ .pf-v5-c-action-list > * + .pf-v5-c-action-list__group,
1316
+ .pf-v5-c-action-list .pf-v5-c-action-list__group + *,
1317
+ .pf-v5-c-action-list__group > * + .pf-v5-c-action-list__group,
1318
+ .pf-v5-c-action-list__group .pf-v5-c-action-list__group + * {
1319
+ margin-inline-start: var(--pf-v5-c-action-list--group--spacer);
1320
+ }
1321
+
1322
+ .pf-v5-c-action-list.pf-m-icons,
1323
+ .pf-v5-c-action-list__group.pf-m-icons {
1324
+ --pf-v5-c-action-list--child--spacer: var(--pf-v5-c-action-list--m-icon--spacer);
1325
+ }
1326
+
1288
1327
  .pf-v5-c-alert {
1289
1328
  --pf-v5-global--Color--100: var(--pf-v5-global--Color--dark-100);
1290
1329
  --pf-v5-global--Color--200: var(--pf-v5-global--Color--dark-200);
@@ -1532,37 +1571,6 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
1532
1571
  --pf-v5-c-alert--m-inline--m-info--BackgroundColor: var(--pf-v5-global--BackgroundColor--300);
1533
1572
  }
1534
1573
 
1535
- .pf-v5-c-action-list {
1536
- --pf-v5-c-action-list--m-icon--spacer: 0;
1537
- --pf-v5-c-action-list--child--spacer-base: var(--pf-v5-global--spacer--md);
1538
- --pf-v5-c-action-list--group--spacer-base: var(--pf-v5-global--spacer--2xl);
1539
- }
1540
-
1541
- .pf-v5-c-action-list,
1542
- .pf-v5-c-action-list__group {
1543
- --pf-v5-c-action-list--child--spacer: var(--pf-v5-c-action-list--child--spacer-base);
1544
- --pf-v5-c-action-list--group--spacer: var(--pf-v5-c-action-list--group--spacer-base);
1545
- display: flex;
1546
- align-items: center;
1547
- }
1548
-
1549
- .pf-v5-c-action-list > * + *,
1550
- .pf-v5-c-action-list__group > * + * {
1551
- margin-inline-start: var(--pf-v5-c-action-list--child--spacer);
1552
- }
1553
-
1554
- .pf-v5-c-action-list > * + .pf-v5-c-action-list__group,
1555
- .pf-v5-c-action-list .pf-v5-c-action-list__group + *,
1556
- .pf-v5-c-action-list__group > * + .pf-v5-c-action-list__group,
1557
- .pf-v5-c-action-list__group .pf-v5-c-action-list__group + * {
1558
- margin-inline-start: var(--pf-v5-c-action-list--group--spacer);
1559
- }
1560
-
1561
- .pf-v5-c-action-list.pf-m-icons,
1562
- .pf-v5-c-action-list__group.pf-m-icons {
1563
- --pf-v5-c-action-list--child--spacer: var(--pf-v5-c-action-list--m-icon--spacer);
1564
- }
1565
-
1566
1574
  .pf-v5-c-avatar {
1567
1575
  --pf-v5-c-avatar--BorderColor: transparent;
1568
1576
  --pf-v5-c-avatar--BorderWidth: 0;
@@ -2134,112 +2142,6 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
2134
2142
  max-width: 100%;
2135
2143
  }
2136
2144
 
2137
- .pf-v5-c-breadcrumb {
2138
- --pf-v5-c-breadcrumb__item--FontSize: var(--pf-v5-global--FontSize--sm);
2139
- --pf-v5-c-breadcrumb__item--LineHeight: var(--pf-v5-global--LineHeight--sm);
2140
- --pf-v5-c-breadcrumb__item--MarginRight: var(--pf-v5-global--spacer--sm);
2141
- --pf-v5-c-breadcrumb__item-divider--Color: var(--pf-v5-global--icon--Color--dark);
2142
- --pf-v5-c-breadcrumb__item-divider--MarginRight: var(--pf-v5-global--spacer--sm);
2143
- --pf-v5-c-breadcrumb__item-divider--FontSize: var(--pf-v5-global--FontSize--sm);
2144
- --pf-v5-c-breadcrumb__link--Color: var(--pf-v5-global--link--Color);
2145
- --pf-v5-c-breadcrumb__link--TextDecoration: var(--pf-v5-global--link--TextDecoration);
2146
- --pf-v5-c-breadcrumb__link--hover--Color: var(--pf-v5-global--link--Color--hover);
2147
- --pf-v5-c-breadcrumb__link--hover--TextDecoration: var(--pf-v5-global--link--TextDecoration--hover);
2148
- --pf-v5-c-breadcrumb__link--m-current--Color: var(--pf-v5-global--Color--100);
2149
- --pf-v5-c-breadcrumb__link--BackgroundColor: transparent;
2150
- --pf-v5-c-breadcrumb__heading--FontSize: var(--pf-v5-global--FontSize--sm);
2151
- --pf-v5-c-breadcrumb__dropdown--MarginTop: calc(var(--pf-v5-global--spacer--form-element) * -1);
2152
- --pf-v5-c-breadcrumb__dropdown--MarginRight: calc(var(--pf-v5-c-breadcrumb__item--MarginRight) * -1);
2153
- --pf-v5-c-breadcrumb__dropdown--MarginBottom: calc(var(--pf-v5-global--spacer--form-element) * -1);
2154
- --pf-v5-c-breadcrumb__dropdown--MarginLeft: calc(var(--pf-v5-c-breadcrumb__item-divider--MarginRight) * -1);
2155
- --pf-v5-c-breadcrumb__dropdown--c-dropdown__toggle--LineHeight: var(--pf-v5-global--LineHeight--sm);
2156
- display: inline-flex;
2157
- }
2158
-
2159
- .pf-v5-c-breadcrumb__list {
2160
- display: flex;
2161
- flex-wrap: wrap;
2162
- align-items: center;
2163
- }
2164
-
2165
- .pf-v5-c-breadcrumb__item {
2166
- display: flex;
2167
- align-items: baseline;
2168
- font-size: var(--pf-v5-c-breadcrumb__item--FontSize);
2169
- font-weight: var(--pf-v5-c-breadcrumb__item--FontWeight);
2170
- line-height: var(--pf-v5-c-breadcrumb__item--LineHeight);
2171
- white-space: nowrap;
2172
- list-style: none;
2173
- }
2174
-
2175
- .pf-v5-c-breadcrumb__item:not(:last-child) {
2176
- margin-inline-end: var(--pf-v5-c-breadcrumb__item--MarginRight);
2177
- }
2178
-
2179
- .pf-v5-c-breadcrumb__item-divider {
2180
- margin-inline-end: var(--pf-v5-c-breadcrumb__item-divider--MarginRight);
2181
- font-size: var(--pf-v5-c-breadcrumb__item-divider--FontSize);
2182
- line-height: 1;
2183
- color: var(--pf-v5-c-breadcrumb__item-divider--Color);
2184
- }
2185
-
2186
- :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-breadcrumb__item-divider {
2187
- scale: -1 1;
2188
- }
2189
-
2190
- .pf-v5-c-breadcrumb__link {
2191
- font-size: inherit;
2192
- font-weight: var(--pf-v5-c-breadcrumb__link--FontWeight);
2193
- line-height: inherit;
2194
- color: var(--pf-v5-c-breadcrumb__link--Color);
2195
- text-decoration: var(--pf-v5-c-breadcrumb__link--TextDecoration);
2196
- word-break: break-word;
2197
- background-color: var(--pf-v5-c-breadcrumb__link--BackgroundColor);
2198
- }
2199
-
2200
- .pf-v5-c-breadcrumb__link:hover {
2201
- --pf-v5-c-breadcrumb__link--Color: var(--pf-v5-c-breadcrumb__link--hover--Color);
2202
- --pf-v5-c-breadcrumb__link--TextDecoration: var(--pf-v5-c-breadcrumb__link--hover--TextDecoration);
2203
- }
2204
-
2205
- .pf-v5-c-breadcrumb__link.pf-m-current {
2206
- cursor: default;
2207
- }
2208
-
2209
- .pf-v5-c-breadcrumb__link.pf-m-current, .pf-v5-c-breadcrumb__link.pf-m-current:hover {
2210
- color: var(--pf-v5-c-breadcrumb__link--m-current--Color);
2211
- text-decoration: none;
2212
- }
2213
-
2214
- button.pf-v5-c-breadcrumb__link {
2215
- border: none;
2216
- }
2217
-
2218
- .pf-v5-c-breadcrumb__dropdown {
2219
- margin-block-start: var(--pf-v5-c-breadcrumb__dropdown--MarginTop);
2220
- margin-block-end: var(--pf-v5-c-breadcrumb__dropdown--MarginBottom);
2221
- margin-inline-start: var(--pf-v5-c-breadcrumb__dropdown--MarginLeft);
2222
- margin-inline-end: var(--pf-v5-c-breadcrumb__dropdown--MarginRight);
2223
- }
2224
-
2225
- .pf-v5-c-breadcrumb__dropdown .pf-v5-c-dropdown__toggle {
2226
- line-height: var(--pf-v5-c-breadcrumb__dropdown--c-dropdown__toggle--LineHeight);
2227
- }
2228
-
2229
- .pf-v5-c-breadcrumb__heading {
2230
- display: inline;
2231
- font-size: var(--pf-v5-c-breadcrumb__heading--FontSize);
2232
- }
2233
-
2234
- .pf-v5-c-breadcrumb__link,
2235
- .pf-v5-c-breadcrumb__heading {
2236
- white-space: normal;
2237
- }
2238
-
2239
- .pf-v5-c-breadcrumb__list > :first-child .pf-v5-c-breadcrumb__item-divider {
2240
- display: none;
2241
- }
2242
-
2243
2145
  .pf-v5-c-button {
2244
2146
  --pf-v5-c-button--PaddingTop: var(--pf-v5-global--spacer--form-element);
2245
2147
  --pf-v5-c-button--PaddingRight: var(--pf-v5-global--spacer--md);
@@ -2870,6 +2772,112 @@ button.pf-v5-c-breadcrumb__link {
2870
2772
  border-block-end: var(--pf-v5-global--BorderWidth--sm) solid var(--pf-v5-global--palette--black-700);
2871
2773
  }
2872
2774
 
2775
+ .pf-v5-c-breadcrumb {
2776
+ --pf-v5-c-breadcrumb__item--FontSize: var(--pf-v5-global--FontSize--sm);
2777
+ --pf-v5-c-breadcrumb__item--LineHeight: var(--pf-v5-global--LineHeight--sm);
2778
+ --pf-v5-c-breadcrumb__item--MarginRight: var(--pf-v5-global--spacer--sm);
2779
+ --pf-v5-c-breadcrumb__item-divider--Color: var(--pf-v5-global--icon--Color--dark);
2780
+ --pf-v5-c-breadcrumb__item-divider--MarginRight: var(--pf-v5-global--spacer--sm);
2781
+ --pf-v5-c-breadcrumb__item-divider--FontSize: var(--pf-v5-global--FontSize--sm);
2782
+ --pf-v5-c-breadcrumb__link--Color: var(--pf-v5-global--link--Color);
2783
+ --pf-v5-c-breadcrumb__link--TextDecoration: var(--pf-v5-global--link--TextDecoration);
2784
+ --pf-v5-c-breadcrumb__link--hover--Color: var(--pf-v5-global--link--Color--hover);
2785
+ --pf-v5-c-breadcrumb__link--hover--TextDecoration: var(--pf-v5-global--link--TextDecoration--hover);
2786
+ --pf-v5-c-breadcrumb__link--m-current--Color: var(--pf-v5-global--Color--100);
2787
+ --pf-v5-c-breadcrumb__link--BackgroundColor: transparent;
2788
+ --pf-v5-c-breadcrumb__heading--FontSize: var(--pf-v5-global--FontSize--sm);
2789
+ --pf-v5-c-breadcrumb__dropdown--MarginTop: calc(var(--pf-v5-global--spacer--form-element) * -1);
2790
+ --pf-v5-c-breadcrumb__dropdown--MarginRight: calc(var(--pf-v5-c-breadcrumb__item--MarginRight) * -1);
2791
+ --pf-v5-c-breadcrumb__dropdown--MarginBottom: calc(var(--pf-v5-global--spacer--form-element) * -1);
2792
+ --pf-v5-c-breadcrumb__dropdown--MarginLeft: calc(var(--pf-v5-c-breadcrumb__item-divider--MarginRight) * -1);
2793
+ --pf-v5-c-breadcrumb__dropdown--c-dropdown__toggle--LineHeight: var(--pf-v5-global--LineHeight--sm);
2794
+ display: inline-flex;
2795
+ }
2796
+
2797
+ .pf-v5-c-breadcrumb__list {
2798
+ display: flex;
2799
+ flex-wrap: wrap;
2800
+ align-items: center;
2801
+ }
2802
+
2803
+ .pf-v5-c-breadcrumb__item {
2804
+ display: flex;
2805
+ align-items: baseline;
2806
+ font-size: var(--pf-v5-c-breadcrumb__item--FontSize);
2807
+ font-weight: var(--pf-v5-c-breadcrumb__item--FontWeight);
2808
+ line-height: var(--pf-v5-c-breadcrumb__item--LineHeight);
2809
+ white-space: nowrap;
2810
+ list-style: none;
2811
+ }
2812
+
2813
+ .pf-v5-c-breadcrumb__item:not(:last-child) {
2814
+ margin-inline-end: var(--pf-v5-c-breadcrumb__item--MarginRight);
2815
+ }
2816
+
2817
+ .pf-v5-c-breadcrumb__item-divider {
2818
+ margin-inline-end: var(--pf-v5-c-breadcrumb__item-divider--MarginRight);
2819
+ font-size: var(--pf-v5-c-breadcrumb__item-divider--FontSize);
2820
+ line-height: 1;
2821
+ color: var(--pf-v5-c-breadcrumb__item-divider--Color);
2822
+ }
2823
+
2824
+ :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-breadcrumb__item-divider {
2825
+ scale: -1 1;
2826
+ }
2827
+
2828
+ .pf-v5-c-breadcrumb__link {
2829
+ font-size: inherit;
2830
+ font-weight: var(--pf-v5-c-breadcrumb__link--FontWeight);
2831
+ line-height: inherit;
2832
+ color: var(--pf-v5-c-breadcrumb__link--Color);
2833
+ text-decoration: var(--pf-v5-c-breadcrumb__link--TextDecoration);
2834
+ word-break: break-word;
2835
+ background-color: var(--pf-v5-c-breadcrumb__link--BackgroundColor);
2836
+ }
2837
+
2838
+ .pf-v5-c-breadcrumb__link:hover {
2839
+ --pf-v5-c-breadcrumb__link--Color: var(--pf-v5-c-breadcrumb__link--hover--Color);
2840
+ --pf-v5-c-breadcrumb__link--TextDecoration: var(--pf-v5-c-breadcrumb__link--hover--TextDecoration);
2841
+ }
2842
+
2843
+ .pf-v5-c-breadcrumb__link.pf-m-current {
2844
+ cursor: default;
2845
+ }
2846
+
2847
+ .pf-v5-c-breadcrumb__link.pf-m-current, .pf-v5-c-breadcrumb__link.pf-m-current:hover {
2848
+ color: var(--pf-v5-c-breadcrumb__link--m-current--Color);
2849
+ text-decoration: none;
2850
+ }
2851
+
2852
+ button.pf-v5-c-breadcrumb__link {
2853
+ border: none;
2854
+ }
2855
+
2856
+ .pf-v5-c-breadcrumb__dropdown {
2857
+ margin-block-start: var(--pf-v5-c-breadcrumb__dropdown--MarginTop);
2858
+ margin-block-end: var(--pf-v5-c-breadcrumb__dropdown--MarginBottom);
2859
+ margin-inline-start: var(--pf-v5-c-breadcrumb__dropdown--MarginLeft);
2860
+ margin-inline-end: var(--pf-v5-c-breadcrumb__dropdown--MarginRight);
2861
+ }
2862
+
2863
+ .pf-v5-c-breadcrumb__dropdown .pf-v5-c-dropdown__toggle {
2864
+ line-height: var(--pf-v5-c-breadcrumb__dropdown--c-dropdown__toggle--LineHeight);
2865
+ }
2866
+
2867
+ .pf-v5-c-breadcrumb__heading {
2868
+ display: inline;
2869
+ font-size: var(--pf-v5-c-breadcrumb__heading--FontSize);
2870
+ }
2871
+
2872
+ .pf-v5-c-breadcrumb__link,
2873
+ .pf-v5-c-breadcrumb__heading {
2874
+ white-space: normal;
2875
+ }
2876
+
2877
+ .pf-v5-c-breadcrumb__list > :first-child .pf-v5-c-breadcrumb__item-divider {
2878
+ display: none;
2879
+ }
2880
+
2873
2881
  .pf-v5-c-calendar-month {
2874
2882
  --pf-v5-global--Color--100: var(--pf-v5-global--Color--dark-100);
2875
2883
  --pf-v5-global--Color--200: var(--pf-v5-global--Color--dark-200);
@@ -8817,156 +8825,6 @@ label.pf-v5-c-input-group__text {
8817
8825
  --pf-v5-c-sidebar__panel--FlexBasis: 100%;
8818
8826
  }
8819
8827
  }
8820
- .pf-v5-c-label-group {
8821
- --pf-v5-c-label-group--RowGap: var(--pf-v5-global--spacer--sm);
8822
- --pf-v5-c-label-group--ColumnGap: 0;
8823
- --pf-v5-c-label-group--m-vertical--RowGap: var(--pf-v5-global--spacer--sm);
8824
- --pf-v5-c-label-group--m-vertical--ColumnGap: var(--pf-v5-global--spacer--sm);
8825
- --pf-v5-c-label-group__main--RowGap: var(--pf-v5-global--spacer--xs);
8826
- --pf-v5-c-label-group__main--ColumnGap: var(--pf-v5-global--spacer--sm);
8827
- --pf-v5-c-label-group--m-vertical__main--RowGap: var(--pf-v5-global--spacer--sm);
8828
- --pf-v5-c-label-group--m-vertical__main--ColumnGap: var(--pf-v5-global--spacer--xs);
8829
- --pf-v5-c-label-group__list--RowGap: var(--pf-v5-global--spacer--xs);
8830
- --pf-v5-c-label-group__list--ColumnGap: var(--pf-v5-global--spacer--xs);
8831
- --pf-v5-c-label-group--m-vertical__list--RowGap: var(--pf-v5-global--spacer--xs);
8832
- --pf-v5-c-label-group--m-vertical__list--ColumnGap: var(--pf-v5-global--spacer--xs);
8833
- --pf-v5-c-label-group--m-category--PaddingTop: var(--pf-v5-global--spacer--xs);
8834
- --pf-v5-c-label-group--m-category--PaddingRight: var(--pf-v5-global--spacer--xs);
8835
- --pf-v5-c-label-group--m-category--PaddingBottom: var(--pf-v5-global--spacer--xs);
8836
- --pf-v5-c-label-group--m-category--PaddingLeft: var(--pf-v5-global--spacer--sm);
8837
- --pf-v5-c-label-group--m-vertical--m-category--PaddingRight: var(--pf-v5-global--spacer--sm);
8838
- --pf-v5-c-label-group--m-category--BorderRadius: var(--pf-v5-global--BorderRadius--sm);
8839
- --pf-v5-c-label-group--m-category--BorderWidth: var(--pf-v5-global--BorderWidth--sm);
8840
- --pf-v5-c-label-group--m-category--BorderColor: var(--pf-v5-global--BorderColor--300);
8841
- --pf-v5-c-label-group--m-category--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
8842
- --pf-v5-c-label-group__label--FontSize: var(--pf-v5-global--FontSize--sm);
8843
- --pf-v5-c-label-group__label--MaxWidth: 18ch;
8844
- --pf-v5-c-label-group__close--MarginTop: calc(var(--pf-v5-global--spacer--xs) * -1);
8845
- --pf-v5-c-label-group__close--MarginBottom: calc(var(--pf-v5-global--spacer--xs) * -1);
8846
- --pf-v5-c-label-group--m-vertical__close--MarginTop: calc(var(--pf-v5-global--spacer--form-element) * -1);
8847
- --pf-v5-c-label-group--m-vertical__close--MarginRight: calc(var(--pf-v5-global--spacer--form-element) * -1);
8848
- --pf-v5-c-label-group--m-vertical__close--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
8849
- --pf-v5-c-label-group--m-vertical__close--c-button--PaddingLeft: var(--pf-v5-global--spacer--sm);
8850
- --pf-v5-c-label-group__textarea--MinWidth: 12.5rem;
8851
- --pf-v5-c-label-group__textarea--PaddingTop: 0.125rem;
8852
- --pf-v5-c-label-group__textarea--PaddingRight: var(--pf-v5-global--spacer--xs);
8853
- --pf-v5-c-label-group__textarea--PaddingBottom: 0;
8854
- --pf-v5-c-label-group__textarea--PaddingLeft: var(--pf-v5-global--spacer--xs);
8855
- display: inline-flex;
8856
- row-gap: var(--pf-v5-c-label-group--RowGap);
8857
- column-gap: var(--pf-v5-c-label-group--ColumnGap);
8858
- align-items: center;
8859
- }
8860
-
8861
- .pf-v5-c-label-group.pf-m-category {
8862
- padding-block-start: var(--pf-v5-c-label-group--m-category--PaddingTop);
8863
- padding-block-end: var(--pf-v5-c-label-group--m-category--PaddingBottom);
8864
- padding-inline-start: var(--pf-v5-c-label-group--m-category--PaddingLeft);
8865
- padding-inline-end: var(--pf-v5-c-label-group--m-category--PaddingRight);
8866
- background-color: var(--pf-v5-c-label-group--m-category--BackgroundColor);
8867
- border: var(--pf-v5-c-label-group--m-category--BorderWidth) solid var(--pf-v5-c-label-group--m-category--BorderColor);
8868
- border-radius: var(--pf-v5-c-label-group--m-category--BorderRadius);
8869
- }
8870
-
8871
- .pf-v5-c-label-group.pf-m-vertical {
8872
- --pf-v5-c-label-group--RowGap: var(--pf-v5-c-label-group--m-vertical--RowGap);
8873
- --pf-v5-c-label-group--ColumnGap: var(--pf-v5-c-label-group--m-vertical--ColumnGap);
8874
- --pf-v5-c-label-group__main--RowGap: var(--pf-v5-c-label-group--m-vertical__main--RowGap);
8875
- --pf-v5-c-label-group__main--ColumnGap: var(--pf-v5-c-label-group--m-vertical__main--ColumnGap);
8876
- --pf-v5-c-label-group__list--RowGap: var(--pf-v5-c-label-group--m-vertical__list--RowGap);
8877
- --pf-v5-c-label-group__list--ColumnGap: var(--pf-v5-c-label-group--m-vertical__list--ColumnGap);
8878
- --pf-v5-c-label-group__close--MarginTop: var(--pf-v5-c-label-group--m-vertical__close--MarginTop);
8879
- --pf-v5-c-label-group__close--MarginLeft: var(--pf-v5-c-label-group--m-vertical__close--MarginLeft);
8880
- --pf-v5-c-label-group__close--MarginBottom: 0;
8881
- --pf-v5-c-label-group__close--MarginRight: var(--pf-v5-c-label-group--m-vertical__close--MarginRight);
8882
- --pf-v5-c-label-group--m-category--PaddingRight: var(--pf-v5-c-label-group--m-vertical--m-category--PaddingRight);
8883
- }
8884
-
8885
- .pf-v5-c-label-group.pf-m-vertical.pf-v5-c-label-group {
8886
- align-items: flex-start;
8887
- }
8888
-
8889
- .pf-v5-c-label-group.pf-m-vertical .pf-v5-c-label-group__list {
8890
- flex-direction: column;
8891
- align-items: flex-start;
8892
- }
8893
-
8894
- .pf-v5-c-label-group.pf-m-vertical .pf-v5-c-label-group__main {
8895
- flex-direction: column;
8896
- }
8897
-
8898
- .pf-v5-c-label-group.pf-m-vertical .pf-v5-c-label-group__close .pf-v5-c-button {
8899
- --pf-v5-c-button--PaddingLeft: var(--pf-v5-c-label-group--m-vertical__close--c-button--PaddingLeft);
8900
- --pf-v5-c-button--PaddingRight: var(--pf-v5-c-label-group--m-vertical__close--c-button--PaddingRight);
8901
- }
8902
-
8903
- .pf-v5-c-label-group.pf-m-editable,
8904
- .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__main,
8905
- .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__list {
8906
- display: flex;
8907
- }
8908
-
8909
- .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__main,
8910
- .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__list,
8911
- .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__list-item.pf-m-textarea,
8912
- .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__textarea {
8913
- flex: 1;
8914
- }
8915
-
8916
- .pf-v5-c-label-group__main {
8917
- display: flex;
8918
- flex: 1;
8919
- flex-wrap: wrap;
8920
- row-gap: var(--pf-v5-c-label-group__main--RowGap);
8921
- column-gap: var(--pf-v5-c-label-group__main--ColumnGap);
8922
- align-items: baseline;
8923
- }
8924
-
8925
- .pf-v5-c-label-group__list {
8926
- display: inline-flex;
8927
- flex-wrap: wrap;
8928
- row-gap: var(--pf-v5-c-label-group__list--RowGap);
8929
- column-gap: var(--pf-v5-c-label-group__list--ColumnGap);
8930
- }
8931
-
8932
- .pf-v5-c-label-group__list-item {
8933
- display: inline-flex;
8934
- }
8935
-
8936
- .pf-v5-c-label-group__label {
8937
- overflow: hidden;
8938
- text-overflow: ellipsis;
8939
- white-space: nowrap;
8940
- max-width: var(--pf-v5-c-label-group__label--MaxWidth);
8941
- font-size: var(--pf-v5-c-label-group__label--FontSize);
8942
- }
8943
-
8944
- .pf-v5-c-label-group__close {
8945
- display: flex;
8946
- align-self: flex-start;
8947
- margin-block-start: var(--pf-v5-c-label-group__close--MarginTop);
8948
- margin-block-end: var(--pf-v5-c-label-group__close--MarginBottom);
8949
- margin-inline-start: var(--pf-v5-c-label-group__close--MarginLeft);
8950
- margin-inline-end: var(--pf-v5-c-label-group__close--MarginRight);
8951
- }
8952
-
8953
- .pf-v5-c-label-group__textarea {
8954
- min-width: var(--pf-v5-c-label-group__textarea--MinWidth);
8955
- padding-block-start: var(--pf-v5-c-label-group__textarea--PaddingTop);
8956
- padding-block-end: var(--pf-v5-c-label-group__textarea--PaddingBottom);
8957
- padding-inline-start: var(--pf-v5-c-label-group__textarea--PaddingLeft);
8958
- padding-inline-end: var(--pf-v5-c-label-group__textarea--PaddingRight);
8959
- white-space: nowrap;
8960
- resize: none;
8961
- border: 0;
8962
- -ms-overflow-style: none;
8963
- scrollbar-width: none;
8964
- }
8965
-
8966
- .pf-v5-c-label-group__textarea::-webkit-scrollbar {
8967
- display: none;
8968
- }
8969
-
8970
8828
  .pf-v5-c-label {
8971
8829
  --pf-v5-c-label--PaddingTop: var(--pf-v5-global--spacer--xs);
8972
8830
  --pf-v5-c-label--PaddingRight: var(--pf-v5-global--spacer--sm);
@@ -9461,6 +9319,156 @@ button.pf-v5-c-label__content:focus {
9461
9319
  --pf-v5-c-label--m-outline--m-gold__content--link--focus--before--BorderColor: var(--pf-v5-global--palette--gold-100);
9462
9320
  }
9463
9321
 
9322
+ .pf-v5-c-label-group {
9323
+ --pf-v5-c-label-group--RowGap: var(--pf-v5-global--spacer--sm);
9324
+ --pf-v5-c-label-group--ColumnGap: 0;
9325
+ --pf-v5-c-label-group--m-vertical--RowGap: var(--pf-v5-global--spacer--sm);
9326
+ --pf-v5-c-label-group--m-vertical--ColumnGap: var(--pf-v5-global--spacer--sm);
9327
+ --pf-v5-c-label-group__main--RowGap: var(--pf-v5-global--spacer--xs);
9328
+ --pf-v5-c-label-group__main--ColumnGap: var(--pf-v5-global--spacer--sm);
9329
+ --pf-v5-c-label-group--m-vertical__main--RowGap: var(--pf-v5-global--spacer--sm);
9330
+ --pf-v5-c-label-group--m-vertical__main--ColumnGap: var(--pf-v5-global--spacer--xs);
9331
+ --pf-v5-c-label-group__list--RowGap: var(--pf-v5-global--spacer--xs);
9332
+ --pf-v5-c-label-group__list--ColumnGap: var(--pf-v5-global--spacer--xs);
9333
+ --pf-v5-c-label-group--m-vertical__list--RowGap: var(--pf-v5-global--spacer--xs);
9334
+ --pf-v5-c-label-group--m-vertical__list--ColumnGap: var(--pf-v5-global--spacer--xs);
9335
+ --pf-v5-c-label-group--m-category--PaddingTop: var(--pf-v5-global--spacer--xs);
9336
+ --pf-v5-c-label-group--m-category--PaddingRight: var(--pf-v5-global--spacer--xs);
9337
+ --pf-v5-c-label-group--m-category--PaddingBottom: var(--pf-v5-global--spacer--xs);
9338
+ --pf-v5-c-label-group--m-category--PaddingLeft: var(--pf-v5-global--spacer--sm);
9339
+ --pf-v5-c-label-group--m-vertical--m-category--PaddingRight: var(--pf-v5-global--spacer--sm);
9340
+ --pf-v5-c-label-group--m-category--BorderRadius: var(--pf-v5-global--BorderRadius--sm);
9341
+ --pf-v5-c-label-group--m-category--BorderWidth: var(--pf-v5-global--BorderWidth--sm);
9342
+ --pf-v5-c-label-group--m-category--BorderColor: var(--pf-v5-global--BorderColor--300);
9343
+ --pf-v5-c-label-group--m-category--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
9344
+ --pf-v5-c-label-group__label--FontSize: var(--pf-v5-global--FontSize--sm);
9345
+ --pf-v5-c-label-group__label--MaxWidth: 18ch;
9346
+ --pf-v5-c-label-group__close--MarginTop: calc(var(--pf-v5-global--spacer--xs) * -1);
9347
+ --pf-v5-c-label-group__close--MarginBottom: calc(var(--pf-v5-global--spacer--xs) * -1);
9348
+ --pf-v5-c-label-group--m-vertical__close--MarginTop: calc(var(--pf-v5-global--spacer--form-element) * -1);
9349
+ --pf-v5-c-label-group--m-vertical__close--MarginRight: calc(var(--pf-v5-global--spacer--form-element) * -1);
9350
+ --pf-v5-c-label-group--m-vertical__close--c-button--PaddingRight: var(--pf-v5-global--spacer--sm);
9351
+ --pf-v5-c-label-group--m-vertical__close--c-button--PaddingLeft: var(--pf-v5-global--spacer--sm);
9352
+ --pf-v5-c-label-group__textarea--MinWidth: 12.5rem;
9353
+ --pf-v5-c-label-group__textarea--PaddingTop: 0.125rem;
9354
+ --pf-v5-c-label-group__textarea--PaddingRight: var(--pf-v5-global--spacer--xs);
9355
+ --pf-v5-c-label-group__textarea--PaddingBottom: 0;
9356
+ --pf-v5-c-label-group__textarea--PaddingLeft: var(--pf-v5-global--spacer--xs);
9357
+ display: inline-flex;
9358
+ row-gap: var(--pf-v5-c-label-group--RowGap);
9359
+ column-gap: var(--pf-v5-c-label-group--ColumnGap);
9360
+ align-items: center;
9361
+ }
9362
+
9363
+ .pf-v5-c-label-group.pf-m-category {
9364
+ padding-block-start: var(--pf-v5-c-label-group--m-category--PaddingTop);
9365
+ padding-block-end: var(--pf-v5-c-label-group--m-category--PaddingBottom);
9366
+ padding-inline-start: var(--pf-v5-c-label-group--m-category--PaddingLeft);
9367
+ padding-inline-end: var(--pf-v5-c-label-group--m-category--PaddingRight);
9368
+ background-color: var(--pf-v5-c-label-group--m-category--BackgroundColor);
9369
+ border: var(--pf-v5-c-label-group--m-category--BorderWidth) solid var(--pf-v5-c-label-group--m-category--BorderColor);
9370
+ border-radius: var(--pf-v5-c-label-group--m-category--BorderRadius);
9371
+ }
9372
+
9373
+ .pf-v5-c-label-group.pf-m-vertical {
9374
+ --pf-v5-c-label-group--RowGap: var(--pf-v5-c-label-group--m-vertical--RowGap);
9375
+ --pf-v5-c-label-group--ColumnGap: var(--pf-v5-c-label-group--m-vertical--ColumnGap);
9376
+ --pf-v5-c-label-group__main--RowGap: var(--pf-v5-c-label-group--m-vertical__main--RowGap);
9377
+ --pf-v5-c-label-group__main--ColumnGap: var(--pf-v5-c-label-group--m-vertical__main--ColumnGap);
9378
+ --pf-v5-c-label-group__list--RowGap: var(--pf-v5-c-label-group--m-vertical__list--RowGap);
9379
+ --pf-v5-c-label-group__list--ColumnGap: var(--pf-v5-c-label-group--m-vertical__list--ColumnGap);
9380
+ --pf-v5-c-label-group__close--MarginTop: var(--pf-v5-c-label-group--m-vertical__close--MarginTop);
9381
+ --pf-v5-c-label-group__close--MarginLeft: var(--pf-v5-c-label-group--m-vertical__close--MarginLeft);
9382
+ --pf-v5-c-label-group__close--MarginBottom: 0;
9383
+ --pf-v5-c-label-group__close--MarginRight: var(--pf-v5-c-label-group--m-vertical__close--MarginRight);
9384
+ --pf-v5-c-label-group--m-category--PaddingRight: var(--pf-v5-c-label-group--m-vertical--m-category--PaddingRight);
9385
+ }
9386
+
9387
+ .pf-v5-c-label-group.pf-m-vertical.pf-v5-c-label-group {
9388
+ align-items: flex-start;
9389
+ }
9390
+
9391
+ .pf-v5-c-label-group.pf-m-vertical .pf-v5-c-label-group__list {
9392
+ flex-direction: column;
9393
+ align-items: flex-start;
9394
+ }
9395
+
9396
+ .pf-v5-c-label-group.pf-m-vertical .pf-v5-c-label-group__main {
9397
+ flex-direction: column;
9398
+ }
9399
+
9400
+ .pf-v5-c-label-group.pf-m-vertical .pf-v5-c-label-group__close .pf-v5-c-button {
9401
+ --pf-v5-c-button--PaddingLeft: var(--pf-v5-c-label-group--m-vertical__close--c-button--PaddingLeft);
9402
+ --pf-v5-c-button--PaddingRight: var(--pf-v5-c-label-group--m-vertical__close--c-button--PaddingRight);
9403
+ }
9404
+
9405
+ .pf-v5-c-label-group.pf-m-editable,
9406
+ .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__main,
9407
+ .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__list {
9408
+ display: flex;
9409
+ }
9410
+
9411
+ .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__main,
9412
+ .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__list,
9413
+ .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__list-item.pf-m-textarea,
9414
+ .pf-v5-c-label-group.pf-m-editable .pf-v5-c-label-group__textarea {
9415
+ flex: 1;
9416
+ }
9417
+
9418
+ .pf-v5-c-label-group__main {
9419
+ display: flex;
9420
+ flex: 1;
9421
+ flex-wrap: wrap;
9422
+ row-gap: var(--pf-v5-c-label-group__main--RowGap);
9423
+ column-gap: var(--pf-v5-c-label-group__main--ColumnGap);
9424
+ align-items: baseline;
9425
+ }
9426
+
9427
+ .pf-v5-c-label-group__list {
9428
+ display: inline-flex;
9429
+ flex-wrap: wrap;
9430
+ row-gap: var(--pf-v5-c-label-group__list--RowGap);
9431
+ column-gap: var(--pf-v5-c-label-group__list--ColumnGap);
9432
+ }
9433
+
9434
+ .pf-v5-c-label-group__list-item {
9435
+ display: inline-flex;
9436
+ }
9437
+
9438
+ .pf-v5-c-label-group__label {
9439
+ overflow: hidden;
9440
+ text-overflow: ellipsis;
9441
+ white-space: nowrap;
9442
+ max-width: var(--pf-v5-c-label-group__label--MaxWidth);
9443
+ font-size: var(--pf-v5-c-label-group__label--FontSize);
9444
+ }
9445
+
9446
+ .pf-v5-c-label-group__close {
9447
+ display: flex;
9448
+ align-self: flex-start;
9449
+ margin-block-start: var(--pf-v5-c-label-group__close--MarginTop);
9450
+ margin-block-end: var(--pf-v5-c-label-group__close--MarginBottom);
9451
+ margin-inline-start: var(--pf-v5-c-label-group__close--MarginLeft);
9452
+ margin-inline-end: var(--pf-v5-c-label-group__close--MarginRight);
9453
+ }
9454
+
9455
+ .pf-v5-c-label-group__textarea {
9456
+ min-width: var(--pf-v5-c-label-group__textarea--MinWidth);
9457
+ padding-block-start: var(--pf-v5-c-label-group__textarea--PaddingTop);
9458
+ padding-block-end: var(--pf-v5-c-label-group__textarea--PaddingBottom);
9459
+ padding-inline-start: var(--pf-v5-c-label-group__textarea--PaddingLeft);
9460
+ padding-inline-end: var(--pf-v5-c-label-group__textarea--PaddingRight);
9461
+ white-space: nowrap;
9462
+ resize: none;
9463
+ border: 0;
9464
+ -ms-overflow-style: none;
9465
+ scrollbar-width: none;
9466
+ }
9467
+
9468
+ .pf-v5-c-label-group__textarea::-webkit-scrollbar {
9469
+ display: none;
9470
+ }
9471
+
9464
9472
  .pf-v5-c-list {
9465
9473
  --pf-v5-c-list--PaddingLeft: var(--pf-v5-global--spacer--lg);
9466
9474
  --pf-v5-c-list--nested--MarginTop: var(--pf-v5-global--spacer--sm);
@@ -15842,202 +15850,6 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
15842
15850
  --pf-v5-c-popover--m-success__title-text--Color: var(--pf-v5-global--success-color--100);
15843
15851
  }
15844
15852
 
15845
- .pf-v5-c-progress {
15846
- --pf-v5-c-progress--GridGap: var(--pf-v5-global--spacer--md);
15847
- --pf-v5-c-progress__bar--before--BackgroundColor: var(--pf-v5-global--primary-color--100);
15848
- --pf-v5-c-progress__bar--Height: var(--pf-v5-global--spacer--md);
15849
- --pf-v5-c-progress__bar--BackgroundColor: var(--pf-v5-global--BackgroundColor--light-100);
15850
- --pf-v5-c-progress__measure--m-static-width--MinWidth: 4.5ch;
15851
- --pf-v5-c-progress__status--Gap: var(--pf-v5-global--spacer--sm);
15852
- --pf-v5-c-progress__status-icon--Color: var(--pf-v5-global--Color--100);
15853
- --pf-v5-c-progress__bar--before--Opacity: .2;
15854
- --pf-v5-c-progress__indicator--Height: var(--pf-v5-c-progress__bar--Height);
15855
- --pf-v5-c-progress__indicator--BackgroundColor: var(--pf-v5-c-progress__bar--before--BackgroundColor);
15856
- --pf-v5-c-progress__helper-text--MarginTop: calc(var(--pf-v5-global--spacer--xs) - var(--pf-v5-c-progress--GridGap));
15857
- --pf-v5-c-progress--m-success__bar--BackgroundColor: var(--pf-v5-global--success-color--100);
15858
- --pf-v5-c-progress--m-warning__bar--BackgroundColor: var(--pf-v5-global--warning-color--100);
15859
- --pf-v5-c-progress--m-danger__bar--BackgroundColor: var(--pf-v5-global--danger-color--100);
15860
- --pf-v5-c-progress--m-success__status-icon--Color: var(--pf-v5-global--success-color--100);
15861
- --pf-v5-c-progress--m-warning__status-icon--Color: var(--pf-v5-global--warning-color--100);
15862
- --pf-v5-c-progress--m-danger__status-icon--Color: var(--pf-v5-global--danger-color--100);
15863
- --pf-v5-c-progress--m-inside__indicator--MinWidth: var(--pf-v5-global--spacer--xl);
15864
- --pf-v5-c-progress--m-inside__measure--Color: var(--pf-v5-global--Color--light-100);
15865
- --pf-v5-c-progress--m-success--m-inside__measure--Color: var(--pf-v5-global--Color--light-100);
15866
- --pf-v5-c-progress--m-warning--m-inside__measure--Color: var(--pf-v5-global--Color--dark-100);
15867
- --pf-v5-c-progress--m-inside__measure--FontSize: var(--pf-v5-global--FontSize--sm);
15868
- --pf-v5-c-progress--m-outside__measure--FontSize: var(--pf-v5-global--FontSize--sm);
15869
- --pf-v5-c-progress--m-sm__bar--Height: var(--pf-v5-global--spacer--sm);
15870
- --pf-v5-c-progress--m-sm__description--FontSize: var(--pf-v5-global--FontSize--sm);
15871
- --pf-v5-c-progress--m-sm__measure--FontSize: var(--pf-v5-global--FontSize--sm);
15872
- --pf-v5-c-progress--m-lg__bar--Height: var(--pf-v5-global--spacer--lg);
15873
- display: grid;
15874
- grid-template-rows: 1fr auto;
15875
- grid-template-columns: auto auto;
15876
- grid-gap: var(--pf-v5-c-progress--GridGap);
15877
- align-items: end;
15878
- }
15879
-
15880
- .pf-v5-c-progress.pf-m-sm {
15881
- --pf-v5-c-progress__bar--Height: var(--pf-v5-c-progress--m-sm__bar--Height);
15882
- }
15883
-
15884
- .pf-v5-c-progress.pf-m-sm .pf-v5-c-progress__description {
15885
- font-size: var(--pf-v5-c-progress--m-sm__description--FontSize);
15886
- }
15887
-
15888
- .pf-v5-c-progress.pf-m-sm .pf-v5-c-progress__measure {
15889
- font-size: var(--pf-v5-c-progress--m-sm__measure--FontSize);
15890
- }
15891
-
15892
- .pf-v5-c-progress.pf-m-lg {
15893
- --pf-v5-c-progress__bar--Height: var(--pf-v5-c-progress--m-lg__bar--Height);
15894
- }
15895
-
15896
- .pf-v5-c-progress.pf-m-inside .pf-v5-c-progress__indicator {
15897
- display: flex;
15898
- align-items: center;
15899
- justify-content: center;
15900
- min-width: var(--pf-v5-c-progress--m-inside__indicator--MinWidth);
15901
- }
15902
-
15903
- .pf-v5-c-progress.pf-m-inside .pf-v5-c-progress__measure {
15904
- font-size: var(--pf-v5-c-progress--m-inside__measure--FontSize);
15905
- color: var(--pf-v5-c-progress--m-inside__measure--Color);
15906
- text-align: center;
15907
- }
15908
-
15909
- .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__description {
15910
- grid-column: 1/3;
15911
- }
15912
-
15913
- .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__status {
15914
- grid-row: 2/3;
15915
- grid-column: 2/3;
15916
- align-self: center;
15917
- }
15918
-
15919
- .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__measure {
15920
- display: inline-block;
15921
- font-size: var(--pf-v5-c-progress--m-outside__measure--FontSize);
15922
- }
15923
-
15924
- .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__measure.pf-m-static-width {
15925
- min-width: var(--pf-v5-c-progress__measure--m-static-width--MinWidth);
15926
- text-align: start;
15927
- }
15928
-
15929
- .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__bar,
15930
- .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__indicator {
15931
- grid-column: 1/2;
15932
- }
15933
-
15934
- .pf-v5-c-progress.pf-m-singleline {
15935
- grid-template-rows: 1fr;
15936
- }
15937
-
15938
- .pf-v5-c-progress.pf-m-singleline .pf-v5-c-progress__description {
15939
- display: none;
15940
- }
15941
-
15942
- .pf-v5-c-progress.pf-m-singleline .pf-v5-c-progress__bar {
15943
- grid-row: 1/2;
15944
- grid-column: 1/2;
15945
- }
15946
-
15947
- .pf-v5-c-progress.pf-m-singleline .pf-v5-c-progress__status {
15948
- grid-row: 1/2;
15949
- grid-column: 2/3;
15950
- }
15951
-
15952
- .pf-v5-c-progress.pf-m-outside, .pf-v5-c-progress.pf-m-singleline {
15953
- grid-template-columns: 1fr fit-content(50%);
15954
- }
15955
-
15956
- .pf-v5-c-progress.pf-m-success {
15957
- --pf-v5-c-progress__bar--before--BackgroundColor: var(--pf-v5-c-progress--m-success__bar--BackgroundColor);
15958
- --pf-v5-c-progress__status-icon--Color: var(--pf-v5-c-progress--m-success__status-icon--Color);
15959
- --pf-v5-c-progress--m-inside__measure--Color: var(--pf-v5-c-progress--m-success--m-inside__measure--Color);
15960
- }
15961
-
15962
- .pf-v5-c-progress.pf-m-warning {
15963
- --pf-v5-c-progress__bar--before--BackgroundColor: var(--pf-v5-c-progress--m-warning__bar--BackgroundColor);
15964
- --pf-v5-c-progress__status-icon--Color: var(--pf-v5-c-progress--m-warning__status-icon--Color);
15965
- --pf-v5-c-progress--m-inside__measure--Color: var(--pf-v5-c-progress--m-warning--m-inside__measure--Color);
15966
- }
15967
-
15968
- .pf-v5-c-progress.pf-m-danger {
15969
- --pf-v5-c-progress__bar--before--BackgroundColor: var(--pf-v5-c-progress--m-danger__bar--BackgroundColor);
15970
- --pf-v5-c-progress__status-icon--Color: var(--pf-v5-c-progress--m-danger__status-icon--Color);
15971
- }
15972
-
15973
- .pf-v5-c-progress__description {
15974
- grid-column: 1/2;
15975
- word-break: break-word;
15976
- }
15977
-
15978
- .pf-v5-c-progress__description.pf-m-truncate {
15979
- overflow: hidden;
15980
- text-overflow: ellipsis;
15981
- white-space: nowrap;
15982
- }
15983
-
15984
- .pf-v5-c-progress__status {
15985
- display: flex;
15986
- grid-row: 1/2;
15987
- grid-column: 2/3;
15988
- gap: var(--pf-v5-c-progress__status--Gap);
15989
- align-items: flex-start;
15990
- justify-content: flex-end;
15991
- text-align: end;
15992
- word-break: break-word;
15993
- }
15994
-
15995
- .pf-v5-c-progress__status-icon {
15996
- color: var(--pf-v5-c-progress__status-icon--Color);
15997
- }
15998
-
15999
- .pf-v5-c-progress__bar::before,
16000
- .pf-v5-c-progress__indicator {
16001
- top: 0;
16002
- left: 0;
16003
- }
16004
-
16005
- .pf-v5-c-progress__bar {
16006
- position: relative;
16007
- grid-row: 2/3;
16008
- grid-column: 1/3;
16009
- align-self: center;
16010
- height: var(--pf-v5-c-progress__bar--Height);
16011
- background-color: var(--pf-v5-c-progress__bar--BackgroundColor);
16012
- }
16013
-
16014
- .pf-v5-c-progress__bar::before {
16015
- position: absolute;
16016
- width: 100%;
16017
- height: 100%;
16018
- content: "";
16019
- background-color: var(--pf-v5-c-progress__bar--before--BackgroundColor);
16020
- opacity: var(--pf-v5-c-progress__bar--before--Opacity);
16021
- }
16022
-
16023
- .pf-v5-c-progress__indicator {
16024
- position: absolute;
16025
- height: var(--pf-v5-c-progress__indicator--Height);
16026
- background-color: var(--pf-v5-c-progress__indicator--BackgroundColor);
16027
- }
16028
-
16029
- .pf-v5-c-progress__helper-text {
16030
- grid-row: 3/4;
16031
- grid-column: 1/3;
16032
- margin-block-start: var(--pf-v5-c-progress__helper-text--MarginTop);
16033
- }
16034
-
16035
- :where(.pf-v5-theme-dark) .pf-v5-c-progress {
16036
- --pf-v5-c-progress--m-inside__measure--Color: var(--pf-v5-global--palette--black-900);
16037
- --pf-v5-c-progress--m-success--m-inside__measure--Color: var(--pf-v5-global--palette--black-900);
16038
- --pf-v5-c-progress--m-warning--m-inside__measure--Color: var(--pf-v5-global--palette--black-900);
16039
- }
16040
-
16041
15853
  .pf-v5-c-progress-stepper {
16042
15854
  --pf-v5-c-progress-stepper--m-vertical--GridAutoFlow: row;
16043
15855
  --pf-v5-c-progress-stepper--m-vertical--GridTemplateColumns: auto 1fr;
@@ -16371,6 +16183,7 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
16371
16183
  }
16372
16184
 
16373
16185
  .pf-v5-c-progress-stepper__step-title.pf-m-help-text {
16186
+ padding: 0;
16374
16187
  text-decoration: underline;
16375
16188
  text-decoration-thickness: var(--pf-v5-c-progress-stepper__step-title--m-help-text--TextDecorationThickness);
16376
16189
  text-decoration-style: dashed;
@@ -16672,71 +16485,267 @@ label.pf-v5-c-menu__item:where(:not([disabled], .pf-m-disabled, .pf-m-aria-disab
16672
16485
  --pf-v5-c-progress-stepper--m-center__step-main--before--Content: "";
16673
16486
  }
16674
16487
  }
16675
- .pf-v5-c-radio {
16676
- --pf-v5-c-radio--GridGap: var(--pf-v5-global--spacer--xs) var(--pf-v5-global--spacer--sm);
16677
- --pf-v5-c-radio__label--disabled--Color: var(--pf-v5-global--disabled-color--100);
16678
- --pf-v5-c-radio__label--Color: var(--pf-v5-global--Color--100);
16679
- --pf-v5-c-radio__label--FontWeight: var(--pf-v5-global--FontWeight--normal);
16680
- --pf-v5-c-radio__label--FontSize: var(--pf-v5-global--FontSize--md);
16681
- --pf-v5-c-radio__label--LineHeight: var(--pf-v5-global--LineHeight--md);
16682
- --pf-v5-c-radio__input--TranslateY: calc((var(--pf-v5-c-radio__label--LineHeight) * var(--pf-v5-c-radio__label--FontSize) / 2 ) - 50%);
16683
- --pf-v5-c-radio__input--TranslateY--moz: var(--pf-v5-c-radio__input--TranslateY);
16684
- --pf-v5-c-radio__input--first-child--MarginLeft: 0.0625rem;
16685
- --pf-v5-c-radio__input--last-child--MarginRight: 0.0625rem;
16686
- --pf-v5-c-radio__description--FontSize: var(--pf-v5-global--FontSize--sm);
16687
- --pf-v5-c-radio__description--Color: var(--pf-v5-global--Color--200);
16688
- --pf-v5-c-radio__body--MarginTop: var(--pf-v5-global--spacer--sm);
16488
+ .pf-v5-c-progress {
16489
+ --pf-v5-c-progress--GridGap: var(--pf-v5-global--spacer--md);
16490
+ --pf-v5-c-progress__bar--before--BackgroundColor: var(--pf-v5-global--primary-color--100);
16491
+ --pf-v5-c-progress__bar--Height: var(--pf-v5-global--spacer--md);
16492
+ --pf-v5-c-progress__bar--BackgroundColor: var(--pf-v5-global--BackgroundColor--light-100);
16493
+ --pf-v5-c-progress__measure--m-static-width--MinWidth: 4.5ch;
16494
+ --pf-v5-c-progress__status--Gap: var(--pf-v5-global--spacer--sm);
16495
+ --pf-v5-c-progress__status-icon--Color: var(--pf-v5-global--Color--100);
16496
+ --pf-v5-c-progress__bar--before--Opacity: .2;
16497
+ --pf-v5-c-progress__indicator--Height: var(--pf-v5-c-progress__bar--Height);
16498
+ --pf-v5-c-progress__indicator--BackgroundColor: var(--pf-v5-c-progress__bar--before--BackgroundColor);
16499
+ --pf-v5-c-progress__helper-text--MarginTop: calc(var(--pf-v5-global--spacer--xs) - var(--pf-v5-c-progress--GridGap));
16500
+ --pf-v5-c-progress--m-success__bar--BackgroundColor: var(--pf-v5-global--success-color--100);
16501
+ --pf-v5-c-progress--m-warning__bar--BackgroundColor: var(--pf-v5-global--warning-color--100);
16502
+ --pf-v5-c-progress--m-danger__bar--BackgroundColor: var(--pf-v5-global--danger-color--100);
16503
+ --pf-v5-c-progress--m-success__status-icon--Color: var(--pf-v5-global--success-color--100);
16504
+ --pf-v5-c-progress--m-warning__status-icon--Color: var(--pf-v5-global--warning-color--100);
16505
+ --pf-v5-c-progress--m-danger__status-icon--Color: var(--pf-v5-global--danger-color--100);
16506
+ --pf-v5-c-progress--m-inside__indicator--MinWidth: var(--pf-v5-global--spacer--xl);
16507
+ --pf-v5-c-progress--m-inside__measure--Color: var(--pf-v5-global--Color--light-100);
16508
+ --pf-v5-c-progress--m-success--m-inside__measure--Color: var(--pf-v5-global--Color--light-100);
16509
+ --pf-v5-c-progress--m-warning--m-inside__measure--Color: var(--pf-v5-global--Color--dark-100);
16510
+ --pf-v5-c-progress--m-inside__measure--FontSize: var(--pf-v5-global--FontSize--sm);
16511
+ --pf-v5-c-progress--m-outside__measure--FontSize: var(--pf-v5-global--FontSize--sm);
16512
+ --pf-v5-c-progress--m-sm__bar--Height: var(--pf-v5-global--spacer--sm);
16513
+ --pf-v5-c-progress--m-sm__description--FontSize: var(--pf-v5-global--FontSize--sm);
16514
+ --pf-v5-c-progress--m-sm__measure--FontSize: var(--pf-v5-global--FontSize--sm);
16515
+ --pf-v5-c-progress--m-lg__bar--Height: var(--pf-v5-global--spacer--lg);
16689
16516
  display: grid;
16690
- grid-template-columns: auto 1fr;
16691
- grid-gap: var(--pf-v5-c-radio--GridGap);
16692
- align-items: baseline;
16517
+ grid-template-rows: 1fr auto;
16518
+ grid-template-columns: auto auto;
16519
+ grid-gap: var(--pf-v5-c-progress--GridGap);
16520
+ align-items: end;
16693
16521
  }
16694
16522
 
16695
- .pf-v5-c-radio.pf-m-standalone {
16696
- --pf-v5-c-radio--GridGap: 0;
16697
- --pf-v5-c-radio__input--TranslateY: none;
16698
- display: inline-grid;
16523
+ .pf-v5-c-progress.pf-m-sm {
16524
+ --pf-v5-c-progress__bar--Height: var(--pf-v5-c-progress--m-sm__bar--Height);
16699
16525
  }
16700
16526
 
16701
- .pf-v5-c-radio__input {
16702
- align-self: start;
16703
- -moz-transform: translateY(var(--pf-v5-c-radio__input--TranslateY--moz));
16704
- transform: translateY(var(--pf-v5-c-radio__input--TranslateY));
16527
+ .pf-v5-c-progress.pf-m-sm .pf-v5-c-progress__description {
16528
+ font-size: var(--pf-v5-c-progress--m-sm__description--FontSize);
16705
16529
  }
16706
16530
 
16707
- .pf-v5-c-radio__input:first-child {
16708
- margin-inline-start: var(--pf-v5-c-radio__input--first-child--MarginLeft);
16531
+ .pf-v5-c-progress.pf-m-sm .pf-v5-c-progress__measure {
16532
+ font-size: var(--pf-v5-c-progress--m-sm__measure--FontSize);
16709
16533
  }
16710
16534
 
16711
- .pf-v5-c-radio__input:last-child {
16712
- margin-inline-end: var(--pf-v5-c-radio__input--last-child--MarginRight);
16535
+ .pf-v5-c-progress.pf-m-lg {
16536
+ --pf-v5-c-progress__bar--Height: var(--pf-v5-c-progress--m-lg__bar--Height);
16713
16537
  }
16714
16538
 
16715
- .pf-v5-c-radio__label {
16716
- font-size: var(--pf-v5-c-radio__label--FontSize);
16717
- font-weight: var(--pf-v5-c-radio__label--FontWeight);
16718
- line-height: var(--pf-v5-c-radio__label--LineHeight);
16719
- color: var(--pf-v5-c-radio__label--Color);
16539
+ .pf-v5-c-progress.pf-m-inside .pf-v5-c-progress__indicator {
16540
+ display: flex;
16541
+ align-items: center;
16542
+ justify-content: center;
16543
+ min-width: var(--pf-v5-c-progress--m-inside__indicator--MinWidth);
16720
16544
  }
16721
16545
 
16722
- .pf-v5-c-radio__description {
16723
- grid-column: 2;
16724
- font-size: var(--pf-v5-c-radio__description--FontSize);
16725
- color: var(--pf-v5-c-radio__description--Color);
16546
+ .pf-v5-c-progress.pf-m-inside .pf-v5-c-progress__measure {
16547
+ font-size: var(--pf-v5-c-progress--m-inside__measure--FontSize);
16548
+ color: var(--pf-v5-c-progress--m-inside__measure--Color);
16549
+ text-align: center;
16726
16550
  }
16727
16551
 
16728
- .pf-v5-c-radio__body {
16729
- grid-column: 2;
16730
- margin-block-start: var(--pf-v5-c-radio__body--MarginTop);
16552
+ .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__description {
16553
+ grid-column: 1/3;
16731
16554
  }
16732
16555
 
16733
- .pf-v5-c-radio__label,
16734
- .pf-v5-c-radio__input {
16735
- justify-self: start;
16556
+ .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__status {
16557
+ grid-row: 2/3;
16558
+ grid-column: 2/3;
16559
+ align-self: center;
16736
16560
  }
16737
16561
 
16738
- label.pf-v5-c-radio, .pf-v5-c-radio__label,
16739
- .pf-v5-c-radio__input {
16562
+ .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__measure {
16563
+ display: inline-block;
16564
+ font-size: var(--pf-v5-c-progress--m-outside__measure--FontSize);
16565
+ }
16566
+
16567
+ .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__measure.pf-m-static-width {
16568
+ min-width: var(--pf-v5-c-progress__measure--m-static-width--MinWidth);
16569
+ text-align: start;
16570
+ }
16571
+
16572
+ .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__bar,
16573
+ .pf-v5-c-progress.pf-m-outside .pf-v5-c-progress__indicator {
16574
+ grid-column: 1/2;
16575
+ }
16576
+
16577
+ .pf-v5-c-progress.pf-m-singleline {
16578
+ grid-template-rows: 1fr;
16579
+ }
16580
+
16581
+ .pf-v5-c-progress.pf-m-singleline .pf-v5-c-progress__description {
16582
+ display: none;
16583
+ }
16584
+
16585
+ .pf-v5-c-progress.pf-m-singleline .pf-v5-c-progress__bar {
16586
+ grid-row: 1/2;
16587
+ grid-column: 1/2;
16588
+ }
16589
+
16590
+ .pf-v5-c-progress.pf-m-singleline .pf-v5-c-progress__status {
16591
+ grid-row: 1/2;
16592
+ grid-column: 2/3;
16593
+ }
16594
+
16595
+ .pf-v5-c-progress.pf-m-outside, .pf-v5-c-progress.pf-m-singleline {
16596
+ grid-template-columns: 1fr fit-content(50%);
16597
+ }
16598
+
16599
+ .pf-v5-c-progress.pf-m-success {
16600
+ --pf-v5-c-progress__bar--before--BackgroundColor: var(--pf-v5-c-progress--m-success__bar--BackgroundColor);
16601
+ --pf-v5-c-progress__status-icon--Color: var(--pf-v5-c-progress--m-success__status-icon--Color);
16602
+ --pf-v5-c-progress--m-inside__measure--Color: var(--pf-v5-c-progress--m-success--m-inside__measure--Color);
16603
+ }
16604
+
16605
+ .pf-v5-c-progress.pf-m-warning {
16606
+ --pf-v5-c-progress__bar--before--BackgroundColor: var(--pf-v5-c-progress--m-warning__bar--BackgroundColor);
16607
+ --pf-v5-c-progress__status-icon--Color: var(--pf-v5-c-progress--m-warning__status-icon--Color);
16608
+ --pf-v5-c-progress--m-inside__measure--Color: var(--pf-v5-c-progress--m-warning--m-inside__measure--Color);
16609
+ }
16610
+
16611
+ .pf-v5-c-progress.pf-m-danger {
16612
+ --pf-v5-c-progress__bar--before--BackgroundColor: var(--pf-v5-c-progress--m-danger__bar--BackgroundColor);
16613
+ --pf-v5-c-progress__status-icon--Color: var(--pf-v5-c-progress--m-danger__status-icon--Color);
16614
+ }
16615
+
16616
+ .pf-v5-c-progress__description {
16617
+ grid-column: 1/2;
16618
+ word-break: break-word;
16619
+ }
16620
+
16621
+ .pf-v5-c-progress__description.pf-m-truncate {
16622
+ overflow: hidden;
16623
+ text-overflow: ellipsis;
16624
+ white-space: nowrap;
16625
+ }
16626
+
16627
+ .pf-v5-c-progress__status {
16628
+ display: flex;
16629
+ grid-row: 1/2;
16630
+ grid-column: 2/3;
16631
+ gap: var(--pf-v5-c-progress__status--Gap);
16632
+ align-items: flex-start;
16633
+ justify-content: flex-end;
16634
+ text-align: end;
16635
+ word-break: break-word;
16636
+ }
16637
+
16638
+ .pf-v5-c-progress__status-icon {
16639
+ color: var(--pf-v5-c-progress__status-icon--Color);
16640
+ }
16641
+
16642
+ .pf-v5-c-progress__bar::before,
16643
+ .pf-v5-c-progress__indicator {
16644
+ top: 0;
16645
+ left: 0;
16646
+ }
16647
+
16648
+ .pf-v5-c-progress__bar {
16649
+ position: relative;
16650
+ grid-row: 2/3;
16651
+ grid-column: 1/3;
16652
+ align-self: center;
16653
+ height: var(--pf-v5-c-progress__bar--Height);
16654
+ background-color: var(--pf-v5-c-progress__bar--BackgroundColor);
16655
+ }
16656
+
16657
+ .pf-v5-c-progress__bar::before {
16658
+ position: absolute;
16659
+ width: 100%;
16660
+ height: 100%;
16661
+ content: "";
16662
+ background-color: var(--pf-v5-c-progress__bar--before--BackgroundColor);
16663
+ opacity: var(--pf-v5-c-progress__bar--before--Opacity);
16664
+ }
16665
+
16666
+ .pf-v5-c-progress__indicator {
16667
+ position: absolute;
16668
+ height: var(--pf-v5-c-progress__indicator--Height);
16669
+ background-color: var(--pf-v5-c-progress__indicator--BackgroundColor);
16670
+ }
16671
+
16672
+ .pf-v5-c-progress__helper-text {
16673
+ grid-row: 3/4;
16674
+ grid-column: 1/3;
16675
+ margin-block-start: var(--pf-v5-c-progress__helper-text--MarginTop);
16676
+ }
16677
+
16678
+ :where(.pf-v5-theme-dark) .pf-v5-c-progress {
16679
+ --pf-v5-c-progress--m-inside__measure--Color: var(--pf-v5-global--palette--black-900);
16680
+ --pf-v5-c-progress--m-success--m-inside__measure--Color: var(--pf-v5-global--palette--black-900);
16681
+ --pf-v5-c-progress--m-warning--m-inside__measure--Color: var(--pf-v5-global--palette--black-900);
16682
+ }
16683
+
16684
+ .pf-v5-c-radio {
16685
+ --pf-v5-c-radio--GridGap: var(--pf-v5-global--spacer--xs) var(--pf-v5-global--spacer--sm);
16686
+ --pf-v5-c-radio__label--disabled--Color: var(--pf-v5-global--disabled-color--100);
16687
+ --pf-v5-c-radio__label--Color: var(--pf-v5-global--Color--100);
16688
+ --pf-v5-c-radio__label--FontWeight: var(--pf-v5-global--FontWeight--normal);
16689
+ --pf-v5-c-radio__label--FontSize: var(--pf-v5-global--FontSize--md);
16690
+ --pf-v5-c-radio__label--LineHeight: var(--pf-v5-global--LineHeight--md);
16691
+ --pf-v5-c-radio__input--TranslateY: calc((var(--pf-v5-c-radio__label--LineHeight) * var(--pf-v5-c-radio__label--FontSize) / 2 ) - 50%);
16692
+ --pf-v5-c-radio__input--TranslateY--moz: var(--pf-v5-c-radio__input--TranslateY);
16693
+ --pf-v5-c-radio__input--first-child--MarginLeft: 0.0625rem;
16694
+ --pf-v5-c-radio__input--last-child--MarginRight: 0.0625rem;
16695
+ --pf-v5-c-radio__description--FontSize: var(--pf-v5-global--FontSize--sm);
16696
+ --pf-v5-c-radio__description--Color: var(--pf-v5-global--Color--200);
16697
+ --pf-v5-c-radio__body--MarginTop: var(--pf-v5-global--spacer--sm);
16698
+ display: grid;
16699
+ grid-template-columns: auto 1fr;
16700
+ grid-gap: var(--pf-v5-c-radio--GridGap);
16701
+ align-items: baseline;
16702
+ }
16703
+
16704
+ .pf-v5-c-radio.pf-m-standalone {
16705
+ --pf-v5-c-radio--GridGap: 0;
16706
+ --pf-v5-c-radio__input--TranslateY: none;
16707
+ display: inline-grid;
16708
+ }
16709
+
16710
+ .pf-v5-c-radio__input {
16711
+ align-self: start;
16712
+ -moz-transform: translateY(var(--pf-v5-c-radio__input--TranslateY--moz));
16713
+ transform: translateY(var(--pf-v5-c-radio__input--TranslateY));
16714
+ }
16715
+
16716
+ .pf-v5-c-radio__input:first-child {
16717
+ margin-inline-start: var(--pf-v5-c-radio__input--first-child--MarginLeft);
16718
+ }
16719
+
16720
+ .pf-v5-c-radio__input:last-child {
16721
+ margin-inline-end: var(--pf-v5-c-radio__input--last-child--MarginRight);
16722
+ }
16723
+
16724
+ .pf-v5-c-radio__label {
16725
+ font-size: var(--pf-v5-c-radio__label--FontSize);
16726
+ font-weight: var(--pf-v5-c-radio__label--FontWeight);
16727
+ line-height: var(--pf-v5-c-radio__label--LineHeight);
16728
+ color: var(--pf-v5-c-radio__label--Color);
16729
+ }
16730
+
16731
+ .pf-v5-c-radio__description {
16732
+ grid-column: 2;
16733
+ font-size: var(--pf-v5-c-radio__description--FontSize);
16734
+ color: var(--pf-v5-c-radio__description--Color);
16735
+ }
16736
+
16737
+ .pf-v5-c-radio__body {
16738
+ grid-column: 2;
16739
+ margin-block-start: var(--pf-v5-c-radio__body--MarginTop);
16740
+ }
16741
+
16742
+ .pf-v5-c-radio__label,
16743
+ .pf-v5-c-radio__input {
16744
+ justify-self: start;
16745
+ }
16746
+
16747
+ label.pf-v5-c-radio, .pf-v5-c-radio__label,
16748
+ .pf-v5-c-radio__input {
16740
16749
  cursor: pointer;
16741
16750
  }
16742
16751
 
@@ -16921,203 +16930,6 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
16921
16930
  --pf-v5-c-text-input-group__text--after--BorderBottomColor: var(--pf-v5-global--BorderColor--400);
16922
16931
  }
16923
16932
 
16924
- .pf-v5-c-skeleton {
16925
- --pf-v5-c-skeleton--BackgroundColor: var(--pf-v5-global--palette--black-150);
16926
- --pf-v5-c-skeleton--Width: auto;
16927
- --pf-v5-c-skeleton--Height: auto;
16928
- --pf-v5-c-skeleton--BorderRadius: var(--pf-v5-global--BorderRadius--sm);
16929
- --pf-v5-c-skeleton--before--PaddingBottom: 0;
16930
- --pf-v5-c-skeleton--before--Height: auto;
16931
- --pf-v5-c-skeleton--before--Content: " ";
16932
- --pf-v5-c-skeleton--after--LinearGradientAngle: 90deg;
16933
- --pf-v5-c-skeleton--after--LinearGradientColorStop1: var(--pf-v5-global--palette--black-150);
16934
- --pf-v5-c-skeleton--after--LinearGradientColorStop2: #ededed;
16935
- --pf-v5-c-skeleton--after--LinearGradientColorStop3: var(--pf-v5-global--palette--black-150);
16936
- --pf-v5-c-skeleton--after--TranslateX: -100%;
16937
- --pf-v5-c-skeleton--after--AnimationName: pf-v5-c-skeleton-loading;
16938
- --pf-v5-c-skeleton--after--AnimationDuration: 2s;
16939
- --pf-v5-c-skeleton--after--AnimationIterationCount: infinite;
16940
- --pf-v5-c-skeleton--after--AnimationTimingFunction: linear;
16941
- --pf-v5-c-skeleton--after--AnimationDelay: .5s;
16942
- --pf-v5-c-skeleton--m-circle--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
16943
- --pf-v5-c-skeleton--m-circle--before--PaddingBottom: 100%;
16944
- --pf-v5-c-skeleton--m-text-4xl--Height: calc(var(--pf-v5-global--FontSize--4xl) * var(--pf-v5-global--LineHeight--sm));
16945
- --pf-v5-c-skeleton--m-text-3xl--Height: calc(var(--pf-v5-global--FontSize--3xl) * var(--pf-v5-global--LineHeight--sm));
16946
- --pf-v5-c-skeleton--m-text-2xl--Height: calc(var(--pf-v5-global--FontSize--2xl) * var(--pf-v5-global--LineHeight--sm));
16947
- --pf-v5-c-skeleton--m-text-xl--Height: calc(var(--pf-v5-global--FontSize--xl) * var(--pf-v5-global--LineHeight--sm));
16948
- --pf-v5-c-skeleton--m-text-lg--Height: calc(var(--pf-v5-global--FontSize--lg) * var(--pf-v5-global--LineHeight--md));
16949
- --pf-v5-c-skeleton--m-text-md--Height: calc(var(--pf-v5-global--FontSize--md) * var(--pf-v5-global--LineHeight--md));
16950
- --pf-v5-c-skeleton--m-text-sm--Height: calc(var(--pf-v5-global--FontSize--sm) * var(--pf-v5-global--LineHeight--md));
16951
- --pf-v5-c-skeleton--m-width-sm--Width: 6.25rem;
16952
- --pf-v5-c-skeleton--m-width-md--Width: 12.5rem;
16953
- --pf-v5-c-skeleton--m-width-lg--Width: 18.75rem;
16954
- --pf-v5-c-skeleton--m-width-25--Width: 25%;
16955
- --pf-v5-c-skeleton--m-width-33--Width: calc(100% / 3);
16956
- --pf-v5-c-skeleton--m-width-50--Width: 50%;
16957
- --pf-v5-c-skeleton--m-width-66--Width: calc(100% / 3 * 2);
16958
- --pf-v5-c-skeleton--m-width-75--Width: 75%;
16959
- --pf-v5-c-skeleton--m-height-sm--Height: 6.25rem;
16960
- --pf-v5-c-skeleton--m-height-md--Height: 12.5rem;
16961
- --pf-v5-c-skeleton--m-height-lg--Height: 18.75rem;
16962
- --pf-v5-c-skeleton--m-height-25--Height: 25%;
16963
- --pf-v5-c-skeleton--m-height-33--Height: calc(100% / 3);
16964
- --pf-v5-c-skeleton--m-height-50--Height: 50%;
16965
- --pf-v5-c-skeleton--m-height-66--Height: calc(100% / 3 * 2);
16966
- --pf-v5-c-skeleton--m-height-75--Height: 75%;
16967
- --pf-v5-c-skeleton--m-height-100--Height: 100%;
16968
- position: relative;
16969
- width: var(--pf-v5-c-skeleton--Width);
16970
- height: var(--pf-v5-c-skeleton--Height);
16971
- overflow: hidden;
16972
- background-color: var(--pf-v5-c-skeleton--BackgroundColor);
16973
- border-radius: var(--pf-v5-c-skeleton--BorderRadius);
16974
- transform: translate(0);
16975
- }
16976
-
16977
- .pf-v5-c-skeleton::before {
16978
- display: block;
16979
- height: var(--pf-v5-c-skeleton--before--Height);
16980
- padding-block-end: var(--pf-v5-c-skeleton--before--PaddingBottom);
16981
- content: var(--pf-v5-c-skeleton--before--Content);
16982
- }
16983
-
16984
- .pf-v5-c-skeleton::after {
16985
- position: absolute;
16986
- inset: 0;
16987
- display: block;
16988
- content: "";
16989
- background: linear-gradient(var(--pf-v5-c-skeleton--after--LinearGradientAngle), var(--pf-v5-c-skeleton--after--LinearGradientColorStop1), var(--pf-v5-c-skeleton--after--LinearGradientColorStop2), var(--pf-v5-c-skeleton--after--LinearGradientColorStop3));
16990
- transform: translate3d(var(--pf-v5-c-skeleton--after--TranslateX), 0, 0);
16991
- animation: var(--pf-v5-c-skeleton--after--AnimationName) var(--pf-v5-c-skeleton--after--AnimationDuration) var(--pf-v5-c-skeleton--after--AnimationTimingFunction) var(--pf-v5-c-skeleton--after--AnimationDelay) var(--pf-v5-c-skeleton--after--AnimationIterationCount);
16992
- }
16993
-
16994
- :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-skeleton::after {
16995
- scale: -1 1;
16996
- }
16997
-
16998
- .pf-v5-c-skeleton.pf-m-circle {
16999
- --pf-v5-c-skeleton--BorderRadius: var(--pf-v5-c-skeleton--m-circle--BorderRadius);
17000
- }
17001
-
17002
- .pf-v5-c-skeleton.pf-m-square, .pf-v5-c-skeleton.pf-m-circle {
17003
- --pf-v5-c-skeleton--before--Height: 0;
17004
- --pf-v5-c-skeleton--before--PaddingBottom: var(--pf-v5-c-skeleton--m-circle--before--PaddingBottom);
17005
- }
17006
-
17007
- .pf-v5-c-skeleton.pf-m-width-sm {
17008
- --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-sm--Width);
17009
- }
17010
-
17011
- .pf-v5-c-skeleton.pf-m-width-md {
17012
- --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-md--Width);
17013
- }
17014
-
17015
- .pf-v5-c-skeleton.pf-m-width-lg {
17016
- --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-lg--Width);
17017
- }
17018
-
17019
- .pf-v5-c-skeleton.pf-m-width-25 {
17020
- --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-25--Width);
17021
- }
17022
-
17023
- .pf-v5-c-skeleton.pf-m-width-33 {
17024
- --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-33--Width);
17025
- }
17026
-
17027
- .pf-v5-c-skeleton.pf-m-width-50 {
17028
- --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-50--Width);
17029
- }
17030
-
17031
- .pf-v5-c-skeleton.pf-m-width-66 {
17032
- --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-66--Width);
17033
- }
17034
-
17035
- .pf-v5-c-skeleton.pf-m-width-75 {
17036
- --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-75--Width);
17037
- }
17038
-
17039
- .pf-v5-c-skeleton.pf-m-height-sm {
17040
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-sm--Height);
17041
- }
17042
-
17043
- .pf-v5-c-skeleton.pf-m-height-md {
17044
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-md--Height);
17045
- }
17046
-
17047
- .pf-v5-c-skeleton.pf-m-height-lg {
17048
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-lg--Height);
17049
- }
17050
-
17051
- .pf-v5-c-skeleton.pf-m-height-25 {
17052
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-25--Height);
17053
- }
17054
-
17055
- .pf-v5-c-skeleton.pf-m-height-33 {
17056
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-33--Height);
17057
- }
17058
-
17059
- .pf-v5-c-skeleton.pf-m-height-50 {
17060
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-50--Height);
17061
- }
17062
-
17063
- .pf-v5-c-skeleton.pf-m-height-66 {
17064
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-66--Height);
17065
- }
17066
-
17067
- .pf-v5-c-skeleton.pf-m-height-75 {
17068
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-75--Height);
17069
- }
17070
-
17071
- .pf-v5-c-skeleton.pf-m-height-100 {
17072
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-100--Height);
17073
- }
17074
-
17075
- .pf-v5-c-skeleton.pf-m-text-4xl {
17076
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-4xl--Height);
17077
- }
17078
-
17079
- .pf-v5-c-skeleton.pf-m-text-3xl {
17080
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-3xl--Height);
17081
- }
17082
-
17083
- .pf-v5-c-skeleton.pf-m-text-2xl {
17084
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-2xl--Height);
17085
- }
17086
-
17087
- .pf-v5-c-skeleton.pf-m-text-xl {
17088
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-xl--Height);
17089
- }
17090
-
17091
- .pf-v5-c-skeleton.pf-m-text-lg {
17092
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-lg--Height);
17093
- }
17094
-
17095
- .pf-v5-c-skeleton.pf-m-text-md {
17096
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-md--Height);
17097
- }
17098
-
17099
- .pf-v5-c-skeleton.pf-m-text-sm {
17100
- --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-sm--Height);
17101
- }
17102
-
17103
- @keyframes pf-v5-c-skeleton-loading {
17104
- 0% {
17105
- transform: translateX(-100%);
17106
- }
17107
- 60% {
17108
- transform: translateX(100%);
17109
- }
17110
- 100% {
17111
- transform: translateX(100%);
17112
- }
17113
- }
17114
- :where(.pf-v5-theme-dark) .pf-v5-c-skeleton {
17115
- --pf-v5-c-skeleton--BackgroundColor: var(--pf-v5-global--palette--black-600);
17116
- --pf-v5-c-skeleton--after--LinearGradientColorStop1: var(--pf-v5-global--palette--black-600);
17117
- --pf-v5-c-skeleton--after--LinearGradientColorStop2: var(--pf-v5-global--palette--black-500);
17118
- --pf-v5-c-skeleton--after--LinearGradientColorStop3: var(--pf-v5-global--palette--black-600);
17119
- }
17120
-
17121
16933
  .pf-v5-c-simple-list {
17122
16934
  --pf-v5-c-simple-list__item-link--PaddingTop: var(--pf-v5-global--spacer--xs);
17123
16935
  --pf-v5-c-simple-list__item-link--PaddingRight: var(--pf-v5-global--spacer--md);
@@ -17212,252 +17024,215 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
17212
17024
  --pf-v5-c-simple-list__item-link--active--BackgroundColor: var(--pf-v5-global--BackgroundColor--400);
17213
17025
  }
17214
17026
 
17215
- .pf-v5-c-skip-to-content {
17216
- --pf-v5-c-skip-to-content--Top: var(--pf-v5-global--spacer--md);
17217
- --pf-v5-c-skip-to-content--ZIndex: var(--pf-v5-global--ZIndex--2xl);
17218
- --pf-v5-c-skip-to-content--focus--Left: var(--pf-v5-global--spacer--md);
17219
- position: absolute;
17220
- inset-block-start: var(--pf-v5-c-skip-to-content--Top);
17221
- inset-inline-start: -300%;
17222
- z-index: var(--pf-v5-c-skip-to-content--ZIndex);
17027
+ .pf-v5-c-skeleton {
17028
+ --pf-v5-c-skeleton--BackgroundColor: var(--pf-v5-global--palette--black-150);
17029
+ --pf-v5-c-skeleton--Width: auto;
17030
+ --pf-v5-c-skeleton--Height: auto;
17031
+ --pf-v5-c-skeleton--BorderRadius: var(--pf-v5-global--BorderRadius--sm);
17032
+ --pf-v5-c-skeleton--before--PaddingBottom: 0;
17033
+ --pf-v5-c-skeleton--before--Height: auto;
17034
+ --pf-v5-c-skeleton--before--Content: " ";
17035
+ --pf-v5-c-skeleton--after--LinearGradientAngle: 90deg;
17036
+ --pf-v5-c-skeleton--after--LinearGradientColorStop1: var(--pf-v5-global--palette--black-150);
17037
+ --pf-v5-c-skeleton--after--LinearGradientColorStop2: #ededed;
17038
+ --pf-v5-c-skeleton--after--LinearGradientColorStop3: var(--pf-v5-global--palette--black-150);
17039
+ --pf-v5-c-skeleton--after--TranslateX: -100%;
17040
+ --pf-v5-c-skeleton--after--AnimationName: pf-v5-c-skeleton-loading;
17041
+ --pf-v5-c-skeleton--after--AnimationDuration: 2s;
17042
+ --pf-v5-c-skeleton--after--AnimationIterationCount: infinite;
17043
+ --pf-v5-c-skeleton--after--AnimationTimingFunction: linear;
17044
+ --pf-v5-c-skeleton--after--AnimationDelay: .5s;
17045
+ --pf-v5-c-skeleton--m-circle--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
17046
+ --pf-v5-c-skeleton--m-circle--before--PaddingBottom: 100%;
17047
+ --pf-v5-c-skeleton--m-text-4xl--Height: calc(var(--pf-v5-global--FontSize--4xl) * var(--pf-v5-global--LineHeight--sm));
17048
+ --pf-v5-c-skeleton--m-text-3xl--Height: calc(var(--pf-v5-global--FontSize--3xl) * var(--pf-v5-global--LineHeight--sm));
17049
+ --pf-v5-c-skeleton--m-text-2xl--Height: calc(var(--pf-v5-global--FontSize--2xl) * var(--pf-v5-global--LineHeight--sm));
17050
+ --pf-v5-c-skeleton--m-text-xl--Height: calc(var(--pf-v5-global--FontSize--xl) * var(--pf-v5-global--LineHeight--sm));
17051
+ --pf-v5-c-skeleton--m-text-lg--Height: calc(var(--pf-v5-global--FontSize--lg) * var(--pf-v5-global--LineHeight--md));
17052
+ --pf-v5-c-skeleton--m-text-md--Height: calc(var(--pf-v5-global--FontSize--md) * var(--pf-v5-global--LineHeight--md));
17053
+ --pf-v5-c-skeleton--m-text-sm--Height: calc(var(--pf-v5-global--FontSize--sm) * var(--pf-v5-global--LineHeight--md));
17054
+ --pf-v5-c-skeleton--m-width-sm--Width: 6.25rem;
17055
+ --pf-v5-c-skeleton--m-width-md--Width: 12.5rem;
17056
+ --pf-v5-c-skeleton--m-width-lg--Width: 18.75rem;
17057
+ --pf-v5-c-skeleton--m-width-25--Width: 25%;
17058
+ --pf-v5-c-skeleton--m-width-33--Width: calc(100% / 3);
17059
+ --pf-v5-c-skeleton--m-width-50--Width: 50%;
17060
+ --pf-v5-c-skeleton--m-width-66--Width: calc(100% / 3 * 2);
17061
+ --pf-v5-c-skeleton--m-width-75--Width: 75%;
17062
+ --pf-v5-c-skeleton--m-height-sm--Height: 6.25rem;
17063
+ --pf-v5-c-skeleton--m-height-md--Height: 12.5rem;
17064
+ --pf-v5-c-skeleton--m-height-lg--Height: 18.75rem;
17065
+ --pf-v5-c-skeleton--m-height-25--Height: 25%;
17066
+ --pf-v5-c-skeleton--m-height-33--Height: calc(100% / 3);
17067
+ --pf-v5-c-skeleton--m-height-50--Height: 50%;
17068
+ --pf-v5-c-skeleton--m-height-66--Height: calc(100% / 3 * 2);
17069
+ --pf-v5-c-skeleton--m-height-75--Height: 75%;
17070
+ --pf-v5-c-skeleton--m-height-100--Height: 100%;
17071
+ position: relative;
17072
+ width: var(--pf-v5-c-skeleton--Width);
17073
+ height: var(--pf-v5-c-skeleton--Height);
17074
+ overflow: hidden;
17075
+ background-color: var(--pf-v5-c-skeleton--BackgroundColor);
17076
+ border-radius: var(--pf-v5-c-skeleton--BorderRadius);
17077
+ transform: translate(0);
17223
17078
  }
17224
17079
 
17225
- .pf-v5-c-skip-to-content:focus-within {
17226
- inset-inline-start: var(--pf-v5-c-skip-to-content--focus--Left);
17080
+ .pf-v5-c-skeleton::before {
17081
+ display: block;
17082
+ height: var(--pf-v5-c-skeleton--before--Height);
17083
+ padding-block-end: var(--pf-v5-c-skeleton--before--PaddingBottom);
17084
+ content: var(--pf-v5-c-skeleton--before--Content);
17227
17085
  }
17228
17086
 
17229
- .pf-v5-c-slider {
17230
- --pf-v5-c-slider--value: 0;
17231
- --pf-v5-c-slider__step--Left: 0;
17232
- --pf-v5-c-slider__rail--PaddingTop: var(--pf-v5-global--spacer--md);
17233
- --pf-v5-c-slider__rail--PaddingBottom: var(--pf-v5-global--spacer--md);
17234
- --pf-v5-c-slider__rail-track--Height: 0.25rem;
17235
- --pf-v5-c-slider__rail-track--before--base--BackgroundColor: var(--pf-v5-global--BorderColor--100);
17236
- --pf-v5-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-v5-global--active-color--300);
17237
- --pf-v5-c-slider__rail-track--before--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
17238
- --pf-v5-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop: var(--pf-v5-c-slider--value);
17239
- --pf-v5-c-slider__rail-track--before--fill--direction: right;
17240
- --pf-v5-c-slider__steps--FontSize: var(--pf-v5-global--FontSize--sm);
17241
- --pf-v5-c-slider__steps--Height: var(--pf-v5-c-slider__steps--FontSize);
17242
- --pf-v5-c-slider__step-tick--Top: var(--pf-v5-global--spacer--md);
17243
- --pf-v5-c-slider__step-tick--Width: 0.25rem;
17244
- --pf-v5-c-slider__step-tick--Height: 0.25rem;
17245
- --pf-v5-c-slider__step-tick--BackgroundColor: var(--pf-v5-global--BorderColor--200);
17246
- --pf-v5-c-slider__step-tick--TranslateX: -50%;
17247
- --pf-v5-c-slider__step-tick--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
17248
- --pf-v5-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-v5-global--primary-color--100);
17249
- --pf-v5-c-slider__step--first-child__step-tick--TranslateX: 0;
17250
- --pf-v5-c-slider__step--last-child__step-tick--TranslateX: -100%;
17251
- --pf-v5-c-slider__step-label--TranslateX: -50%;
17252
- --pf-v5-c-slider__step-label--Top: calc(var(--pf-v5-global--spacer--xl) + var(--pf-v5-c-slider__rail-track--Height));
17253
- --pf-v5-c-slider__step--first-child__step-label--TranslateX: 0;
17254
- --pf-v5-c-slider__step--last-child__step-label--TranslateX: -100%;
17255
- --pf-v5-c-slider__thumb--Top: calc(var(--pf-v5-c-slider__rail-track--Height) / 2 + var(--pf-v5-global--spacer--md));
17256
- --pf-v5-c-slider__thumb--Width: 1rem;
17257
- --pf-v5-c-slider__thumb--Height: 1rem;
17258
- --pf-v5-c-slider__thumb--Left: var(--pf-v5-c-slider--value);
17259
- --pf-v5-c-slider__thumb--BackgroundColor: var(--pf-v5-global--primary-color--100);
17260
- --pf-v5-c-slider__thumb--TranslateX: -50%;
17261
- --pf-v5-c-slider__thumb--TranslateY: -50%;
17262
- --pf-v5-c-slider__thumb--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
17263
- --pf-v5-c-slider__thumb--BoxShadow--base:
17264
- 0 0 0 2px var(--pf-v5-global--BackgroundColor--100),
17265
- 0 0 0 3px var(--pf-v5-global--primary-color--100);
17266
- --pf-v5-c-slider__thumb--hover--BoxShadow: var(--pf-v5-c-slider__thumb--BoxShadow--base);
17267
- --pf-v5-c-slider__thumb--focus--BoxShadow: var(--pf-v5-c-slider__thumb--BoxShadow--base);
17268
- --pf-v5-c-slider__thumb--active--BoxShadow:
17269
- var(--pf-v5-c-slider__thumb--BoxShadow--base),
17270
- 0 0 2px 5px var(--pf-v5-global--active-color--200);
17271
- --pf-v5-c-slider__thumb--before--Width: var(--pf-v5-global--target-size--MinWidth);
17272
- --pf-v5-c-slider__thumb--before--Height: var(--pf-v5-global--target-size--MinHeight);
17273
- --pf-v5-c-slider__thumb--before--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
17274
- --pf-v5-c-slider__thumb--before--TranslateX: -50%;
17275
- --pf-v5-c-slider__thumb--before--TranslateY: -50%;
17276
- --pf-v5-c-slider__value--MarginLeft: var(--pf-v5-global--spacer--md);
17277
- --pf-v5-c-slider__value--c-form-control--width-base: 3.5ch;
17278
- --pf-v5-c-slider__value--c-form-control--width-chars: 3;
17279
- --pf-v5-c-slider__value--c-form-control--Width: calc(var(--pf-v5-c-slider__value--c-form-control--width-base) + (var(--pf-v5-c-slider__value--c-form-control--width-chars) * 1ch));
17280
- --pf-v5-c-slider__value--m-floating--TranslateX: -50%;
17281
- --pf-v5-c-slider__value--m-floating--TranslateY: -100%;
17282
- --pf-v5-c-slider__value--m-floating--Left: var(--pf-v5-c-slider--value);
17283
- --pf-v5-c-slider__value--m-floating--ZIndex: var(--pf-v5-global--ZIndex--sm);
17284
- --pf-v5-c-slider__actions--MarginRight: var(--pf-v5-global--spacer--sm);
17285
- --pf-v5-c-slider__main--actions--MarginLeft: var(--pf-v5-global--spacer--sm);
17286
- --pf-v5-c-slider--m-disabled__rail-track--before--fill--BackgroundColor: var(--pf-v5-global--palette--black-500);
17287
- --pf-v5-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor: var(--pf-v5-global--palette--black-700);
17288
- --pf-v5-c-slider--m-disabled__thumb--BackgroundColor: var(--pf-v5-global--palette--black-700);
17289
- display: flex;
17087
+ .pf-v5-c-skeleton::after {
17088
+ position: absolute;
17089
+ inset: 0;
17090
+ display: block;
17091
+ content: "";
17092
+ background: linear-gradient(var(--pf-v5-c-skeleton--after--LinearGradientAngle), var(--pf-v5-c-skeleton--after--LinearGradientColorStop1), var(--pf-v5-c-skeleton--after--LinearGradientColorStop2), var(--pf-v5-c-skeleton--after--LinearGradientColorStop3));
17093
+ transform: translate3d(var(--pf-v5-c-skeleton--after--TranslateX), 0, 0);
17094
+ animation: var(--pf-v5-c-skeleton--after--AnimationName) var(--pf-v5-c-skeleton--after--AnimationDuration) var(--pf-v5-c-skeleton--after--AnimationTimingFunction) var(--pf-v5-c-skeleton--after--AnimationDelay) var(--pf-v5-c-skeleton--after--AnimationIterationCount);
17290
17095
  }
17291
17096
 
17292
- :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider {
17293
- --pf-v5-c-slider__rail-track--before--fill--direction: left;
17097
+ :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-skeleton::after {
17098
+ scale: -1 1;
17294
17099
  }
17295
17100
 
17296
- .pf-v5-c-slider.pf-m-disabled {
17297
- --pf-v5-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-v5-c-slider--m-disabled__rail-track--before--fill--BackgroundColor);
17298
- --pf-v5-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-v5-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor);
17299
- --pf-v5-c-slider__thumb--BackgroundColor: var(--pf-v5-c-slider--m-disabled__thumb--BackgroundColor);
17101
+ .pf-v5-c-skeleton.pf-m-circle {
17102
+ --pf-v5-c-skeleton--BorderRadius: var(--pf-v5-c-skeleton--m-circle--BorderRadius);
17300
17103
  }
17301
17104
 
17302
- .pf-v5-c-slider.pf-m-disabled .pf-v5-c-slider__rail,
17303
- .pf-v5-c-slider.pf-m-disabled .pf-v5-c-slider__thumb {
17304
- cursor: not-allowed;
17105
+ .pf-v5-c-skeleton.pf-m-square, .pf-v5-c-skeleton.pf-m-circle {
17106
+ --pf-v5-c-skeleton--before--Height: 0;
17107
+ --pf-v5-c-skeleton--before--PaddingBottom: var(--pf-v5-c-skeleton--m-circle--before--PaddingBottom);
17305
17108
  }
17306
17109
 
17307
- .pf-v5-c-slider.pf-m-disabled .pf-v5-c-slider__thumb {
17308
- --pf-v5-c-slider__thumb--BoxShadow: none;
17110
+ .pf-v5-c-skeleton.pf-m-width-sm {
17111
+ --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-sm--Width);
17309
17112
  }
17310
17113
 
17311
- .pf-v5-c-slider__main {
17312
- position: relative;
17313
- flex-grow: 1;
17114
+ .pf-v5-c-skeleton.pf-m-width-md {
17115
+ --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-md--Width);
17314
17116
  }
17315
17117
 
17316
- .pf-v5-c-slider__rail {
17317
- padding-block-start: var(--pf-v5-c-slider__rail--PaddingTop);
17318
- padding-block-end: var(--pf-v5-c-slider__rail--PaddingBottom);
17118
+ .pf-v5-c-skeleton.pf-m-width-lg {
17119
+ --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-lg--Width);
17319
17120
  }
17320
17121
 
17321
- .pf-v5-c-slider__rail-track {
17322
- position: relative;
17323
- height: var(--pf-v5-c-slider__rail-track--Height);
17122
+ .pf-v5-c-skeleton.pf-m-width-25 {
17123
+ --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-25--Width);
17324
17124
  }
17325
17125
 
17326
- .pf-v5-c-slider__rail-track::before {
17327
- position: absolute;
17328
- inset: 0;
17329
- content: "";
17330
- background: linear-gradient(to var(--pf-v5-c-slider__rail-track--before--fill--direction), var(--pf-v5-c-slider__rail-track--before--fill--BackgroundColor), var(--pf-v5-c-slider__rail-track--before--fill--BackgroundColor) var(--pf-v5-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop), var(--pf-v5-c-slider__rail-track--before--base--BackgroundColor) var(--pf-v5-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop));
17331
- border-radius: var(--pf-v5-c-slider__rail-track--before--BorderRadius);
17126
+ .pf-v5-c-skeleton.pf-m-width-33 {
17127
+ --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-33--Width);
17332
17128
  }
17333
17129
 
17334
- .pf-v5-c-slider__steps {
17335
- height: var(--pf-v5-c-slider__steps--Height);
17336
- font-size: var(--pf-v5-c-slider__steps--FontSize);
17337
- line-height: 1;
17130
+ .pf-v5-c-skeleton.pf-m-width-50 {
17131
+ --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-50--Width);
17338
17132
  }
17339
17133
 
17340
- .pf-v5-c-slider__step {
17341
- position: absolute;
17342
- inset-block-start: 0;
17343
- inset-inline-start: var(--pf-v5-c-slider__step--Left);
17344
- content: "";
17134
+ .pf-v5-c-skeleton.pf-m-width-66 {
17135
+ --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-66--Width);
17345
17136
  }
17346
17137
 
17347
- .pf-v5-c-slider__step.pf-m-active {
17348
- --pf-v5-c-slider__step-tick--BackgroundColor: var(--pf-v5-c-slider__step--m-active__slider-tick--BackgroundColor);
17138
+ .pf-v5-c-skeleton.pf-m-width-75 {
17139
+ --pf-v5-c-skeleton--Width: var(--pf-v5-c-skeleton--m-width-75--Width);
17349
17140
  }
17350
17141
 
17351
- .pf-v5-c-slider__step:first-child {
17352
- --pf-v5-c-slider__step-tick--TranslateX: var(--pf-v5-c-slider__step--first-child__step-tick--TranslateX);
17353
- --pf-v5-c-slider__step-label--TranslateX: var(--pf-v5-c-slider__step--first-child__step-label--TranslateX);
17142
+ .pf-v5-c-skeleton.pf-m-height-sm {
17143
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-sm--Height);
17354
17144
  }
17355
17145
 
17356
- .pf-v5-c-slider__step:last-child {
17357
- --pf-v5-c-slider__step-tick--TranslateX: var(--pf-v5-c-slider__step--last-child__step-tick--TranslateX);
17358
- --pf-v5-c-slider__step-label--TranslateX: var(--pf-v5-c-slider__step--last-child__step-label--TranslateX);
17146
+ .pf-v5-c-skeleton.pf-m-height-md {
17147
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-md--Height);
17359
17148
  }
17360
17149
 
17361
- .pf-v5-c-slider__step-tick {
17362
- transform: translateX(var(--pf-v5-c-slider__step-tick--TranslateX));
17363
- position: absolute;
17364
- inset-block-start: var(--pf-v5-c-slider__step-tick--Top);
17365
- inset-inline-start: 0;
17366
- width: var(--pf-v5-c-slider__step-tick--Width);
17367
- height: var(--pf-v5-c-slider__step-tick--Height);
17368
- background-color: var(--pf-v5-c-slider__step-tick--BackgroundColor);
17369
- border-radius: var(--pf-v5-c-slider__step-tick--BorderRadius);
17150
+ .pf-v5-c-skeleton.pf-m-height-lg {
17151
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-lg--Height);
17370
17152
  }
17371
17153
 
17372
- :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider__step-tick {
17373
- transform: translateX(calc(var(--pf-v5-c-slider__step-tick--TranslateX) * var(--pf-v5-global--inverse--multiplier)));
17154
+ .pf-v5-c-skeleton.pf-m-height-25 {
17155
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-25--Height);
17374
17156
  }
17375
17157
 
17376
- .pf-v5-c-slider__step-label {
17377
- transform: translateX(var(--pf-v5-c-slider__step-label--TranslateX));
17378
- position: absolute;
17379
- inset-block-start: var(--pf-v5-c-slider__step-label--Top);
17380
- word-break: normal;
17158
+ .pf-v5-c-skeleton.pf-m-height-33 {
17159
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-33--Height);
17381
17160
  }
17382
17161
 
17383
- :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider__step-label {
17384
- transform: translateX(calc(var(--pf-v5-c-slider__step-label--TranslateX) * var(--pf-v5-global--inverse--multiplier)));
17162
+ .pf-v5-c-skeleton.pf-m-height-50 {
17163
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-50--Height);
17385
17164
  }
17386
17165
 
17387
- .pf-v5-c-slider__thumb {
17388
- transform: translate(var(--pf-v5-c-slider__thumb--TranslateX), var(--pf-v5-c-slider__thumb--TranslateY));
17389
- position: absolute;
17390
- inset-block-start: var(--pf-v5-c-slider__thumb--Top);
17391
- inset-inline-start: var(--pf-v5-c-slider__thumb--Left);
17392
- width: var(--pf-v5-c-slider__thumb--Width);
17393
- height: var(--pf-v5-c-slider__thumb--Height);
17394
- cursor: pointer;
17395
- background-color: var(--pf-v5-c-slider__thumb--BackgroundColor);
17396
- border-radius: var(--pf-v5-c-slider__thumb--BorderRadius);
17397
- box-shadow: var(--pf-v5-c-slider__thumb--BoxShadow);
17166
+ .pf-v5-c-skeleton.pf-m-height-66 {
17167
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-66--Height);
17398
17168
  }
17399
17169
 
17400
- :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider__thumb {
17401
- transform: translate(calc(var(--pf-v5-c-slider__thumb--TranslateX) * var(--pf-v5-global--inverse--multiplier)), var(--pf-v5-c-slider__thumb--TranslateY));
17170
+ .pf-v5-c-skeleton.pf-m-height-75 {
17171
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-75--Height);
17402
17172
  }
17403
17173
 
17404
- .pf-v5-c-slider__thumb::before {
17405
- transform: translate(var(--pf-v5-c-slider__thumb--before--TranslateX), var(--pf-v5-c-slider__thumb--before--TranslateY));
17406
- position: absolute;
17407
- inset-block-start: 50%;
17408
- inset-inline-start: 50%;
17409
- width: var(--pf-v5-c-slider__thumb--before--Width);
17410
- height: var(--pf-v5-c-slider__thumb--before--Height);
17411
- content: "";
17412
- border-radius: var(--pf-v5-c-slider__thumb--before--BorderRadius);
17174
+ .pf-v5-c-skeleton.pf-m-height-100 {
17175
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-height-100--Height);
17413
17176
  }
17414
17177
 
17415
- :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider__thumb::before {
17416
- transform: translate(calc(var(--pf-v5-c-slider__thumb--before--TranslateX) * var(--pf-v5-global--inverse--multiplier)), var(--pf-v5-c-slider__thumb--before--TranslateY));
17178
+ .pf-v5-c-skeleton.pf-m-text-4xl {
17179
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-4xl--Height);
17417
17180
  }
17418
17181
 
17419
- .pf-v5-c-slider__thumb:hover {
17420
- --pf-v5-c-slider__thumb--BoxShadow: var(--pf-v5-c-slider__thumb--hover--BoxShadow);
17182
+ .pf-v5-c-skeleton.pf-m-text-3xl {
17183
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-3xl--Height);
17421
17184
  }
17422
17185
 
17423
- .pf-v5-c-slider__thumb:focus {
17424
- --pf-v5-c-slider__thumb--BoxShadow: var(--pf-v5-c-slider__thumb--focus--BoxShadow);
17425
- outline: 0;
17186
+ .pf-v5-c-skeleton.pf-m-text-2xl {
17187
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-2xl--Height);
17426
17188
  }
17427
17189
 
17428
- .pf-v5-c-slider__thumb:active {
17429
- --pf-v5-c-slider__thumb--BoxShadow: var(--pf-v5-c-slider__thumb--active--BoxShadow);
17190
+ .pf-v5-c-skeleton.pf-m-text-xl {
17191
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-xl--Height);
17430
17192
  }
17431
17193
 
17432
- .pf-v5-c-slider__value {
17433
- margin-inline-start: var(--pf-v5-c-slider__value--MarginLeft);
17194
+ .pf-v5-c-skeleton.pf-m-text-lg {
17195
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-lg--Height);
17434
17196
  }
17435
17197
 
17436
- .pf-v5-c-slider__value.pf-m-floating {
17437
- transform: translate(var(--pf-v5-c-slider__value--m-floating--TranslateX), var(--pf-v5-c-slider__value--m-floating--TranslateY));
17438
- --pf-v5-c-slider__value--MarginLeft: 0;
17439
- position: absolute;
17440
- inset-block-start: 0;
17441
- inset-inline-start: var(--pf-v5-c-slider__value--m-floating--Left);
17442
- z-index: var(--pf-v5-c-slider__value--m-floating--ZIndex);
17198
+ .pf-v5-c-skeleton.pf-m-text-md {
17199
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-md--Height);
17443
17200
  }
17444
17201
 
17445
- :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider__value.pf-m-floating {
17446
- transform: translate(calc(var(--pf-v5-c-slider__value--m-floating--TranslateX) * var(--pf-v5-global--inverse--multiplier)), var(--pf-v5-c-slider__value--m-floating--TranslateY));
17202
+ .pf-v5-c-skeleton.pf-m-text-sm {
17203
+ --pf-v5-c-skeleton--Height: var(--pf-v5-c-skeleton--m-text-sm--Height);
17204
+ }
17205
+
17206
+ @keyframes pf-v5-c-skeleton-loading {
17207
+ 0% {
17208
+ transform: translateX(-100%);
17209
+ }
17210
+ 60% {
17211
+ transform: translateX(100%);
17212
+ }
17213
+ 100% {
17214
+ transform: translateX(100%);
17215
+ }
17447
17216
  }
17448
-
17449
- .pf-v5-c-slider__value .pf-v5-c-form-control {
17450
- width: var(--pf-v5-c-slider__value--c-form-control--Width);
17217
+ :where(.pf-v5-theme-dark) .pf-v5-c-skeleton {
17218
+ --pf-v5-c-skeleton--BackgroundColor: var(--pf-v5-global--palette--black-600);
17219
+ --pf-v5-c-skeleton--after--LinearGradientColorStop1: var(--pf-v5-global--palette--black-600);
17220
+ --pf-v5-c-skeleton--after--LinearGradientColorStop2: var(--pf-v5-global--palette--black-500);
17221
+ --pf-v5-c-skeleton--after--LinearGradientColorStop3: var(--pf-v5-global--palette--black-600);
17451
17222
  }
17452
17223
 
17453
- .pf-v5-c-slider__actions {
17454
- display: flex;
17455
- margin-inline-end: var(--pf-v5-c-slider__actions--MarginRight);
17224
+ .pf-v5-c-skip-to-content {
17225
+ --pf-v5-c-skip-to-content--Top: var(--pf-v5-global--spacer--md);
17226
+ --pf-v5-c-skip-to-content--ZIndex: var(--pf-v5-global--ZIndex--2xl);
17227
+ --pf-v5-c-skip-to-content--focus--Left: var(--pf-v5-global--spacer--md);
17228
+ position: absolute;
17229
+ inset-block-start: var(--pf-v5-c-skip-to-content--Top);
17230
+ inset-inline-start: -300%;
17231
+ z-index: var(--pf-v5-c-skip-to-content--ZIndex);
17456
17232
  }
17457
17233
 
17458
- .pf-v5-c-slider__main ~ .pf-v5-c-slider__actions {
17459
- --pf-v5-c-slider__actions--MarginRight: 0;
17460
- margin-inline-start: var(--pf-v5-c-slider__main--actions--MarginLeft);
17234
+ .pf-v5-c-skip-to-content:focus-within {
17235
+ inset-inline-start: var(--pf-v5-c-skip-to-content--focus--Left);
17461
17236
  }
17462
17237
 
17463
17238
  .pf-v5-c-spinner {
@@ -17657,118 +17432,310 @@ svg.pf-v5-c-spinner.pf-m-xl {
17657
17432
  display: none;
17658
17433
  }
17659
17434
 
17660
- .pf-v5-c-switch__input:not(:checked) ~ .pf-m-on {
17661
- display: none;
17435
+ .pf-v5-c-switch__input:not(:checked) ~ .pf-m-on {
17436
+ display: none;
17437
+ }
17438
+
17439
+ .pf-v5-c-switch__input:disabled {
17440
+ cursor: not-allowed;
17441
+ }
17442
+
17443
+ .pf-v5-c-switch__input:disabled ~ .pf-v5-c-switch__label {
17444
+ color: var(--pf-v5-c-switch__input--disabled__label--Color);
17445
+ cursor: not-allowed;
17446
+ }
17447
+
17448
+ .pf-v5-c-switch__input:disabled ~ .pf-v5-c-switch__toggle {
17449
+ --pf-v5-c-switch__toggle-icon--Color: var(--pf-v5-c-switch__input--disabled__toggle-icon--Color);
17450
+ cursor: not-allowed;
17451
+ background-color: var(--pf-v5-c-switch__input--disabled__toggle--BackgroundColor);
17452
+ }
17453
+
17454
+ .pf-v5-c-switch__input:disabled ~ .pf-v5-c-switch__toggle::before {
17455
+ background-color: var(--pf-v5-c-switch__input--disabled__toggle--before--BackgroundColor);
17456
+ }
17457
+
17458
+ .pf-v5-c-switch__toggle {
17459
+ position: relative;
17460
+ display: inline-block;
17461
+ width: var(--pf-v5-c-switch__toggle--Width);
17462
+ height: var(--pf-v5-c-switch__toggle--Height);
17463
+ background-color: var(--pf-v5-c-switch__toggle--BackgroundColor);
17464
+ border-radius: var(--pf-v5-c-switch__toggle--BorderRadius);
17465
+ }
17466
+
17467
+ .pf-v5-c-switch__toggle::before {
17468
+ position: absolute;
17469
+ inset-block-start: var(--pf-v5-c-switch__toggle--before--Top);
17470
+ inset-inline-start: var(--pf-v5-c-switch__toggle--before--Left);
17471
+ display: block;
17472
+ width: var(--pf-v5-c-switch__toggle--before--Width);
17473
+ height: var(--pf-v5-c-switch__toggle--before--Height);
17474
+ content: "";
17475
+ background-color: var(--pf-v5-c-switch__toggle--before--BackgroundColor);
17476
+ border-radius: var(--pf-v5-c-switch__toggle--before--BorderRadius);
17477
+ box-shadow: var(--pf-v5-c-switch__toggle--before--BoxShadow);
17478
+ transition: var(--pf-v5-c-switch__toggle--before--Transition);
17479
+ }
17480
+
17481
+ .pf-v5-c-switch__toggle-icon {
17482
+ position: absolute;
17483
+ inset-block-start: 0;
17484
+ inset-block-end: 0;
17485
+ inset-inline-start: var(--pf-v5-c-switch__toggle-icon--Left);
17486
+ display: flex;
17487
+ align-items: center;
17488
+ font-size: var(--pf-v5-c-switch__toggle-icon--FontSize);
17489
+ color: var(--pf-v5-c-switch__toggle-icon--Color);
17490
+ }
17491
+
17492
+ .pf-v5-c-switch__label {
17493
+ display: inline-block;
17494
+ grid-column: 2;
17495
+ color: var(--pf-v5-c-switch__label--Color);
17496
+ vertical-align: top;
17497
+ }
17498
+
17499
+ :where(.pf-v5-theme-dark) .pf-v5-c-switch {
17500
+ --pf-v5-c-switch__toggle-icon--Color: var(--pf-v5-global--BackgroundColor--100);
17501
+ --pf-v5-c-switch__input--not-checked__label--Color: var(--pf-v5-global--Color--100);
17502
+ --pf-v5-c-switch__input--disabled__toggle--before--BackgroundColor: var(--pf-v5-global--disabled-color--100);
17503
+ --pf-v5-c-switch__toggle--before--BoxShadow: none;
17504
+ --pf-v5-c-switch__input--disabled__toggle-icon--Color: var(--pf-v5-global--disabled-color--100);
17505
+ }
17506
+
17507
+ .pf-v5-c-slider {
17508
+ --pf-v5-c-slider--value: 0;
17509
+ --pf-v5-c-slider__step--Left: 0;
17510
+ --pf-v5-c-slider__rail--PaddingTop: var(--pf-v5-global--spacer--md);
17511
+ --pf-v5-c-slider__rail--PaddingBottom: var(--pf-v5-global--spacer--md);
17512
+ --pf-v5-c-slider__rail-track--Height: 0.25rem;
17513
+ --pf-v5-c-slider__rail-track--before--base--BackgroundColor: var(--pf-v5-global--BorderColor--100);
17514
+ --pf-v5-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-v5-global--active-color--300);
17515
+ --pf-v5-c-slider__rail-track--before--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
17516
+ --pf-v5-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop: var(--pf-v5-c-slider--value);
17517
+ --pf-v5-c-slider__rail-track--before--fill--direction: right;
17518
+ --pf-v5-c-slider__steps--FontSize: var(--pf-v5-global--FontSize--sm);
17519
+ --pf-v5-c-slider__steps--Height: var(--pf-v5-c-slider__steps--FontSize);
17520
+ --pf-v5-c-slider__step-tick--Top: var(--pf-v5-global--spacer--md);
17521
+ --pf-v5-c-slider__step-tick--Width: 0.25rem;
17522
+ --pf-v5-c-slider__step-tick--Height: 0.25rem;
17523
+ --pf-v5-c-slider__step-tick--BackgroundColor: var(--pf-v5-global--BorderColor--200);
17524
+ --pf-v5-c-slider__step-tick--TranslateX: -50%;
17525
+ --pf-v5-c-slider__step-tick--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
17526
+ --pf-v5-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-v5-global--primary-color--100);
17527
+ --pf-v5-c-slider__step--first-child__step-tick--TranslateX: 0;
17528
+ --pf-v5-c-slider__step--last-child__step-tick--TranslateX: -100%;
17529
+ --pf-v5-c-slider__step-label--TranslateX: -50%;
17530
+ --pf-v5-c-slider__step-label--Top: calc(var(--pf-v5-global--spacer--xl) + var(--pf-v5-c-slider__rail-track--Height));
17531
+ --pf-v5-c-slider__step--first-child__step-label--TranslateX: 0;
17532
+ --pf-v5-c-slider__step--last-child__step-label--TranslateX: -100%;
17533
+ --pf-v5-c-slider__thumb--Top: calc(var(--pf-v5-c-slider__rail-track--Height) / 2 + var(--pf-v5-global--spacer--md));
17534
+ --pf-v5-c-slider__thumb--Width: 1rem;
17535
+ --pf-v5-c-slider__thumb--Height: 1rem;
17536
+ --pf-v5-c-slider__thumb--Left: var(--pf-v5-c-slider--value);
17537
+ --pf-v5-c-slider__thumb--BackgroundColor: var(--pf-v5-global--primary-color--100);
17538
+ --pf-v5-c-slider__thumb--TranslateX: -50%;
17539
+ --pf-v5-c-slider__thumb--TranslateY: -50%;
17540
+ --pf-v5-c-slider__thumb--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
17541
+ --pf-v5-c-slider__thumb--BoxShadow--base:
17542
+ 0 0 0 2px var(--pf-v5-global--BackgroundColor--100),
17543
+ 0 0 0 3px var(--pf-v5-global--primary-color--100);
17544
+ --pf-v5-c-slider__thumb--hover--BoxShadow: var(--pf-v5-c-slider__thumb--BoxShadow--base);
17545
+ --pf-v5-c-slider__thumb--focus--BoxShadow: var(--pf-v5-c-slider__thumb--BoxShadow--base);
17546
+ --pf-v5-c-slider__thumb--active--BoxShadow:
17547
+ var(--pf-v5-c-slider__thumb--BoxShadow--base),
17548
+ 0 0 2px 5px var(--pf-v5-global--active-color--200);
17549
+ --pf-v5-c-slider__thumb--before--Width: var(--pf-v5-global--target-size--MinWidth);
17550
+ --pf-v5-c-slider__thumb--before--Height: var(--pf-v5-global--target-size--MinHeight);
17551
+ --pf-v5-c-slider__thumb--before--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
17552
+ --pf-v5-c-slider__thumb--before--TranslateX: -50%;
17553
+ --pf-v5-c-slider__thumb--before--TranslateY: -50%;
17554
+ --pf-v5-c-slider__value--MarginLeft: var(--pf-v5-global--spacer--md);
17555
+ --pf-v5-c-slider__value--c-form-control--width-base: 3.5ch;
17556
+ --pf-v5-c-slider__value--c-form-control--width-chars: 3;
17557
+ --pf-v5-c-slider__value--c-form-control--Width: calc(var(--pf-v5-c-slider__value--c-form-control--width-base) + (var(--pf-v5-c-slider__value--c-form-control--width-chars) * 1ch));
17558
+ --pf-v5-c-slider__value--m-floating--TranslateX: -50%;
17559
+ --pf-v5-c-slider__value--m-floating--TranslateY: -100%;
17560
+ --pf-v5-c-slider__value--m-floating--Left: var(--pf-v5-c-slider--value);
17561
+ --pf-v5-c-slider__value--m-floating--ZIndex: var(--pf-v5-global--ZIndex--sm);
17562
+ --pf-v5-c-slider__actions--MarginRight: var(--pf-v5-global--spacer--sm);
17563
+ --pf-v5-c-slider__main--actions--MarginLeft: var(--pf-v5-global--spacer--sm);
17564
+ --pf-v5-c-slider--m-disabled__rail-track--before--fill--BackgroundColor: var(--pf-v5-global--palette--black-500);
17565
+ --pf-v5-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor: var(--pf-v5-global--palette--black-700);
17566
+ --pf-v5-c-slider--m-disabled__thumb--BackgroundColor: var(--pf-v5-global--palette--black-700);
17567
+ display: flex;
17568
+ }
17569
+
17570
+ :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider {
17571
+ --pf-v5-c-slider__rail-track--before--fill--direction: left;
17572
+ }
17573
+
17574
+ .pf-v5-c-slider.pf-m-disabled {
17575
+ --pf-v5-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-v5-c-slider--m-disabled__rail-track--before--fill--BackgroundColor);
17576
+ --pf-v5-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-v5-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor);
17577
+ --pf-v5-c-slider__thumb--BackgroundColor: var(--pf-v5-c-slider--m-disabled__thumb--BackgroundColor);
17578
+ }
17579
+
17580
+ .pf-v5-c-slider.pf-m-disabled .pf-v5-c-slider__rail,
17581
+ .pf-v5-c-slider.pf-m-disabled .pf-v5-c-slider__thumb {
17582
+ cursor: not-allowed;
17583
+ }
17584
+
17585
+ .pf-v5-c-slider.pf-m-disabled .pf-v5-c-slider__thumb {
17586
+ --pf-v5-c-slider__thumb--BoxShadow: none;
17587
+ }
17588
+
17589
+ .pf-v5-c-slider__main {
17590
+ position: relative;
17591
+ flex-grow: 1;
17592
+ }
17593
+
17594
+ .pf-v5-c-slider__rail {
17595
+ padding-block-start: var(--pf-v5-c-slider__rail--PaddingTop);
17596
+ padding-block-end: var(--pf-v5-c-slider__rail--PaddingBottom);
17597
+ }
17598
+
17599
+ .pf-v5-c-slider__rail-track {
17600
+ position: relative;
17601
+ height: var(--pf-v5-c-slider__rail-track--Height);
17602
+ }
17603
+
17604
+ .pf-v5-c-slider__rail-track::before {
17605
+ position: absolute;
17606
+ inset: 0;
17607
+ content: "";
17608
+ background: linear-gradient(to var(--pf-v5-c-slider__rail-track--before--fill--direction), var(--pf-v5-c-slider__rail-track--before--fill--BackgroundColor), var(--pf-v5-c-slider__rail-track--before--fill--BackgroundColor) var(--pf-v5-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop), var(--pf-v5-c-slider__rail-track--before--base--BackgroundColor) var(--pf-v5-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop));
17609
+ border-radius: var(--pf-v5-c-slider__rail-track--before--BorderRadius);
17610
+ }
17611
+
17612
+ .pf-v5-c-slider__steps {
17613
+ height: var(--pf-v5-c-slider__steps--Height);
17614
+ font-size: var(--pf-v5-c-slider__steps--FontSize);
17615
+ line-height: 1;
17616
+ }
17617
+
17618
+ .pf-v5-c-slider__step {
17619
+ position: absolute;
17620
+ inset-block-start: 0;
17621
+ inset-inline-start: var(--pf-v5-c-slider__step--Left);
17622
+ content: "";
17623
+ }
17624
+
17625
+ .pf-v5-c-slider__step.pf-m-active {
17626
+ --pf-v5-c-slider__step-tick--BackgroundColor: var(--pf-v5-c-slider__step--m-active__slider-tick--BackgroundColor);
17627
+ }
17628
+
17629
+ .pf-v5-c-slider__step:first-child {
17630
+ --pf-v5-c-slider__step-tick--TranslateX: var(--pf-v5-c-slider__step--first-child__step-tick--TranslateX);
17631
+ --pf-v5-c-slider__step-label--TranslateX: var(--pf-v5-c-slider__step--first-child__step-label--TranslateX);
17632
+ }
17633
+
17634
+ .pf-v5-c-slider__step:last-child {
17635
+ --pf-v5-c-slider__step-tick--TranslateX: var(--pf-v5-c-slider__step--last-child__step-tick--TranslateX);
17636
+ --pf-v5-c-slider__step-label--TranslateX: var(--pf-v5-c-slider__step--last-child__step-label--TranslateX);
17637
+ }
17638
+
17639
+ .pf-v5-c-slider__step-tick {
17640
+ transform: translateX(var(--pf-v5-c-slider__step-tick--TranslateX));
17641
+ position: absolute;
17642
+ inset-block-start: var(--pf-v5-c-slider__step-tick--Top);
17643
+ inset-inline-start: 0;
17644
+ width: var(--pf-v5-c-slider__step-tick--Width);
17645
+ height: var(--pf-v5-c-slider__step-tick--Height);
17646
+ background-color: var(--pf-v5-c-slider__step-tick--BackgroundColor);
17647
+ border-radius: var(--pf-v5-c-slider__step-tick--BorderRadius);
17648
+ }
17649
+
17650
+ :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider__step-tick {
17651
+ transform: translateX(calc(var(--pf-v5-c-slider__step-tick--TranslateX) * var(--pf-v5-global--inverse--multiplier)));
17652
+ }
17653
+
17654
+ .pf-v5-c-slider__step-label {
17655
+ transform: translateX(var(--pf-v5-c-slider__step-label--TranslateX));
17656
+ position: absolute;
17657
+ inset-block-start: var(--pf-v5-c-slider__step-label--Top);
17658
+ word-break: normal;
17659
+ }
17660
+
17661
+ :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider__step-label {
17662
+ transform: translateX(calc(var(--pf-v5-c-slider__step-label--TranslateX) * var(--pf-v5-global--inverse--multiplier)));
17662
17663
  }
17663
17664
 
17664
- .pf-v5-c-switch__input:disabled {
17665
- cursor: not-allowed;
17665
+ .pf-v5-c-slider__thumb {
17666
+ transform: translate(var(--pf-v5-c-slider__thumb--TranslateX), var(--pf-v5-c-slider__thumb--TranslateY));
17667
+ position: absolute;
17668
+ inset-block-start: var(--pf-v5-c-slider__thumb--Top);
17669
+ inset-inline-start: var(--pf-v5-c-slider__thumb--Left);
17670
+ width: var(--pf-v5-c-slider__thumb--Width);
17671
+ height: var(--pf-v5-c-slider__thumb--Height);
17672
+ cursor: pointer;
17673
+ background-color: var(--pf-v5-c-slider__thumb--BackgroundColor);
17674
+ border-radius: var(--pf-v5-c-slider__thumb--BorderRadius);
17675
+ box-shadow: var(--pf-v5-c-slider__thumb--BoxShadow);
17666
17676
  }
17667
17677
 
17668
- .pf-v5-c-switch__input:disabled ~ .pf-v5-c-switch__label {
17669
- color: var(--pf-v5-c-switch__input--disabled__label--Color);
17670
- cursor: not-allowed;
17678
+ :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider__thumb {
17679
+ transform: translate(calc(var(--pf-v5-c-slider__thumb--TranslateX) * var(--pf-v5-global--inverse--multiplier)), var(--pf-v5-c-slider__thumb--TranslateY));
17671
17680
  }
17672
17681
 
17673
- .pf-v5-c-switch__input:disabled ~ .pf-v5-c-switch__toggle {
17674
- --pf-v5-c-switch__toggle-icon--Color: var(--pf-v5-c-switch__input--disabled__toggle-icon--Color);
17675
- cursor: not-allowed;
17676
- background-color: var(--pf-v5-c-switch__input--disabled__toggle--BackgroundColor);
17682
+ .pf-v5-c-slider__thumb::before {
17683
+ transform: translate(var(--pf-v5-c-slider__thumb--before--TranslateX), var(--pf-v5-c-slider__thumb--before--TranslateY));
17684
+ position: absolute;
17685
+ inset-block-start: 50%;
17686
+ inset-inline-start: 50%;
17687
+ width: var(--pf-v5-c-slider__thumb--before--Width);
17688
+ height: var(--pf-v5-c-slider__thumb--before--Height);
17689
+ content: "";
17690
+ border-radius: var(--pf-v5-c-slider__thumb--before--BorderRadius);
17677
17691
  }
17678
17692
 
17679
- .pf-v5-c-switch__input:disabled ~ .pf-v5-c-switch__toggle::before {
17680
- background-color: var(--pf-v5-c-switch__input--disabled__toggle--before--BackgroundColor);
17693
+ :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider__thumb::before {
17694
+ transform: translate(calc(var(--pf-v5-c-slider__thumb--before--TranslateX) * var(--pf-v5-global--inverse--multiplier)), var(--pf-v5-c-slider__thumb--before--TranslateY));
17681
17695
  }
17682
17696
 
17683
- .pf-v5-c-switch__toggle {
17684
- position: relative;
17685
- display: inline-block;
17686
- width: var(--pf-v5-c-switch__toggle--Width);
17687
- height: var(--pf-v5-c-switch__toggle--Height);
17688
- background-color: var(--pf-v5-c-switch__toggle--BackgroundColor);
17689
- border-radius: var(--pf-v5-c-switch__toggle--BorderRadius);
17697
+ .pf-v5-c-slider__thumb:hover {
17698
+ --pf-v5-c-slider__thumb--BoxShadow: var(--pf-v5-c-slider__thumb--hover--BoxShadow);
17690
17699
  }
17691
17700
 
17692
- .pf-v5-c-switch__toggle::before {
17693
- position: absolute;
17694
- inset-block-start: var(--pf-v5-c-switch__toggle--before--Top);
17695
- inset-inline-start: var(--pf-v5-c-switch__toggle--before--Left);
17696
- display: block;
17697
- width: var(--pf-v5-c-switch__toggle--before--Width);
17698
- height: var(--pf-v5-c-switch__toggle--before--Height);
17699
- content: "";
17700
- background-color: var(--pf-v5-c-switch__toggle--before--BackgroundColor);
17701
- border-radius: var(--pf-v5-c-switch__toggle--before--BorderRadius);
17702
- box-shadow: var(--pf-v5-c-switch__toggle--before--BoxShadow);
17703
- transition: var(--pf-v5-c-switch__toggle--before--Transition);
17701
+ .pf-v5-c-slider__thumb:focus {
17702
+ --pf-v5-c-slider__thumb--BoxShadow: var(--pf-v5-c-slider__thumb--focus--BoxShadow);
17703
+ outline: 0;
17704
17704
  }
17705
17705
 
17706
- .pf-v5-c-switch__toggle-icon {
17707
- position: absolute;
17708
- inset-block-start: 0;
17709
- inset-block-end: 0;
17710
- inset-inline-start: var(--pf-v5-c-switch__toggle-icon--Left);
17711
- display: flex;
17712
- align-items: center;
17713
- font-size: var(--pf-v5-c-switch__toggle-icon--FontSize);
17714
- color: var(--pf-v5-c-switch__toggle-icon--Color);
17706
+ .pf-v5-c-slider__thumb:active {
17707
+ --pf-v5-c-slider__thumb--BoxShadow: var(--pf-v5-c-slider__thumb--active--BoxShadow);
17715
17708
  }
17716
17709
 
17717
- .pf-v5-c-switch__label {
17718
- display: inline-block;
17719
- grid-column: 2;
17720
- color: var(--pf-v5-c-switch__label--Color);
17721
- vertical-align: top;
17710
+ .pf-v5-c-slider__value {
17711
+ margin-inline-start: var(--pf-v5-c-slider__value--MarginLeft);
17722
17712
  }
17723
17713
 
17724
- :where(.pf-v5-theme-dark) .pf-v5-c-switch {
17725
- --pf-v5-c-switch__toggle-icon--Color: var(--pf-v5-global--BackgroundColor--100);
17726
- --pf-v5-c-switch__input--not-checked__label--Color: var(--pf-v5-global--Color--100);
17727
- --pf-v5-c-switch__input--disabled__toggle--before--BackgroundColor: var(--pf-v5-global--disabled-color--100);
17728
- --pf-v5-c-switch__toggle--before--BoxShadow: none;
17729
- --pf-v5-c-switch__input--disabled__toggle-icon--Color: var(--pf-v5-global--disabled-color--100);
17714
+ .pf-v5-c-slider__value.pf-m-floating {
17715
+ transform: translate(var(--pf-v5-c-slider__value--m-floating--TranslateX), var(--pf-v5-c-slider__value--m-floating--TranslateY));
17716
+ --pf-v5-c-slider__value--MarginLeft: 0;
17717
+ position: absolute;
17718
+ inset-block-start: 0;
17719
+ inset-inline-start: var(--pf-v5-c-slider__value--m-floating--Left);
17720
+ z-index: var(--pf-v5-c-slider__value--m-floating--ZIndex);
17730
17721
  }
17731
17722
 
17732
- .pf-v5-c-tab-content {
17733
- --pf-v5-c-tab-content__body--PaddingTop: 0;
17734
- --pf-v5-c-tab-content__body--PaddingRight: 0;
17735
- --pf-v5-c-tab-content__body--PaddingBottom: 0;
17736
- --pf-v5-c-tab-content__body--PaddingLeft: 0;
17737
- --pf-v5-c-tab-content__body--m-padding--PaddingTop: var(--pf-v5-global--spacer--md);
17738
- --pf-v5-c-tab-content__body--m-padding--PaddingRight: var(--pf-v5-global--spacer--md);
17739
- --pf-v5-c-tab-content__body--m-padding--PaddingBottom: var(--pf-v5-global--spacer--md);
17740
- --pf-v5-c-tab-content__body--m-padding--PaddingLeft: var(--pf-v5-global--spacer--md);
17741
- --pf-v5-c-tab-content__body--m-padding--xl--PaddingTop: var(--pf-v5-global--spacer--lg);
17742
- --pf-v5-c-tab-content__body--m-padding--xl--PaddingRight: var(--pf-v5-global--spacer--lg);
17743
- --pf-v5-c-tab-content__body--m-padding--xl--PaddingBottom: var(--pf-v5-global--spacer--lg);
17744
- --pf-v5-c-tab-content__body--m-padding--xl--PaddingLeft: var(--pf-v5-global--spacer--lg);
17745
- --pf-v5-c-tab-content--m-light-300: var(--pf-v5-global--BackgroundColor--light-300);
17723
+ :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider__value.pf-m-floating {
17724
+ transform: translate(calc(var(--pf-v5-c-slider__value--m-floating--TranslateX) * var(--pf-v5-global--inverse--multiplier)), var(--pf-v5-c-slider__value--m-floating--TranslateY));
17746
17725
  }
17747
17726
 
17748
- @media screen and (min-width: 1200px) {
17749
- .pf-v5-c-tab-content {
17750
- --pf-v5-c-tab-content__body--m-padding--PaddingTop: var(--pf-v5-c-tab-content__body--m-padding--xl--PaddingTop);
17751
- --pf-v5-c-tab-content__body--m-padding--PaddingRight: var(--pf-v5-c-tab-content__body--m-padding--xl--PaddingRight);
17752
- --pf-v5-c-tab-content__body--m-padding--PaddingBottom: var(--pf-v5-c-tab-content__body--m-padding--xl--PaddingBottom);
17753
- --pf-v5-c-tab-content__body--m-padding--PaddingLeft: var(--pf-v5-c-tab-content__body--m-padding--xl--PaddingLeft);
17754
- }
17755
- }
17756
- .pf-v5-c-tab-content.pf-m-light-300 {
17757
- background-color: var(--pf-v5-c-tab-content--m-light-300);
17727
+ .pf-v5-c-slider__value .pf-v5-c-form-control {
17728
+ width: var(--pf-v5-c-slider__value--c-form-control--Width);
17758
17729
  }
17759
17730
 
17760
- .pf-v5-c-tab-content__body {
17761
- padding-block-start: var(--pf-v5-c-tab-content__body--PaddingTop);
17762
- padding-block-end: var(--pf-v5-c-tab-content__body--PaddingBottom);
17763
- padding-inline-start: var(--pf-v5-c-tab-content__body--PaddingLeft);
17764
- padding-inline-end: var(--pf-v5-c-tab-content__body--PaddingRight);
17731
+ .pf-v5-c-slider__actions {
17732
+ display: flex;
17733
+ margin-inline-end: var(--pf-v5-c-slider__actions--MarginRight);
17765
17734
  }
17766
17735
 
17767
- .pf-v5-c-tab-content__body.pf-m-padding {
17768
- --pf-v5-c-tab-content__body--PaddingTop: var(--pf-v5-c-tab-content__body--m-padding--PaddingTop);
17769
- --pf-v5-c-tab-content__body--PaddingRight: var(--pf-v5-c-tab-content__body--m-padding--PaddingRight);
17770
- --pf-v5-c-tab-content__body--PaddingBottom: var(--pf-v5-c-tab-content__body--m-padding--PaddingBottom);
17771
- --pf-v5-c-tab-content__body--PaddingLeft: var(--pf-v5-c-tab-content__body--m-padding--PaddingLeft);
17736
+ .pf-v5-c-slider__main ~ .pf-v5-c-slider__actions {
17737
+ --pf-v5-c-slider__actions--MarginRight: 0;
17738
+ margin-inline-start: var(--pf-v5-c-slider__main--actions--MarginLeft);
17772
17739
  }
17773
17740
 
17774
17741
  .pf-v5-c-tabs {
@@ -18715,6 +18682,48 @@ svg.pf-v5-c-spinner.pf-m-xl {
18715
18682
  --pf-v5-c-tabs--m-color-scheme--light-300__link--disabled--BackgroundColor: var(--pf-v5-global--disabled-color--200);
18716
18683
  }
18717
18684
 
18685
+ .pf-v5-c-tab-content {
18686
+ --pf-v5-c-tab-content__body--PaddingTop: 0;
18687
+ --pf-v5-c-tab-content__body--PaddingRight: 0;
18688
+ --pf-v5-c-tab-content__body--PaddingBottom: 0;
18689
+ --pf-v5-c-tab-content__body--PaddingLeft: 0;
18690
+ --pf-v5-c-tab-content__body--m-padding--PaddingTop: var(--pf-v5-global--spacer--md);
18691
+ --pf-v5-c-tab-content__body--m-padding--PaddingRight: var(--pf-v5-global--spacer--md);
18692
+ --pf-v5-c-tab-content__body--m-padding--PaddingBottom: var(--pf-v5-global--spacer--md);
18693
+ --pf-v5-c-tab-content__body--m-padding--PaddingLeft: var(--pf-v5-global--spacer--md);
18694
+ --pf-v5-c-tab-content__body--m-padding--xl--PaddingTop: var(--pf-v5-global--spacer--lg);
18695
+ --pf-v5-c-tab-content__body--m-padding--xl--PaddingRight: var(--pf-v5-global--spacer--lg);
18696
+ --pf-v5-c-tab-content__body--m-padding--xl--PaddingBottom: var(--pf-v5-global--spacer--lg);
18697
+ --pf-v5-c-tab-content__body--m-padding--xl--PaddingLeft: var(--pf-v5-global--spacer--lg);
18698
+ --pf-v5-c-tab-content--m-light-300: var(--pf-v5-global--BackgroundColor--light-300);
18699
+ }
18700
+
18701
+ @media screen and (min-width: 1200px) {
18702
+ .pf-v5-c-tab-content {
18703
+ --pf-v5-c-tab-content__body--m-padding--PaddingTop: var(--pf-v5-c-tab-content__body--m-padding--xl--PaddingTop);
18704
+ --pf-v5-c-tab-content__body--m-padding--PaddingRight: var(--pf-v5-c-tab-content__body--m-padding--xl--PaddingRight);
18705
+ --pf-v5-c-tab-content__body--m-padding--PaddingBottom: var(--pf-v5-c-tab-content__body--m-padding--xl--PaddingBottom);
18706
+ --pf-v5-c-tab-content__body--m-padding--PaddingLeft: var(--pf-v5-c-tab-content__body--m-padding--xl--PaddingLeft);
18707
+ }
18708
+ }
18709
+ .pf-v5-c-tab-content.pf-m-light-300 {
18710
+ background-color: var(--pf-v5-c-tab-content--m-light-300);
18711
+ }
18712
+
18713
+ .pf-v5-c-tab-content__body {
18714
+ padding-block-start: var(--pf-v5-c-tab-content__body--PaddingTop);
18715
+ padding-block-end: var(--pf-v5-c-tab-content__body--PaddingBottom);
18716
+ padding-inline-start: var(--pf-v5-c-tab-content__body--PaddingLeft);
18717
+ padding-inline-end: var(--pf-v5-c-tab-content__body--PaddingRight);
18718
+ }
18719
+
18720
+ .pf-v5-c-tab-content__body.pf-m-padding {
18721
+ --pf-v5-c-tab-content__body--PaddingTop: var(--pf-v5-c-tab-content__body--m-padding--PaddingTop);
18722
+ --pf-v5-c-tab-content__body--PaddingRight: var(--pf-v5-c-tab-content__body--m-padding--PaddingRight);
18723
+ --pf-v5-c-tab-content__body--PaddingBottom: var(--pf-v5-c-tab-content__body--m-padding--PaddingBottom);
18724
+ --pf-v5-c-tab-content__body--PaddingLeft: var(--pf-v5-c-tab-content__body--m-padding--PaddingLeft);
18725
+ }
18726
+
18718
18727
  .pf-v5-c-content {
18719
18728
  --pf-v5-c-content--MarginBottom: var(--pf-v5-global--spacer--md);
18720
18729
  --pf-v5-c-content--LineHeight: var(--pf-v5-global--LineHeight--md);
@@ -19156,44 +19165,6 @@ svg.pf-v5-c-spinner.pf-m-xl {
19156
19165
  --pf-v5-c-tile--m-disabled__body--Color: var(--pf-v5-global--disabled-color--300);
19157
19166
  }
19158
19167
 
19159
- .pf-v5-c-timestamp {
19160
- --pf-v5-c-timestamp--FontSize: var(--pf-v5-global--FontSize--sm);
19161
- --pf-v5-c-timestamp--Color: var(--pf-v5-global--Color--200);
19162
- --pf-v5-c-timestamp--OutlineOffset: 0.1875rem;
19163
- --pf-v5-c-timestamp--m-help-text--TextDecorationLine: underline;
19164
- --pf-v5-c-timestamp--m-help-text--TextDecorationStyle: dashed;
19165
- --pf-v5-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-v5-global--BorderWidth--sm);
19166
- --pf-v5-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
19167
- --pf-v5-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v5-global--BorderColor--200);
19168
- --pf-v5-c-timestamp--m-help-text--hover--Color: var(--pf-v5-global--Color--100);
19169
- --pf-v5-c-timestamp--m-help-text--focus--Color: var(--pf-v5-global--Color--100);
19170
- --pf-v5-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-v5-global--Color--100);
19171
- --pf-v5-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-v5-global--Color--100);
19172
- display: inline-block;
19173
- font-size: var(--pf-v5-c-timestamp--FontSize);
19174
- color: var(--pf-v5-c-timestamp--Color);
19175
- outline-offset: var(--pf-v5-c-timestamp--OutlineOffset);
19176
- }
19177
-
19178
- .pf-v5-c-timestamp.pf-m-help-text {
19179
- text-decoration-line: var(--pf-v5-c-timestamp--m-help-text--TextDecorationLine);
19180
- text-decoration-thickness: var(--pf-v5-c-timestamp--m-help-text--TextDecorationThickness);
19181
- text-decoration-style: var(--pf-v5-c-timestamp--m-help-text--TextDecorationStyle);
19182
- text-decoration-color: var(--pf-v5-c-timestamp--m-help-text--TextDecorationColor);
19183
- text-underline-offset: var(--pf-v5-c-timestamp--m-help-text--TextUnderlineOffset);
19184
- cursor: pointer;
19185
- }
19186
-
19187
- .pf-v5-c-timestamp.pf-m-help-text:hover {
19188
- --pf-v5-c-timestamp--Color: var(--pf-v5-c-timestamp--m-help-text--hover--Color);
19189
- --pf-v5-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v5-c-timestamp--m-help-text--hover--TextDecorationColor);
19190
- }
19191
-
19192
- .pf-v5-c-timestamp.pf-m-help-text:focus {
19193
- --pf-v5-c-timestamp--Color: var(--pf-v5-c-timestamp--m-help-text--focus--Color);
19194
- --pf-v5-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v5-c-timestamp--m-help-text--focus--TextDecorationColor);
19195
- }
19196
-
19197
19168
  .pf-v5-c-title {
19198
19169
  --pf-v5-c-title--FontFamily: var(--pf-v5-global--FontFamily--heading);
19199
19170
  --pf-v5-c-title--m-4xl--LineHeight: var(--pf-v5-global--LineHeight--sm);
@@ -19254,6 +19225,44 @@ svg.pf-v5-c-spinner.pf-m-xl {
19254
19225
  line-height: var(--pf-v5-c-title--m-md--LineHeight);
19255
19226
  }
19256
19227
 
19228
+ .pf-v5-c-timestamp {
19229
+ --pf-v5-c-timestamp--FontSize: var(--pf-v5-global--FontSize--sm);
19230
+ --pf-v5-c-timestamp--Color: var(--pf-v5-global--Color--200);
19231
+ --pf-v5-c-timestamp--OutlineOffset: 0.1875rem;
19232
+ --pf-v5-c-timestamp--m-help-text--TextDecorationLine: underline;
19233
+ --pf-v5-c-timestamp--m-help-text--TextDecorationStyle: dashed;
19234
+ --pf-v5-c-timestamp--m-help-text--TextDecorationThickness: var(--pf-v5-global--BorderWidth--sm);
19235
+ --pf-v5-c-timestamp--m-help-text--TextUnderlineOffset: 0.25rem;
19236
+ --pf-v5-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v5-global--BorderColor--200);
19237
+ --pf-v5-c-timestamp--m-help-text--hover--Color: var(--pf-v5-global--Color--100);
19238
+ --pf-v5-c-timestamp--m-help-text--focus--Color: var(--pf-v5-global--Color--100);
19239
+ --pf-v5-c-timestamp--m-help-text--hover--TextDecorationColor: var(--pf-v5-global--Color--100);
19240
+ --pf-v5-c-timestamp--m-help-text--focus--TextDecorationColor: var(--pf-v5-global--Color--100);
19241
+ display: inline-block;
19242
+ font-size: var(--pf-v5-c-timestamp--FontSize);
19243
+ color: var(--pf-v5-c-timestamp--Color);
19244
+ outline-offset: var(--pf-v5-c-timestamp--OutlineOffset);
19245
+ }
19246
+
19247
+ .pf-v5-c-timestamp.pf-m-help-text {
19248
+ text-decoration-line: var(--pf-v5-c-timestamp--m-help-text--TextDecorationLine);
19249
+ text-decoration-thickness: var(--pf-v5-c-timestamp--m-help-text--TextDecorationThickness);
19250
+ text-decoration-style: var(--pf-v5-c-timestamp--m-help-text--TextDecorationStyle);
19251
+ text-decoration-color: var(--pf-v5-c-timestamp--m-help-text--TextDecorationColor);
19252
+ text-underline-offset: var(--pf-v5-c-timestamp--m-help-text--TextUnderlineOffset);
19253
+ cursor: pointer;
19254
+ }
19255
+
19256
+ .pf-v5-c-timestamp.pf-m-help-text:hover {
19257
+ --pf-v5-c-timestamp--Color: var(--pf-v5-c-timestamp--m-help-text--hover--Color);
19258
+ --pf-v5-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v5-c-timestamp--m-help-text--hover--TextDecorationColor);
19259
+ }
19260
+
19261
+ .pf-v5-c-timestamp.pf-m-help-text:focus {
19262
+ --pf-v5-c-timestamp--Color: var(--pf-v5-c-timestamp--m-help-text--focus--Color);
19263
+ --pf-v5-c-timestamp--m-help-text--TextDecorationColor: var(--pf-v5-c-timestamp--m-help-text--focus--TextDecorationColor);
19264
+ }
19265
+
19257
19266
  .pf-v5-c-toggle-group {
19258
19267
  --pf-v5-c-toggle-group__button--PaddingTop: var(--pf-v5-global--spacer--form-element);
19259
19268
  --pf-v5-c-toggle-group__button--PaddingRight: var(--pf-v5-global--spacer--md);