@patternfly/react-styles 4.72.15 → 4.73.0

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 (17) hide show
  1. package/CHANGELOG.md +27 -0
  2. package/css/components/AboutModalBox/about-modal-box.css +3 -0
  3. package/css/components/Banner/banner.css +3 -0
  4. package/css/components/Card/card.css +2 -1
  5. package/css/components/LogViewer/log-viewer.css +3 -0
  6. package/css/components/Login/login.css +4 -0
  7. package/css/components/Masthead/masthead.css +4 -4
  8. package/css/components/Masthead/masthead.d.ts +0 -1
  9. package/css/components/Masthead/masthead.js +0 -1
  10. package/css/components/Masthead/masthead.mjs +0 -1
  11. package/css/components/Page/page.css +5 -0
  12. package/css/components/ProgressStepper/progress-stepper.css +416 -69
  13. package/css/components/ProgressStepper/progress-stepper.d.ts +13 -2
  14. package/css/components/ProgressStepper/progress-stepper.js +13 -2
  15. package/css/components/ProgressStepper/progress-stepper.mjs +13 -2
  16. package/css/components/Wizard/wizard.css +5 -1
  17. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -3,6 +3,33 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # 4.73.0 (2022-06-22)
7
+
8
+
9
+ ### Features
10
+
11
+ * **Table:** add nested sticky header support ([#7595](https://github.com/patternfly/patternfly-react/issues/7595)) ([3888a0b](https://github.com/patternfly/patternfly-react/commit/3888a0bdf5e4e964d2d8d936c5d81f7813d8ec0c))
12
+
13
+
14
+
15
+
16
+
17
+ ## 4.72.17 (2022-06-22)
18
+
19
+ **Note:** Version bump only for package @patternfly/react-styles
20
+
21
+
22
+
23
+
24
+
25
+ ## 4.72.16 (2022-06-22)
26
+
27
+ **Note:** Version bump only for package @patternfly/react-styles
28
+
29
+
30
+
31
+
32
+
6
33
  ## 4.72.15 (2022-06-21)
7
34
 
8
35
  **Note:** Version bump only for package @patternfly/react-styles
package/css/components/AboutModalBox/about-modal-box.css CHANGED
@@ -271,6 +271,9 @@
271
271
  --pf-global--link--Color--hover: #73bcf7;
272
272
  --pf-global--BackgroundColor--100: #1b1d21;
273
273
  }
274
+ :where(.pf-theme-dark) .pf-c-about-modal-box .pf-c-card {
275
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
276
+ }
274
277
  :where(.pf-theme-dark) .pf-c-about-modal-box .pf-c-button {
275
278
  --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
276
279
  --pf-c-button--m-primary--hover--Color: var(--pf-global--Color--light-100);
package/css/components/Banner/banner.css CHANGED
@@ -135,6 +135,9 @@
135
135
  --pf-global--link--Color--hover: #73bcf7;
136
136
  --pf-global--BackgroundColor--100: #1b1d21;
137
137
  }
138
+ :where(.pf-theme-dark) .pf-c-banner .pf-c-card {
139
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
140
+ }
138
141
  :where(.pf-theme-dark) .pf-c-banner .pf-c-button {
139
142
  --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
140
143
  --pf-c-button--m-primary--hover--Color: var(--pf-global--Color--light-100);
package/css/components/Card/card.css CHANGED
@@ -326,7 +326,8 @@
326
326
  font-weight: var(--pf-global--FontWeight--normal);
327
327
  }
328
328
 
329
- :where(.pf-theme-dark) .pf-c-card {
329
+ :where(.pf-theme-dark) .pf-c-card,
330
+ :where(.pf-theme-dark) .pf-c-card.pf-m-non-selectable-raised {
330
331
  --pf-c-card--BoxShadow: var(--pf-global--BoxShadow--md);
331
332
  --pf-c-card--m-hoverable-raised--hover--BoxShadow: var(--pf-global--BoxShadow--lg);
332
333
  --pf-c-card--m-selectable-raised--hover--BoxShadow: var(--pf-global--BoxShadow--lg);
package/css/components/LogViewer/log-viewer.css CHANGED
@@ -209,6 +209,9 @@
209
209
  --pf-global--link--Color--hover: #73bcf7;
210
210
  --pf-global--BackgroundColor--100: #1b1d21;
211
211
  }
212
+ :where(.pf-theme-dark) .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main .pf-c-card {
213
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
214
+ }
212
215
  :where(.pf-theme-dark) .pf-c-log-viewer.pf-m-dark .pf-c-log-viewer__main .pf-c-button {
213
216
  --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
214
217
  --pf-c-button--m-primary--hover--Color: var(--pf-global--Color--light-100);
package/css/components/Login/login.css CHANGED
@@ -306,6 +306,10 @@
306
306
  --pf-global--link--Color--hover: #73bcf7;
307
307
  --pf-global--BackgroundColor--100: #1b1d21;
308
308
  }
309
+ :where(.pf-theme-dark) .pf-c-login__header .pf-c-card,
310
+ :where(.pf-theme-dark) .pf-c-login__footer .pf-c-card {
311
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
312
+ }
309
313
  :where(.pf-theme-dark) .pf-c-login__header .pf-c-button,
310
314
  :where(.pf-theme-dark) .pf-c-login__footer .pf-c-button {
311
315
  --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
package/css/components/Masthead/masthead.css CHANGED
@@ -167,13 +167,10 @@
167
167
  }
168
168
  }
169
169
  @media screen and (min-width: 1200px) {
170
- .pf-c-page:where(:not(.pf-m-resize-observer)) .pf-c-masthead {
170
+ .pf-c-masthead {
171
171
  --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
172
172
  }
173
173
  }
174
- .pf-c-page:where(.pf-m-breakpoint-xl) .pf-c-masthead {
175
- --pf-c-masthead--inset: var(--pf-c-masthead--xl--inset);
176
- }
177
174
  .pf-c-masthead.pf-m-light {
178
175
  color: var(--pf-global--Color--100);
179
176
  --pf-c-masthead--BackgroundColor: var(--pf-c-masthead--m-light--BackgroundColor);
@@ -668,6 +665,9 @@
668
665
  --pf-global--link--Color--hover: #73bcf7;
669
666
  --pf-global--BackgroundColor--100: #1b1d21;
670
667
  }
668
+ :where(.pf-theme-dark) .pf-c-masthead .pf-c-card {
669
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
670
+ }
671
671
  :where(.pf-theme-dark) .pf-c-masthead .pf-c-button {
672
672
  --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
673
673
  --pf-c-button--m-primary--hover--Color: var(--pf-global--Color--light-100);
package/css/components/Masthead/masthead.d.ts CHANGED
@@ -14,7 +14,6 @@ declare const _default: {
14
14
  "light_200": "pf-m-light-200",
15
15
  "light": "pf-m-light",
16
16
  "resizeObserver": "pf-m-resize-observer",
17
- "breakpointXl": "pf-m-breakpoint-xl",
18
17
  "fullHeight": "pf-m-full-height",
19
18
  "horizontal": "pf-m-horizontal",
20
19
  "displayStack": "pf-m-display-stack",
package/css/components/Masthead/masthead.js CHANGED
@@ -16,7 +16,6 @@ exports.default = {
16
16
  "light_200": "pf-m-light-200",
17
17
  "light": "pf-m-light",
18
18
  "resizeObserver": "pf-m-resize-observer",
19
- "breakpointXl": "pf-m-breakpoint-xl",
20
19
  "fullHeight": "pf-m-full-height",
21
20
  "horizontal": "pf-m-horizontal",
22
21
  "displayStack": "pf-m-display-stack",
package/css/components/Masthead/masthead.mjs CHANGED
@@ -14,7 +14,6 @@ export default {
14
14
  "light_200": "pf-m-light-200",
15
15
  "light": "pf-m-light",
16
16
  "resizeObserver": "pf-m-resize-observer",
17
- "breakpointXl": "pf-m-breakpoint-xl",
18
17
  "fullHeight": "pf-m-full-height",
19
18
  "horizontal": "pf-m-horizontal",
20
19
  "displayStack": "pf-m-display-stack",
package/css/components/Page/page.css CHANGED
@@ -920,6 +920,11 @@
920
920
  --pf-global--link--Color--hover: #73bcf7;
921
921
  --pf-global--BackgroundColor--100: #1b1d21;
922
922
  }
923
+ :where(.pf-theme-dark) .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector .pf-c-card,
924
+ :where(.pf-theme-dark) .pf-c-page__main-section[class*=pf-m-dark-] .pf-c-card,
925
+ :where(.pf-theme-dark) .pf-c-page__header .pf-c-card {
926
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
927
+ }
923
928
  :where(.pf-theme-dark) .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector .pf-c-button,
924
929
  :where(.pf-theme-dark) .pf-c-page__main-section[class*=pf-m-dark-] .pf-c-button,
925
930
  :where(.pf-theme-dark) .pf-c-page__header .pf-c-button {
package/css/components/ProgressStepper/progress-stepper.css CHANGED
@@ -1,37 +1,6 @@
1
1
  .pf-c-progress-stepper {
2
- --pf-c-progress-stepper--GridAutoFlow: column;
3
- --pf-c-progress-stepper--GridTemplateRows: auto 1fr;
4
- --pf-c-progress-stepper--GridTemplateColumns: initial;
5
2
  --pf-c-progress-stepper--m-vertical--GridAutoFlow: row;
6
3
  --pf-c-progress-stepper--m-vertical--GridTemplateColumns: auto 1fr;
7
- --pf-c-progress-stepper--m-compact--GridAutoFlow: row;
8
- --pf-c-progress-stepper--m-compact--GridTemplateColumns: repeat(auto-fill, 1.75rem);
9
- --pf-c-progress-stepper__step-connector--JustifyContent: start;
10
- --pf-c-progress-stepper--m-center__step-connector--JustifyContent: center;
11
- --pf-c-progress-stepper__step-icon--ZIndex: var(--pf-global--ZIndex--xs);
12
- --pf-c-progress-stepper__step-icon--Width: 1.75rem;
13
- --pf-c-progress-stepper__step-icon--Height: var(--pf-c-progress-stepper__step-icon--Width);
14
- --pf-c-progress-stepper__step-icon--FontSize: var(--pf-global--icon--FontSize--md);
15
- --pf-c-progress-stepper__step-icon--Color: var(--pf-global--Color--100);
16
- --pf-c-progress-stepper__step-icon--BackgroundColor: var(--pf-global--BackgroundColor--light-200);
17
- --pf-c-progress-stepper__step-icon--BorderWidth: var(--pf-global--BorderWidth--md);
18
- --pf-c-progress-stepper__step-icon--BorderColor: var(--pf-global--BorderColor--100);
19
- --pf-c-progress-stepper--m-compact__step-icon--Width: 1.125rem;
20
- --pf-c-progress-stepper--m-compact__step-icon--FontSize: var(--pf-global--icon--FontSize--sm);
21
- --pf-c-progress-stepper__pficon--MarginTop: 3px;
22
- --pf-c-progress-stepper__fa-exclamation-triangle--MarginTop: -5px;
23
- --pf-c-progress-stepper--m-compact__pficon--MarginTop: 2px;
24
- --pf-c-progress-stepper--m-compact__fa-exclamation-triangle--MarginTop: -3px;
25
- --pf-c-progress-stepper__step-connector--before--Top: calc(var(--pf-c-progress-stepper__step-icon--Height) / 2);
26
- --pf-c-progress-stepper__step-connector--before--Left: 0;
27
- --pf-c-progress-stepper__step-connector--before--Width: 100%;
28
- --pf-c-progress-stepper__step-connector--before--Height: auto;
29
- --pf-c-progress-stepper__step-connector--before--BorderRightColor: unset;
30
- --pf-c-progress-stepper__step-connector--before--BorderRightWidth: 0;
31
- --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
32
- --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-global--BorderColor--100);
33
- --pf-c-progress-stepper__step-connector--before--Transform: translateY(-50%);
34
- --pf-c-progress-stepper--m-center__step-connector--before--Left: 50%;
35
4
  --pf-c-progress-stepper--m-vertical__step-connector--before--Top: 0;
36
5
  --pf-c-progress-stepper--m-vertical__step-connector--before--Left: calc(var(--pf-c-progress-stepper__step-icon--Width) / 2);
37
6
  --pf-c-progress-stepper--m-vertical__step-connector--before--Width: auto;
@@ -39,19 +8,67 @@
39
8
  --pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth: var(--pf-global--BorderWidth--md);
40
9
  --pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor: var(--pf-global--BorderColor--100);
41
10
  --pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth: 0;
11
+ --pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomColor: transparent;
42
12
  --pf-c-progress-stepper--m-vertical__step-connector--before--Transform: translateX(-50%);
43
- --pf-c-progress-stepper__step-main--MarginTop: var(--pf-global--spacer--sm);
44
- --pf-c-progress-stepper__step-main--MarginRight: var(--pf-global--spacer--sm);
45
- --pf-c-progress-stepper__step-main--MarginBottom: 0;
46
- --pf-c-progress-stepper__step-main--MarginLeft: 0;
47
- --pf-c-progress-stepper--m-center__step-main--MarginRight: var(--pf-global--spacer--xs);
48
- --pf-c-progress-stepper--m-center__step-main--MarginLeft: var(--pf-global--spacer--xs);
49
13
  --pf-c-progress-stepper--m-vertical__step-main--MarginTop: var(--pf-global--spacer--xs);
50
14
  --pf-c-progress-stepper--m-vertical__step-main--MarginRight: 0;
51
15
  --pf-c-progress-stepper--m-vertical__step-main--MarginBottom: var(--pf-global--spacer--xl);
52
16
  --pf-c-progress-stepper--m-vertical__step-main--MarginLeft: var(--pf-global--spacer--xs);
17
+ --pf-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns: 1fr;
18
+ --pf-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom: var(--pf-global--spacer--sm);
19
+ --pf-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow: auto;
20
+ --pf-c-progress-stepper--m-vertical--m-compact__step-main--MarginRight: 0;
21
+ --pf-c-progress-stepper--m-vertical--m-center__step-main--MarginRight: 0;
22
+ --pf-c-progress-stepper--m-vertical--m-center__step-main--MarginLeft: 0;
23
+ --pf-c-progress-stepper--m-horizontal--GridAutoFlow: column;
24
+ --pf-c-progress-stepper--m-horizontal--GridTemplateColumns: initial;
25
+ --pf-c-progress-stepper--m-horizontal__step-connector--before--Top: calc(var(--pf-c-progress-stepper__step-icon--Height) / 2);
26
+ --pf-c-progress-stepper--m-horizontal__step-connector--before--Left: 0;
27
+ --pf-c-progress-stepper--m-horizontal__step-connector--before--Width: 100%;
28
+ --pf-c-progress-stepper--m-horizontal__step-connector--before--Height: auto;
29
+ --pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightWidth: 0;
30
+ --pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightColor: unset;
31
+ --pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomWidth: var(--pf-global--BorderWidth--md);
32
+ --pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomColor: var(--pf-global--BorderColor--100);
33
+ --pf-c-progress-stepper--m-horizontal__step-connector--before--Transform: translateY(-50%);
34
+ --pf-c-progress-stepper--m-horizontal__step-main--MarginTop: var(--pf-global--spacer--sm);
35
+ --pf-c-progress-stepper--m-horizontal__step-main--MarginRight: var(--pf-global--spacer--sm);
36
+ --pf-c-progress-stepper--m-horizontal__step-main--MarginBottom: 0;
37
+ --pf-c-progress-stepper--m-horizontal__step-main--MarginLeft: 0;
38
+ --pf-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns: repeat(auto-fill, 1.75rem);
39
+ --pf-c-progress-stepper--m-horizontal--m-compact__step-connector--PaddingBottom: 0;
40
+ --pf-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow: 2;
41
+ --pf-c-progress-stepper--m-compact--GridAutoFlow: row;
53
42
  --pf-c-progress-stepper--m-compact__step-main--MarginTop: 0;
54
43
  --pf-c-progress-stepper--m-compact__step-main--MarginBottom: var(--pf-global--spacer--sm);
44
+ --pf-c-progress-stepper--m-compact__step-connector--MinWidth: 1.75rem;
45
+ --pf-c-progress-stepper--m-compact__step-icon--Width: 1.125rem;
46
+ --pf-c-progress-stepper--m-compact__step-icon--FontSize: var(--pf-global--icon--FontSize--sm);
47
+ --pf-c-progress-stepper--m-compact__step-title--FontSize: var(--pf-global--FontSize--sm);
48
+ --pf-c-progress-stepper--m-compact__step-title--FontWeight: var(--pf-global--FontWeight--normal);
49
+ --pf-c-progress-stepper--m-compact__pficon--MarginTop: 2px;
50
+ --pf-c-progress-stepper--m-compact__fa-exclamation-triangle--MarginTop: -3px;
51
+ --pf-c-progress-stepper--m-center__step-connector--before--Left: 50%;
52
+ --pf-c-progress-stepper--m-center--GridTemplateColumns: 1fr;
53
+ --pf-c-progress-stepper--m-center__step-connector--JustifyContent: center;
54
+ --pf-c-progress-stepper--m-center__step-main--MarginRight: var(--pf-global--spacer--xs);
55
+ --pf-c-progress-stepper--m-center__step-main--MarginLeft: var(--pf-global--spacer--xs);
56
+ --pf-c-progress-stepper--m-center__step-title--TextAlign: center;
57
+ --pf-c-progress-stepper--m-center__step-description--TextAlign: center;
58
+ --pf-c-progress-stepper--m-center__step-description--MarginRight: 0;
59
+ --pf-c-progress-stepper--m-center__step-description--MarginLeft: 0;
60
+ --pf-c-progress-stepper--GridTemplateRows: auto 1fr;
61
+ --pf-c-progress-stepper__step-connector--JustifyContent: start;
62
+ --pf-c-progress-stepper__step-icon--ZIndex: var(--pf-global--ZIndex--xs);
63
+ --pf-c-progress-stepper__step-icon--Width: 1.75rem;
64
+ --pf-c-progress-stepper__step-icon--Height: var(--pf-c-progress-stepper__step-icon--Width);
65
+ --pf-c-progress-stepper__step-icon--FontSize: var(--pf-global--icon--FontSize--md);
66
+ --pf-c-progress-stepper__step-icon--Color: var(--pf-global--Color--100);
67
+ --pf-c-progress-stepper__step-icon--BackgroundColor: var(--pf-global--BackgroundColor--light-200);
68
+ --pf-c-progress-stepper__step-icon--BorderWidth: var(--pf-global--BorderWidth--md);
69
+ --pf-c-progress-stepper__step-icon--BorderColor: var(--pf-global--BorderColor--100);
70
+ --pf-c-progress-stepper__pficon--MarginTop: 3px;
71
+ --pf-c-progress-stepper__fa-exclamation-triangle--MarginTop: -5px;
55
72
  --pf-c-progress-stepper__step-title--Color: var(--pf-global--Color--100);
56
73
  --pf-c-progress-stepper__step-title--TextAlign: left;
57
74
  --pf-c-progress-stepper__step-title--FontSize: var(--pf-global--FontSize--md);
@@ -60,9 +77,6 @@
60
77
  --pf-c-progress-stepper__step--m-current__step-title--Color: var(--pf-global--Color--100);
61
78
  --pf-c-progress-stepper__step--m-pending__step-title--Color: var(--pf-global--Color--200);
62
79
  --pf-c-progress-stepper__step--m-danger__step-title--Color: var(--pf-global--danger-color--100);
63
- --pf-c-progress-stepper--m-center__step-title--TextAlign: center;
64
- --pf-c-progress-stepper--m-compact__step-title--FontSize: var(--pf-global--FontSize--sm);
65
- --pf-c-progress-stepper--m-compact__step-title--FontWeight: var(--pf-global--FontWeight--normal);
66
80
  --pf-c-progress-stepper__step-title--m-help-text--TextDecorationColor: var(--pf-global--BorderColor--200);
67
81
  --pf-c-progress-stepper__step-title--m-help-text--TextDecorationThickness: var(--pf-global--BorderWidth--sm);
68
82
  --pf-c-progress-stepper__step-title--m-help-text--TextUnderlineOffset: 0.25rem;
@@ -79,9 +93,26 @@
79
93
  --pf-c-progress-stepper__step-description--FontSize: var(--pf-global--FontSize--sm);
80
94
  --pf-c-progress-stepper__step-description--Color: var(--pf-global--Color--200);
81
95
  --pf-c-progress-stepper__step-description--TextAlign: left;
82
- --pf-c-progress-stepper--m-center__step-description--TextAlign: center;
83
- --pf-c-progress-stepper--m-center__step-description--MarginRight: 0;
84
- --pf-c-progress-stepper--m-center__step-description--MarginLeft: 0;
96
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-vertical--GridAutoFlow);
97
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--GridTemplateColumns);
98
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Top);
99
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Left);
100
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Width);
101
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Height);
102
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth);
103
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor);
104
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth);
105
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomColor);
106
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Transform);
107
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-vertical__step-main--MarginTop);
108
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical__step-main--MarginRight);
109
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-vertical__step-main--MarginBottom);
110
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical__step-main--MarginLeft);
111
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns);
112
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow);
113
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom);
114
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: none;
115
+ --pf-c-progress-stepper--m-center__step-main--before--Content: "";
85
116
  position: relative;
