@patternfly/patternfly 6.0.0-prerelease.5 → 6.0.0-prerelease.7

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.
@@ -6,5 +6,3 @@
6
6
  text-align: center;
7
7
  width: #{$fa-fw-width};
8
8
  }
9
-
10
- @debug $fa-css-prefix;
@@ -215,7 +215,7 @@
215
215
  --pf-v6-c-button__icon--MarginInlineEnd: 0;
216
216
  --pf-v6-c-button__icon--m-start--MarginInlineEnd: 0;
217
217
  --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
218
- --pf-v6-c-button__progress--width: calc(var(--pf-v6-c-spinner--m-md--diameter) + var(--pf-t--global--spacer--sm));
218
+ --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
219
219
  --pf-v6-c-button__progress--Opacity: 0;
220
220
  --pf-v6-c-button__progress--TranslateY: -50%;
221
221
  --pf-v6-c-button__progress--TranslateX: 0;
@@ -226,7 +226,7 @@
226
226
  --pf-v6-c-button--m-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width) / 2);
227
227
  --pf-v6-c-button--m-in-progress--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
228
228
  --pf-v6-c-button--m-in-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width));
229
- --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-v6-c-spinner--Color);
229
+ --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
230
230
  --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
231
231
  --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
232
232
  --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
@@ -260,7 +260,7 @@
260
260
  --#{$button}__icon--m-end--MarginInlineStart: 0;
261
261
 
262
262
  // Progress
263
- --#{$button}__progress--width: calc(var(--#{$spinner}--m-md--diameter) + var(--pf-t--global--spacer--sm)); // matches medium spinner diameter plus a spacer
263
+ --#{$button}__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm)); // matches medium spinner diameter plus a spacer
264
264
  --#{$button}__progress--Opacity: 0;
265
265
  --#{$button}__progress--TranslateY: -50%;
266
266
  --#{$button}__progress--TranslateX: 0;
@@ -271,7 +271,7 @@
271
271
  --#{$button}--m-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--#{$button}__progress--width) / 2);
272
272
  --#{$button}--m-in-progress--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
273
273
  --#{$button}--m-in-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--#{$button}__progress--width));
274
- --#{$button}--m-in-progress--m-plain--Color: var(--#{$spinner}--Color);
274
+ --#{$button}--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
275
275
  --#{$button}--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
276
276
  --#{$button}--m-in-progress--m-plain__progress--TranslateX: -50%;
277
277
 
