@patternfly/react-styles 6.0.0-alpha.11 → 6.0.0-alpha.12

Sign up to get free protection for your applications and to get access to all the features.
Files changed (61) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/css/components/Alert/alert.css +2 -0
  3. package/css/components/Breadcrumb/breadcrumb.css +9 -1
  4. package/css/components/Button/button.css +44 -24
  5. package/css/components/CalendarMonth/calendar-month.css +61 -92
  6. package/css/components/CalendarMonth/calendar-month.d.ts +2 -4
  7. package/css/components/CalendarMonth/calendar-month.js +2 -4
  8. package/css/components/CalendarMonth/calendar-month.mjs +2 -4
  9. package/css/components/CodeBlock/code-block.css +4 -0
  10. package/css/components/CodeEditor/code-editor.css +94 -72
  11. package/css/components/CodeEditor/code-editor.d.ts +4 -4
  12. package/css/components/CodeEditor/code-editor.js +4 -4
  13. package/css/components/CodeEditor/code-editor.mjs +4 -4
  14. package/css/components/DatePicker/date-picker.css +13 -14
  15. package/css/components/DatePicker/date-picker.d.ts +1 -2
  16. package/css/components/DatePicker/date-picker.js +1 -2
  17. package/css/components/DatePicker/date-picker.mjs +1 -2
  18. package/css/components/Divider/divider.css +8 -6
  19. package/css/components/DualListSelector/dual-list-selector.css +56 -48
  20. package/css/components/DualListSelector/dual-list-selector.d.ts +1 -2
  21. package/css/components/DualListSelector/dual-list-selector.js +1 -2
  22. package/css/components/DualListSelector/dual-list-selector.mjs +1 -2
  23. package/css/components/FormControl/form-control.css +3 -3
  24. package/css/components/Icon/icon.css +27 -27
  25. package/css/components/Label/label-group.css +1 -1
  26. package/css/components/Label/label.css +13 -7
  27. package/css/components/Menu/menu.css +388 -419
  28. package/css/components/Menu/menu.d.ts +5 -8
  29. package/css/components/Menu/menu.js +5 -8
  30. package/css/components/Menu/menu.mjs +5 -8
  31. package/css/components/MenuToggle/menu-toggle.css +229 -265
  32. package/css/components/MenuToggle/menu-toggle.d.ts +7 -8
  33. package/css/components/MenuToggle/menu-toggle.js +7 -8
  34. package/css/components/MenuToggle/menu-toggle.mjs +7 -8
  35. package/css/components/Pagination/pagination.css +2 -12
  36. package/css/components/ProgressStepper/progress-stepper.css +72 -69
  37. package/css/components/ProgressStepper/progress-stepper.d.ts +1 -0
  38. package/css/components/ProgressStepper/progress-stepper.js +1 -0
  39. package/css/components/ProgressStepper/progress-stepper.mjs +1 -0
  40. package/css/components/Table/table-grid.css +29 -45
  41. package/css/components/Table/table-scrollable.css +6 -6
  42. package/css/components/Table/table-tree-view.css +76 -74
  43. package/css/components/Table/table.css +54 -74
  44. package/css/components/TextInputGroup/text-input-group.css +0 -14
  45. package/css/components/TextInputGroup/text-input-group.d.ts +1 -3
  46. package/css/components/TextInputGroup/text-input-group.js +1 -3
  47. package/css/components/TextInputGroup/text-input-group.mjs +1 -3
  48. package/css/components/Tile/tile.css +1 -1
  49. package/css/components/TreeView/tree-view.css +76 -97
  50. package/css/components/TreeView/tree-view.d.ts +0 -4
  51. package/css/components/TreeView/tree-view.js +0 -4
  52. package/css/components/TreeView/tree-view.mjs +0 -4
  53. package/css/components/Wizard/wizard.css +128 -205
  54. package/css/components/Wizard/wizard.d.ts +0 -3
  55. package/css/components/Wizard/wizard.js +0 -3
  56. package/css/components/Wizard/wizard.mjs +0 -3
  57. package/css/docs/components/Menu/examples/Menu.css +7 -11
  58. package/css/docs/components/Menu/examples/Menu.d.ts +2 -1
  59. package/css/docs/components/Menu/examples/Menu.js +2 -1
  60. package/css/docs/components/Menu/examples/Menu.mjs +2 -1
  61. package/package.json +3 -3
@@ -1,5 +1,6 @@
1
1
  import './menu-toggle.css';