86
117
  display: grid;
87
118
  grid-auto-flow: var(--pf-c-progress-stepper--GridAutoFlow);
@@ -89,43 +120,76 @@
89
120
  grid-template-rows: var(--pf-c-progress-stepper--GridTemplateRows);
90
121
  grid-auto-columns: 1fr;
91
122
  }
123
+ @media screen and (min-width: 768px) {
124
+ .pf-c-progress-stepper {
125
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-horizontal--GridAutoFlow);
126
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--GridTemplateColumns);
127
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Top);
128
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Left);
129
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Width);
130
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Height);
131
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightWidth);
132
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightColor);
133
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomWidth);
134
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomColor);
135
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Transform);
136
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginTop);
137
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginRight);
138
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginBottom);
139
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginLeft);
140
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns);
141
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow);
142
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--PaddingBottom);
143
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: "";
144
+ --pf-c-progress-stepper--m-center__step-main--before--Content: none;
145
+ }
146
+ }
92
147
  .pf-c-progress-stepper.pf-m-center {
93
- --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-center__step-connector--before--Left);
94
148
  --pf-c-progress-stepper__step-connector--JustifyContent: var(--pf-c-progress-stepper--m-center__step-connector--JustifyContent);
95
149
  --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-center__step-main--MarginRight);