@@ -2,7 +2,7 @@
2
2
  .pf-v6-c-check {
3
3
  --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
4
4
  --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
5
- --pf-v6-c-check--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
5
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
6
6
  --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
7
7
  --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
8
8
  --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -25,7 +25,7 @@
25
25
  .pf-v6-c-check.pf-m-standalone {
26
26
  display: inline-grid;
27
27
  grid-template-columns: auto;
28
- min-height: var(--pf-v6-c-check--MinHeight);
28
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
29
29
  }
30
30
  .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
31
31
  align-self: center;
@@ -3,7 +3,7 @@
3
3
  @include pf-root($check) {
4
4
  --#{$check}--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
5
5
  --#{$check}--AccentColor: var(--pf-t--global--color--brand--default);
6
- --#{$check}--MinHeight: calc(var(--#{$check}__label--FontSize) * var(--#{$check}__label--LineHeight));
6
+ --#{$check}--m-standalone--MinHeight: calc(var(--#{$check}__label--FontSize) * var(--#{$check}__label--LineHeight));
7
7
 
8
8
  // TODO: update to `--#{$check}--FontSize` `--#{$check}--LineHeight`
9
9
  --#{$check}__label--disabled--Color: var(--pf-t--global--text--color--disabled);
@@ -33,7 +33,7 @@
33
33
  &.pf-m-standalone {
34
34
  display: inline-grid;
35
35
  grid-template-columns: auto;
36
- min-height: var(--#{$check}--MinHeight);
36
+ min-height: var(--#{$check}--m-standalone--MinHeight);
37
37
 
38
38
  .#{$check}__input {
39
39
  align-self: center;
@@ -32,9 +32,9 @@
32
32
  --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
33
33
  --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
34
34
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
35
- --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
35
+ --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
36
36
  --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
37
- --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
37
+ --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
38
38
  --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
39
39
  --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
40
40
  --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
@@ -49,11 +49,11 @@
49
49
  --#{$menu-toggle}--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
50
50
 
51
51
  // * Menu toggle icon
52
- --#{$menu-toggle}__icon--MinHeight: calc(var(--#{$menu}__item--FontSize) * var(--#{$menu}__item--LineHeight));
52
+ --#{$menu-toggle}__icon--MinHeight: calc(var(--#{$menu-toggle}--FontSize) * var(--#{$menu-toggle}--LineHeight));
53
53
  --#{$menu-toggle}__icon--Color: var(--pf-t--global--icon--color--regular);
54
54
 
55
55
  // * Menu toggle toggle icon
56
- --#{$menu-toggle}__toggle-icon--MinHeight: calc(var(--#{$menu}__item--FontSize) * var(--#{$menu}__item--LineHeight));
56
+ --#{$menu-toggle}__toggle-icon--MinHeight: calc(var(--#{$menu-toggle}--FontSize) * var(--#{$menu-toggle}--LineHeight));
57
57
  --#{$menu-toggle}__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
58
58
 
59
59
  // * Menu toggle primary
@@ -440,6 +440,10 @@
440
440
  flex-grow: 1;
441
441
  }
442
442
 
443
+ .pf-v6-c-page__main {
444
+ overflow: auto;
445
+ }
446
+
443
447
  .pf-v6-c-page__main-subnav {
444
448
  padding-block-start: var(--pf-v6-c-page__main-subnav--PaddingBlockStart);
445
449
  padding-block-end: var(--pf-v6-c-page__main-subnav--PaddingBlockEnd);
@@ -361,6 +361,10 @@ $pf-page-v6--height-breakpoint-map: build-breakpoint-map("base", "sm", "md", "lg
361
361
  flex-grow: 1;
362
362
  }
363
363
 
364
+ .#{$page}__main {
365
+ overflow: auto;
366
+ }
367
+
364
368
  .#{$page}__main-subnav {
365
369
  padding-block-start: var(--#{$page}__main-subnav--PaddingBlockStart);
366
370
  padding-block-end: var(--#{$page}__main-subnav--PaddingBlockEnd);
@@ -9,7 +9,7 @@
9
9
  --pf-v6-c-pagination__nav--ColumnGap: var(--pf-t--global--spacer--sm);
10
10
  --pf-v6-c-pagination__nav-page-select--FontSize: var(--pf-t--global--font--size--body--default);
11
11
  --pf-v6-c-pagination__nav-page-select--ColumnGap: var(--pf-t--global--spacer--sm);
12
- --pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc((var(--pf-v6-c-form-control--PaddingInlineEnd) + var(--pf-v6-c-form-control--PaddingInlineStart)) + (var(--pf-v6-c-form-control--before--BorderWidth) * 2));
12
+ --pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--border--width--control--default) * 2);
13
13
  --pf-v6-c-pagination__nav-page-select--c-form-control--width-chars: 2;
14
14
  --pf-v6-c-pagination__nav-page-select--c-form-control--Width: calc(var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-base) + (var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars) * 1ch));
15
15
  --pf-v6-c-pagination__total-items--Display: block;
@@ -19,7 +19,7 @@ $pf-v6-c-pagination--variable-map: build-spacer-map("none", "sm", "md", "lg", "x
19
19
  // nav page select
20
20
  --#{$pagination}__nav-page-select--FontSize: var(--pf-t--global--font--size--body--default);
21
21
  --#{$pagination}__nav-page-select--ColumnGap: var(--pf-t--global--spacer--sm);
22
- --#{$pagination}__nav-page-select--c-form-control--width-base: calc((var(--#{$form-control}--PaddingInlineEnd) + var(--#{$form-control}--PaddingInlineStart)) + (var(--#{$form-control}--before--BorderWidth) * 2));
22
+ --#{$pagination}__nav-page-select--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--border--width--control--default) * 2);
23
23
  --#{$pagination}__nav-page-select--c-form-control--width-chars: 2;
24
24
  --#{$pagination}__nav-page-select--c-form-control--Width: calc(var(--#{$pagination}__nav-page-select--c-form-control--width-base) + (var(--#{$pagination}__nav-page-select--c-form-control--width-chars) * 1ch));
25
25
 
@@ -2,7 +2,7 @@
2
2
  .pf-v6-c-radio {
3
3
  --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
4
4
  --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
5
- --pf-v6-c-radio--Height: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
5
+ --pf-v6-c-radio--m-standalone--MinHeight: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
6
6
  --pf-v6-c-radio__label--disabled--Color: var(--pf-t--global--text--color--disabled);
7
7
  --pf-v6-c-radio__label--Color: var(--pf-t--global--text--color--regular);
8
8
  --pf-v6-c-radio__label--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -26,7 +26,7 @@
26
26
  .pf-v6-c-radio.pf-m-standalone {
27
27
  display: inline-grid;
28
28
  grid-template-columns: auto;
29
- height: var(--pf-v6-c-check--Height);
29
+ min-height: var(--pf-v6-c-radio--m-standalone--MinHeight);
30
30
  }
31
31
  .pf-v6-c-radio.pf-m-standalone .pf-v6-c-radio__input {
32
32
  align-self: center;
@@ -3,7 +3,7 @@
3
3
  @include pf-root($radio) {
4
4
  --#{$radio}--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
5
5
  --#{$radio}--AccentColor: var(--pf-t--global--icon--color--brand--default);
6
- --#{$radio}--Height: calc(var(--#{$radio}__label--FontSize) * var(--#{$radio}__label--LineHeight));
6
+ --#{$radio}--m-standalone--MinHeight: calc(var(--#{$radio}__label--FontSize) * var(--#{$radio}__label--LineHeight));
7
7
 
8
8
  // TODO: update to `--#{$radio}--FontSize` `--#{$radio}--LineHeight`
9
9
  --#{$radio}__label--disabled--Color: var(--pf-t--global--text--color--disabled);
@@ -34,7 +34,7 @@
34
34
  &.pf-m-standalone {
35
35
  display: inline-grid;
36
36
  grid-template-columns: auto;
37
- height: var(--#{$check}--Height);
37
+ min-height: var(--#{$radio}--m-standalone--MinHeight);
38
38
 
39
39
  .#{$radio}__input {
40
40
  align-self: center;
@@ -46,7 +46,7 @@
46
46
  --pf-v6-c-slider__thumb--before--TranslateX: -50%;
47
47
  --pf-v6-c-slider__thumb--before--TranslateY: -50%;
48
48
  --pf-v6-c-slider__value--MarginInlineStart: var(--pf-t--global--spacer--md);
49
- --pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-v6-c-form-control--PaddingInlineStart) + var(--pf-v6-c-form-control--PaddingInlineEnd) + 1.25rem);
49
+ --pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + 1.25rem);
50
50
  --pf-v6-c-slider__value--c-form-control--width-chars: 3;
51
51
  --pf-v6-c-slider__value--c-form-control--Width: calc(var(--pf-v6-c-slider__value--c-form-control--width-base) + var(--pf-v6-c-slider__value--c-form-control--width-chars) * 1ch);
52
52
  --pf-v6-c-slider__value--m-floating--TranslateX: -50%;
@@ -59,7 +59,7 @@
59
59
 
60
60
  // value
61
61
  --#{$slider}__value--MarginInlineStart: var(--pf-t--global--spacer--md);
62
- --#{$slider}__value--c-form-control--width-base: calc(var(--#{$form-control}--PaddingInlineStart) + var(--#{$form-control}--PaddingInlineEnd) + #{pf-size-prem(20px)}); // form control base width + number input spinner width
62
+ --#{$slider}__value--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + #{pf-size-prem(20px)}); // form control base width + number input spinner width
63
63
  --#{$slider}__value--c-form-control--width-chars: 3;
64
64
  --#{$slider}__value--c-form-control--Width: calc(var(--#{$slider}__value--c-form-control--width-base) + var(--#{$slider}__value--c-form-control--width-chars) * 1ch);
65
65
  --#{$slider}__value--m-floating--TranslateX: -50%;
@@ -1632,7 +1632,7 @@ button.pf-v6-c-breadcrumb__link {
1632
1632
  --pf-v6-c-button__icon--MarginInlineEnd: 0;
1633
1633
  --pf-v6-c-button__icon--m-start--MarginInlineEnd: 0;
1634
1634
  --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
1635
- --pf-v6-c-button__progress--width: calc(var(--pf-v6-c-spinner--m-md--diameter) + var(--pf-t--global--spacer--sm));
1635
+ --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
1636
1636
  --pf-v6-c-button__progress--Opacity: 0;
1637
1637
  --pf-v6-c-button__progress--TranslateY: -50%;
1638
1638
  --pf-v6-c-button__progress--TranslateX: 0;
@@ -1643,7 +1643,7 @@ button.pf-v6-c-breadcrumb__link {
1643
1643
  --pf-v6-c-button--m-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width) / 2);
1644
1644
  --pf-v6-c-button--m-in-progress--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
1645
1645
  --pf-v6-c-button--m-in-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width));
1646
- --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-v6-c-spinner--Color);
1646
+ --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
1647
1647
  --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
1648
1648
  --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
1649
1649
  --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
@@ -2548,7 +2548,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2548
2548
  .pf-v6-c-check {
2549
2549
  --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
2550
2550
  --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
2551
- --pf-v6-c-check--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
2551
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
2552
2552
  --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
2553
2553
  --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
2554
2554
  --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -2571,7 +2571,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2571
2571
  .pf-v6-c-check.pf-m-standalone {
2572
2572
  display: inline-grid;
2573
2573
  grid-template-columns: auto;
2574
- min-height: var(--pf-v6-c-check--MinHeight);
2574
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
2575
2575
  }
2576
2576
  .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
2577
2577
  align-self: center;
@@ -9986,9 +9986,9 @@ ul.pf-v6-c-list {
9986
9986
  --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
9987
9987
  --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
9988
9988
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
9989
- --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
9989
+ --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
9990
9990
  --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
9991
- --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
9991
+ --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
9992
9992
  --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
9993
9993
  --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
9994
9994
  --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
@@ -11841,6 +11841,10 @@ ul.pf-v6-c-list {
11841
11841
  flex-grow: 1;
11842
11842
  }
11843
11843
 
11844
+ .pf-v6-c-page__main {
11845
+ overflow: auto;
11846
+ }
11847
+
11844
11848
  .pf-v6-c-page__main-subnav {
11845
11849
  padding-block-start: var(--pf-v6-c-page__main-subnav--PaddingBlockStart);
11846
11850
  padding-block-end: var(--pf-v6-c-page__main-subnav--PaddingBlockEnd);
@@ -12022,7 +12026,7 @@ ul.pf-v6-c-list {
12022
12026
  --pf-v6-c-pagination__nav--ColumnGap: var(--pf-t--global--spacer--sm);
12023
12027
  --pf-v6-c-pagination__nav-page-select--FontSize: var(--pf-t--global--font--size--body--default);
12024
12028
  --pf-v6-c-pagination__nav-page-select--ColumnGap: var(--pf-t--global--spacer--sm);
12025
- --pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc((var(--pf-v6-c-form-control--PaddingInlineEnd) + var(--pf-v6-c-form-control--PaddingInlineStart)) + (var(--pf-v6-c-form-control--before--BorderWidth) * 2));
12029
+ --pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--border--width--control--default) * 2);
12026
12030
  --pf-v6-c-pagination__nav-page-select--c-form-control--width-chars: 2;
12027
12031
  --pf-v6-c-pagination__nav-page-select--c-form-control--Width: calc(var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-base) + (var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars) * 1ch));
12028
12032
  --pf-v6-c-pagination__total-items--Display: block;
@@ -13443,7 +13447,7 @@ ul.pf-v6-c-list {
13443
13447
  .pf-v6-c-radio {
13444
13448
  --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
13445
13449
  --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
13446
- --pf-v6-c-radio--Height: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
13450
+ --pf-v6-c-radio--m-standalone--MinHeight: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
13447
13451
  --pf-v6-c-radio__label--disabled--Color: var(--pf-t--global--text--color--disabled);
13448
13452
  --pf-v6-c-radio__label--Color: var(--pf-t--global--text--color--regular);
13449
13453
  --pf-v6-c-radio__label--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -13467,7 +13471,7 @@ ul.pf-v6-c-list {
13467
13471
  .pf-v6-c-radio.pf-m-standalone {
13468
13472
  display: inline-grid;
13469
13473
  grid-template-columns: auto;
13470
- height: var(--pf-v6-c-check--Height);
13474
+ min-height: var(--pf-v6-c-radio--m-standalone--MinHeight);
13471
13475
  }
13472
13476
  .pf-v6-c-radio.pf-m-standalone .pf-v6-c-radio__input {
13473
13477
  align-self: center;
@@ -14168,7 +14172,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
14168
14172
  --pf-v6-c-slider__thumb--before--TranslateX: -50%;
14169
14173
  --pf-v6-c-slider__thumb--before--TranslateY: -50%;
14170
14174
  --pf-v6-c-slider__value--MarginInlineStart: var(--pf-t--global--spacer--md);
14171
- --pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-v6-c-form-control--PaddingInlineStart) + var(--pf-v6-c-form-control--PaddingInlineEnd) + 1.25rem);
14175
+ --pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + 1.25rem);
14172
14176
  --pf-v6-c-slider__value--c-form-control--width-chars: 3;
14173
14177
  --pf-v6-c-slider__value--c-form-control--Width: calc(var(--pf-v6-c-slider__value--c-form-control--width-base) + var(--pf-v6-c-slider__value--c-form-control--width-chars) * 1ch);
14174
14178
  --pf-v6-c-slider__value--m-floating--TranslateX: -50%;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "6.0.0-prerelease.5",
4
+ "version": "6.0.0-prerelease.7",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -47,11 +47,11 @@
47
47
  "@commitlint/config-conventional": "^19.1.0",
48
48
  "@fortawesome/fontawesome": "^1.1.8",
49
49
  "@octokit/rest": "^20.1.0",
50
- "@patternfly/documentation-framework": "6.0.0-alpha.90",
50
+ "@patternfly/documentation-framework": "6.0.0-alpha.92",
51
51
  "@patternfly/patternfly-a11y": "4.3.1",
52
- "@patternfly/react-code-editor": "6.0.0-alpha.106",
53
- "@patternfly/react-core": "6.0.0-alpha.106",
54
- "@patternfly/react-table": "6.0.0-alpha.107",
52
+ "@patternfly/react-code-editor": "6.0.0-prerelease.4",
53
+ "@patternfly/react-core": "6.0.0-prerelease.4",
54
+ "@patternfly/react-table": "6.0.0-prerelease.4",
55
55
  "@starptech/prettyhtml": "^0.10.0",
56
56
  "backstopjs": "^6.3.23",
57
57
  "cheerio": "^1.0.0-rc.12",
@@ -9063,7 +9063,7 @@ button.pf-v6-c-breadcrumb__link {
9063
9063
  --pf-v6-c-button__icon--MarginInlineEnd: 0;
9064
9064
  --pf-v6-c-button__icon--m-start--MarginInlineEnd: 0;
9065
9065
  --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
9066
- --pf-v6-c-button__progress--width: calc(var(--pf-v6-c-spinner--m-md--diameter) + var(--pf-t--global--spacer--sm));
9066
+ --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
9067
9067
  --pf-v6-c-button__progress--Opacity: 0;
9068
9068
  --pf-v6-c-button__progress--TranslateY: -50%;
9069
9069
  --pf-v6-c-button__progress--TranslateX: 0;
@@ -9074,7 +9074,7 @@ button.pf-v6-c-breadcrumb__link {
9074
9074
  --pf-v6-c-button--m-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width) / 2);
9075
9075
  --pf-v6-c-button--m-in-progress--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
9076
9076
  --pf-v6-c-button--m-in-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width));
9077
- --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-v6-c-spinner--Color);
9077
+ --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
9078
9078
  --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
9079
9079
  --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
9080
9080
  --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
@@ -9979,7 +9979,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
9979
9979
  .pf-v6-c-check {
9980
9980
  --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
9981
9981
  --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
9982
- --pf-v6-c-check--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
9982
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
9983
9983
  --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
9984
9984
  --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
9985
9985
  --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -10002,7 +10002,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
10002
10002
  .pf-v6-c-check.pf-m-standalone {
10003
10003
  display: inline-grid;
10004
10004
  grid-template-columns: auto;
10005
- min-height: var(--pf-v6-c-check--MinHeight);
10005
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
10006
10006
  }
10007
10007
  .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
10008
10008
  align-self: center;
@@ -17417,9 +17417,9 @@ ul.pf-v6-c-list {
17417
17417
  --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
17418
17418
  --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
17419
17419
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
17420
- --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
17420
+ --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
17421
17421
  --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
17422
- --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
17422
+ --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
17423
17423
  --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
17424
17424
  --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
17425
17425
  --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
@@ -19272,6 +19272,10 @@ ul.pf-v6-c-list {
19272
19272
  flex-grow: 1;
19273
19273
  }
19274
19274
 
19275
+ .pf-v6-c-page__main {
19276
+ overflow: auto;
19277
+ }
19278
+
19275
19279
  .pf-v6-c-page__main-subnav {
19276
19280
  padding-block-start: var(--pf-v6-c-page__main-subnav--PaddingBlockStart);
19277
19281
  padding-block-end: var(--pf-v6-c-page__main-subnav--PaddingBlockEnd);
@@ -19453,7 +19457,7 @@ ul.pf-v6-c-list {
19453
19457
  --pf-v6-c-pagination__nav--ColumnGap: var(--pf-t--global--spacer--sm);
19454
19458
  --pf-v6-c-pagination__nav-page-select--FontSize: var(--pf-t--global--font--size--body--default);
19455
19459
  --pf-v6-c-pagination__nav-page-select--ColumnGap: var(--pf-t--global--spacer--sm);
19456
- --pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc((var(--pf-v6-c-form-control--PaddingInlineEnd) + var(--pf-v6-c-form-control--PaddingInlineStart)) + (var(--pf-v6-c-form-control--before--BorderWidth) * 2));
19460
+ --pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--border--width--control--default) * 2);
19457
19461
  --pf-v6-c-pagination__nav-page-select--c-form-control--width-chars: 2;
19458
19462
  --pf-v6-c-pagination__nav-page-select--c-form-control--Width: calc(var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-base) + (var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars) * 1ch));
19459
19463
  --pf-v6-c-pagination__total-items--Display: block;
@@ -20874,7 +20878,7 @@ ul.pf-v6-c-list {
20874
20878
  .pf-v6-c-radio {
20875
20879
  --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
20876
20880
  --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
20877
- --pf-v6-c-radio--Height: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
20881
+ --pf-v6-c-radio--m-standalone--MinHeight: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
20878
20882
  --pf-v6-c-radio__label--disabled--Color: var(--pf-t--global--text--color--disabled);
20879
20883
  --pf-v6-c-radio__label--Color: var(--pf-t--global--text--color--regular);
20880
20884
  --pf-v6-c-radio__label--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -20898,7 +20902,7 @@ ul.pf-v6-c-list {
20898
20902
  .pf-v6-c-radio.pf-m-standalone {
20899
20903
  display: inline-grid;
20900
20904
  grid-template-columns: auto;
20901
- height: var(--pf-v6-c-check--Height);
20905
+ min-height: var(--pf-v6-c-radio--m-standalone--MinHeight);
20902
20906
  }
20903
20907
  .pf-v6-c-radio.pf-m-standalone .pf-v6-c-radio__input {
20904
20908
  align-self: center;
@@ -21599,7 +21603,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
21599
21603
  --pf-v6-c-slider__thumb--before--TranslateX: -50%;
21600
21604
  --pf-v6-c-slider__thumb--before--TranslateY: -50%;
21601
21605
  --pf-v6-c-slider__value--MarginInlineStart: var(--pf-t--global--spacer--md);
21602
- --pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-v6-c-form-control--PaddingInlineStart) + var(--pf-v6-c-form-control--PaddingInlineEnd) + 1.25rem);
21606
+ --pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + 1.25rem);
21603
21607
  --pf-v6-c-slider__value--c-form-control--width-chars: 3;
21604
21608
  --pf-v6-c-slider__value--c-form-control--Width: calc(var(--pf-v6-c-slider__value--c-form-control--width-base) + var(--pf-v6-c-slider__value--c-form-control--width-chars) * 1ch);
21605
21609
  --pf-v6-c-slider__value--m-floating--TranslateX: -50%;
package/patternfly.css CHANGED
@@ -9184,7 +9184,7 @@ button.pf-v6-c-breadcrumb__link {
9184
9184
  --pf-v6-c-button__icon--MarginInlineEnd: 0;
9185
9185
  --pf-v6-c-button__icon--m-start--MarginInlineEnd: 0;
9186
9186
  --pf-v6-c-button__icon--m-end--MarginInlineStart: 0;
9187
- --pf-v6-c-button__progress--width: calc(var(--pf-v6-c-spinner--m-md--diameter) + var(--pf-t--global--spacer--sm));
9187
+ --pf-v6-c-button__progress--width: calc(var(--pf-t--global--icon--size--lg) + var(--pf-t--global--spacer--sm));
9188
9188
  --pf-v6-c-button__progress--Opacity: 0;
9189
9189
  --pf-v6-c-button__progress--TranslateY: -50%;
9190
9190
  --pf-v6-c-button__progress--TranslateX: 0;
@@ -9195,7 +9195,7 @@ button.pf-v6-c-breadcrumb__link {
9195
9195
  --pf-v6-c-button--m-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width) / 2);
9196
9196
  --pf-v6-c-button--m-in-progress--PaddingInlineEnd: var(--pf-t--global--spacer--control--horizontal--default);
9197
9197
  --pf-v6-c-button--m-in-progress--PaddingInlineStart: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-v6-c-button__progress--width));