2
2
  declare const _default: {
3
+ "button": "pf-v5-c-button",
3
4
  "check": "pf-v5-c-check",
4
5
  "checkInput": "pf-v5-c-check__input",
5
6
  "menuToggle": "pf-v5-c-menu-toggle",
@@ -12,18 +13,16 @@ declare const _default: {
12
13
  "modifiers": {
13
14
  "primary": "pf-m-primary",
14
15
  "secondary": "pf-m-secondary",
15
- "expanded": "pf-m-expanded",
16
- "plain": "pf-m-plain",
17
- "text": "pf-m-text",
18
16
  "fullHeight": "pf-m-full-height",
17
+ "fullWidth": "pf-m-full-width",
18
+ "plain": "pf-m-plain",
19
+ "expanded": "pf-m-expanded",
20
+ "active": "pf-m-active",
19
21
  "disabled": "pf-m-disabled",
20
- "typeahead": "pf-m-typeahead",
21
22
  "splitButton": "pf-m-split-button",
22
23
  "action": "pf-m-action",
23
- "active": "pf-m-active",
24
- "fullWidth": "pf-m-full-width"
24
+ "typeahead": "pf-m-typeahead"
25
25
  },
26
- "textInputGroup": "pf-v5-c-text-input-group",
27
- "themeDark": "pf-v5-theme-dark"
26
+ "textInputGroup": "pf-v5-c-text-input-group"
28
27
  };
29
28
  export default _default;
@@ -2,6 +2,7 @@
2
2
  exports.__esModule = true;
3
3
  require('./menu-toggle.css');
4
4
  exports.default = {
5
+ "button": "pf-v5-c-button",
5
6
  "check": "pf-v5-c-check",
6
7
  "checkInput": "pf-v5-c-check__input",
7
8
  "menuToggle": "pf-v5-c-menu-toggle",
@@ -14,17 +15,15 @@ exports.default = {
14
15
  "modifiers": {
15
16
  "primary": "pf-m-primary",
16
17
  "secondary": "pf-m-secondary",
17
- "expanded": "pf-m-expanded",
18
- "plain": "pf-m-plain",
19
- "text": "pf-m-text",
20
18
  "fullHeight": "pf-m-full-height",
19
+ "fullWidth": "pf-m-full-width",
20
+ "plain": "pf-m-plain",
21
+ "expanded": "pf-m-expanded",
22
+ "active": "pf-m-active",
21
23
  "disabled": "pf-m-disabled",
22
- "typeahead": "pf-m-typeahead",
23
24
  "splitButton": "pf-m-split-button",
24
25
  "action": "pf-m-action",
25
- "active": "pf-m-active",
26
- "fullWidth": "pf-m-full-width"
26
+ "typeahead": "pf-m-typeahead"
27
27
  },
28
- "textInputGroup": "pf-v5-c-text-input-group",
29
- "themeDark": "pf-v5-theme-dark"
28
+ "textInputGroup": "pf-v5-c-text-input-group"
30
29
  };
@@ -1,5 +1,6 @@
1
1
  import './menu-toggle.css';
2
2
  export default {
3
+ "button": "pf-v5-c-button",
3
4
  "check": "pf-v5-c-check",
4
5
  "checkInput": "pf-v5-c-check__input",
5
6
  "menuToggle": "pf-v5-c-menu-toggle",
@@ -12,17 +13,15 @@ export default {
12
13
  "modifiers": {
13
14
  "primary": "pf-m-primary",
14
15
  "secondary": "pf-m-secondary",
15
- "expanded": "pf-m-expanded",
16
- "plain": "pf-m-plain",
17
- "text": "pf-m-text",
18
16
  "fullHeight": "pf-m-full-height",
17
+ "fullWidth": "pf-m-full-width",
18
+ "plain": "pf-m-plain",
19
+ "expanded": "pf-m-expanded",
20
+ "active": "pf-m-active",
19
21
  "disabled": "pf-m-disabled",
20
- "typeahead": "pf-m-typeahead",
21
22
  "splitButton": "pf-m-split-button",
22
23
  "action": "pf-m-action",
23
- "active": "pf-m-active",
24
- "fullWidth": "pf-m-full-width"
24
+ "typeahead": "pf-m-typeahead"
25
25
  },
26
- "textInputGroup": "pf-v5-c-text-input-group",
27
- "themeDark": "pf-v5-theme-dark"
26
+ "textInputGroup": "pf-v5-c-text-input-group"
28
27
  };
@@ -10,15 +10,14 @@
10
10
  :where(.pf-v5-c-pagination) {
11
11
  --pf-v5-c-pagination--inset: 0;
12
12
  --pf-v5-c-pagination--ColumnGap: var(--pf-t--global--spacer--lg);
13
- --pf-v5-c-pagination--m-page-insets--inset: var(--pf-t--global--spacer--md);
14
- --pf-v5-c-pagination--m-page-insets--xl--inset: var(--pf-t--global--spacer--lg);
13
+ --pf-v5-c-pagination--m-page-insets--inset: var(--pf-t--global--spacer--lg);
15
14
  --pf-v5-c-pagination__nav--Display: none;
16
15
  --pf-v5-c-pagination--m-display-summary__nav--Display: none;
17
16
  --pf-v5-c-pagination--m-display-full__nav--Display: inline-flex;
18
17
  --pf-v5-c-pagination__nav--ColumnGap: var(--pf-t--global--spacer--sm);
19
18
  --pf-v5-c-pagination__nav-page-select--FontSize: var(--pf-t--global--font--size--body--md);
20
19
  --pf-v5-c-pagination__nav-page-select--ColumnGap: var(--pf-t--global--spacer--sm);
21
- --pf-v5-c-pagination__nav-page-select--c-form-control--width-base: calc(var(--pf-t--global--spacer--sm) * 2 + var(--pf-t--global--border--width--100) * 2);
20
+ --pf-v5-c-pagination__nav-page-select--c-form-control--width-base: calc((var(--pf-v5-c-form-control--PaddingRight) + var(--pf-v5-c-form-control--PaddingLeft)) + (var(--pf-v5-c-form-control--before--BorderWidth) * 2));
22
21
  --pf-v5-c-pagination__nav-page-select--c-form-control--width-chars: 2;
23
22
  --pf-v5-c-pagination__nav-page-select--c-form-control--Width: calc(var(--pf-v5-c-pagination__nav-page-select--c-form-control--width-base) + (var(--pf-v5-c-pagination__nav-page-select--c-form-control--width-chars) * 1ch));
24
23
  --pf-v5-c-pagination__total-items--Display: block;
@@ -37,10 +36,6 @@
37
36
  --pf-v5-c-pagination--m-bottom--Bottom: 0;
38
37
  --pf-v5-c-pagination--m-bottom--PaddingRight: var(--pf-t--global--spacer--lg);
39
38
  --pf-v5-c-pagination--m-bottom--PaddingLeft: var(--pf-t--global--spacer--lg);
40
- --pf-v5-c-pagination--m-bottom--md--PaddingTop: var(--pf-t--global--spacer--md);
41
- --pf-v5-c-pagination--m-bottom--md--PaddingBottom: var(--pf-t--global--spacer--md);
42
- --pf-v5-c-pagination--m-bottom--xl--PaddingRight: var(--pf-t--global--spacer--lg);
43
- --pf-v5-c-pagination--m-bottom--xl--PaddingLeft: var(--pf-t--global--spacer--lg);
44
39
  --pf-v5-c-pagination--m-bottom--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
45
40
  --pf-v5-c-pagination__page-menu--Display: none;
46
41
  --pf-v5-c-pagination--m-display-summary__page-menu--Display: none;
@@ -58,10 +53,7 @@
58
53
  @media screen and (min-width: 1200px) {
59
54
  :where(:root),
60
55
  :where(.pf-v5-c-pagination) {
61
- --pf-v5-c-pagination--m-bottom--PaddingRight: var(--pf-v5-c-pagination--m-bottom--xl--PaddingRight);
62
- --pf-v5-c-pagination--m-bottom--PaddingLeft: var(--pf-v5-c-pagination--m-bottom--xl--PaddingLeft);
63
56
  --pf-v5-c-pagination__scroll-button--Width: var(--pf-v5-c-pagination__scroll-button--xl--Width);
64
- --pf-v5-c-pagination--m-page-insets--inset: var(--pf-v5-c-pagination--m-page-insets--xl--inset);
65
57
  }
66
58
  }
67
59
 
@@ -115,8 +107,6 @@
115
107
  --pf-v5-c-pagination--m-bottom--Bottom: auto;
116
108
  position: relative;
117
109
  justify-content: flex-end;
118
- padding-block-start: var(--pf-v5-c-pagination--m-bottom--md--PaddingTop);
119
- padding-block-end: var(--pf-v5-c-pagination--m-bottom--md--PaddingBottom);
120
110
  }
121
111
  .pf-v5-c-pagination.pf-m-bottom .pf-v5-c-pagination__nav-control.pf-m-first,
122
112
  .pf-v5-c-pagination.pf-m-bottom .pf-v5-c-pagination__nav-control.pf-m-last,
@@ -1,21 +1,22 @@
1
- .pf-v5-c-progress-stepper {
1
+ :where(:root),
2
+ :where(.pf-v5-c-progress-stepper) {
2
3
  --pf-v5-c-progress-stepper--m-vertical--GridAutoFlow: row;
3
4
  --pf-v5-c-progress-stepper--m-vertical--GridTemplateColumns: auto 1fr;
4
5
  --pf-v5-c-progress-stepper--m-vertical__step-connector--before--Top: 0;
5
6
  --pf-v5-c-progress-stepper--m-vertical__step-connector--before--Left: calc(var(--pf-v5-c-progress-stepper__step-icon--Width) / 2);
6
7
  --pf-v5-c-progress-stepper--m-vertical__step-connector--before--Width: auto;
7
8
  --pf-v5-c-progress-stepper--m-vertical__step-connector--before--Height: 100%;
8
- --pf-v5-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth: var(--pf-v5-global--BorderWidth--md);
9
- --pf-v5-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor: var(--pf-v5-global--BorderColor--100);
9
+ --pf-v5-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth: var(--pf-t--global--border--width--box--default);
10
+ --pf-v5-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor: var(--pf-t--global--border--color--default);
10
11
  --pf-v5-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth: 0;
11
12
  --pf-v5-c-progress-stepper--m-vertical__step-connector--before--BorderBottomColor: transparent;
12
13
  --pf-v5-c-progress-stepper--m-vertical__step-connector--before--Transform: translateX(-50%);
13
- --pf-v5-c-progress-stepper--m-vertical__step-main--MarginTop: var(--pf-v5-global--spacer--xs);
14
+ --pf-v5-c-progress-stepper--m-vertical__step-main--MarginTop: 0px;
14
15
  --pf-v5-c-progress-stepper--m-vertical__step-main--MarginRight: 0;
15
- --pf-v5-c-progress-stepper--m-vertical__step-main--MarginBottom: var(--pf-v5-global--spacer--xl);
16
- --pf-v5-c-progress-stepper--m-vertical__step-main--MarginLeft: var(--pf-v5-global--spacer--xs);
16
+ --pf-v5-c-progress-stepper--m-vertical__step-main--MarginBottom: var(--pf-t--global--spacer--xl);
17
+ --pf-v5-c-progress-stepper--m-vertical__step-main--MarginLeft: var(--pf-t--global--spacer--sm);
17
18
  --pf-v5-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns: 1fr;
18
- --pf-v5-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom: var(--pf-v5-global--spacer--sm);
19
+ --pf-v5-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom: var(--pf-t--global--spacer--sm);
19
20
  --pf-v5-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow: auto;
20
21
  --pf-v5-c-progress-stepper--m-vertical--m-compact__step-main--MarginTop: 0;
21
22
  --pf-v5-c-progress-stepper--m-vertical--m-compact__step-main--MarginRight: 0;
@@ -30,11 +31,11 @@
30
31
  --pf-v5-c-progress-stepper--m-horizontal__step-connector--before--Height: auto;
31
32
  --pf-v5-c-progress-stepper--m-horizontal__step-connector--before--BorderRightWidth: 0;
32
33
  --pf-v5-c-progress-stepper--m-horizontal__step-connector--before--BorderRightColor: unset;
33
- --pf-v5-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomWidth: var(--pf-v5-global--BorderWidth--md);
34
- --pf-v5-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomColor: var(--pf-v5-global--BorderColor--100);
34
+ --pf-v5-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomWidth: var(--pf-t--global--border--width--divider--default);
35
+ --pf-v5-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomColor: var(--pf-t--global--border--color--default);
35
36
  --pf-v5-c-progress-stepper--m-horizontal__step-connector--before--Transform: translateY(-50%);
36
- --pf-v5-c-progress-stepper--m-horizontal__step-main--MarginTop: var(--pf-v5-global--spacer--sm);
37
- --pf-v5-c-progress-stepper--m-horizontal__step-main--MarginRight: var(--pf-v5-global--spacer--sm);
37
+ --pf-v5-c-progress-stepper--m-horizontal__step-main--MarginTop: var(--pf-t--global--spacer--sm);
38
+ --pf-v5-c-progress-stepper--m-horizontal__step-main--MarginRight: var(--pf-t--global--spacer--sm);
38
39
  --pf-v5-c-progress-stepper--m-horizontal__step-main--MarginBottom: 0;
39
40
  --pf-v5-c-progress-stepper--m-horizontal__step-main--MarginLeft: 0;
40
41
  --pf-v5-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns: repeat(auto-fill, 1.75rem);
@@ -42,57 +43,58 @@
42
43
  --pf-v5-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow: 2;
43
44
  --pf-v5-c-progress-stepper--m-compact--GridAutoFlow: row;
44
45
  --pf-v5-c-progress-stepper--m-compact__step-main--MarginTop: 0;
45
- --pf-v5-c-progress-stepper--m-compact__step-main--MarginBottom: var(--pf-v5-global--spacer--sm);
46
+ --pf-v5-c-progress-stepper--m-compact__step-main--MarginBottom: var(--pf-t--global--spacer--sm);
46
47
  --pf-v5-c-progress-stepper--m-compact__step-connector--MinWidth: 1.75rem;
47
48
  --pf-v5-c-progress-stepper--m-compact__step-icon--Width: 1.125rem;
48
- --pf-v5-c-progress-stepper--m-compact__step-icon--FontSize: var(--pf-v5-global--icon--FontSize--sm);
49
- --pf-v5-c-progress-stepper--m-compact__step-title--FontSize: var(--pf-v5-global--FontSize--sm);
50
- --pf-v5-c-progress-stepper--m-compact__step-title--FontWeight: var(--pf-v5-global--FontWeight--normal);
49
+ --pf-v5-c-progress-stepper--m-compact__step-icon--FontSize: var(--pf-t--global--icon--size--font--body--sm);
50
+ --pf-v5-c-progress-stepper--m-compact__step-title--FontSize: var(--pf-t--global--font--size--body--lg);
51
+ --pf-v5-c-progress-stepper--m-compact__step-title--FontWeight: var(--pf-t--global--font--weight--body--bold);
51
52
  --pf-v5-c-progress-stepper--m-compact__pficon--MarginTop: 2px;
52
53
  --pf-v5-c-progress-stepper--m-compact__fa-exclamation-triangle--MarginTop: -3px;
53
54
  --pf-v5-c-progress-stepper--m-center__step-connector--before--Left: 50%;
54
55
  --pf-v5-c-progress-stepper--m-center--GridTemplateColumns: 1fr;
55
56
  --pf-v5-c-progress-stepper--m-center__step-connector--JustifyContent: center;
56
- --pf-v5-c-progress-stepper--m-center__step-main--MarginRight: var(--pf-v5-global--spacer--xs);
57
- --pf-v5-c-progress-stepper--m-center__step-main--MarginLeft: var(--pf-v5-global--spacer--xs);
57
+ --pf-v5-c-progress-stepper--m-center__step-main--MarginRight: var(--pf-t--global--spacer--xs);
58
+ --pf-v5-c-progress-stepper--m-center__step-main--MarginLeft: var(--pf-t--global--spacer--xs);
58
59
  --pf-v5-c-progress-stepper--m-center__step-main--TextAlign: center;
59
60
  --pf-v5-c-progress-stepper--m-center__step-description--MarginRight: 0;
60
61
  --pf-v5-c-progress-stepper--m-center__step-description--MarginLeft: 0;
61
62
  --pf-v5-c-progress-stepper--GridTemplateRows: auto 1fr;
62
63
  --pf-v5-c-progress-stepper__step-connector--JustifyContent: flex-start;
63
- --pf-v5-c-progress-stepper__step-icon--ZIndex: var(--pf-v5-global--ZIndex--xs);
64
- --pf-v5-c-progress-stepper__step-icon--Width: 1.75rem;
64
+ --pf-v5-c-progress-stepper__step-icon--ZIndex: var(--pf-t--global--Zindex--xs);
65
+ --pf-v5-c-progress-stepper__step-icon--Width: 1.5rem;
65
66
  --pf-v5-c-progress-stepper__step-icon--Height: var(--pf-v5-c-progress-stepper__step-icon--Width);
66
- --pf-v5-c-progress-stepper__step-icon--FontSize: var(--pf-v5-global--icon--FontSize--md);
67
- --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-global--Color--100);
68
- --pf-v5-c-progress-stepper__step-icon--BackgroundColor: var(--pf-v5-global--BackgroundColor--light-200);
69
- --pf-v5-c-progress-stepper__step-icon--BorderWidth: var(--pf-v5-global--BorderWidth--md);
70
- --pf-v5-c-progress-stepper__step-icon--BorderColor: var(--pf-v5-global--BorderColor--100);
67
+ --pf-v5-c-progress-stepper__step-icon--FontSize: var(--pf-t--global--icon--size--font--body--default);
68
+ --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-t--global--icon--color--regular);
69
+ --pf-v5-c-progress-stepper__step-icon--BackgroundColor: var(--pf-t--global--background--color--primary--default);
70
+ --pf-v5-c-progress-stepper__step-icon--BorderWidth: var(--pf-t--global--border--width--box--default);
71
+ --pf-v5-c-progress-stepper__step-icon--BorderColor: var(--pf-t--global--border--color--default);
72
+ --pf-v5-c-progress-stepper__step--m-current__step-icon--Color: var(--pf-t--global--icon--color--brand--default);
73
+ --pf-v5-c-progress-stepper__step--m-info__step-icon--Color: var(--pf-t--global--icon--color--status--info--default);
74
+ --pf-v5-c-progress-stepper__step--m-success__step-icon--Color: var(--pf-t--global--icon--color--status--success--default);
75
+ --pf-v5-c-progress-stepper__step--m-warning__step-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
76
+ --pf-v5-c-progress-stepper__step--m-danger__step-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
77
+ --pf-v5-c-progress-stepper__step--m-custom__step-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
71
78
  --pf-v5-c-progress-stepper__pficon--MarginTop: 3px;
72
- --pf-v5-c-progress-stepper__fa-exclamation-triangle--MarginTop: -5px;
73
- --pf-v5-c-progress-stepper__step-title--Color: var(--pf-v5-global--Color--100);
79
+ --pf-v5-c-progress-stepper__fa-exclamation-triangle--MarginTop: -2px;
80
+ --pf-v5-c-progress-stepper__step-title--Color: var(--pf-t--global--text--color--regular);
74
81
  --pf-v5-c-progress-stepper__step-title--TextAlign: start;
75
- --pf-v5-c-progress-stepper__step-title--FontSize: var(--pf-v5-global--FontSize--md);
76
- --pf-v5-c-progress-stepper__step-title--FontWeight: var(--pf-v5-global--FontWeight--normal);
77
- --pf-v5-c-progress-stepper__step--m-current__step-title--FontWeight: var(--pf-v5-global--FontWeight--bold);
78
- --pf-v5-c-progress-stepper__step--m-current__step-title--Color: var(--pf-v5-global--Color--100);
79
- --pf-v5-c-progress-stepper__step--m-pending__step-title--Color: var(--pf-v5-global--Color--200);
80
- --pf-v5-c-progress-stepper__step--m-danger__step-title--Color: var(--pf-v5-global--danger-color--100);
81
- --pf-v5-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-v5-global--BorderColor--200);
82
- --pf-v5-c-progress-stepper__step-title--m-help-text--TextDecorationThickness: var(--pf-v5-global--BorderWidth--sm);
82
+ --pf-v5-c-progress-stepper__step-title--FontSize: var(--pf-t--global--font--size--body--lg);
83
+ --pf-v5-c-progress-stepper__step-title--FontWeight: var(--pf-t--global--font--weight--body);
84
+ --pf-v5-c-progress-stepper__step--m-current__step-title--FontWeight: var(--pf-t--global--font--weight--body--bold);
85
+ --pf-v5-c-progress-stepper__step--m-current__step-title--Color: var(--pf-t--global--text--color--regular);
86
+ --pf-v5-c-progress-stepper__step--m-pending__step-title--Color: var(--pf-t--global--text--color--subtle);
87
+ --pf-v5-c-progress-stepper__step--m-danger__step-title--Color: var(--pf-t--global--text--color--status--danger--default);
88
+ --pf-v5-c-progress-stepper__step-title--m-help-text--PaddingInlineStart: 0;
89
+ --pf-v5-c-progress-stepper__step-title--m-help-text--PaddingInlineEnd: 0;
90
+ --pf-v5-c-progress-stepper__step-title--m-help-text--TextDecorationColor: currentcolor;
91
+ --pf-v5-c-progress-stepper__step-title--m-help-text--TextDecorationThickness: var(--pf-t--global--link--text-decoration);
83
92
  --pf-v5-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset: 0.25rem;
84
- --pf-v5-c-progress-stepper__step-title--m-help-text--hover--TextDecorationColor: var(--pf-v5-global--Color--100);
85
- --pf-v5-c-progress-stepper__step-title--m-help-text--focus--TextDecorationColor: var(--pf-v5-global--Color--100);
86
- --pf-v5-c-progress-stepper__step-title--m-help-text--hover--Color: var(--pf-v5-global--Color--100);
87
- --pf-v5-c-progress-stepper__step-title--m-help-text--focus--Color: var(--pf-v5-global--Color--100);
88
- --pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--Color: var(--pf-v5-global--danger-color--200);
89
- --pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--Color: var(--pf-v5-global--danger-color--200);
90
- --pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--TextDecorationColor: var(--pf-v5-global--danger-color--100);
91
- --pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--TextDecorationColor: var(--pf-v5-global--danger-color--200);
92
- --pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--TextDecorationColor: var(--pf-v5-global--danger-color--200);
93
- --pf-v5-c-progress-stepper__step-description--MarginTop: var(--pf-v5-global--spacer--xs);
94
- --pf-v5-c-progress-stepper__step-description--FontSize: var(--pf-v5-global--FontSize--sm);
95
- --pf-v5-c-progress-stepper__step-description--Color: var(--pf-v5-global--Color--200);
93
+ --pf-v5-c-progress-stepper__step-title--m-help-text--hover--Color: var(--pf-t--global--text--color--brand--hover);
94
+ --pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--Color: var(--pf-t--global--text--color--status--danger--hover);
95
+ --pf-v5-c-progress-stepper__step-description--MarginTop: var(--pf-t--global--spacer--xs);
96
+ --pf-v5-c-progress-stepper__step-description--FontSize: var(--pf-t--global--font--size--body--sm);
97
+ --pf-v5-c-progress-stepper__step-description--Color: var(--pf-t--global--text--color--subtle);
96
98
  --pf-v5-c-progress-stepper__step-description--TextAlign: start;
97
99
  --pf-v5-c-progress-stepper--GridAutoFlow: var(--pf-v5-c-progress-stepper--m-vertical--GridAutoFlow);
98
100
  --pf-v5-c-progress-stepper--GridTemplateColumns: var(--pf-v5-c-progress-stepper--m-vertical--GridTemplateColumns);
@@ -114,15 +116,10 @@
114
116
  --pf-v5-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-v5-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom);
115
117
  --pf-v5-c-progress-stepper--m-center__step-connector--before--Content: none;
116
118
  --pf-v5-c-progress-stepper--m-center__step-main--before--Content: "";
117
- position: relative;
118
- display: grid;
119
- grid-template-rows: var(--pf-v5-c-progress-stepper--GridTemplateRows);
120
- grid-template-columns: var(--pf-v5-c-progress-stepper--GridTemplateColumns);
121
- grid-auto-columns: 1fr;
122
- grid-auto-flow: var(--pf-v5-c-progress-stepper--GridAutoFlow);
123
119
  }