96
150
  --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-center__step-main--MarginLeft);
151
+ --pf-c-progress-stepper__step-title--TextAlign: var(--pf-c-progress-stepper--m-center__step-title--TextAlign);
97
152
  --pf-c-progress-stepper__step-description--MarginRight: var(--pf-c-progress-stepper--m-center__step-description--MarginRight);
98
153
  --pf-c-progress-stepper__step-description--MarginLeft: var(--pf-c-progress-stepper--m-center__step-description--MarginLeft);
99
- --pf-c-progress-stepper__step-title--TextAlign: var(--pf-c-progress-stepper--m-center__step-title--TextAlign);
100
154
  --pf-c-progress-stepper__step-description--TextAlign: var(--pf-c-progress-stepper--m-center__step-description--TextAlign);
155
+ --pf-c-progress-stepper--m-vertical__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical--m-center__step-main--MarginRight);
156
+ --pf-c-progress-stepper--m-vertical__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical--m-center__step-main--MarginLeft);
157
+ grid-template-columns: var(--pf-c-progress-stepper--m-center--GridTemplateColumns);
101
158
  }
102
- .pf-c-progress-stepper.pf-m-vertical {
103
- --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-vertical--GridAutoFlow);
104
- --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--GridTemplateColumns);
105
- --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Top);
106
- --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Left);
107
- --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Width);
108
- --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Height);
109
- --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth);
110
- --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor);
111
- --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth);
112
- --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Transform);
113
- --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-vertical__step-main--MarginTop);
114
- --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical__step-main--MarginRight);
115
- --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-vertical__step-main--MarginBottom);
116
- --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical__step-main--MarginLeft);
159
+ .pf-c-progress-stepper.pf-m-center .pf-c-progress-stepper__step-main {
160
+ position: relative;
161
+ }
162
+ .pf-c-progress-stepper.pf-m-center .pf-c-progress-stepper__step:not(:last-of-type) > .pf-c-progress-stepper__step-connector::before {
163
+ left: var(--pf-c-progress-stepper--m-center__step-connector--before--Left);
164
+ }
165
+ .pf-c-progress-stepper.pf-m-center:not(.pf-m-compact) .pf-c-progress-stepper__step:not(:last-of-type) > .pf-c-progress-stepper__step-main::before {
166
+ content: var(--pf-c-progress-stepper--m-center__step-main--before--Content);
167
+ }
168
+ .pf-c-progress-stepper.pf-m-center:not(.pf-m-compact) .pf-c-progress-stepper__step:not(:last-of-type) > .pf-c-progress-stepper__step-connector::before {
169
+ content: var(--pf-c-progress-stepper--m-center__step-connector--before--Content);
117
170
  }