9198
- --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-v6-c-spinner--Color);
9198
+ --pf-v6-c-button--m-in-progress--m-plain--Color: var(--pf-t--global--icon--color--brand--default);
9199
9199
  --pf-v6-c-button--m-in-progress--m-plain__progress--InsetInlineStart: 50%;
9200
9200
  --pf-v6-c-button--m-in-progress--m-plain__progress--TranslateX: -50%;
9201
9201
  --pf-v6-c-button--m-primary__c-badge--BorderColor: var(--pf-t--global--border--color--default);
@@ -10100,7 +10100,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
10100
10100
  .pf-v6-c-check {
10101
10101
  --pf-v6-c-check--GridGap: var(--pf-t--global--spacer--gap--group--vertical) var(--pf-t--global--spacer--gap--text-to-element--default);
10102
10102
  --pf-v6-c-check--AccentColor: var(--pf-t--global--color--brand--default);
10103
- --pf-v6-c-check--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
10103
+ --pf-v6-c-check--m-standalone--MinHeight: calc(var(--pf-v6-c-check__label--FontSize) * var(--pf-v6-c-check__label--LineHeight));
10104
10104
  --pf-v6-c-check__label--disabled--Color: var(--pf-t--global--text--color--disabled);
10105
10105
  --pf-v6-c-check__label--Color: var(--pf-t--global--text--color--regular);
10106
10106
  --pf-v6-c-check__label--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -10123,7 +10123,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
10123
10123
  .pf-v6-c-check.pf-m-standalone {
10124
10124
  display: inline-grid;
10125
10125
  grid-template-columns: auto;
10126
- min-height: var(--pf-v6-c-check--MinHeight);
10126
+ min-height: var(--pf-v6-c-check--m-standalone--MinHeight);
10127
10127
  }
10128
10128
  .pf-v6-c-check.pf-m-standalone .pf-v6-c-check__input {
10129
10129
  align-self: center;
@@ -17538,9 +17538,9 @@ ul.pf-v6-c-list {
17538
17538
  --pf-v6-c-menu-toggle--disabled__toggle-icon--Color: var(--pf-t--global--icon--color--on-disabled);
17539
17539
  --pf-v6-c-menu-toggle--disabled__status-icon--Color: var(--pf-t--global--icon--color--on-disabled);
17540
17540
  --pf-v6-c-menu-toggle--disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
17541
- --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
17541
+ --pf-v6-c-menu-toggle__icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
17542
17542
  --pf-v6-c-menu-toggle__icon--Color: var(--pf-t--global--icon--color--regular);
17543
- --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu__item--FontSize) * var(--pf-v6-c-menu__item--LineHeight));
17543
+ --pf-v6-c-menu-toggle__toggle-icon--MinHeight: calc(var(--pf-v6-c-menu-toggle--FontSize) * var(--pf-v6-c-menu-toggle--LineHeight));
17544
17544
  --pf-v6-c-menu-toggle__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
17545
17545
  --pf-v6-c-menu-toggle--m-primary--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--default);