124
120
  @media screen and (min-width: 768px) {
125
- .pf-v5-c-progress-stepper {
121
+ :where(:root),
122
+ :where(.pf-v5-c-progress-stepper) {
126
123
  --pf-v5-c-progress-stepper--GridAutoFlow: var(--pf-v5-c-progress-stepper--m-horizontal--GridAutoFlow);
127
124
  --pf-v5-c-progress-stepper--GridTemplateColumns: var(--pf-v5-c-progress-stepper--m-horizontal--GridTemplateColumns);
128
125
  --pf-v5-c-progress-stepper__step-connector--before--Top: var(--pf-v5-c-progress-stepper--m-horizontal__step-connector--before--Top);
@@ -145,6 +142,15 @@
145
142
  --pf-v5-c-progress-stepper--m-center__step-main--before--Content: none;
146
143
  }
147
144
  }
145
+
146
+ .pf-v5-c-progress-stepper {
147
+ position: relative;
148
+ display: grid;
149
+ grid-template-rows: var(--pf-v5-c-progress-stepper--GridTemplateRows);
150
+ grid-template-columns: var(--pf-v5-c-progress-stepper--GridTemplateColumns);
151
+ grid-auto-columns: 1fr;
152
+ grid-auto-flow: var(--pf-v5-c-progress-stepper--GridAutoFlow);
153
+ }
148
154
  .pf-v5-c-progress-stepper.pf-m-center {
149
155
  --pf-v5-c-progress-stepper__step-connector--JustifyContent: var(--pf-v5-c-progress-stepper--m-center__step-connector--JustifyContent);
150
156
  --pf-v5-c-progress-stepper__step-main--MarginRight: var(--pf-v5-c-progress-stepper--m-center__step-main--MarginRight);
@@ -204,8 +210,8 @@
204
210
  border: 0;
205
211
  }
206
212
  .pf-v5-c-progress-stepper.pf-m-compact .pf-v5-c-progress-stepper__step.pf-m-current .pf-v5-c-progress-stepper__step-main {
207
- grid-column: 1/-1;
208
213
  grid-row: 1/2;
214
+ grid-column: 1/-1;
209
215
  }
210
216
  .pf-v5-c-progress-stepper.pf-m-compact .pf-v5-c-progress-stepper__step-description {
211
217
  display: none;
@@ -217,27 +223,27 @@
217
223
  .pf-v5-c-progress-stepper__step.pf-m-current {
218
224
  --pf-v5-c-progress-stepper__step-title--FontWeight: var(--pf-v5-c-progress-stepper__step--m-current__step-title--FontWeight);
219
225
  --pf-v5-c-progress-stepper__step-title--Color: var(--pf-v5-c-progress-stepper__step--m-current__step-title--Color);
226
+ --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-c-progress-stepper__step--m-current__step-icon--Color);
220
227
  }
221
228
  .pf-v5-c-progress-stepper__step.pf-m-pending {
222
229
  --pf-v5-c-progress-stepper__step-title--Color: var(--pf-v5-c-progress-stepper__step--m-pending__step-title--Color);
223
230
  }
224
231
  .pf-v5-c-progress-stepper__step.pf-m-success {
225
- --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-global--success-color--100);
232
+ --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-c-progress-stepper__step--m-success__step-icon--Color);
226
233
  }
