@patternfly/patternfly 6.0.0-alpha.48 → 6.0.0-alpha.49

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 (11) hide show
  1. package/components/DataList/data-list.css +101 -158
  2. package/components/DataList/data-list.scss +95 -154
  3. package/components/Slider/slider.css +34 -30
  4. package/components/Slider/slider.scss +46 -43
  5. package/package.json +1 -1
  6. package/patternfly-no-globals.css +136 -181
  7. package/patternfly-theme-dark-unversioned.css +136 -181
  8. package/patternfly.css +136 -181
  9. package/patternfly.min.css +1 -1
  10. package/patternfly.min.css.map +1 -1
  11. package/components/DataList/themes/dark/data-list.scss +0 -10
package/patternfly-no-globals.css CHANGED
@@ -1,5 +1,5 @@
1
1
  @charset "UTF-8";
2
- .pf-v5-c-table, .pf-v5-c-select, .pf-v5-c-menu, .pf-v5-c-data-list, .pf-v5-c-context-selector__menu, .pf-v5-c-chip-group, .pf-v5-c-chip, .pf-v5-c-calendar-month, .pf-v5-t-light {
2
+ .pf-v5-c-table, .pf-v5-c-select, .pf-v5-c-menu, .pf-v5-c-context-selector__menu, .pf-v5-c-chip-group, .pf-v5-c-chip, .pf-v5-c-calendar-month, .pf-v5-t-light {
3
3
  --pf-v5-global--Color--100: var(--pf-v5-global--Color--dark-100);
4
4
  --pf-v5-global--Color--200: var(--pf-v5-global--Color--dark-200);
5
5
  --pf-v5-global--BorderColor--100: var(--pf-v5-global--BorderColor--dark-100);
@@ -10552,149 +10552,135 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10552
10552
  }
10553
10553
  }
10554
10554
 