17546
17546
  --pf-v6-c-menu-toggle--m-primary--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--default);
@@ -19393,6 +19393,10 @@ ul.pf-v6-c-list {
19393
19393
  flex-grow: 1;
19394
19394
  }
19395
19395
 
19396
+ .pf-v6-c-page__main {
19397
+ overflow: auto;
19398
+ }
19399
+
19396
19400
  .pf-v6-c-page__main-subnav {
19397
19401
  padding-block-start: var(--pf-v6-c-page__main-subnav--PaddingBlockStart);
19398
19402
  padding-block-end: var(--pf-v6-c-page__main-subnav--PaddingBlockEnd);
@@ -19574,7 +19578,7 @@ ul.pf-v6-c-list {
19574
19578
  --pf-v6-c-pagination__nav--ColumnGap: var(--pf-t--global--spacer--sm);
19575
19579
  --pf-v6-c-pagination__nav-page-select--FontSize: var(--pf-t--global--font--size--body--default);
19576
19580
  --pf-v6-c-pagination__nav-page-select--ColumnGap: var(--pf-t--global--spacer--sm);
19577
- --pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc((var(--pf-v6-c-form-control--PaddingInlineEnd) + var(--pf-v6-c-form-control--PaddingInlineStart)) + (var(--pf-v6-c-form-control--before--BorderWidth) * 2));
19581
+ --pf-v6-c-pagination__nav-page-select--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--border--width--control--default) * 2);
19578
19582
  --pf-v6-c-pagination__nav-page-select--c-form-control--width-chars: 2;