227
234
  .pf-v5-c-progress-stepper__step.pf-m-danger {
228
- --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-global--danger-color--100);
235
+ --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-c-progress-stepper__step--m-danger__step-icon--Color);
229
236
  --pf-v5-c-progress-stepper__step-title--Color: var(--pf-v5-c-progress-stepper__step--m-danger__step-title--Color);
230
237
  --pf-v5-c-progress-stepper__step-title--m-help-text--hover--Color: var(--pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--Color);
231
- --pf-v5-c-progress-stepper__step-title--m-help-text--focus--Color: var(--pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--Color);
232
- --pf-v5-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--TextDecorationColor);
233
- --pf-v5-c-progress-stepper__step-title--m-help-text--hover--TextDecorationColor: var(--pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--hover--TextDecorationColor);
234
- --pf-v5-c-progress-stepper__step-title--m-help-text--focus--TextDecorationColor: var(--pf-v5-c-progress-stepper__step--m-danger__step-title--m-help-text--focus--TextDecorationColor);
235
238
  }
236
239
  .pf-v5-c-progress-stepper__step.pf-m-warning {
237
- --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-global--warning-color--100);
240
+ --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-c-progress-stepper__step--m-warning__step-icon--Color);
238
241
  }
239
242
  .pf-v5-c-progress-stepper__step.pf-m-info {
240
- --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-global--info-color--100);
243
+ --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-c-progress-stepper__step--m-info__step-icon--Color);
244
+ }
245
+ .pf-v5-c-progress-stepper__step.pf-m-custom {
246
+ --pf-v5-c-progress-stepper__step-icon--Color: var(--pf-v5-c-progress-stepper__step--m-custom__step-icon--Color);
241
247
  }