118
171
  .pf-c-progress-stepper.pf-m-compact {
119
- --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-compact--GridAutoFlow);
120
- --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-compact--GridTemplateColumns);
121
- --pf-c-progress-stepper__step-icon--Width: var(--pf-c-progress-stepper--m-compact__step-icon--Width);
122
- --pf-c-progress-stepper__step-icon--FontSize: var(--pf-c-progress-stepper--m-compact__step-icon--FontSize);
123
- --pf-c-progress-stepper__pficon--MarginTop: var(--pf-c-progress-stepper--m-compact__pficon--MarginTop);
124
- --pf-c-progress-stepper__fa-exclamation-triangle--MarginTop: var(--pf-c-progress-stepper--m-compact__fa-exclamation-triangle--MarginTop);
125
172
  --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-compact__step-main--MarginTop);
126
173
  --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-compact__step-main--MarginBottom);
174
+ --pf-c-progress-stepper__step-icon--Width: var(--pf-c-progress-stepper--m-compact__step-icon--Width);
175
+ --pf-c-progress-stepper__step-icon--FontSize: var(--pf-c-progress-stepper--m-compact__step-icon--FontSize);
127
176
  --pf-c-progress-stepper__step-title--FontSize: var(--pf-c-progress-stepper--m-compact__step-title--FontSize);