19579
19583
  --pf-v6-c-pagination__nav-page-select--c-form-control--Width: calc(var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-base) + (var(--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars) * 1ch));
19580
19584
  --pf-v6-c-pagination__total-items--Display: block;
@@ -20995,7 +20999,7 @@ ul.pf-v6-c-list {
20995
20999
  .pf-v6-c-radio {
20996
21000
  --pf-v6-c-radio--GridGap: var(--pf-t--global--spacer--sm) var(--pf-t--global--spacer--sm);
20997
21001
  --pf-v6-c-radio--AccentColor: var(--pf-t--global--icon--color--brand--default);
20998
- --pf-v6-c-radio--Height: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
21002
+ --pf-v6-c-radio--m-standalone--MinHeight: calc(var(--pf-v6-c-radio__label--FontSize) * var(--pf-v6-c-radio__label--LineHeight));
20999
21003
  --pf-v6-c-radio__label--disabled--Color: var(--pf-t--global--text--color--disabled);
21000
21004
  --pf-v6-c-radio__label--Color: var(--pf-t--global--text--color--regular);
21001
21005
  --pf-v6-c-radio__label--FontWeight: var(--pf-t--global--font--weight--body--default);
@@ -21019,7 +21023,7 @@ ul.pf-v6-c-list {
21019
21023
  .pf-v6-c-radio.pf-m-standalone {
21020
21024
  display: inline-grid;
21021
21025
  grid-template-columns: auto;
21022
- height: var(--pf-v6-c-check--Height);
21026
+ min-height: var(--pf-v6-c-radio--m-standalone--MinHeight);
21023
21027
  }
21024
21028
  .pf-v6-c-radio.pf-m-standalone .pf-v6-c-radio__input {
21025
21029
  align-self: center;
@@ -21720,7 +21724,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
21720
21724
  --pf-v6-c-slider__thumb--before--TranslateX: -50%;
21721
21725
  --pf-v6-c-slider__thumb--before--TranslateY: -50%;
21722
21726
  --pf-v6-c-slider__value--MarginInlineStart: var(--pf-t--global--spacer--md);
21723
- --pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-v6-c-form-control--PaddingInlineStart) + var(--pf-v6-c-form-control--PaddingInlineEnd) + 1.25rem);
21727
+ --pf-v6-c-slider__value--c-form-control--width-base: calc(var(--pf-t--global--spacer--control--horizontal--default) + var(--pf-t--global--spacer--control--horizontal--default) + 1.25rem);
21724
21728
  --pf-v6-c-slider__value--c-form-control--width-chars: 3;
21725
21729
  --pf-v6-c-slider__value--c-form-control--Width: calc(var(--pf-v6-c-slider__value--c-form-control--width-base) + var(--pf-v6-c-slider__value--c-form-control--width-chars) * 1ch);
21726
21730
  --pf-v6-c-slider__value--m-floating--TranslateX: -50%;