242
248
  .pf-v5-c-progress-stepper__step:last-child {
243
249
  --pf-v5-c-progress-stepper__step-main--MarginBottom: 0;
@@ -266,7 +272,7 @@
266
272
  display: flex;
267
273
  align-items: center;
268
274
  justify-content: center;
269
- width: var(--pf-v5-c-progress-stepper__step-icon--Width);
275
+ min-width: var(--pf-v5-c-progress-stepper__step-icon--Width);
270
276
  height: var(--pf-v5-c-progress-stepper__step-icon--Height);
271
277
  font-size: var(--pf-v5-c-progress-stepper__step-icon--FontSize);
272
278
  color: var(--pf-v5-c-progress-stepper__step-icon--Color);
@@ -308,6 +314,8 @@
308
314
  border: 0;
309
315
  }
310
316
  .pf-v5-c-progress-stepper__step-title.pf-m-help-text {
317
+ padding-inline-start: var(--pf-v5-c-progress-stepper__step-title--m-help-text--PaddingInlineStart);
318
+ padding-inline-end: var(--pf-v5-c-progress-stepper__step-title--m-help-text--PaddingInlineEnd);
311
319
  text-decoration: underline;
312
320
  text-decoration-thickness: var(--pf-v5-c-progress-stepper__step-title--m-help-text--TextDecorationThickness);
313
321
  text-decoration-style: dashed;
@@ -315,13 +323,8 @@
315
323
  text-underline-offset: var(--pf-v5-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset);
316
324
  cursor: pointer;
317
325
  }