128
177
  --pf-c-progress-stepper__step--m-current__step-title--FontWeight: var(--pf-c-progress-stepper--m-compact__step-title--FontWeight);
178
+ --pf-c-progress-stepper__pficon--MarginTop: var(--pf-c-progress-stepper--m-compact__pficon--MarginTop);
179
+ --pf-c-progress-stepper__fa-exclamation-triangle--MarginTop: var(--pf-c-progress-stepper--m-compact__fa-exclamation-triangle--MarginTop);
180
+ --pf-c-progress-stepper--m-vertical__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical--m-compact__step-main--MarginLeft);
181
+ --pf-c-progress-stepper--m-vertical__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical--m-compact__step-main--MarginRight);
182
+ display: inline-grid;
183
+ grid-template-columns: var(--pf-c-progress-stepper--m-compact--GridTemplateColumns);
184
+ grid-auto-flow: var(--pf-c-progress-stepper--m-compact--GridAutoFlow);
185
+ }
186
+ .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step-connector {
187
+ min-width: var(--pf-c-progress-stepper--m-compact__step-connector--MinWidth);
188
+ grid-row: var(--pf-c-progress-stepper--m-compact__step-connector--GridRow);
189
+ padding-bottom: var(--pf-c-progress-stepper--m-compact__step-connector--PaddingBottom);
190
+ }
191
+ .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step-main {
192
+ margin-bottom: var(--pf-c-progress-stepper--m-compact__step-main--MarginBottom);
129
193
  }
130
194
  .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step:not(.pf-m-current) .pf-c-progress-stepper__step-main {
131
195
  position: fixed;
@@ -136,13 +200,13 @@
136
200
  white-space: nowrap;
137
201
  border: 0;
138
202
  }
139
- .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step-description {
140
- display: none;
141
- }
142
203
  .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step.pf-m-current .pf-c-progress-stepper__step-main {
143
204
  grid-column: 1/-1;
144
205
  grid-row: 1/2;
145
206
  }
207
+ .pf-c-progress-stepper.pf-m-compact .pf-c-progress-stepper__step-description {
208
+ display: none;
209
+ }
146
210
 