10555
- .pf-v5-c-data-list {
10556
- --pf-v5-c-data-list--FontSize: 1em;
10557
- --pf-v5-c-data-list--LineHeight: var(--pf-v5-global--LineHeight--md);
10558
- --pf-v5-c-data-list--BorderTopColor: var(--pf-v5-global--BorderColor--300);
10559
- --pf-v5-c-data-list--BorderTopWidth: var(--pf-v5-global--spacer--sm);
10560
- --pf-v5-c-data-list--sm--BorderTopWidth: var(--pf-v5-global--BorderWidth--sm);
10561
- --pf-v5-c-data-list--sm--BorderTopColor: var(--pf-v5-global--BorderColor--100);
10562
- --pf-v5-c-data-list--MarginLeft: var(--pf-v5-global--spacer--md);
10563
- --pf-v5-c-data-list__item--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
10564
- --pf-v5-c-data-list__item--m-selected--ZIndex: var(--pf-v5-global--ZIndex--xs);
10565
- --pf-v5-c-data-list__item--m-expanded--before--BackgroundColor: var(--pf-v5-global--active-color--100);
10566
- --pf-v5-c-data-list__item--m-selected--before--BackgroundColor: var(--pf-v5-global--active-color--100);
10567
- --pf-v5-c-data-list__item--m-selected--BoxShadow: var(--pf-v5-global--BoxShadow--sm-top), var(--pf-v5-global--BoxShadow--sm-bottom);
10568
- --pf-v5-c-data-list__item--m-clickable--OutlineOffset: calc(-1 * var(--pf-v5-global--spacer--xs));
10569
- --pf-v5-c-data-list__item--m-clickable--hover--ZIndex: calc(var(--pf-v5-c-data-list__item--m-selected--ZIndex) + 1);
10570
- --pf-v5-c-data-list__item--m-clickable--hover--BoxShadow: var(--pf-v5-global--BoxShadow--sm-top), var(--pf-v5-global--BoxShadow--sm-bottom);
10571
- --pf-v5-c-data-list__item--m-clickable--focus--BoxShadow: var(--pf-v5-global--BoxShadow--sm-top), var(--pf-v5-global--BoxShadow--sm-bottom);
10572
- --pf-v5-c-data-list__item--m-clickable--active--BoxShadow: var(--pf-v5-global--BoxShadow--sm-top), var(--pf-v5-global--BoxShadow--sm-bottom);
10573
- --pf-v5-c-data-list__item--BorderBottomColor: var(--pf-v5-global--BorderColor--300);
10574
- --pf-v5-c-data-list__item--BorderBottomWidth: 0.5rem;
10575
- --pf-v5-c-data-list__item--m-clickable--hover--item--BorderTopColor: var(--pf-v5-c-data-list__item--BorderBottomColor);
10576
- --pf-v5-c-data-list__item--m-clickable--hover--item--BorderTopWidth: var(--pf-v5-c-data-list__item--BorderBottomWidth);
10577
- --pf-v5-c-data-list__item--sm--BorderBottomWidth: var(--pf-v5-global--BorderWidth--sm);
10578
- --pf-v5-c-data-list__item--sm--BorderBottomColor: var(--pf-v5-global--BorderColor--100);
10579
- --pf-v5-c-data-list__item--before--BackgroundColor: transparent;
10580
- --pf-v5-c-data-list__item--before--Width: calc(2 * var(--pf-v5-global--BorderWidth--lg));
10581
- --pf-v5-c-data-list__item--before--Transition: var(--pf-v5-global--Transition);
10582
- --pf-v5-c-data-list__item--before--Top: 0;
10583
- --pf-v5-c-data-list__item--before--sm--Top: calc(var(--pf-v5-c-data-list__item--BorderBottomWidth) * -1);
10584
- --pf-v5-c-data-list__item-row--PaddingRight: var(--pf-v5-global--spacer--md);
10585
- --pf-v5-c-data-list__item-row--PaddingLeft: var(--pf-v5-global--spacer--md);
10586
- --pf-v5-c-data-list__item-row--xl--PaddingRight: var(--pf-v5-global--spacer--lg);
10587
- --pf-v5-c-data-list__item-row--xl--PaddingLeft: var(--pf-v5-global--spacer--lg);
10588
- --pf-v5-c-data-list__item-content--md--PaddingBottom: var(--pf-v5-global--spacer--lg);
10589
- --pf-v5-c-data-list__cell--PaddingTop: var(--pf-v5-global--spacer--lg);
10590
- --pf-v5-c-data-list__cell--PaddingBottom: var(--pf-v5-global--spacer--lg);
10591
- --pf-v5-c-data-list__cell--MarginRight: var(--pf-v5-global--spacer--xl);
10555
+ :root, .pf-v5-c-data-list {
10556
+ --pf-v5-c-data-list--FontSize: var( --pf-t--global--font--size--body);
10557
+ --pf-v5-c-data-list--LineHeight: var(--pf-t--global--font--line-height--body);
10558
+ --pf-v5-c-data-list--BorderTopColor: var(--pf-t--global--border--color--default);
10559
+ --pf-v5-c-data-list--BorderTopWidth: var(--pf-t--global--spacer--sm);
10560
+ --pf-v5-c-data-list--sm--BorderTopWidth: var(--pf-t--global--border--width--divider--default);
10561
+ --pf-v5-c-data-list--sm--BorderTopColor: var(--pf-t--global--border--color--default);
10562
+ --pf-v5-c-data-list--MarginLeft: var(--pf-t--global--spacer--md);
10563
+ --pf-v5-c-data-list__item--BackgroundColor: var( --pf-t--global--background--color--primary--default);
10564
+ --pf-v5-c-data-list__item--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
10565
+ --pf-v5-c-data-list__item--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
10566
+ --pf-v5-c-data-list__item--m-clickable--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
10567
+ --pf-v5-c-data-list__item--BorderBottomColor: var(--pf-t--global--border--color--default);
10568
+ --pf-v5-c-data-list__item--BorderBottomWidth: var(--pf-t--global--spacer--sm);
10569
+ --pf-v5-c-data-list__item--sm--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
10570
+ --pf-v5-c-data-list__item--sm--BorderBottomColor: var(--pf-t--global--border--color--default);
10571
+ --pf-v5-c-data-list__item-row--PaddingRight: var(--pf-t--global--spacer--md);
10572
+ --pf-v5-c-data-list__item-row--PaddingLeft: var(--pf-t--global--spacer--md);
10573
+ --pf-v5-c-data-list__item-row--xl--PaddingRight: var(--pf-t--global--spacer--lg);
10574
+ --pf-v5-c-data-list__item-row--xl--PaddingLeft: var(--pf-t--global--spacer--lg);
10575
+ --pf-v5-c-data-list__item-content--md--PaddingBottom: var(--pf-t--global--spacer--lg);
10576
+ --pf-v5-c-data-list__cell--PaddingTop: var(--pf-t--global--spacer--lg);
10577
+ --pf-v5-c-data-list__cell--PaddingBottom: var(--pf-t--global--spacer--lg);
10578
+ --pf-v5-c-data-list__cell--MarginRight: var(--pf-t--global--spacer--xl);
10592
10579
  --pf-v5-c-data-list__cell--md--PaddingBottom: 0;
10593
- --pf-v5-c-data-list__cell--m-icon--MarginRight: var(--pf-v5-global--spacer--md);
10580
+ --pf-v5-c-data-list__cell--m-icon--MarginRight: var(--pf-t--global--spacer--md);
10594
10581
  --pf-v5-c-data-list__cell--cell--PaddingTop: 0;
10595
- --pf-v5-c-data-list__cell--cell--md--PaddingTop: var(--pf-v5-global--spacer--lg);
10596
- --pf-v5-c-data-list__cell--m-icon--cell--PaddingTop: var(--pf-v5-global--spacer--lg);
10582
+ --pf-v5-c-data-list__cell--cell--md--PaddingTop: var(--pf-t--global--spacer--lg);
10583
+ --pf-v5-c-data-list__cell--m-icon--cell--PaddingTop: var(--pf-t--global--spacer--lg);
10597
10584
  --pf-v5-c-data-list--cell--MinWidth: initial;
10598
10585
  --pf-v5-c-data-list--cell--Overflow: visible;
10599
10586
  --pf-v5-c-data-list--cell--TextOverflow: clip;
10600
10587
  --pf-v5-c-data-list--cell--WhiteSpace: normal;
10601
10588
  --pf-v5-c-data-list--cell--WordBreak: normal;
10602
10589
  --pf-v5-c-data-list--cell--m-truncate--MinWidth: 5ch;
10603
- --pf-v5-c-data-list__toggle--MarginLeft: calc(var(--pf-v5-global--spacer--sm) * -1);
10604
- --pf-v5-c-data-list__toggle--MarginTop: calc(var(--pf-v5-global--spacer--form-element) * -1);
10605
- --pf-v5-c-data-list__toggle--MarginBottom: calc(var(--pf-v5-global--spacer--form-element) * -1);
10590
+ --pf-v5-c-data-list__toggle--MarginLeft: calc(var(--pf-t--global--spacer--sm) * -1);
10591
+ --pf-v5-c-data-list__toggle--MarginTop: calc(var(--pf-t--global--spacer--sm) * -1);
10592
+ --pf-v5-c-data-list__toggle--MarginBottom: calc(var(--pf-t--global--spacer--sm) * -1);
10606
10593
  --pf-v5-c-data-list__toggle-icon--Height: calc(var(--pf-v5-c-data-list--FontSize) * var(--pf-v5-c-data-list--LineHeight));
10607
10594
  --pf-v5-c-data-list__toggle-icon--Transition: .2s ease-in 0s;
10608
10595
  --pf-v5-c-data-list__toggle-icon--Rotate: 0;
10609
10596
  --pf-v5-c-data-list__item--m-expanded__toggle-icon--Rotate: 90deg;
10610
10597
  --pf-v5-c-data-list__item-draggable-button--BackgroundColor: transparent;
10611
- --pf-v5-c-data-list__item-draggable-button--PaddingLeft: var(--pf-v5-global--spacer--md);
10612
- --pf-v5-c-data-list__item-draggable-button--PaddingRight: var(--pf-v5-global--spacer--md);
10613
- --pf-v5-c-data-list__item-draggable-button--MarginTop: calc(var(--pf-v5-global--spacer--lg) * -1);
10614
- --pf-v5-c-data-list__item-draggable-button--MarginBottom: calc(var(--pf-v5-global--spacer--lg) * -1);
10615
- --pf-v5-c-data-list__item-draggable-button--PaddingTop: var(--pf-v5-global--spacer--lg);
10616
- --pf-v5-c-data-list__item-draggable-button--PaddingBottom: var(--pf-v5-global--spacer--lg);
10617
- --pf-v5-c-data-list__item-draggable-button--MarginLeft: calc(var(--pf-v5-global--spacer--md) * -1);
10618
- --pf-v5-c-data-list__item-draggable-button-icon--Color: var(--pf-v5-global--icon--Color--light);
10619
- --pf-v5-c-data-list__item-draggable-button--m-disabled__draggable-icon--Color: var(--pf-v5-global--disabled-color--200);
10620
- --pf-v5-c-data-list__item-draggable-button--hover__draggable-icon--Color: var(--pf-v5-global--icon--Color--dark);
10621
- --pf-v5-c-data-list__item-draggable-button--focus__draggable-icon--Color: var(--pf-v5-global--icon--Color--dark);
10622
- --pf-v5-c-data-list__item--m-ghost-row--after--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
10598
+ --pf-v5-c-data-list__item-draggable-button--PaddingLeft: var(--pf-t--global--spacer--md);
10599
+ --pf-v5-c-data-list__item-draggable-button--PaddingRight: var(--pf-t--global--spacer--md);
10600
+ --pf-v5-c-data-list__item-draggable-button--MarginTop: calc(var(--pf-t--global--spacer--lg) * -1);
10601
+ --pf-v5-c-data-list__item-draggable-button--MarginBottom: calc(var(--pf-t--global--spacer--lg) * -1);
10602
+ --pf-v5-c-data-list__item-draggable-button--PaddingTop: var(--pf-t--global--spacer--lg);
10603
+ --pf-v5-c-data-list__item-draggable-button--PaddingBottom: var(--pf-t--global--spacer--lg);
10604
+ --pf-v5-c-data-list__item-draggable-button--MarginLeft: calc(var(--pf-t--global--spacer--md) * -1);
10605
+ --pf-v5-c-data-list__item-draggable-button-icon--Color: var(--pf-t--global--icon--color--subtle);
10606
+ --pf-v5-c-data-list__item-draggable-button--m-disabled__draggable-icon--Color: var(--pf-t--global--icon--color--disabled);
10607
+ --pf-v5-c-data-list__item-draggable-button--hover__draggable-icon--Color: var(--pf-t--global--icon--color--regular);
10608
+ --pf-v5-c-data-list__item-draggable-button--focus__draggable-icon--Color: var(--pf-t--global--icon--color--regular);
10609
+ --pf-v5-c-data-list__item--m-ghost-row--after--BackgroundColor: var(--pf-t--global--background--color--primary--default);
10623
10610
  --pf-v5-c-data-list__item--m-ghost-row--after--Opacity: .6;
10624
- --pf-v5-c-data-list__item-control--PaddingTop: var(--pf-v5-global--spacer--lg);
10625
- --pf-v5-c-data-list__item-control--PaddingBottom: var(--pf-v5-global--spacer--lg);
10626
- --pf-v5-c-data-list__item-control--MarginRight: var(--pf-v5-global--spacer--md);
10627
- --pf-v5-c-data-list__item-control--md--MarginRight: var(--pf-v5-global--spacer--xl);
10628
- --pf-v5-c-data-list__item-control--not-last-child--MarginRight: var(--pf-v5-global--spacer--md);
10611
+ --pf-v5-c-data-list__item-control--PaddingTop: var(--pf-t--global--spacer--lg);
10612
+ --pf-v5-c-data-list__item-control--PaddingBottom: var(--pf-t--global--spacer--lg);
10613
+ --pf-v5-c-data-list__item-control--MarginRight: var(--pf-t--global--spacer--md);
10614
+ --pf-v5-c-data-list__item-control--md--MarginRight: var(--pf-t--global--spacer--xl);
10615
+ --pf-v5-c-data-list__item-control--not-last-child--MarginRight: var(--pf-t--global--spacer--md);
10629
10616
  --pf-v5-c-data-list__check--Height: calc(var(--pf-v5-c-data-list--FontSize) * var(--pf-v5-c-data-list--LineHeight));
10630
10617
  --pf-v5-c-data-list__check--MarginTop: -0.0625rem;
10631
10618
  --pf-v5-c-data-list__item-action--Display: flex;
10632
- --pf-v5-c-data-list__item-action--PaddingTop: var(--pf-v5-global--spacer--lg);
10633
- --pf-v5-c-data-list__item-action--PaddingBottom: var(--pf-v5-global--spacer--lg);
10634
- --pf-v5-c-data-list__item-action--MarginLeft: var(--pf-v5-global--spacer--md);
10635
- --pf-v5-c-data-list__item-action--md--MarginLeft: var(--pf-v5-global--spacer--xl);
10636
- --pf-v5-c-data-list__item-action--not-last-child--MarginRight: var(--pf-v5-global--spacer--md);
10637
- --pf-v5-c-data-list__item-action__action--MarginTop: calc(var(--pf-v5-global--spacer--form-element) * -1);
10619
+ --pf-v5-c-data-list__item-action--PaddingTop: var(--pf-t--global--spacer--lg);
10620
+ --pf-v5-c-data-list__item-action--PaddingBottom: var(--pf-t--global--spacer--lg);
10621
+ --pf-v5-c-data-list__item-action--MarginLeft: var(--pf-t--global--spacer--md);
10622
+ --pf-v5-c-data-list__item-action--md--MarginLeft: var(--pf-t--global--spacer--xl);
10623
+ --pf-v5-c-data-list__item-action--not-last-child--MarginRight: var(--pf-t--global--spacer--md);
10624
+ --pf-v5-c-data-list__item-action__action--MarginTop: calc(var(--pf-t--global--spacer--sm) * -1);
10638
10625
  --pf-v5-c-data-list__action--MarginTop: var(--pf-v5-c-data-list__item-action__action--MarginTop);
10639
- --pf-v5-c-data-list__item-action__action--MarginBottom: calc(var(--pf-v5-global--spacer--form-element) * -1);
10640
- --pf-v5-c-data-list__expandable-content--MarginRight: calc(var(--pf-v5-c-data-list__expandable-content-body--PaddingRight) * -1);
10641
- --pf-v5-c-data-list__expandable-content--MarginLeft: calc(var(--pf-v5-c-data-list__expandable-content-body--PaddingLeft) * -1);
10626
+ --pf-v5-c-data-list__item-action__action--MarginBottom: calc(var(--pf-t--global--spacer--sm) * -1);
10627
+ --pf-v5-c-data-list__expandable-content--BackgroundColor: var( --pf-t--global--background--color--primary--default);
10628
+ --pf-v5-c-data-list__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
10629
+ --pf-v5-c-data-list__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
10630
+ --pf-v5-c-data-list__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
10642
10631
  --pf-v5-c-data-list__expandable-content--MaxHeight: 37.5rem;
10643
- --pf-v5-c-data-list__expandable-content--before--Top: calc(var(--pf-v5-c-data-list__item--BorderBottomWidth) * -1);
10644
- --pf-v5-c-data-list__expandable-content-body--PaddingTop: var(--pf-v5-global--spacer--md);
10645
- --pf-v5-c-data-list__expandable-content-body--PaddingRight: var(--pf-v5-global--spacer--md);
10646
- --pf-v5-c-data-list__expandable-content-body--PaddingBottom: var(--pf-v5-global--spacer--md);
10647
- --pf-v5-c-data-list__expandable-content-body--PaddingLeft: var(--pf-v5-global--spacer--md);
10648
- --pf-v5-c-data-list__expandable-content-body--md--PaddingTop: var(--pf-v5-global--spacer--lg);
10649
- --pf-v5-c-data-list__expandable-content-body--xl--PaddingRight: var(--pf-v5-global--spacer--lg);
10650
- --pf-v5-c-data-list__expandable-content-body--md--PaddingBottom: var(--pf-v5-global--spacer--lg);
10651
- --pf-v5-c-data-list__expandable-content-body--xl--PaddingLeft: var(--pf-v5-global--spacer--lg);
10652
- --pf-v5-c-data-list--m-compact--FontSize: var(--pf-v5-global--FontSize--sm);
10653
- --pf-v5-c-data-list--m-compact--LineHeight: var(--pf-v5-global--LineHeight--sm);
10654
- --pf-v5-c-data-list--m-compact__check--FontSize: var(--pf-v5-global--FontSize--md);
10655
- --pf-v5-c-data-list--m-compact__cell--PaddingTop: var(--pf-v5-global--spacer--sm);
10656
- --pf-v5-c-data-list--m-compact__cell--PaddingBottom: var(--pf-v5-global--spacer--sm);
10632
+ --pf-v5-c-data-list__expandable-content-body--PaddingTop: var(--pf-t--global--spacer--md);
10633
+ --pf-v5-c-data-list__expandable-content-body--PaddingRight: var(--pf-t--global--spacer--md);
10634
+ --pf-v5-c-data-list__expandable-content-body--PaddingBottom: var(--pf-t--global--spacer--md);
10635
+ --pf-v5-c-data-list__expandable-content-body--PaddingLeft: var(--pf-t--global--spacer--md);
10636
+ --pf-v5-c-data-list__expandable-content-body--md--PaddingTop: var(--pf-t--global--spacer--lg);
10637
+ --pf-v5-c-data-list__expandable-content-body--xl--PaddingRight: var(--pf-t--global--spacer--lg);
10638
+ --pf-v5-c-data-list__expandable-content-body--md--PaddingBottom: var(--pf-t--global--spacer--lg);
10639
+ --pf-v5-c-data-list__expandable-content-body--xl--PaddingLeft: var(--pf-t--global--spacer--lg);
10640
+ --pf-v5-c-data-list__expandable-content-body--BorderRadius: var(--pf-t--global--border--radius--small);
10641
+ --pf-v5-c-data-list--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
10642
+ --pf-v5-c-data-list--m-compact--LineHeight: var(--pf-t--global--font--line-height--body);
10643
+ --pf-v5-c-data-list--m-compact__check--FontSize: var(--pf-t--global--font--size--body--md);
10644
+ --pf-v5-c-data-list--m-compact__cell--PaddingTop: var(--pf-t--global--spacer--sm);
10645
+ --pf-v5-c-data-list--m-compact__cell--PaddingBottom: var(--pf-t--global--spacer--sm);
10657
10646
  --pf-v5-c-data-list--m-compact__cell--md--PaddingBottom: 0;
10658
10647
  --pf-v5-c-data-list--m-compact__cell-cell--PaddingTop: 0;
10659
- --pf-v5-c-data-list--m-compact__cell-cell--md--PaddingTop: var(--pf-v5-global--spacer--sm);
10660
- --pf-v5-c-data-list--m-compact__cell--cell--MarginRight: var(--pf-v5-global--spacer--md);
10661
- --pf-v5-c-data-list--m-compact__item-control--PaddingTop: var(--pf-v5-global--spacer--sm);
10662
- --pf-v5-c-data-list--m-compact__item-control--PaddingBottom: var(--pf-v5-global--spacer--sm);
10663
- --pf-v5-c-data-list--m-compact__item-control--MarginRight: var(--pf-v5-global--spacer--md);
10664
- --pf-v5-c-data-list--m-compact__item-action--PaddingTop: var(--pf-v5-global--spacer--sm);
10665
- --pf-v5-c-data-list--m-compact__item-action--PaddingBottom: var(--pf-v5-global--spacer--sm);
10666
- --pf-v5-c-data-list--m-compact__item-action--MarginLeft: var(--pf-v5-global--spacer--md);
10648
+ --pf-v5-c-data-list--m-compact__cell-cell--md--PaddingTop: var(--pf-t--global--spacer--sm);
10649
+ --pf-v5-c-data-list--m-compact__cell--cell--MarginRight: var(--pf-t--global--spacer--md);
10650
+ --pf-v5-c-data-list--m-compact__item-control--PaddingTop: var(--pf-t--global--spacer--sm);
10651
+ --pf-v5-c-data-list--m-compact__item-control--PaddingBottom: var(--pf-t--global--spacer--sm);
10652
+ --pf-v5-c-data-list--m-compact__item-control--MarginRight: var(--pf-t--global--spacer--md);
10653
+ --pf-v5-c-data-list--m-compact__item-action--PaddingTop: var(--pf-t--global--spacer--sm);
10654
+ --pf-v5-c-data-list--m-compact__item-action--PaddingBottom: var(--pf-t--global--spacer--sm);
10655
+ --pf-v5-c-data-list--m-compact__item-action--MarginLeft: var(--pf-t--global--spacer--md);
10667
10656
  --pf-v5-c-data-list--m-compact__item-action__action--MarginTop: calc(var(--pf-v5-c-data-list--m-compact__item-action--PaddingTop) * -1);
10668
10657
  --pf-v5-c-data-list--m-compact__item-action__action--MarginBottom: calc(var(--pf-v5-c-data-list--m-compact__item-action--PaddingBottom) * -1);
10669
10658
  --pf-v5-c-data-list--m-compact__action--MarginTop: var(--pf-v5-c-data-list--m-compact__item-action__action--MarginTop);
10670
- --pf-v5-c-data-list--m-compact__item-content--PaddingBottom: var(--pf-v5-global--spacer--sm);
10671
- --pf-v5-c-data-list--m-compact__item-draggable-button--MarginTop: calc(var(--pf-v5-global--spacer--sm) * -1);
10672
- --pf-v5-c-data-list--m-compact__item-draggable-button--MarginBottom: calc(var(--pf-v5-global--spacer--sm) * -1);
10673
- --pf-v5-c-data-list--m-compact__item-draggable-button--PaddingTop: var(--pf-v5-global--spacer--sm);
10674
- --pf-v5-c-data-list--m-compact__item-draggable-button--PaddingBottom: var(--pf-v5-global--spacer--sm);
10675
- --pf-v5-c-data-list--m-compact__cell--m-icon--cell--PaddingTop: var(--pf-v5-global--spacer--sm);
10676
- color: var(--pf-v5-global--Color--100);
10677
- font-size: var(--pf-v5-c-data-list--FontSize);
10678
- line-height: var(--pf-v5-c-data-list--LineHeight);
10679
- overflow-wrap: break-word;
10680
- border-block-start: var(--pf-v5-c-data-list--BorderTopWidth) solid var(--pf-v5-c-data-list--BorderTopColor);
10659
+ --pf-v5-c-data-list--m-compact__item-content--PaddingBottom: var(--pf-t--global--spacer--sm);
10660
+ --pf-v5-c-data-list--m-compact__item-draggable-button--MarginTop: calc(var(--pf-t--global--spacer--sm) * -1);
10661
+ --pf-v5-c-data-list--m-compact__item-draggable-button--MarginBottom: calc(var(--pf-t--global--spacer--sm) * -1);
10662
+ --pf-v5-c-data-list--m-compact__item-draggable-button--PaddingTop: var(--pf-t--global--spacer--sm);
10663
+ --pf-v5-c-data-list--m-compact__item-draggable-button--PaddingBottom: var(--pf-t--global--spacer--sm);
10664
+ --pf-v5-c-data-list--m-compact__cell--m-icon--cell--PaddingTop: var(--pf-t--global--spacer--sm);
10681
10665
  }
10682
10666
  @media screen and (min-width: 576px) {
10683
- .pf-v5-c-data-list {
10667
+ :root, .pf-v5-c-data-list {
10684
10668
  --pf-v5-c-data-list--BorderTopColor: var(--pf-v5-c-data-list--sm--BorderTopColor);
10685
10669
  --pf-v5-c-data-list--BorderTopWidth: var(--pf-v5-c-data-list--sm--BorderTopWidth);
10686
10670
  }
10687
10671
  }
10688
10672
  @media screen and (min-width: 576px) {
10689
- .pf-v5-c-data-list {
10673
+ :root, .pf-v5-c-data-list {
10690
10674
  --pf-v5-c-data-list__item--BorderBottomWidth: var(--pf-v5-c-data-list__item--sm--BorderBottomWidth);
10691
10675
  --pf-v5-c-data-list__item--BorderBottomColor: var(--pf-v5-c-data-list__item--sm--BorderBottomColor);
10692
10676
  }
10693
10677
  }
10694
- @media (min-width: 576px) {
10695
- .pf-v5-c-data-list {
10696
- --pf-v5-c-data-list__item--before--Top: var(--pf-v5-c-data-list__item--before--sm--Top);
10697
- }
10678
+
10679
+ .pf-v5-c-data-list {
10680
+ font-size: var(--pf-v5-c-data-list--FontSize);
10681
+ line-height: var(--pf-v5-c-data-list--LineHeight);
10682
+ overflow-wrap: break-word;
10683
+ border-block-start: var(--pf-v5-c-data-list--BorderTopWidth) solid var(--pf-v5-c-data-list--BorderTopColor);
10698
10684
  }
10699
10685
  .pf-v5-c-data-list.pf-m-compact {
10700
10686
  --pf-v5-c-data-list__check--FontSize: var(--pf-v5-c-data-list--m-compact__check--FontSize);
@@ -10758,44 +10744,15 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10758
10744
  background-color: var(--pf-v5-c-data-list__item--BackgroundColor);
10759
10745
  border-block-end: var(--pf-v5-c-data-list__item--BorderBottomWidth) solid var(--pf-v5-c-data-list__item--BorderBottomColor);
10760
10746
  }
10761
- .pf-v5-c-data-list__item::before {
10762
- position: absolute;
10763
- inset-block-start: var(--pf-v5-c-data-list__item--before--Top);
10764
- inset-block-end: 0;
10765
- inset-inline-start: 0;
10766
- width: var(--pf-v5-c-data-list__item--before--Width);
10767
- content: "";
10768
- background-color: var(--pf-v5-c-data-list__item--before--BackgroundColor);
10769
- transition: var(--pf-v5-c-data-list__item--before--Transition);
10770
- }
10771
10747
  .pf-v5-c-data-list__item.pf-m-clickable {
10772
10748
  cursor: pointer;
10773
10749
  outline-offset: var(--pf-v5-c-data-list__item--m-clickable--OutlineOffset);
10774
10750
  }
10775
10751
  .pf-v5-c-data-list__item.pf-m-clickable:hover, .pf-v5-c-data-list__item.pf-m-clickable:focus {
10776
- position: relative;
10777
- z-index: var(--pf-v5-c-data-list__item--m-clickable--hover--ZIndex);
10778
- }
10779
- .pf-v5-c-data-list__item.pf-m-clickable:hover:not(.pf-m-selected):not(:last-child), .pf-v5-c-data-list__item.pf-m-clickable:focus:not(.pf-m-selected):not(:last-child) {
10780
- --pf-v5-c-data-list__item--BorderBottomWidth: 0;
10781
- }
10782
- .pf-v5-c-data-list__item.pf-m-clickable:hover:not(.pf-m-selected):not(:last-child) + .pf-v5-c-data-list__item, .pf-v5-c-data-list__item.pf-m-clickable:focus:not(.pf-m-selected):not(:last-child) + .pf-v5-c-data-list__item {
10783
- border-block-start: var(--pf-v5-c-data-list__item--m-clickable--hover--item--BorderTopWidth) solid var(--pf-v5-c-data-list__item--m-clickable--hover--item--BorderTopColor);
10784
- }
10785
- .pf-v5-c-data-list__item.pf-m-clickable:hover {
10786
- box-shadow: var(--pf-v5-c-data-list__item--m-clickable--hover--BoxShadow);
10787
- }
10788
- .pf-v5-c-data-list__item.pf-m-clickable:focus {
10789
- box-shadow: var(--pf-v5-c-data-list__item--m-clickable--focus--BoxShadow);
10790
- }
10791
- .pf-v5-c-data-list__item.pf-m-clickable:active {
10792
- box-shadow: var(--pf-v5-c-data-list__item--m-clickable--active--BoxShadow);
10752
+ background-color: var(--pf-v5-c-data-list__item--hover--BackgroundColor);
10793
10753
  }
10794
10754
  .pf-v5-c-data-list__item.pf-m-selected {
10795
- --pf-v5-c-data-list__item--before--BackgroundColor: var(--pf-v5-c-data-list__item--m-selected--before--BackgroundColor);
10796
- position: relative;
10797
- z-index: var(--pf-v5-c-data-list__item--m-selected--ZIndex);
10798
- box-shadow: var(--pf-v5-c-data-list__item--m-selected--BoxShadow);
10755
+ background-color: var(--pf-v5-c-data-list__item--m-selected--BackgroundColor);
10799
10756
  }
10800
10757
  .pf-v5-c-data-list__item.pf-m-ghost-row::after {
10801
10758
  position: absolute;
@@ -10949,7 +10906,12 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10949
10906
 
10950
10907
  .pf-v5-c-data-list__expandable-content {
10951
10908
  max-height: var(--pf-v5-c-data-list__expandable-content--MaxHeight);
10909
+ margin-block-end: var(--pf-v5-c-data-list__expandable-content--MarginBlockEnd);
10910
+ margin-inline-start: var(--pf-v5-c-data-list__expandable-content--MarginInlineStart);
10911
+ margin-inline-end: var(--pf-v5-c-data-list__expandable-content--MarginInlineEnd);
10952
10912
  overflow-y: auto;
10913
+ background-color: var(--pf-v5-c-data-list__expandable-content--BackgroundColor);
10914
+ border-radius: var(--pf-v5-c-data-list__expandable-content-body--BorderRadius);
10953
10915
  }
10954
10916
  .pf-v5-c-data-list__expandable-content .pf-v5-c-data-list__expandable-content-body {
10955
10917
  padding-block-start: var(--pf-v5-c-data-list__expandable-content-body--PaddingTop);
@@ -10973,17 +10935,6 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10973
10935
  padding: 0;
10974
10936
  }
10975
10937
 
10976
- :where(.pf-v5-theme-dark) .pf-v5-c-wizard__header .pf-v5-c-button, :where(.pf-v5-theme-dark) .pf-v5-c-log-viewer.pf-m-dark .pf-v5-c-log-viewer__main .pf-v5-c-button {
10977
- --pf-v5-c-button--m-primary--BackgroundColor: var(--pf-v5-global--primary-color--300);
10978
- }
10979
-
10980
- :where(.pf-v5-theme-dark) .pf-v5-c-data-list {
10981
- --pf-v5-c-data-list--BorderTopColor: var(--pf-v5-global--BorderColor--100);
10982
- --pf-v5-c-data-list--sm--BorderTopColor: var(--pf-v5-global--BorderColor--100);
10983
- --pf-v5-c-data-list__item--BorderBottomColor: var(--pf-v5-global--BorderColor--100);
10984
- --pf-v5-c-data-list__item--sm--BorderBottomColor: var(--pf-v5-global--BorderColor--100);
10985
- }
10986
-
10987
10938
  .pf-v5-c-description-list {
10988
10939
  --pf-v5-c-description-list--RowGap: var(--pf-v5-global--gutter--md);
10989
10940
  --pf-v5-c-description-list--ColumnGap: var(--pf-v5-global--spacer--lg);
@@ -24818,66 +24769,70 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
24818
24769
  inset-inline-start: var(--pf-v5-c-skip-to-content--focus--Left);
24819
24770
  }
24820
24771
 
24772
+ :root,
24821
24773
  .pf-v5-c-slider {
24822
24774
  --pf-v5-c-slider--value: 0;
24823
24775
  --pf-v5-c-slider__step--Left: 0;
24824
- --pf-v5-c-slider__rail--PaddingTop: var(--pf-v5-global--spacer--md);
24825
- --pf-v5-c-slider__rail--PaddingBottom: var(--pf-v5-global--spacer--md);
24776
+ --pf-v5-c-slider__rail--PaddingTop: var(--pf-t--global--spacer--md);
24777
+ --pf-v5-c-slider__rail--PaddingBottom: var(--pf-t--global--spacer--md);
24826
24778
  --pf-v5-c-slider__rail-track--Height: 0.25rem;
24827
- --pf-v5-c-slider__rail-track--before--base--BackgroundColor: var(--pf-v5-global--BorderColor--100);
24828
- --pf-v5-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-v5-global--active-color--300);
24829
- --pf-v5-c-slider__rail-track--before--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
24779
+ --pf-v5-c-slider__rail-track--before--base--BackgroundColor: var(--pf-t--global--border--color--default);
24780
+ --pf-v5-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-t--global--border--color--hover);
24781
+ --pf-v5-c-slider__rail-track--before--BorderRadius: var(--pf-t--global--border--radius--tiny);
24830
24782
  --pf-v5-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop: var(--pf-v5-c-slider--value);
24831
- --pf-v5-c-slider__rail-track--before--fill--direction: right;
24832
- --pf-v5-c-slider__steps--FontSize: var(--pf-v5-global--FontSize--sm);
24783
+ --pf-v5-c-slider__steps--FontSize: var(--pf-t--global--font--size--sm);
24833
24784
  --pf-v5-c-slider__steps--Height: var(--pf-v5-c-slider__steps--FontSize);
24834
- --pf-v5-c-slider__step-tick--Top: var(--pf-v5-global--spacer--md);
24785
+ --pf-v5-c-slider__step-tick--Top: var(--pf-t--global--spacer--md);
24835
24786
  --pf-v5-c-slider__step-tick--Width: 0.25rem;
24836
24787
  --pf-v5-c-slider__step-tick--Height: 0.25rem;
24837
- --pf-v5-c-slider__step-tick--BackgroundColor: var(--pf-v5-global--BorderColor--200);
24788
+ --pf-v5-c-slider__step-tick--BackgroundColor: var(--pf-t--global--icon--color--subtle);
24838
24789
  --pf-v5-c-slider__step-tick--TranslateX: -50%;
24839
- --pf-v5-c-slider__step-tick--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
24840
- --pf-v5-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-v5-global--primary-color--100);
24790
+ --pf-v5-c-slider__step-tick--BorderRadius: var(--pf-t--global--border--radius--large);
24791
+ --pf-v5-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-t--global--icon--color--brand--clicked);
24841
24792
  --pf-v5-c-slider__step--first-child__step-tick--TranslateX: 0;
24842
24793
  --pf-v5-c-slider__step--last-child__step-tick--TranslateX: -100%;
24843
24794
  --pf-v5-c-slider__step-label--TranslateX: -50%;
24844
- --pf-v5-c-slider__step-label--Top: calc(var(--pf-v5-global--spacer--xl) + var(--pf-v5-c-slider__rail-track--Height));
24795
+ --pf-v5-c-slider__step-label--Top: calc(var(--pf-t--global--spacer--xl) + var(--pf-v5-c-slider__rail-track--Height));
24845
24796
  --pf-v5-c-slider__step--first-child__step-label--TranslateX: 0;
24846
24797
  --pf-v5-c-slider__step--last-child__step-label--TranslateX: -100%;
24847
- --pf-v5-c-slider__thumb--Top: calc(var(--pf-v5-c-slider__rail-track--Height) / 2 + var(--pf-v5-global--spacer--md));
24798
+ --pf-v5-c-slider__thumb--Top: calc(var(--pf-v5-c-slider__rail-track--Height) / 2 + var(--pf-t--global--spacer--md));
24848
24799
  --pf-v5-c-slider__thumb--Width: 1rem;
24849
24800
  --pf-v5-c-slider__thumb--Height: 1rem;
24850
24801
  --pf-v5-c-slider__thumb--Left: var(--pf-v5-c-slider--value);
24851
- --pf-v5-c-slider__thumb--BackgroundColor: var(--pf-v5-global--primary-color--100);
24802
+ --pf-v5-c-slider__thumb--BackgroundColor: var(--pf-t--global--color--brand--default);
24852
24803
  --pf-v5-c-slider__thumb--TranslateX: -50%;
24853
24804
  --pf-v5-c-slider__thumb--TranslateY: -50%;
24854
- --pf-v5-c-slider__thumb--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
24805
+ --pf-v5-c-slider__thumb--BorderRadius: var(--pf-t--global--border--radius--large);
24855
24806
  --pf-v5-c-slider__thumb--BoxShadow--base:
24856
- 0 0 0 2px var(--pf-v5-global--BackgroundColor--100),
24857
- 0 0 0 3px var(--pf-v5-global--primary-color--100);
24807
+ 0 0 0 2px var(--pf-t--global--background--color--primary--default),
24808
+ 0 0 0 3px var(--pf-t--global--color--brand--default);
24858
24809
  --pf-v5-c-slider__thumb--hover--BoxShadow: var(--pf-v5-c-slider__thumb--BoxShadow--base);
24859
24810
  --pf-v5-c-slider__thumb--focus--BoxShadow: var(--pf-v5-c-slider__thumb--BoxShadow--base);
24860
24811
  --pf-v5-c-slider__thumb--active--BoxShadow:
24861
24812
  var(--pf-v5-c-slider__thumb--BoxShadow--base),
24862
- 0 0 2px 5px var(--pf-v5-global--active-color--200);
24863
- --pf-v5-c-slider__thumb--before--Width: var(--pf-v5-global--target-size--MinWidth);
24864
- --pf-v5-c-slider__thumb--before--Height: var(--pf-v5-global--target-size--MinHeight);
24865
- --pf-v5-c-slider__thumb--before--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
24813
+ 0 0 2px 5px var(--pf-t--global--color--nonstatus--blue--clicked);
24814
+ --pf-v5-c-slider__thumb--before--Width: 44px;
24815
+ --pf-v5-c-slider__thumb--before--Height: var(--pf-v5-c-slider__thumb--before--Width);
24816
+ --pf-v5-c-slider__thumb--before--BorderRadius: var(--pf-t--global--border--radius--large);
24866
24817
  --pf-v5-c-slider__thumb--before--TranslateX: -50%;
24867
24818
  --pf-v5-c-slider__thumb--before--TranslateY: -50%;
24868
- --pf-v5-c-slider__value--MarginLeft: var(--pf-v5-global--spacer--md);
24869
- --pf-v5-c-slider__value--c-form-control--width-base: 3.5ch;
24819
+ --pf-v5-c-slider__value--MarginLeft: var(--pf-t--global--spacer--md);
24820
+ --pf-v5-c-slider__value--c-form-control--width-base: calc(var(--pf-v5-c-form-control--PaddingLeft) + var(--pf-v5-c-form-control--PaddingRight) + 1.25rem);
24870
24821
  --pf-v5-c-slider__value--c-form-control--width-chars: 3;
24871
- --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));
24822
+ --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);
24872
24823
  --pf-v5-c-slider__value--m-floating--TranslateX: -50%;