318
- .pf-v5-c-progress-stepper__step-title.pf-m-help-text:hover {
326
+ .pf-v5-c-progress-stepper__step-title.pf-m-help-text:hover, .pf-v5-c-progress-stepper__step-title.pf-m-help-text:focus {
319
327
  --pf-v5-c-progress-stepper__step-title--Color: var(--pf-v5-c-progress-stepper__step-title--m-help-text--hover--Color);
320
- --pf-v5-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-v5-c-progress-stepper__step-title--m-help-text--hover--TextDecorationColor);
321
- }
322
- .pf-v5-c-progress-stepper__step-title.pf-m-help-text:focus {
323
- --pf-v5-c-progress-stepper__step-title--Color: var(--pf-v5-c-progress-stepper__step-title--m-help-text--focus--Color);
324
- --pf-v5-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-v5-c-progress-stepper__step-title--m-help-text--focus--TextDecorationColor);
325
328
  }
326
329
 
327
330
  .pf-v5-c-progress-stepper__step-description {
@@ -10,6 +10,7 @@ declare const _default: {
10
10
  "danger": "pf-m-danger",
11
11
  "warning": "pf-m-warning",
12
12
  "info": "pf-m-info",
13
+ "custom": "pf-m-custom",
13
14
  "helpText": "pf-m-help-text",
14
15
  "horizontal": "pf-m-horizontal",
15
16
  "vertical": "pf-m-vertical",
@@ -12,6 +12,7 @@ exports.default = {
12
12
  "danger": "pf-m-danger",
13
13
  "warning": "pf-m-warning",
14
14
  "info": "pf-m-info",
15
+ "custom": "pf-m-custom",
15
16
  "helpText": "pf-m-help-text",
16
17
  "horizontal": "pf-m-horizontal",
17
18
  "vertical": "pf-m-vertical",
@@ -10,6 +10,7 @@ export default {
10
10
  "danger": "pf-m-danger",
11
11
  "warning": "pf-m-warning",
12
12
  "info": "pf-m-info",
13
+ "custom": "pf-m-custom",
13
14
  "helpText": "pf-m-help-text",
14
15
  "horizontal": "pf-m-horizontal",
15
16
  "vertical": "pf-m-vertical",
@@ -1,27 +1,25 @@
1
1
  .pf-v5-c-table[class*=pf-m-grid] {
2
2
  --pf-v5-c-table--responsive--BorderColor: var(--pf-t--global--border--color--default);
3
3
  --pf-v5-c-table__tbody--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
4
- --pf-v5-c-table__tbody--after--border-width--base: var(--pf-v5-global--BorderWidth--lg);
4
+ --pf-v5-c-table__tbody--after--border-width--base: var(--pf-t--global--border--width--extra-strong);
5
5
  --pf-v5-c-table__tbody--after--BorderLeftWidth: 0;
6
6
  --pf-v5-c-table__tbody--after--BorderColor: var(--pf-t--global--border--color--active);
7
7
  --pf-v5-c-table__tr--responsive--border-width--base: var(--pf-t--global--border--width--divider--default);
8
- --pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth: var(--pf-v5-global--BorderWidth--sm);
9
- --pf-v5-c-table__tr--responsive--GridColumnGap: var(--pf-v5-global--spacer--md);
10
- --pf-v5-c-table__tr--responsive--MarginTop: var(--pf-t--global--border--width--divider--default);
11
- --pf-v5-c-table__tr--responsive--PaddingTop: var(--pf-v5-global--spacer--md);
12
- --pf-v5-c-table__tr--responsive--PaddingRight: var(--pf-v5-global--spacer--lg);
13
- --pf-v5-c-table__tr--responsive--xl--PaddingRight: var(--pf-v5-global--spacer--md);
14
- --pf-v5-c-table__tr--responsive--PaddingBottom: var(--pf-v5-global--spacer--md);
15
- --pf-v5-c-table__tr--responsive--PaddingLeft: var(--pf-v5-global--spacer--lg);
16
- --pf-v5-c-table__tr--responsive--xl--PaddingLeft: var(--pf-v5-global--spacer--md);
17
- --pf-v5-c-table__tr--responsive--nested-table--PaddingTop: var(--pf-v5-global--spacer--xl);
18
- --pf-v5-c-table__tr--responsive--nested-table--PaddingRight: var(--pf-v5-global--spacer--lg);
19
- --pf-v5-c-table__tr--responsive--nested-table--PaddingBottom: var(--pf-v5-global--spacer--xl);
20
- --pf-v5-c-table__tr--responsive--nested-table--PaddingLeft: var(--pf-v5-global--spacer--lg);
8
+ --pf-v5-c-table__tr--responsive--last-child--BorderBottomWidth: var(--pf-v5-c-table__tbody--responsive--border-width--base);
9
+ --pf-v5-c-table__tr--responsive--GridColumnGap: var(--pf-t--global--spacer--md);
10
+ --pf-v5-c-table__tr--responsive--MarginTop: var(--pf-v5-c-table__tbody--responsive--border-width--base);
11
+ --pf-v5-c-table__tr--responsive--PaddingTop: var(--pf-t--global--spacer--md);
12
+ --pf-v5-c-table__tr--responsive--PaddingRight: var(--pf-t--global--spacer--lg);
13
+ --pf-v5-c-table__tr--responsive--PaddingBottom: var(--pf-t--global--spacer--md);
14
+ --pf-v5-c-table__tr--responsive--PaddingLeft: var(--pf-t--global--spacer--lg);
15
+ --pf-v5-c-table__tr--responsive--nested-table--PaddingTop: var(--pf-t--global--spacer--xl);
16
+ --pf-v5-c-table__tr--responsive--nested-table--PaddingRight: var(--pf-t--global--spacer--lg);
17
+ --pf-v5-c-table__tr--responsive--nested-table--PaddingBottom: var(--pf-t--global--spacer--xl);
18
+ --pf-v5-c-table__tr--responsive--nested-table--PaddingLeft: var(--pf-t--global--spacer--lg);
21
19
  --pf-v5-c-table__tbody--after__tr--BorderLeftWidth: 0;
22
20
  --pf-v5-c-table__tbody--after__tr--BorderLeftColor: transparent;
23
21
  --pf-v5-c-table__tbody--m-expanded--after__tr--BorderLeftWidth: var(--pf-v5-c-table__expandable-row--after--border-width--base);
24
- --pf-v5-c-table__tbody--m-expanded--after__tr--BorderLeftColor: var(--pf-v5-global--active-color--400);
22
+ --pf-v5-c-table__tbody--m-expanded--after__tr--BorderLeftColor: var(--pf-t--global--border--color--active);
25
23
  --pf-v5-c-table__tbody--m-selected--after__tr--BorderLeftWidth: var(--pf-v5-c-table__expandable-row--after--border-width--base);
26
24
  --pf-v5-c-table__tbody--m-selected--after__tr--BorderLeftColor: var(--pf-t--global--border--color--active);
27
25
  --pf-v5-c-table--m-grid--cell--hidden-visible--Display: grid;
@@ -29,48 +27,34 @@
29
27
  --pf-v5-c-table--m-grid--cell--PaddingRight: 0;
30
28
  --pf-v5-c-table--m-grid--cell--PaddingBottom: 0;
31
29
  --pf-v5-c-table--m-grid--cell--PaddingLeft: 0;
32
- --pf-v5-c-table-td--responsive--GridColumnGap: var(--pf-v5-global--spacer--md);
33
- --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-v5-global--spacer--md);
34
- --pf-v5-c-table--cell--responsive--PaddingBottom: var(--pf-v5-global--spacer--sm);
35
- --pf-v5-c-table--cell--first-child--responsive--PaddingTop: var(--pf-v5-global--spacer--sm);
30
+ --pf-v5-c-table-td--responsive--GridColumnGap: var(--pf-t--global--spacer--md);
31
+ --pf-v5-c-table--cell--responsive--PaddingTop: var(--pf-t--global--spacer--md);
32
+ --pf-v5-c-table--cell--responsive--PaddingBottom: var(--pf-t--global--spacer--sm);
33
+ --pf-v5-c-table--cell--first-child--responsive--PaddingTop: var(--pf-t--global--spacer--sm);
36
34
  --pf-v5-c-table--cell--responsive--PaddingRight: 0;
37
35
  --pf-v5-c-table--cell--responsive--PaddingLeft: 0;
38
- --pf-v5-c-table--m-compact__tr--responsive--PaddingTop: var(--pf-v5-global--spacer--sm);
39
- --pf-v5-c-table--m-compact__tr--responsive--PaddingBottom: var(--pf-v5-global--spacer--sm);
40
- --pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop: var(--pf-v5-global--spacer--xs);
41
- --pf-v5-c-table--m-compact__tr__td--responsive--PaddingBottom: var(--pf-v5-global--spacer--xs);
36
+ --pf-v5-c-table--m-compact__tr--responsive--PaddingTop: var(--pf-t--global--spacer--sm);
37
+ --pf-v5-c-table--m-compact__tr--responsive--PaddingBottom: var(--pf-t--global--spacer--sm);
38
+ --pf-v5-c-table--m-compact__tr__td--responsive--PaddingTop: var(--pf-t--global--spacer--xs);
39
+ --pf-v5-c-table--m-compact__tr__td--responsive--PaddingBottom: var(--pf-t--global--spacer--xs);
42
40
  --pf-v5-c-table--m-compact__check--responsive--MarginTop: 0.4375rem;
43
- --pf-v5-c-table--m-compact__action--responsive--MarginTop: calc(var(--pf-v5-global--spacer--xs) * -1);
44
- --pf-v5-c-table--m-compact__action--responsive--MarginBottom: calc(var(--pf-v5-global--spacer--xs) * -1);
41
+ --pf-v5-c-table--m-compact__action--responsive--MarginTop: calc(var(--pf-t--global--spacer--xs) * -1);
42
+ --pf-v5-c-table--m-compact__action--responsive--MarginBottom: calc(var(--pf-t--global--spacer--xs) * -1);
45
43
  --pf-v5-c-table--m-compact__toggle--c-button--responsive--MarginBottom: calc(0.375rem * -1);
46
- --pf-v5-c-table__expandable-row-content--responsive--PaddingRight: var(--pf-v5-global--spacer--lg);
47
- --pf-v5-c-table__expandable-row-content--responsive--PaddingLeft: var(--pf-v5-global--spacer--lg);
48
- --pf-v5-c-table__expandable-row-content--responsive--xl--PaddingRight: var(--pf-v5-global--spacer--md);
49
- --pf-v5-c-table__expandable-row-content--responsive--xl--PaddingLeft: var(--pf-v5-global--spacer--md);
44
+ --pf-v5-c-table__expandable-row-content--responsive--PaddingRight: var(--pf-t--global--spacer--lg);
45
+ --pf-v5-c-table__expandable-row-content--responsive--PaddingLeft: var(--pf-t--global--spacer--lg);
50
46
  --pf-v5-c-table__expandable-row-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
51
- --pf-v5-c-table__check--responsive--MarginLeft: var(--pf-t--global--border--width--divider--default);
47
+ --pf-v5-c-table__check--responsive--MarginLeft: var(--pf-v5-c-table__tbody--responsive--border-width--base);
52
48
  --pf-v5-c-table__check--responsive--MarginTop: 0.875rem;
53
49
  --pf-v5-c-table--m-grid__favorite--MarginTop: 0.5rem;
54
- --pf-v5-c-table--m-grid__check--favorite--MarginLeft: var(--pf-v5-global--spacer--xl);
50
+ --pf-v5-c-table--m-grid__check--favorite--MarginLeft: var(--pf-t--global--spacer--xl);
55
51
  --pf-v5-c-table--m-grid__action--MarginTop: 0.375rem;
56
- --pf-v5-c-table__action--responsive--MarginLeft: var(--pf-v5-global--spacer--xl);
57
- --pf-v5-c-table--m-grid__favorite--action--MarginLeft: var(--pf-v5-global--spacer--2xl);
52
+ --pf-v5-c-table__action--responsive--MarginLeft: var(--pf-t--global--spacer--xl);
53
+ --pf-v5-c-table--m-grid__favorite--action--MarginLeft: var(--pf-t--global--spacer--2xl);
58
54
  --pf-v5-c-table--m-grid__check--favorite--action--MarginLeft: calc(var(--pf-v5-c-table--m-grid__check--favorite--MarginLeft) + var(--pf-v5-c-table--m-grid__favorite--action--MarginLeft));
59
55
  --pf-v5-c-table__toggle__icon--Transition: .2s ease-in 0s;
60
56
  --pf-v5-c-table__toggle--m-expanded__icon--Rotate: 180deg;
61
57
  }
62
- @media screen and (max-width: 1200px) {
63
- .pf-v5-c-table[class*=pf-m-grid] {
64
- --pf-v5-c-table__tr--responsive--PaddingRight: var(--pf-v5-c-table__tr--responsive--xl--PaddingRight);
65
- --pf-v5-c-table__tr--responsive--PaddingLeft: var(--pf-v5-c-table__tr--responsive--xl--PaddingLeft);
66
- }
67
- }
68
- @media screen and (max-width: 1200px) {
69
- .pf-v5-c-table[class*=pf-m-grid] {
70
- --pf-v5-c-table__expandable-row-content--responsive--PaddingRight: var(--pf-v5-c-table__expandable-row-content--responsive--xl--PaddingRight);
71
- --pf-v5-c-table__expandable-row-content--responsive--PaddingLeft: var(--pf-v5-c-table__expandable-row-content--responsive--xl--PaddingLeft);
72
- }
73
- }
74
58
 
75
59
  .pf-m-grid.pf-v5-c-table {
76
60
  --pf-v5-c-table--cell--PaddingTop: var(--pf-v5-c-table--m-grid--cell--PaddingTop);
@@ -1,14 +1,14 @@
1
1
  .pf-v5-c-table {
2
2
  --pf-v5-c-table__sticky-cell--MinWidth--base: 12.5rem;
3
3
  --pf-v5-c-table__sticky-cell--MinWidth: var(--pf-v5-c-table__sticky-cell--MinWidth--base);
4
- --pf-v5-c-table__sticky-cell--ZIndex: var(--pf-v5-global--ZIndex--xs);
4
+ --pf-v5-c-table__sticky-cell--ZIndex: var(--pf-t--global--Zindex--xs);
5
5
  --pf-v5-c-table__sticky-cell--Right: auto;
6
6
  --pf-v5-c-table__sticky-cell--Left: auto;
7
- --pf-v5-c-table__sticky-cell--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
8
- --pf-v5-c-table__sticky-cell--m-border-right--before--BorderRightWidth: var(--pf-v5-global--BorderWidth--sm);
9
- --pf-v5-c-table__sticky-cell--m-border-right--before--BorderRightColor: var(--pf-v5-global--BorderColor--100);
10
- --pf-v5-c-table__sticky-cell--m-border-left--before--BorderLeftWidth: var(--pf-v5-global--BorderWidth--sm);
11
- --pf-v5-c-table__sticky-cell--m-border-left--before--BorderLeftColor: var(--pf-v5-global--BorderColor--100);
7
+ --pf-v5-c-table__sticky-cell--BackgroundColor: var(--pf-t--global--background--color--primary--default);
8
+ --pf-v5-c-table__sticky-cell--m-border-right--before--BorderRightWidth: var(--pf-t--global--border--width--divider--default);
9
+ --pf-v5-c-table__sticky-cell--m-border-right--before--BorderRightColor: var(--pf-t--global--border--color--default);
10
+ --pf-v5-c-table__sticky-cell--m-border-left--before--BorderLeftWidth: var(--pf-t--global--border--width--divider--default);
11
+ --pf-v5-c-table__sticky-cell--m-border-left--before--BorderLeftColor: var(--pf-t--global--border--color--default);
12
12
  --pf-v5-c-table__sticky-cell--m-right--Right: 0;
13
13
  --pf-v5-c-table__sticky-cell--m-left--Left: 0;
14
14
  --pf-v5-c-table--m-sticky-header__sticky-cell--ZIndex: calc(var(--pf-v5-c-table__sticky-cell--ZIndex) + 1);