147
211
  .pf-c-progress-stepper__step {
148
212
  display: contents;
@@ -217,6 +281,14 @@
217
281
  .pf-c-progress-stepper__step-main {
218
282
  margin: var(--pf-c-progress-stepper__step-main--MarginTop) var(--pf-c-progress-stepper__step-main--MarginRight) var(--pf-c-progress-stepper__step-main--MarginBottom) var(--pf-c-progress-stepper__step-main--MarginLeft);
219
283
  }
284
+ .pf-c-progress-stepper__step:not(:last-of-type) > .pf-c-progress-stepper__step-main::before {
285
+ position: absolute;
286
+ top: calc(100% + var(--pf-c-progress-stepper__step-main--MarginTop));
287
+ left: calc(50% - calc(var(--pf-c-progress-stepper__step-connector--before--BorderRightWidth) / 2));
288
+ width: auto;
289
+ height: calc(var(--pf-c-progress-stepper__step-main--MarginTop) + var(--pf-c-progress-stepper__step-main--MarginBottom));
290
+ border-right: var(--pf-c-progress-stepper__step-connector--before--BorderRightWidth) solid var(--pf-c-progress-stepper__step-connector--before--BorderRightColor);
291
+ }
220
292
 
221
293
  .pf-c-progress-stepper__step-title {
222
294
  font-size: var(--pf-c-progress-stepper__step-title--FontSize);
@@ -247,4 +319,279 @@
247
319
  font-size: var(--pf-c-progress-stepper__step-description--FontSize);
248
320
  color: var(--pf-c-progress-stepper__step-description--Color);
249
321
  text-align: var(--pf-c-progress-stepper__step-description--TextAlign);
322
+ }
323
+
324
+ .pf-c-progress-stepper.pf-m-horizontal {
325
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-horizontal--GridAutoFlow);
326
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--GridTemplateColumns);
327
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Top);
328
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Left);
329
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Width);
330
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Height);
331
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightWidth);
332
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightColor);
333
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomWidth);
334
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomColor);
335
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Transform);
336
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginTop);
337
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginRight);
338
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginBottom);
339
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginLeft);
340
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns);
341
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow);
342
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--PaddingBottom);
343
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: "";
344
+ --pf-c-progress-stepper--m-center__step-main--before--Content: none;
345
+ }
346
+ .pf-c-progress-stepper.pf-m-vertical {
347
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-vertical--GridAutoFlow);
348
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--GridTemplateColumns);
349
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Top);
350
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Left);
351
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Width);
352
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Height);
353
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth);
354
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor);
355
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth);
356
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomColor);
357
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Transform);
358
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-vertical__step-main--MarginTop);
359
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical__step-main--MarginRight);
360
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-vertical__step-main--MarginBottom);
361
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical__step-main--MarginLeft);
362
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns);
363
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow);
364
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom);
365
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: none;
366
+ --pf-c-progress-stepper--m-center__step-main--before--Content: "";
367
+ }
368
+ @media (min-width: 576px) {
369
+ .pf-c-progress-stepper.pf-m-horizontal-on-sm {
370
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-horizontal--GridAutoFlow);
371
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--GridTemplateColumns);
372
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Top);
373
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Left);
374
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Width);
375
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Height);
376
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightWidth);
377
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightColor);
378
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomWidth);
379
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomColor);
380
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Transform);
381
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginTop);
382
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginRight);
383
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginBottom);
384
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginLeft);
385
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns);
386
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow);
387
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--PaddingBottom);
388
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: "";
389
+ --pf-c-progress-stepper--m-center__step-main--before--Content: none;
390
+ }
391
+ .pf-c-progress-stepper.pf-m-vertical-on-sm {
392
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-vertical--GridAutoFlow);
393
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--GridTemplateColumns);
394
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Top);
395
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Left);
396
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Width);
397
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Height);
398
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth);
399
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor);
400
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth);
401
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomColor);
402
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Transform);
403
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-vertical__step-main--MarginTop);
404
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical__step-main--MarginRight);
405
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-vertical__step-main--MarginBottom);
406
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical__step-main--MarginLeft);
407
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns);
408
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow);
409
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom);
410
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: none;
411
+ --pf-c-progress-stepper--m-center__step-main--before--Content: "";
412
+ }
413
+ }
414
+ @media (min-width: 768px) {
415
+ .pf-c-progress-stepper.pf-m-horizontal-on-md {
416
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-horizontal--GridAutoFlow);
417
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--GridTemplateColumns);
418
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Top);
419
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Left);
420
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Width);
421
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Height);
422
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightWidth);
423
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightColor);
424
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomWidth);
425
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomColor);
426
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Transform);
427
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginTop);
428
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginRight);
429
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginBottom);
430
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginLeft);
431
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns);
432
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow);
433
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--PaddingBottom);
434
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: "";
435
+ --pf-c-progress-stepper--m-center__step-main--before--Content: none;
436
+ }
437
+ .pf-c-progress-stepper.pf-m-vertical-on-md {
438
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-vertical--GridAutoFlow);
439
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--GridTemplateColumns);
440
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Top);
441
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Left);
442
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Width);
443
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Height);
444
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth);
445
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor);
446
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth);
447
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomColor);
448
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Transform);
449
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-vertical__step-main--MarginTop);
450
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical__step-main--MarginRight);
451
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-vertical__step-main--MarginBottom);
452
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical__step-main--MarginLeft);
453
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns);
454
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow);
455
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom);
456
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: none;
457
+ --pf-c-progress-stepper--m-center__step-main--before--Content: "";
458
+ }
459
+ }
460
+ @media (min-width: 992px) {
461
+ .pf-c-progress-stepper.pf-m-horizontal-on-lg {
462
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-horizontal--GridAutoFlow);
463
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--GridTemplateColumns);
464
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Top);
465
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Left);
466
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Width);
467
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Height);
468
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightWidth);
469
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightColor);
470
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomWidth);
471
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomColor);
472
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Transform);
473
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginTop);
474
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginRight);
475
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginBottom);
476
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginLeft);
477
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns);
478
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow);
479
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--PaddingBottom);
480
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: "";
481
+ --pf-c-progress-stepper--m-center__step-main--before--Content: none;
482
+ }
483
+ .pf-c-progress-stepper.pf-m-vertical-on-lg {
484
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-vertical--GridAutoFlow);
485
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--GridTemplateColumns);
486
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Top);
487
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Left);
488
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Width);
489
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Height);
490
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth);
491
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor);
492
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth);
493
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomColor);
494
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Transform);
495
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-vertical__step-main--MarginTop);
496
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical__step-main--MarginRight);
497
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-vertical__step-main--MarginBottom);
498
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical__step-main--MarginLeft);
499
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns);
500
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow);
501
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom);
502
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: none;
503
+ --pf-c-progress-stepper--m-center__step-main--before--Content: "";
504
+ }
505
+ }
506
+ @media (min-width: 1200px) {
507
+ .pf-c-progress-stepper.pf-m-horizontal-on-xl {
508
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-horizontal--GridAutoFlow);
509
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--GridTemplateColumns);
510
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Top);
511
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Left);
512
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Width);
513
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Height);
514
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightWidth);
515
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightColor);
516
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomWidth);
517
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomColor);
518
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Transform);
519
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginTop);
520
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginRight);
521
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginBottom);
522
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginLeft);
523
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns);
524
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow);
525
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--PaddingBottom);
526
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: "";
527
+ --pf-c-progress-stepper--m-center__step-main--before--Content: none;
528
+ }
529
+ .pf-c-progress-stepper.pf-m-vertical-on-xl {
530
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-vertical--GridAutoFlow);
531
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--GridTemplateColumns);
532
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Top);
533
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Left);
534
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Width);
535
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Height);
536
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth);
537
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor);
538
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth);
539
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomColor);
540
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Transform);
541
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-vertical__step-main--MarginTop);
542
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical__step-main--MarginRight);
543
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-vertical__step-main--MarginBottom);
544
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical__step-main--MarginLeft);
545
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns);
546
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow);
547
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom);
548
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: none;
549
+ --pf-c-progress-stepper--m-center__step-main--before--Content: "";
550
+ }
551
+ }
552
+ @media (min-width: 1450px) {
553
+ .pf-c-progress-stepper.pf-m-horizontal-on-2xl {
554
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-horizontal--GridAutoFlow);
555
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--GridTemplateColumns);
556
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Top);
557
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Left);
558
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Width);
559
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Height);
560
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightWidth);
561
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderRightColor);
562
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomWidth);
563
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--BorderBottomColor);
564
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-horizontal__step-connector--before--Transform);
565
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginTop);
566
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginRight);
567
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginBottom);
568
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-horizontal__step-main--MarginLeft);
569
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-horizontal--m-compact--GridTemplateColumns);
570
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--GridRow);
571
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-horizontal--m-compact__step-connector--PaddingBottom);
572
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: "";
573
+ --pf-c-progress-stepper--m-center__step-main--before--Content: none;
574
+ }
575
+ .pf-c-progress-stepper.pf-m-vertical-on-2xl {
576
+ --pf-c-progress-stepper--GridAutoFlow: var(--pf-c-progress-stepper--m-vertical--GridAutoFlow);
577
+ --pf-c-progress-stepper--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--GridTemplateColumns);
578
+ --pf-c-progress-stepper__step-connector--before--Top: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Top);
579
+ --pf-c-progress-stepper__step-connector--before--Left: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Left);
580
+ --pf-c-progress-stepper__step-connector--before--Width: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Width);
581
+ --pf-c-progress-stepper__step-connector--before--Height: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Height);
582
+ --pf-c-progress-stepper__step-connector--before--BorderRightWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightWidth);
583
+ --pf-c-progress-stepper__step-connector--before--BorderRightColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderRightColor);
584
+ --pf-c-progress-stepper__step-connector--before--BorderBottomWidth: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomWidth);
585
+ --pf-c-progress-stepper__step-connector--before--BorderBottomColor: var(--pf-c-progress-stepper--m-vertical__step-connector--before--BorderBottomColor);
586
+ --pf-c-progress-stepper__step-connector--before--Transform: var(--pf-c-progress-stepper--m-vertical__step-connector--before--Transform);
587
+ --pf-c-progress-stepper__step-main--MarginTop: var(--pf-c-progress-stepper--m-vertical__step-main--MarginTop);
588
+ --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical__step-main--MarginRight);
589
+ --pf-c-progress-stepper__step-main--MarginBottom: var(--pf-c-progress-stepper--m-vertical__step-main--MarginBottom);
590
+ --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical__step-main--MarginLeft);
591
+ --pf-c-progress-stepper--m-compact--GridTemplateColumns: var(--pf-c-progress-stepper--m-vertical--m-compact--GridTemplateColumns);
592
+ --pf-c-progress-stepper--m-compact__step-connector--GridRow: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--GridRow);
593
+ --pf-c-progress-stepper--m-compact__step-connector--PaddingBottom: var(--pf-c-progress-stepper--m-vertical--m-compact__step-connector--PaddingBottom);
594
+ --pf-c-progress-stepper--m-center__step-connector--before--Content: none;
595
+ --pf-c-progress-stepper--m-center__step-main--before--Content: "";
596
+ }
250
597
  }