24873
24824
  --pf-v5-c-slider__value--m-floating--TranslateY: -100%;
24874
24825
  --pf-v5-c-slider__value--m-floating--Left: var(--pf-v5-c-slider--value);
24875
- --pf-v5-c-slider__value--m-floating--ZIndex: var(--pf-v5-global--ZIndex--sm);
24876
- --pf-v5-c-slider__actions--MarginRight: var(--pf-v5-global--spacer--sm);
24877
- --pf-v5-c-slider__main--actions--MarginLeft: var(--pf-v5-global--spacer--sm);
24878
- --pf-v5-c-slider--m-disabled__rail-track--before--fill--BackgroundColor: var(--pf-v5-global--palette--black-500);
24879
- --pf-v5-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor: var(--pf-v5-global--palette--black-700);
24880
- --pf-v5-c-slider--m-disabled__thumb--BackgroundColor: var(--pf-v5-global--palette--black-700);
24826
+ --pf-v5-c-slider__value--m-floating--ZIndex: var(--pf-t--global--Zindex--sm);
24827
+ --pf-v5-c-slider__actions--MarginRight: var(--pf-t--global--spacer--sm);
24828
+ --pf-v5-c-slider__main--actions--MarginLeft: var(--pf-t--global--spacer--sm);
24829
+ --pf-v5-c-slider--m-disabled__rail-track--before--fill--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
24830
+ --pf-v5-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor: var(--pf-t--global--icon--color--disabled);
24831
+ --pf-v5-c-slider--m-disabled__thumb--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
24832
+ }
24833
+
24834
+ .pf-v5-c-slider {
24835
+ --pf-v5-c-slider__rail-track--before--fill--direction: right;
24881
24836
  display: flex;
24882
24837
  }
24883
24838
  :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider {