@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-theme-dark-unversioned.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-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-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);
@@ -10669,149 +10669,135 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10669
10669
  }
10670
10670
  }
10671
10671
 
10672
- .pf-v5-c-data-list {
10673
- --pf-v5-c-data-list--FontSize: 1em;
10674
- --pf-v5-c-data-list--LineHeight: var(--pf-v5-global--LineHeight--md);
10675
- --pf-v5-c-data-list--BorderTopColor: var(--pf-v5-global--BorderColor--300);
10676
- --pf-v5-c-data-list--BorderTopWidth: var(--pf-v5-global--spacer--sm);
10677
- --pf-v5-c-data-list--sm--BorderTopWidth: var(--pf-v5-global--BorderWidth--sm);
10678
- --pf-v5-c-data-list--sm--BorderTopColor: var(--pf-v5-global--BorderColor--100);
10679
- --pf-v5-c-data-list--MarginLeft: var(--pf-v5-global--spacer--md);
10680
- --pf-v5-c-data-list__item--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
10681
- --pf-v5-c-data-list__item--m-selected--ZIndex: var(--pf-v5-global--ZIndex--xs);
10682
- --pf-v5-c-data-list__item--m-expanded--before--BackgroundColor: var(--pf-v5-global--active-color--100);
10683
- --pf-v5-c-data-list__item--m-selected--before--BackgroundColor: var(--pf-v5-global--active-color--100);
10684
- --pf-v5-c-data-list__item--m-selected--BoxShadow: var(--pf-v5-global--BoxShadow--sm-top), var(--pf-v5-global--BoxShadow--sm-bottom);
10685
- --pf-v5-c-data-list__item--m-clickable--OutlineOffset: calc(-1 * var(--pf-v5-global--spacer--xs));
10686
- --pf-v5-c-data-list__item--m-clickable--hover--ZIndex: calc(var(--pf-v5-c-data-list__item--m-selected--ZIndex) + 1);
10687
- --pf-v5-c-data-list__item--m-clickable--hover--BoxShadow: var(--pf-v5-global--BoxShadow--sm-top), var(--pf-v5-global--BoxShadow--sm-bottom);
10688
- --pf-v5-c-data-list__item--m-clickable--focus--BoxShadow: var(--pf-v5-global--BoxShadow--sm-top), var(--pf-v5-global--BoxShadow--sm-bottom);
10689
- --pf-v5-c-data-list__item--m-clickable--active--BoxShadow: var(--pf-v5-global--BoxShadow--sm-top), var(--pf-v5-global--BoxShadow--sm-bottom);
10690
- --pf-v5-c-data-list__item--BorderBottomColor: var(--pf-v5-global--BorderColor--300);
10691
- --pf-v5-c-data-list__item--BorderBottomWidth: 0.5rem;
10692
- --pf-v5-c-data-list__item--m-clickable--hover--item--BorderTopColor: var(--pf-v5-c-data-list__item--BorderBottomColor);
10693
- --pf-v5-c-data-list__item--m-clickable--hover--item--BorderTopWidth: var(--pf-v5-c-data-list__item--BorderBottomWidth);
10694
- --pf-v5-c-data-list__item--sm--BorderBottomWidth: var(--pf-v5-global--BorderWidth--sm);
10695
- --pf-v5-c-data-list__item--sm--BorderBottomColor: var(--pf-v5-global--BorderColor--100);
10696
- --pf-v5-c-data-list__item--before--BackgroundColor: transparent;
10697
- --pf-v5-c-data-list__item--before--Width: calc(2 * var(--pf-v5-global--BorderWidth--lg));
10698
- --pf-v5-c-data-list__item--before--Transition: var(--pf-v5-global--Transition);
10699
- --pf-v5-c-data-list__item--before--Top: 0;
10700
- --pf-v5-c-data-list__item--before--sm--Top: calc(var(--pf-v5-c-data-list__item--BorderBottomWidth) * -1);
10701
- --pf-v5-c-data-list__item-row--PaddingRight: var(--pf-v5-global--spacer--md);
10702
- --pf-v5-c-data-list__item-row--PaddingLeft: var(--pf-v5-global--spacer--md);
10703
- --pf-v5-c-data-list__item-row--xl--PaddingRight: var(--pf-v5-global--spacer--lg);
10704
- --pf-v5-c-data-list__item-row--xl--PaddingLeft: var(--pf-v5-global--spacer--lg);
10705
- --pf-v5-c-data-list__item-content--md--PaddingBottom: var(--pf-v5-global--spacer--lg);
10706
- --pf-v5-c-data-list__cell--PaddingTop: var(--pf-v5-global--spacer--lg);
10707
- --pf-v5-c-data-list__cell--PaddingBottom: var(--pf-v5-global--spacer--lg);
10708
- --pf-v5-c-data-list__cell--MarginRight: var(--pf-v5-global--spacer--xl);
10672
+ :root, .pf-v5-c-data-list {
10673
+ --pf-v5-c-data-list--FontSize: var( --pf-t--global--font--size--body);
10674
+ --pf-v5-c-data-list--LineHeight: var(--pf-t--global--font--line-height--body);
10675
+ --pf-v5-c-data-list--BorderTopColor: var(--pf-t--global--border--color--default);
10676
+ --pf-v5-c-data-list--BorderTopWidth: var(--pf-t--global--spacer--sm);
10677
+ --pf-v5-c-data-list--sm--BorderTopWidth: var(--pf-t--global--border--width--divider--default);
10678
+ --pf-v5-c-data-list--sm--BorderTopColor: var(--pf-t--global--border--color--default);
10679
+ --pf-v5-c-data-list--MarginLeft: var(--pf-t--global--spacer--md);
10680
+ --pf-v5-c-data-list__item--BackgroundColor: var( --pf-t--global--background--color--primary--default);
10681
+ --pf-v5-c-data-list__item--hover--BackgroundColor: var(--pf-t--global--background--color--primary--hover);
10682
+ --pf-v5-c-data-list__item--m-selected--BackgroundColor: var(--pf-t--global--background--color--primary--clicked);
10683
+ --pf-v5-c-data-list__item--m-clickable--OutlineOffset: calc(-1 * var(--pf-t--global--spacer--xs));
10684
+ --pf-v5-c-data-list__item--BorderBottomColor: var(--pf-t--global--border--color--default);
10685
+ --pf-v5-c-data-list__item--BorderBottomWidth: var(--pf-t--global--spacer--sm);
10686
+ --pf-v5-c-data-list__item--sm--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
10687
+ --pf-v5-c-data-list__item--sm--BorderBottomColor: var(--pf-t--global--border--color--default);
10688
+ --pf-v5-c-data-list__item-row--PaddingRight: var(--pf-t--global--spacer--md);
10689
+ --pf-v5-c-data-list__item-row--PaddingLeft: var(--pf-t--global--spacer--md);
10690
+ --pf-v5-c-data-list__item-row--xl--PaddingRight: var(--pf-t--global--spacer--lg);
10691
+ --pf-v5-c-data-list__item-row--xl--PaddingLeft: var(--pf-t--global--spacer--lg);
10692
+ --pf-v5-c-data-list__item-content--md--PaddingBottom: var(--pf-t--global--spacer--lg);
10693
+ --pf-v5-c-data-list__cell--PaddingTop: var(--pf-t--global--spacer--lg);
10694
+ --pf-v5-c-data-list__cell--PaddingBottom: var(--pf-t--global--spacer--lg);
10695
+ --pf-v5-c-data-list__cell--MarginRight: var(--pf-t--global--spacer--xl);
10709
10696
  --pf-v5-c-data-list__cell--md--PaddingBottom: 0;
10710
- --pf-v5-c-data-list__cell--m-icon--MarginRight: var(--pf-v5-global--spacer--md);
10697
+ --pf-v5-c-data-list__cell--m-icon--MarginRight: var(--pf-t--global--spacer--md);
10711
10698
  --pf-v5-c-data-list__cell--cell--PaddingTop: 0;
10712
- --pf-v5-c-data-list__cell--cell--md--PaddingTop: var(--pf-v5-global--spacer--lg);
10713
- --pf-v5-c-data-list__cell--m-icon--cell--PaddingTop: var(--pf-v5-global--spacer--lg);
10699
+ --pf-v5-c-data-list__cell--cell--md--PaddingTop: var(--pf-t--global--spacer--lg);
10700
+ --pf-v5-c-data-list__cell--m-icon--cell--PaddingTop: var(--pf-t--global--spacer--lg);
10714
10701
  --pf-v5-c-data-list--cell--MinWidth: initial;
10715
10702
  --pf-v5-c-data-list--cell--Overflow: visible;
10716
10703
  --pf-v5-c-data-list--cell--TextOverflow: clip;
10717
10704
  --pf-v5-c-data-list--cell--WhiteSpace: normal;
10718
10705
  --pf-v5-c-data-list--cell--WordBreak: normal;
10719
10706
  --pf-v5-c-data-list--cell--m-truncate--MinWidth: 5ch;
10720
- --pf-v5-c-data-list__toggle--MarginLeft: calc(var(--pf-v5-global--spacer--sm) * -1);
10721
- --pf-v5-c-data-list__toggle--MarginTop: calc(var(--pf-v5-global--spacer--form-element) * -1);
10722
- --pf-v5-c-data-list__toggle--MarginBottom: calc(var(--pf-v5-global--spacer--form-element) * -1);
10707
+ --pf-v5-c-data-list__toggle--MarginLeft: calc(var(--pf-t--global--spacer--sm) * -1);
10708
+ --pf-v5-c-data-list__toggle--MarginTop: calc(var(--pf-t--global--spacer--sm) * -1);
10709
+ --pf-v5-c-data-list__toggle--MarginBottom: calc(var(--pf-t--global--spacer--sm) * -1);
10723
10710
  --pf-v5-c-data-list__toggle-icon--Height: calc(var(--pf-v5-c-data-list--FontSize) * var(--pf-v5-c-data-list--LineHeight));
10724
10711
  --pf-v5-c-data-list__toggle-icon--Transition: .2s ease-in 0s;
10725
10712
  --pf-v5-c-data-list__toggle-icon--Rotate: 0;
10726
10713
  --pf-v5-c-data-list__item--m-expanded__toggle-icon--Rotate: 90deg;
10727
10714
  --pf-v5-c-data-list__item-draggable-button--BackgroundColor: transparent;
10728
- --pf-v5-c-data-list__item-draggable-button--PaddingLeft: var(--pf-v5-global--spacer--md);
10729
- --pf-v5-c-data-list__item-draggable-button--PaddingRight: var(--pf-v5-global--spacer--md);
10730
- --pf-v5-c-data-list__item-draggable-button--MarginTop: calc(var(--pf-v5-global--spacer--lg) * -1);
10731
- --pf-v5-c-data-list__item-draggable-button--MarginBottom: calc(var(--pf-v5-global--spacer--lg) * -1);
10732
- --pf-v5-c-data-list__item-draggable-button--PaddingTop: var(--pf-v5-global--spacer--lg);
10733
- --pf-v5-c-data-list__item-draggable-button--PaddingBottom: var(--pf-v5-global--spacer--lg);
10734
- --pf-v5-c-data-list__item-draggable-button--MarginLeft: calc(var(--pf-v5-global--spacer--md) * -1);
10735
- --pf-v5-c-data-list__item-draggable-button-icon--Color: var(--pf-v5-global--icon--Color--light);
10736
- --pf-v5-c-data-list__item-draggable-button--m-disabled__draggable-icon--Color: var(--pf-v5-global--disabled-color--200);
10737
- --pf-v5-c-data-list__item-draggable-button--hover__draggable-icon--Color: var(--pf-v5-global--icon--Color--dark);
10738
- --pf-v5-c-data-list__item-draggable-button--focus__draggable-icon--Color: var(--pf-v5-global--icon--Color--dark);
10739
- --pf-v5-c-data-list__item--m-ghost-row--after--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
10715
+ --pf-v5-c-data-list__item-draggable-button--PaddingLeft: var(--pf-t--global--spacer--md);
10716
+ --pf-v5-c-data-list__item-draggable-button--PaddingRight: var(--pf-t--global--spacer--md);
10717
+ --pf-v5-c-data-list__item-draggable-button--MarginTop: calc(var(--pf-t--global--spacer--lg) * -1);
10718
+ --pf-v5-c-data-list__item-draggable-button--MarginBottom: calc(var(--pf-t--global--spacer--lg) * -1);
10719
+ --pf-v5-c-data-list__item-draggable-button--PaddingTop: var(--pf-t--global--spacer--lg);
10720
+ --pf-v5-c-data-list__item-draggable-button--PaddingBottom: var(--pf-t--global--spacer--lg);
10721
+ --pf-v5-c-data-list__item-draggable-button--MarginLeft: calc(var(--pf-t--global--spacer--md) * -1);
10722
+ --pf-v5-c-data-list__item-draggable-button-icon--Color: var(--pf-t--global--icon--color--subtle);
10723
+ --pf-v5-c-data-list__item-draggable-button--m-disabled__draggable-icon--Color: var(--pf-t--global--icon--color--disabled);
10724
+ --pf-v5-c-data-list__item-draggable-button--hover__draggable-icon--Color: var(--pf-t--global--icon--color--regular);
10725
+ --pf-v5-c-data-list__item-draggable-button--focus__draggable-icon--Color: var(--pf-t--global--icon--color--regular);
10726
+ --pf-v5-c-data-list__item--m-ghost-row--after--BackgroundColor: var(--pf-t--global--background--color--primary--default);
10740
10727
  --pf-v5-c-data-list__item--m-ghost-row--after--Opacity: .6;
10741
- --pf-v5-c-data-list__item-control--PaddingTop: var(--pf-v5-global--spacer--lg);
10742
- --pf-v5-c-data-list__item-control--PaddingBottom: var(--pf-v5-global--spacer--lg);
10743
- --pf-v5-c-data-list__item-control--MarginRight: var(--pf-v5-global--spacer--md);
10744
- --pf-v5-c-data-list__item-control--md--MarginRight: var(--pf-v5-global--spacer--xl);
10745
- --pf-v5-c-data-list__item-control--not-last-child--MarginRight: var(--pf-v5-global--spacer--md);
10728
+ --pf-v5-c-data-list__item-control--PaddingTop: var(--pf-t--global--spacer--lg);
10729
+ --pf-v5-c-data-list__item-control--PaddingBottom: var(--pf-t--global--spacer--lg);
10730
+ --pf-v5-c-data-list__item-control--MarginRight: var(--pf-t--global--spacer--md);
10731
+ --pf-v5-c-data-list__item-control--md--MarginRight: var(--pf-t--global--spacer--xl);
10732
+ --pf-v5-c-data-list__item-control--not-last-child--MarginRight: var(--pf-t--global--spacer--md);
10746
10733
  --pf-v5-c-data-list__check--Height: calc(var(--pf-v5-c-data-list--FontSize) * var(--pf-v5-c-data-list--LineHeight));
10747
10734
  --pf-v5-c-data-list__check--MarginTop: -0.0625rem;
10748
10735
  --pf-v5-c-data-list__item-action--Display: flex;
10749
- --pf-v5-c-data-list__item-action--PaddingTop: var(--pf-v5-global--spacer--lg);
10750
- --pf-v5-c-data-list__item-action--PaddingBottom: var(--pf-v5-global--spacer--lg);
10751
- --pf-v5-c-data-list__item-action--MarginLeft: var(--pf-v5-global--spacer--md);
10752
- --pf-v5-c-data-list__item-action--md--MarginLeft: var(--pf-v5-global--spacer--xl);
10753
- --pf-v5-c-data-list__item-action--not-last-child--MarginRight: var(--pf-v5-global--spacer--md);
10754
- --pf-v5-c-data-list__item-action__action--MarginTop: calc(var(--pf-v5-global--spacer--form-element) * -1);
10736
+ --pf-v5-c-data-list__item-action--PaddingTop: var(--pf-t--global--spacer--lg);
10737
+ --pf-v5-c-data-list__item-action--PaddingBottom: var(--pf-t--global--spacer--lg);
10738
+ --pf-v5-c-data-list__item-action--MarginLeft: var(--pf-t--global--spacer--md);
10739
+ --pf-v5-c-data-list__item-action--md--MarginLeft: var(--pf-t--global--spacer--xl);
10740
+ --pf-v5-c-data-list__item-action--not-last-child--MarginRight: var(--pf-t--global--spacer--md);
10741
+ --pf-v5-c-data-list__item-action__action--MarginTop: calc(var(--pf-t--global--spacer--sm) * -1);
10755
10742
  --pf-v5-c-data-list__action--MarginTop: var(--pf-v5-c-data-list__item-action__action--MarginTop);
10756
- --pf-v5-c-data-list__item-action__action--MarginBottom: calc(var(--pf-v5-global--spacer--form-element) * -1);
10757
- --pf-v5-c-data-list__expandable-content--MarginRight: calc(var(--pf-v5-c-data-list__expandable-content-body--PaddingRight) * -1);
10758
- --pf-v5-c-data-list__expandable-content--MarginLeft: calc(var(--pf-v5-c-data-list__expandable-content-body--PaddingLeft) * -1);
10743
+ --pf-v5-c-data-list__item-action__action--MarginBottom: calc(var(--pf-t--global--spacer--sm) * -1);
10744
+ --pf-v5-c-data-list__expandable-content--BackgroundColor: var( --pf-t--global--background--color--primary--default);
10745
+ --pf-v5-c-data-list__expandable-content--MarginBlockEnd: var(--pf-t--global--spacer--md);
10746
+ --pf-v5-c-data-list__expandable-content--MarginInlineStart: var(--pf-t--global--spacer--md);
10747
+ --pf-v5-c-data-list__expandable-content--MarginInlineEnd: var(--pf-t--global--spacer--md);
10759
10748
  --pf-v5-c-data-list__expandable-content--MaxHeight: 37.5rem;
10760
- --pf-v5-c-data-list__expandable-content--before--Top: calc(var(--pf-v5-c-data-list__item--BorderBottomWidth) * -1);
10761
- --pf-v5-c-data-list__expandable-content-body--PaddingTop: var(--pf-v5-global--spacer--md);
10762
- --pf-v5-c-data-list__expandable-content-body--PaddingRight: var(--pf-v5-global--spacer--md);
10763
- --pf-v5-c-data-list__expandable-content-body--PaddingBottom: var(--pf-v5-global--spacer--md);
10764
- --pf-v5-c-data-list__expandable-content-body--PaddingLeft: var(--pf-v5-global--spacer--md);
10765
- --pf-v5-c-data-list__expandable-content-body--md--PaddingTop: var(--pf-v5-global--spacer--lg);
10766
- --pf-v5-c-data-list__expandable-content-body--xl--PaddingRight: var(--pf-v5-global--spacer--lg);
10767
- --pf-v5-c-data-list__expandable-content-body--md--PaddingBottom: var(--pf-v5-global--spacer--lg);
10768
- --pf-v5-c-data-list__expandable-content-body--xl--PaddingLeft: var(--pf-v5-global--spacer--lg);
10769
- --pf-v5-c-data-list--m-compact--FontSize: var(--pf-v5-global--FontSize--sm);
10770
- --pf-v5-c-data-list--m-compact--LineHeight: var(--pf-v5-global--LineHeight--sm);
10771
- --pf-v5-c-data-list--m-compact__check--FontSize: var(--pf-v5-global--FontSize--md);
10772
- --pf-v5-c-data-list--m-compact__cell--PaddingTop: var(--pf-v5-global--spacer--sm);
10773
- --pf-v5-c-data-list--m-compact__cell--PaddingBottom: var(--pf-v5-global--spacer--sm);
10749
+ --pf-v5-c-data-list__expandable-content-body--PaddingTop: var(--pf-t--global--spacer--md);
10750
+ --pf-v5-c-data-list__expandable-content-body--PaddingRight: var(--pf-t--global--spacer--md);
10751
+ --pf-v5-c-data-list__expandable-content-body--PaddingBottom: var(--pf-t--global--spacer--md);
10752
+ --pf-v5-c-data-list__expandable-content-body--PaddingLeft: var(--pf-t--global--spacer--md);
10753
+ --pf-v5-c-data-list__expandable-content-body--md--PaddingTop: var(--pf-t--global--spacer--lg);
10754
+ --pf-v5-c-data-list__expandable-content-body--xl--PaddingRight: var(--pf-t--global--spacer--lg);
10755
+ --pf-v5-c-data-list__expandable-content-body--md--PaddingBottom: var(--pf-t--global--spacer--lg);
10756
+ --pf-v5-c-data-list__expandable-content-body--xl--PaddingLeft: var(--pf-t--global--spacer--lg);
10757
+ --pf-v5-c-data-list__expandable-content-body--BorderRadius: var(--pf-t--global--border--radius--small);
10758
+ --pf-v5-c-data-list--m-compact--FontSize: var(--pf-t--global--font--size--body--sm);
10759
+ --pf-v5-c-data-list--m-compact--LineHeight: var(--pf-t--global--font--line-height--body);
10760
+ --pf-v5-c-data-list--m-compact__check--FontSize: var(--pf-t--global--font--size--body--md);
10761
+ --pf-v5-c-data-list--m-compact__cell--PaddingTop: var(--pf-t--global--spacer--sm);
10762
+ --pf-v5-c-data-list--m-compact__cell--PaddingBottom: var(--pf-t--global--spacer--sm);
10774
10763
  --pf-v5-c-data-list--m-compact__cell--md--PaddingBottom: 0;
10775
10764
  --pf-v5-c-data-list--m-compact__cell-cell--PaddingTop: 0;
10776
- --pf-v5-c-data-list--m-compact__cell-cell--md--PaddingTop: var(--pf-v5-global--spacer--sm);
10777
- --pf-v5-c-data-list--m-compact__cell--cell--MarginRight: var(--pf-v5-global--spacer--md);
10778
- --pf-v5-c-data-list--m-compact__item-control--PaddingTop: var(--pf-v5-global--spacer--sm);
10779
- --pf-v5-c-data-list--m-compact__item-control--PaddingBottom: var(--pf-v5-global--spacer--sm);
10780
- --pf-v5-c-data-list--m-compact__item-control--MarginRight: var(--pf-v5-global--spacer--md);
10781
- --pf-v5-c-data-list--m-compact__item-action--PaddingTop: var(--pf-v5-global--spacer--sm);
10782
- --pf-v5-c-data-list--m-compact__item-action--PaddingBottom: var(--pf-v5-global--spacer--sm);
10783
- --pf-v5-c-data-list--m-compact__item-action--MarginLeft: var(--pf-v5-global--spacer--md);
10765
+ --pf-v5-c-data-list--m-compact__cell-cell--md--PaddingTop: var(--pf-t--global--spacer--sm);
10766
+ --pf-v5-c-data-list--m-compact__cell--cell--MarginRight: var(--pf-t--global--spacer--md);
10767
+ --pf-v5-c-data-list--m-compact__item-control--PaddingTop: var(--pf-t--global--spacer--sm);
10768
+ --pf-v5-c-data-list--m-compact__item-control--PaddingBottom: var(--pf-t--global--spacer--sm);
10769
+ --pf-v5-c-data-list--m-compact__item-control--MarginRight: var(--pf-t--global--spacer--md);
10770
+ --pf-v5-c-data-list--m-compact__item-action--PaddingTop: var(--pf-t--global--spacer--sm);
10771
+ --pf-v5-c-data-list--m-compact__item-action--PaddingBottom: var(--pf-t--global--spacer--sm);
10772
+ --pf-v5-c-data-list--m-compact__item-action--MarginLeft: var(--pf-t--global--spacer--md);
10784
10773
  --pf-v5-c-data-list--m-compact__item-action__action--MarginTop: calc(var(--pf-v5-c-data-list--m-compact__item-action--PaddingTop) * -1);
10785
10774
  --pf-v5-c-data-list--m-compact__item-action__action--MarginBottom: calc(var(--pf-v5-c-data-list--m-compact__item-action--PaddingBottom) * -1);
10786
10775
  --pf-v5-c-data-list--m-compact__action--MarginTop: var(--pf-v5-c-data-list--m-compact__item-action__action--MarginTop);
10787
- --pf-v5-c-data-list--m-compact__item-content--PaddingBottom: var(--pf-v5-global--spacer--sm);
10788
- --pf-v5-c-data-list--m-compact__item-draggable-button--MarginTop: calc(var(--pf-v5-global--spacer--sm) * -1);
10789
- --pf-v5-c-data-list--m-compact__item-draggable-button--MarginBottom: calc(var(--pf-v5-global--spacer--sm) * -1);
10790
- --pf-v5-c-data-list--m-compact__item-draggable-button--PaddingTop: var(--pf-v5-global--spacer--sm);
10791
- --pf-v5-c-data-list--m-compact__item-draggable-button--PaddingBottom: var(--pf-v5-global--spacer--sm);
10792
- --pf-v5-c-data-list--m-compact__cell--m-icon--cell--PaddingTop: var(--pf-v5-global--spacer--sm);
10793
- color: var(--pf-v5-global--Color--100);
10794
- font-size: var(--pf-v5-c-data-list--FontSize);
10795
- line-height: var(--pf-v5-c-data-list--LineHeight);
10796
- overflow-wrap: break-word;
10797
- border-block-start: var(--pf-v5-c-data-list--BorderTopWidth) solid var(--pf-v5-c-data-list--BorderTopColor);
10776
+ --pf-v5-c-data-list--m-compact__item-content--PaddingBottom: var(--pf-t--global--spacer--sm);
10777
+ --pf-v5-c-data-list--m-compact__item-draggable-button--MarginTop: calc(var(--pf-t--global--spacer--sm) * -1);
10778
+ --pf-v5-c-data-list--m-compact__item-draggable-button--MarginBottom: calc(var(--pf-t--global--spacer--sm) * -1);
10779
+ --pf-v5-c-data-list--m-compact__item-draggable-button--PaddingTop: var(--pf-t--global--spacer--sm);
10780
+ --pf-v5-c-data-list--m-compact__item-draggable-button--PaddingBottom: var(--pf-t--global--spacer--sm);
10781
+ --pf-v5-c-data-list--m-compact__cell--m-icon--cell--PaddingTop: var(--pf-t--global--spacer--sm);
10798
10782
  }
10799
10783
  @media screen and (min-width: 576px) {
10800
- .pf-v5-c-data-list {
10784
+ :root, .pf-v5-c-data-list {
10801
10785
  --pf-v5-c-data-list--BorderTopColor: var(--pf-v5-c-data-list--sm--BorderTopColor);
10802
10786
  --pf-v5-c-data-list--BorderTopWidth: var(--pf-v5-c-data-list--sm--BorderTopWidth);
10803
10787
  }
10804
10788
  }
10805
10789
  @media screen and (min-width: 576px) {
10806
- .pf-v5-c-data-list {
10790
+ :root, .pf-v5-c-data-list {
10807
10791
  --pf-v5-c-data-list__item--BorderBottomWidth: var(--pf-v5-c-data-list__item--sm--BorderBottomWidth);
10808
10792
  --pf-v5-c-data-list__item--BorderBottomColor: var(--pf-v5-c-data-list__item--sm--BorderBottomColor);
10809
10793
  }
10810
10794
  }
10811
- @media (min-width: 576px) {
10812
- .pf-v5-c-data-list {
10813
- --pf-v5-c-data-list__item--before--Top: var(--pf-v5-c-data-list__item--before--sm--Top);
10814
- }
10795
+
10796
+ .pf-v5-c-data-list {
10797
+ font-size: var(--pf-v5-c-data-list--FontSize);
10798
+ line-height: var(--pf-v5-c-data-list--LineHeight);
10799
+ overflow-wrap: break-word;
10800
+ border-block-start: var(--pf-v5-c-data-list--BorderTopWidth) solid var(--pf-v5-c-data-list--BorderTopColor);
10815
10801
  }
10816
10802
  .pf-v5-c-data-list.pf-m-compact {
10817
10803
  --pf-v5-c-data-list__check--FontSize: var(--pf-v5-c-data-list--m-compact__check--FontSize);
@@ -10875,44 +10861,15 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
10875
10861
  background-color: var(--pf-v5-c-data-list__item--BackgroundColor);
10876
10862
  border-block-end: var(--pf-v5-c-data-list__item--BorderBottomWidth) solid var(--pf-v5-c-data-list__item--BorderBottomColor);
10877
10863
  }
10878
- .pf-v5-c-data-list__item::before {
10879
- position: absolute;
10880
- inset-block-start: var(--pf-v5-c-data-list__item--before--Top);
10881
- inset-block-end: 0;
10882
- inset-inline-start: 0;
10883
- width: var(--pf-v5-c-data-list__item--before--Width);
10884
- content: "";
10885
- background-color: var(--pf-v5-c-data-list__item--before--BackgroundColor);
10886
- transition: var(--pf-v5-c-data-list__item--before--Transition);
10887
- }
10888
10864
  .pf-v5-c-data-list__item.pf-m-clickable {
10889
10865
  cursor: pointer;
10890
10866
  outline-offset: var(--pf-v5-c-data-list__item--m-clickable--OutlineOffset);
10891
10867
  }
10892
10868
  .pf-v5-c-data-list__item.pf-m-clickable:hover, .pf-v5-c-data-list__item.pf-m-clickable:focus {
10893
- position: relative;
10894
- z-index: var(--pf-v5-c-data-list__item--m-clickable--hover--ZIndex);
10895
- }
10896
- .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) {
10897
- --pf-v5-c-data-list__item--BorderBottomWidth: 0;
10898
- }
10899
- .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 {
10900
- 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);
10901
- }
10902
- .pf-v5-c-data-list__item.pf-m-clickable:hover {
10903
- box-shadow: var(--pf-v5-c-data-list__item--m-clickable--hover--BoxShadow);
10904
- }
10905
- .pf-v5-c-data-list__item.pf-m-clickable:focus {
10906
- box-shadow: var(--pf-v5-c-data-list__item--m-clickable--focus--BoxShadow);
10907
- }
10908
- .pf-v5-c-data-list__item.pf-m-clickable:active {
10909
- box-shadow: var(--pf-v5-c-data-list__item--m-clickable--active--BoxShadow);
10869
+ background-color: var(--pf-v5-c-data-list__item--hover--BackgroundColor);
10910
10870
  }
10911
10871
  .pf-v5-c-data-list__item.pf-m-selected {
10912
- --pf-v5-c-data-list__item--before--BackgroundColor: var(--pf-v5-c-data-list__item--m-selected--before--BackgroundColor);
10913
- position: relative;
10914
- z-index: var(--pf-v5-c-data-list__item--m-selected--ZIndex);
10915
- box-shadow: var(--pf-v5-c-data-list__item--m-selected--BoxShadow);
10872
+ background-color: var(--pf-v5-c-data-list__item--m-selected--BackgroundColor);
10916
10873
  }
10917
10874
  .pf-v5-c-data-list__item.pf-m-ghost-row::after {
10918
10875
  position: absolute;
@@ -11066,7 +11023,12 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11066
11023
 
11067
11024
  .pf-v5-c-data-list__expandable-content {
11068
11025
  max-height: var(--pf-v5-c-data-list__expandable-content--MaxHeight);
11026
+ margin-block-end: var(--pf-v5-c-data-list__expandable-content--MarginBlockEnd);
11027
+ margin-inline-start: var(--pf-v5-c-data-list__expandable-content--MarginInlineStart);
11028
+ margin-inline-end: var(--pf-v5-c-data-list__expandable-content--MarginInlineEnd);
11069
11029
  overflow-y: auto;
11030
+ background-color: var(--pf-v5-c-data-list__expandable-content--BackgroundColor);
11031
+ border-radius: var(--pf-v5-c-data-list__expandable-content-body--BorderRadius);
11070
11032
  }
11071
11033
  .pf-v5-c-data-list__expandable-content .pf-v5-c-data-list__expandable-content-body {
11072
11034
  padding-block-start: var(--pf-v5-c-data-list__expandable-content-body--PaddingTop);
@@ -11090,17 +11052,6 @@ label.pf-v5-c-check, .pf-v5-c-check__label,
11090
11052
  padding: 0;
11091
11053
  }
11092
11054
 
11093
- :where(.pf-theme-dark) .pf-v5-c-wizard__header .pf-v5-c-button, :where(.pf-theme-dark) .pf-v5-c-log-viewer.pf-m-dark .pf-v5-c-log-viewer__main .pf-v5-c-button {
11094
- --pf-v5-c-button--m-primary--BackgroundColor: var(--pf-v5-global--primary-color--300);
11095
- }
11096
-
11097
- :where(.pf-theme-dark) .pf-v5-c-data-list {
11098
- --pf-v5-c-data-list--BorderTopColor: var(--pf-v5-global--BorderColor--100);
11099
- --pf-v5-c-data-list--sm--BorderTopColor: var(--pf-v5-global--BorderColor--100);
11100
- --pf-v5-c-data-list__item--BorderBottomColor: var(--pf-v5-global--BorderColor--100);
11101
- --pf-v5-c-data-list__item--sm--BorderBottomColor: var(--pf-v5-global--BorderColor--100);
11102
- }
11103
-
11104
11055
  .pf-v5-c-description-list {
11105
11056
  --pf-v5-c-description-list--RowGap: var(--pf-v5-global--gutter--md);
11106
11057
  --pf-v5-c-description-list--ColumnGap: var(--pf-v5-global--spacer--lg);
@@ -24935,66 +24886,70 @@ label.pf-v5-c-radio, .pf-v5-c-radio__label,
24935
24886
  inset-inline-start: var(--pf-v5-c-skip-to-content--focus--Left);
24936
24887
  }
24937
24888
 
24889
+ :root,
24938
24890
  .pf-v5-c-slider {
24939
24891
  --pf-v5-c-slider--value: 0;
24940
24892
  --pf-v5-c-slider__step--Left: 0;
24941
- --pf-v5-c-slider__rail--PaddingTop: var(--pf-v5-global--spacer--md);
24942
- --pf-v5-c-slider__rail--PaddingBottom: var(--pf-v5-global--spacer--md);
24893
+ --pf-v5-c-slider__rail--PaddingTop: var(--pf-t--global--spacer--md);
24894
+ --pf-v5-c-slider__rail--PaddingBottom: var(--pf-t--global--spacer--md);
24943
24895
  --pf-v5-c-slider__rail-track--Height: 0.25rem;
24944
- --pf-v5-c-slider__rail-track--before--base--BackgroundColor: var(--pf-v5-global--BorderColor--100);
24945
- --pf-v5-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-v5-global--active-color--300);
24946
- --pf-v5-c-slider__rail-track--before--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
24896
+ --pf-v5-c-slider__rail-track--before--base--BackgroundColor: var(--pf-t--global--border--color--default);
24897
+ --pf-v5-c-slider__rail-track--before--fill--BackgroundColor: var(--pf-t--global--border--color--hover);
24898
+ --pf-v5-c-slider__rail-track--before--BorderRadius: var(--pf-t--global--border--radius--tiny);
24947
24899
  --pf-v5-c-slider__rail-track--before--fill--BackgroundColor--gradient-stop: var(--pf-v5-c-slider--value);
24948
- --pf-v5-c-slider__rail-track--before--fill--direction: right;
24949
- --pf-v5-c-slider__steps--FontSize: var(--pf-v5-global--FontSize--sm);
24900
+ --pf-v5-c-slider__steps--FontSize: var(--pf-t--global--font--size--sm);
24950
24901
  --pf-v5-c-slider__steps--Height: var(--pf-v5-c-slider__steps--FontSize);
24951
- --pf-v5-c-slider__step-tick--Top: var(--pf-v5-global--spacer--md);
24902
+ --pf-v5-c-slider__step-tick--Top: var(--pf-t--global--spacer--md);
24952
24903
  --pf-v5-c-slider__step-tick--Width: 0.25rem;
24953
24904
  --pf-v5-c-slider__step-tick--Height: 0.25rem;
24954
- --pf-v5-c-slider__step-tick--BackgroundColor: var(--pf-v5-global--BorderColor--200);
24905
+ --pf-v5-c-slider__step-tick--BackgroundColor: var(--pf-t--global--icon--color--subtle);
24955
24906
  --pf-v5-c-slider__step-tick--TranslateX: -50%;
24956
- --pf-v5-c-slider__step-tick--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
24957
- --pf-v5-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-v5-global--primary-color--100);
24907
+ --pf-v5-c-slider__step-tick--BorderRadius: var(--pf-t--global--border--radius--large);
24908
+ --pf-v5-c-slider__step--m-active__slider-tick--BackgroundColor: var(--pf-t--global--icon--color--brand--clicked);
24958
24909
  --pf-v5-c-slider__step--first-child__step-tick--TranslateX: 0;
24959
24910
  --pf-v5-c-slider__step--last-child__step-tick--TranslateX: -100%;
24960
24911
  --pf-v5-c-slider__step-label--TranslateX: -50%;
24961
- --pf-v5-c-slider__step-label--Top: calc(var(--pf-v5-global--spacer--xl) + var(--pf-v5-c-slider__rail-track--Height));
24912
+ --pf-v5-c-slider__step-label--Top: calc(var(--pf-t--global--spacer--xl) + var(--pf-v5-c-slider__rail-track--Height));
24962
24913
  --pf-v5-c-slider__step--first-child__step-label--TranslateX: 0;
24963
24914
  --pf-v5-c-slider__step--last-child__step-label--TranslateX: -100%;
24964
- --pf-v5-c-slider__thumb--Top: calc(var(--pf-v5-c-slider__rail-track--Height) / 2 + var(--pf-v5-global--spacer--md));
24915
+ --pf-v5-c-slider__thumb--Top: calc(var(--pf-v5-c-slider__rail-track--Height) / 2 + var(--pf-t--global--spacer--md));
24965
24916
  --pf-v5-c-slider__thumb--Width: 1rem;
24966
24917
  --pf-v5-c-slider__thumb--Height: 1rem;
24967
24918
  --pf-v5-c-slider__thumb--Left: var(--pf-v5-c-slider--value);
24968
- --pf-v5-c-slider__thumb--BackgroundColor: var(--pf-v5-global--primary-color--100);
24919
+ --pf-v5-c-slider__thumb--BackgroundColor: var(--pf-t--global--color--brand--default);
24969
24920
  --pf-v5-c-slider__thumb--TranslateX: -50%;
24970
24921
  --pf-v5-c-slider__thumb--TranslateY: -50%;
24971
- --pf-v5-c-slider__thumb--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
24922
+ --pf-v5-c-slider__thumb--BorderRadius: var(--pf-t--global--border--radius--large);
24972
24923
  --pf-v5-c-slider__thumb--BoxShadow--base:
24973
- 0 0 0 2px var(--pf-v5-global--BackgroundColor--100),
24974
- 0 0 0 3px var(--pf-v5-global--primary-color--100);
24924
+ 0 0 0 2px var(--pf-t--global--background--color--primary--default),
24925
+ 0 0 0 3px var(--pf-t--global--color--brand--default);
24975
24926
  --pf-v5-c-slider__thumb--hover--BoxShadow: var(--pf-v5-c-slider__thumb--BoxShadow--base);
24976
24927
  --pf-v5-c-slider__thumb--focus--BoxShadow: var(--pf-v5-c-slider__thumb--BoxShadow--base);
24977
24928
  --pf-v5-c-slider__thumb--active--BoxShadow:
24978
24929
  var(--pf-v5-c-slider__thumb--BoxShadow--base),
24979
- 0 0 2px 5px var(--pf-v5-global--active-color--200);
24980
- --pf-v5-c-slider__thumb--before--Width: var(--pf-v5-global--target-size--MinWidth);
24981
- --pf-v5-c-slider__thumb--before--Height: var(--pf-v5-global--target-size--MinHeight);
24982
- --pf-v5-c-slider__thumb--before--BorderRadius: var(--pf-v5-global--BorderRadius--lg);
24930
+ 0 0 2px 5px var(--pf-t--global--color--nonstatus--blue--clicked);
24931
+ --pf-v5-c-slider__thumb--before--Width: 44px;
24932
+ --pf-v5-c-slider__thumb--before--Height: var(--pf-v5-c-slider__thumb--before--Width);
24933
+ --pf-v5-c-slider__thumb--before--BorderRadius: var(--pf-t--global--border--radius--large);
24983
24934
  --pf-v5-c-slider__thumb--before--TranslateX: -50%;
24984
24935
  --pf-v5-c-slider__thumb--before--TranslateY: -50%;
24985
- --pf-v5-c-slider__value--MarginLeft: var(--pf-v5-global--spacer--md);
24986
- --pf-v5-c-slider__value--c-form-control--width-base: 3.5ch;
24936
+ --pf-v5-c-slider__value--MarginLeft: var(--pf-t--global--spacer--md);
24937
+ --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);
24987
24938
  --pf-v5-c-slider__value--c-form-control--width-chars: 3;
24988
- --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));
24939
+ --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);
24989
24940
  --pf-v5-c-slider__value--m-floating--TranslateX: -50%;
24990
24941
  --pf-v5-c-slider__value--m-floating--TranslateY: -100%;
24991
24942
  --pf-v5-c-slider__value--m-floating--Left: var(--pf-v5-c-slider--value);
24992
- --pf-v5-c-slider__value--m-floating--ZIndex: var(--pf-v5-global--ZIndex--sm);
24993
- --pf-v5-c-slider__actions--MarginRight: var(--pf-v5-global--spacer--sm);
24994
- --pf-v5-c-slider__main--actions--MarginLeft: var(--pf-v5-global--spacer--sm);
24995
- --pf-v5-c-slider--m-disabled__rail-track--before--fill--BackgroundColor: var(--pf-v5-global--palette--black-500);
24996
- --pf-v5-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor: var(--pf-v5-global--palette--black-700);
24997
- --pf-v5-c-slider--m-disabled__thumb--BackgroundColor: var(--pf-v5-global--palette--black-700);
24943
+ --pf-v5-c-slider__value--m-floating--ZIndex: var(--pf-t--global--Zindex--sm);
24944
+ --pf-v5-c-slider__actions--MarginRight: var(--pf-t--global--spacer--sm);
24945
+ --pf-v5-c-slider__main--actions--MarginLeft: var(--pf-t--global--spacer--sm);
24946
+ --pf-v5-c-slider--m-disabled__rail-track--before--fill--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
24947
+ --pf-v5-c-slider--m-disabled__step--m-active__slider-tick--BackgroundColor: var(--pf-t--global--icon--color--disabled);
24948
+ --pf-v5-c-slider--m-disabled__thumb--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
24949
+ }
24950
+
24951
+ .pf-v5-c-slider {
24952
+ --pf-v5-c-slider__rail-track--before--fill--direction: right;
24998
24953
  display: flex;
24999
24954
  }
25000
24955
  :where(.pf-v5-m-dir-rtl, [dir=rtl]) .pf-v5-c-slider {