package/css/components/ProgressStepper/progress-stepper.d.ts CHANGED
@@ -3,7 +3,6 @@ declare const _default: {
3
3
  "faExclamationTriangle": "fa-exclamation-triangle",
4
4
  "modifiers": {
5
5
  "center": "pf-m-center",
6
- "vertical": "pf-m-vertical",
7
6
  "compact": "pf-m-compact",
8
7
  "current": "pf-m-current",
9
8
  "pending": "pf-m-pending",
@@ -11,7 +10,19 @@ declare const _default: {
11
10
  "danger": "pf-m-danger",
12
11
  "warning": "pf-m-warning",
13
12
  "info": "pf-m-info",
14
- "helpText": "pf-m-help-text"
13
+ "helpText": "pf-m-help-text",
14
+ "horizontal": "pf-m-horizontal",
15
+ "vertical": "pf-m-vertical",
16
+ "horizontalOnSm": "pf-m-horizontal-on-sm",
17
+ "verticalOnSm": "pf-m-vertical-on-sm",
18
+ "horizontalOnMd": "pf-m-horizontal-on-md",
19
+ "verticalOnMd": "pf-m-vertical-on-md",
20
+ "horizontalOnLg": "pf-m-horizontal-on-lg",
21
+ "verticalOnLg": "pf-m-vertical-on-lg",
22
+ "horizontalOnXl": "pf-m-horizontal-on-xl",
23
+ "verticalOnXl": "pf-m-vertical-on-xl",
24
+ "horizontalOn_2xl": "pf-m-horizontal-on-2xl",
25
+ "verticalOn_2xl": "pf-m-vertical-on-2xl"
15
26
  },
16
27
  "pficon": "pficon",
17
28
  "progressStepper": "pf-c-progress-stepper",
package/css/components/ProgressStepper/progress-stepper.js CHANGED
@@ -5,7 +5,6 @@ exports.default = {
5
5
  "faExclamationTriangle": "fa-exclamation-triangle",
6
6
  "modifiers": {
7
7
  "center": "pf-m-center",
8
- "vertical": "pf-m-vertical",
9
8
  "compact": "pf-m-compact",
10
9
  "current": "pf-m-current",
11
10
  "pending": "pf-m-pending",
@@ -13,7 +12,19 @@ exports.default = {
13
12
  "danger": "pf-m-danger",
14
13
  "warning": "pf-m-warning",
15
14
  "info": "pf-m-info",
16
- "helpText": "pf-m-help-text"
15
+ "helpText": "pf-m-help-text",
16
+ "horizontal": "pf-m-horizontal",
17
+ "vertical": "pf-m-vertical",
18
+ "horizontalOnSm": "pf-m-horizontal-on-sm",
19
+ "verticalOnSm": "pf-m-vertical-on-sm",
20
+ "horizontalOnMd": "pf-m-horizontal-on-md",
21
+ "verticalOnMd": "pf-m-vertical-on-md",
22
+ "horizontalOnLg": "pf-m-horizontal-on-lg",
23
+ "verticalOnLg": "pf-m-vertical-on-lg",
24
+ "horizontalOnXl": "pf-m-horizontal-on-xl",
25
+ "verticalOnXl": "pf-m-vertical-on-xl",
26
+ "horizontalOn_2xl": "pf-m-horizontal-on-2xl",
27
+ "verticalOn_2xl": "pf-m-vertical-on-2xl"
17
28
  },
18
29
  "pficon": "pficon",
19
30
  "progressStepper": "pf-c-progress-stepper",
package/css/components/ProgressStepper/progress-stepper.mjs CHANGED
@@ -3,7 +3,6 @@ export default {
3
3
  "faExclamationTriangle": "fa-exclamation-triangle",
4
4
  "modifiers": {
5
5
  "center": "pf-m-center",
6
- "vertical": "pf-m-vertical",
7
6
  "compact": "pf-m-compact",
8
7
  "current": "pf-m-current",
9
8
  "pending": "pf-m-pending",
@@ -11,7 +10,19 @@ export default {
11
10
  "danger": "pf-m-danger",
12
11
  "warning": "pf-m-warning",
13
12
  "info": "pf-m-info",
14
- "helpText": "pf-m-help-text"
13
+ "helpText": "pf-m-help-text",
14
+ "horizontal": "pf-m-horizontal",
15
+ "vertical": "pf-m-vertical",
16
+ "horizontalOnSm": "pf-m-horizontal-on-sm",
17
+ "verticalOnSm": "pf-m-vertical-on-sm",
18
+ "horizontalOnMd": "pf-m-horizontal-on-md",
19
+ "verticalOnMd": "pf-m-vertical-on-md",
20
+ "horizontalOnLg": "pf-m-horizontal-on-lg",
21
+ "verticalOnLg": "pf-m-vertical-on-lg",
22
+ "horizontalOnXl": "pf-m-horizontal-on-xl",
23
+ "verticalOnXl": "pf-m-vertical-on-xl",
24
+ "horizontalOn_2xl": "pf-m-horizontal-on-2xl",
25
+ "verticalOn_2xl": "pf-m-vertical-on-2xl"
15
26
  },
16
27
  "pficon": "pficon",
17
28
  "progressStepper": "pf-c-progress-stepper",
package/css/components/Wizard/wizard.css CHANGED
@@ -490,6 +490,7 @@
490
490
  }
491
491
 
492
492
  .pf-c-wizard__footer {
493
+ position: relative;
493
494
  z-index: var(--pf-c-wizard__footer--ZIndex);
494
495
  display: flex;
495
496
  flex-wrap: wrap;
@@ -503,7 +504,7 @@
503
504
  .pf-c-wizard__footer > *:not(:last-child) {
504
505
  margin-right: var(--pf-c-wizard__footer--child--MarginRight);
505
506
  }
506
- .pf-c-page__main-wizard .pf-c-wizard__footer, .pf-c-modal-box .pf-c-wizard__footer {
507
+ .pf-c-page__main-wizard .pf-c-wizard__footer, .pf-c-modal-box .pf-c-wizard__footer, .pf-c-drawer > .pf-c-wizard__footer {
507
508
  box-shadow: var(--pf-c-wizard__footer--BoxShadow);
508
509
  }
509
510
 
@@ -520,6 +521,9 @@
520
521
  --pf-global--link--Color--hover: #73bcf7;
521
522
  --pf-global--BackgroundColor--100: #1b1d21;
522
523
  }
524
+ :where(.pf-theme-dark) .pf-c-wizard__header .pf-c-card {
525
+ --pf-c-card--BackgroundColor: var(--pf-global--BackgroundColor--100);
526
+ }
523
527
  :where(.pf-theme-dark) .pf-c-wizard__header .pf-c-button {
524
528
  --pf-c-button--m-primary--Color: var(--pf-global--Color--light-100);
525
529
  --pf-c-button--m-primary--hover--Color: var(--pf-global--Color--light-100);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/react-styles",
3
- "version": "4.72.15",
3
+ "version": "4.73.0",
4
4
  "main": "dist/js/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/esm/index.d.ts",
@@ -19,7 +19,7 @@
19
19
  "clean": "rimraf dist css"
20
20
  },
21
21
  "devDependencies": {
22
- "@patternfly/patternfly": "4.200.0",
22
+ "@patternfly/patternfly": "4.201.2",
23
23
  "camel-case": "^3.0.0",
24
24
  "css": "^2.2.3",
25
25
  "fs-extra": "^6.0.1",
@@ -29,5 +29,5 @@
29
29
  "typescript": "^4.0.0"
30
30
  },
31
31
  "license": "MIT",
32
- "gitHead": "95acf13e41106a55890dd36b6764104a0b8f4b63"
32
+ "gitHead": "d9a07cccab946125e662b145b325eab6525f2211"
33
33
  }