@patternfly/patternfly 4.214.0 → 4.215.1

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 (26) hide show
  1. package/RELEASE-NOTES.md +22 -0
  2. package/components/Banner/banner.css +6 -6
  3. package/components/Banner/banner.scss +8 -4
  4. package/components/Banner/themes/dark/banner.scss +5 -1
  5. package/components/ProgressStepper/progress-stepper.css +7 -4
  6. package/components/ProgressStepper/progress-stepper.scss +7 -4
  7. package/docs/components/Banner/examples/Banner.md +91 -19
  8. package/docs/components/FileUpload/examples/FileUpload.md +1 -1
  9. package/docs/components/Form/examples/Form.md +52 -50
  10. package/docs/components/Login/examples/Login.md +5 -5
  11. package/docs/components/SearchInput/examples/SearchInput.md +2 -2
  12. package/docs/components/TextInputGroup/examples/TextInputGroup.md +2 -2
  13. package/docs/components/Wizard/examples/Wizard.md +5 -5
  14. package/docs/demos/Alert/examples/Alert.md +2 -2
  15. package/docs/demos/Button/examples/Button.md +3 -3
  16. package/docs/demos/Form/examples/BasicForms.md +5 -5
  17. package/docs/demos/HelperText/examples/HelperText.md +1 -1
  18. package/docs/demos/Modal/examples/Modal.md +1 -1
  19. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +1 -1
  20. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +4 -4
  21. package/docs/demos/Wizard/examples/Wizard.md +1960 -748
  22. package/package.json +1 -1
  23. package/patternfly-no-reset.css +13 -10
  24. package/patternfly.css +13 -10
  25. package/patternfly.min.css +1 -1
  26. package/patternfly.min.css.map +1 -1
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "4.214.0",
4
+ "version": "4.215.1",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
package/patternfly-no-reset.css CHANGED
@@ -1,5 +1,5 @@
1
1
  @charset "UTF-8";
2
- .pf-c-table, .pf-c-select, .pf-c-page__sidebar.pf-m-light, .pf-c-menu, .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light, .pf-c-input-group, .pf-c-form-control, .pf-c-data-list, .pf-c-context-selector__menu, .pf-c-chip-group, .pf-c-chip, .pf-c-calendar-month, .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-info, .pf-c-alert, .pf-c-accordion, .pf-t-light {
2
+ .pf-c-table, .pf-c-select, .pf-c-page__sidebar.pf-m-light, .pf-c-menu, .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light, .pf-c-input-group, .pf-c-form-control, .pf-c-data-list, .pf-c-context-selector__menu, .pf-c-chip-group, .pf-c-chip, .pf-c-calendar-month, .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-gold, .pf-c-banner.pf-m-info, .pf-c-banner.pf-m-blue, .pf-c-alert, .pf-c-accordion, .pf-t-light {
3
3
  --pf-global--Color--100: var(--pf-global--Color--dark-100);
4
4
  --pf-global--Color--200: var(--pf-global--Color--dark-200);
5
5
  --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
@@ -7067,17 +7067,17 @@ html {
7067
7067
  --pf-c-banner--PaddingLeft: var(--pf-c-banner--md--PaddingLeft);
7068
7068
  }
7069
7069
  }
7070
- .pf-c-banner.pf-m-info {
7070
+ .pf-c-banner.pf-m-info, .pf-c-banner.pf-m-blue {
7071
7071
  color: var(--pf-global--Color--100);
7072
7072
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-info--BackgroundColor);
7073
7073
  }
7074
- .pf-c-banner.pf-m-danger {
7074
+ .pf-c-banner.pf-m-danger, .pf-c-banner.pf-m-red {
7075
7075
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-danger--BackgroundColor);
7076
7076
  }
7077
- .pf-c-banner.pf-m-success {
7077
+ .pf-c-banner.pf-m-success, .pf-c-banner.pf-m-green {
7078
7078
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-success--BackgroundColor);
7079
7079
  }
7080
- .pf-c-banner.pf-m-warning {
7080
+ .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-gold {
7081
7081
  color: var(--pf-global--Color--100);
7082
7082
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-warning--BackgroundColor);
7083
7083
  }
@@ -7154,7 +7154,7 @@ html {
7154
7154
  :where(.pf-theme-dark) .pf-c-banner {
7155
7155
  color: var(--pf-global--Color--100);
7156
7156
  }
7157
- :where(.pf-theme-dark) .pf-c-banner.pf-m-info, :where(.pf-theme-dark) .pf-c-banner.pf-m-danger, :where(.pf-theme-dark) .pf-c-banner.pf-m-success, :where(.pf-theme-dark) .pf-c-banner.pf-m-warning {
7157
+ :where(.pf-theme-dark) .pf-c-banner.pf-m-info, :where(.pf-theme-dark) .pf-c-banner.pf-m-blue, :where(.pf-theme-dark) .pf-c-banner.pf-m-danger, :where(.pf-theme-dark) .pf-c-banner.pf-m-red, :where(.pf-theme-dark) .pf-c-banner.pf-m-success, :where(.pf-theme-dark) .pf-c-banner.pf-m-green, :where(.pf-theme-dark) .pf-c-banner.pf-m-warning, :where(.pf-theme-dark) .pf-c-banner.pf-m-gold {
7158
7158
  color: var(--pf-global--palette--black-900);
7159
7159
  }
7160
7160
 
@@ -23493,8 +23493,7 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
23493
23493
  --pf-c-progress-stepper--m-center__step-connector--JustifyContent: center;
23494
23494
  --pf-c-progress-stepper--m-center__step-main--MarginRight: var(--pf-global--spacer--xs);
23495
23495
  --pf-c-progress-stepper--m-center__step-main--MarginLeft: var(--pf-global--spacer--xs);
23496
- --pf-c-progress-stepper--m-center__step-title--TextAlign: center;
23497
- --pf-c-progress-stepper--m-center__step-description--TextAlign: center;
23496
+ --pf-c-progress-stepper--m-center__step-main--TextAlign: center;
23498
23497
  --pf-c-progress-stepper--m-center__step-description--MarginRight: 0;
23499
23498
  --pf-c-progress-stepper--m-center__step-description--MarginLeft: 0;
23500
23499
  --pf-c-progress-stepper--GridTemplateRows: auto 1fr;
@@ -23588,10 +23587,11 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
23588
23587
  --pf-c-progress-stepper__step-connector--JustifyContent: var(--pf-c-progress-stepper--m-center__step-connector--JustifyContent);
23589
23588
  --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-center__step-main--MarginRight);
23590
23589
  --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-center__step-main--MarginLeft);
23591
- --pf-c-progress-stepper__step-title--TextAlign: var(--pf-c-progress-stepper--m-center__step-title--TextAlign);
23590
+ --pf-c-progress-stepper--step-main--TextAlign: var(--pf-c-progress-stepper--m-center__step-main--TextAlign, auto);
23591
+ --pf-c-progress-stepper__step-title--TextAlign: var(--pf-c-progress-stepper--m-center__step-title--TextAlign, auto);
23592
23592
  --pf-c-progress-stepper__step-description--MarginRight: var(--pf-c-progress-stepper--m-center__step-description--MarginRight);
23593
23593
  --pf-c-progress-stepper__step-description--MarginLeft: var(--pf-c-progress-stepper--m-center__step-description--MarginLeft);
23594
- --pf-c-progress-stepper__step-description--TextAlign: var(--pf-c-progress-stepper--m-center__step-description--TextAlign);
23594
+ --pf-c-progress-stepper__step-description--TextAlign: var(--pf-c-progress-stepper--m-center__step-description--TextAlign, auto);
23595
23595
  --pf-c-progress-stepper--m-vertical__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical--m-center__step-main--MarginRight);
23596
23596
  --pf-c-progress-stepper--m-vertical__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical--m-center__step-main--MarginLeft);
23597
23597
  grid-template-columns: var(--pf-c-progress-stepper--m-center--GridTemplateColumns);
@@ -23719,7 +23719,10 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
23719
23719
  }
23720
23720
 
23721
23721
  .pf-c-progress-stepper__step-main {
23722
+ min-width: 0;
23722
23723
  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);
23724
+ text-align: var(--pf-c-progress-stepper--step-main--TextAlign, auto);
23725
+ overflow-wrap: anywhere;
23723
23726
  }
23724
23727
  .pf-c-progress-stepper__step:not(:last-of-type) > .pf-c-progress-stepper__step-main::before {
23725
23728
  position: absolute;
package/patternfly.css CHANGED
@@ -1,5 +1,5 @@
1
1
  @charset "UTF-8";
2
- .pf-c-table, .pf-c-select, .pf-c-page__sidebar.pf-m-light, .pf-c-menu, .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light, .pf-c-input-group, .pf-c-form-control, .pf-c-data-list, .pf-c-context-selector__menu, .pf-c-chip-group, .pf-c-chip, .pf-c-calendar-month, .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-info, .pf-c-alert, .pf-c-accordion, .pf-t-light {
2
+ .pf-c-table, .pf-c-select, .pf-c-page__sidebar.pf-m-light, .pf-c-menu, .pf-c-masthead.pf-m-light-200, .pf-c-masthead.pf-m-light, .pf-c-input-group, .pf-c-form-control, .pf-c-data-list, .pf-c-context-selector__menu, .pf-c-chip-group, .pf-c-chip, .pf-c-calendar-month, .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-gold, .pf-c-banner.pf-m-info, .pf-c-banner.pf-m-blue, .pf-c-alert, .pf-c-accordion, .pf-t-light {
3
3
  --pf-global--Color--100: var(--pf-global--Color--dark-100);
4
4
  --pf-global--Color--200: var(--pf-global--Color--dark-200);
5
5
  --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
@@ -7194,17 +7194,17 @@ a {
7194
7194
  --pf-c-banner--PaddingLeft: var(--pf-c-banner--md--PaddingLeft);
7195
7195
  }
7196
7196
  }
7197
- .pf-c-banner.pf-m-info {
7197
+ .pf-c-banner.pf-m-info, .pf-c-banner.pf-m-blue {
7198
7198
  color: var(--pf-global--Color--100);
7199
7199
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-info--BackgroundColor);
7200
7200
  }
7201
- .pf-c-banner.pf-m-danger {
7201
+ .pf-c-banner.pf-m-danger, .pf-c-banner.pf-m-red {
7202
7202
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-danger--BackgroundColor);
7203
7203
  }
7204
- .pf-c-banner.pf-m-success {
7204
+ .pf-c-banner.pf-m-success, .pf-c-banner.pf-m-green {
7205
7205
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-success--BackgroundColor);
7206
7206
  }
7207
- .pf-c-banner.pf-m-warning {
7207
+ .pf-c-banner.pf-m-warning, .pf-c-banner.pf-m-gold {
7208
7208
  color: var(--pf-global--Color--100);
7209
7209
  --pf-c-banner--BackgroundColor: var(--pf-c-banner--m-warning--BackgroundColor);
7210
7210
  }
@@ -7281,7 +7281,7 @@ a {
7281
7281
  :where(.pf-theme-dark) .pf-c-banner {
7282
7282
  color: var(--pf-global--Color--100);
7283
7283
  }
7284
- :where(.pf-theme-dark) .pf-c-banner.pf-m-info, :where(.pf-theme-dark) .pf-c-banner.pf-m-danger, :where(.pf-theme-dark) .pf-c-banner.pf-m-success, :where(.pf-theme-dark) .pf-c-banner.pf-m-warning {
7284
+ :where(.pf-theme-dark) .pf-c-banner.pf-m-info, :where(.pf-theme-dark) .pf-c-banner.pf-m-blue, :where(.pf-theme-dark) .pf-c-banner.pf-m-danger, :where(.pf-theme-dark) .pf-c-banner.pf-m-red, :where(.pf-theme-dark) .pf-c-banner.pf-m-success, :where(.pf-theme-dark) .pf-c-banner.pf-m-green, :where(.pf-theme-dark) .pf-c-banner.pf-m-warning, :where(.pf-theme-dark) .pf-c-banner.pf-m-gold {
7285
7285
  color: var(--pf-global--palette--black-900);
7286
7286
  }
7287
7287
 
@@ -23620,8 +23620,7 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
23620
23620
  --pf-c-progress-stepper--m-center__step-connector--JustifyContent: center;
23621
23621
  --pf-c-progress-stepper--m-center__step-main--MarginRight: var(--pf-global--spacer--xs);
23622
23622
  --pf-c-progress-stepper--m-center__step-main--MarginLeft: var(--pf-global--spacer--xs);
23623
- --pf-c-progress-stepper--m-center__step-title--TextAlign: center;
23624
- --pf-c-progress-stepper--m-center__step-description--TextAlign: center;
23623
+ --pf-c-progress-stepper--m-center__step-main--TextAlign: center;
23625
23624
  --pf-c-progress-stepper--m-center__step-description--MarginRight: 0;
23626
23625
  --pf-c-progress-stepper--m-center__step-description--MarginLeft: 0;
23627
23626
  --pf-c-progress-stepper--GridTemplateRows: auto 1fr;
@@ -23715,10 +23714,11 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
23715
23714
  --pf-c-progress-stepper__step-connector--JustifyContent: var(--pf-c-progress-stepper--m-center__step-connector--JustifyContent);
23716
23715
  --pf-c-progress-stepper__step-main--MarginRight: var(--pf-c-progress-stepper--m-center__step-main--MarginRight);
23717
23716
  --pf-c-progress-stepper__step-main--MarginLeft: var(--pf-c-progress-stepper--m-center__step-main--MarginLeft);
23718
- --pf-c-progress-stepper__step-title--TextAlign: var(--pf-c-progress-stepper--m-center__step-title--TextAlign);
23717
+ --pf-c-progress-stepper--step-main--TextAlign: var(--pf-c-progress-stepper--m-center__step-main--TextAlign, auto);
23718
+ --pf-c-progress-stepper__step-title--TextAlign: var(--pf-c-progress-stepper--m-center__step-title--TextAlign, auto);
23719
23719
  --pf-c-progress-stepper__step-description--MarginRight: var(--pf-c-progress-stepper--m-center__step-description--MarginRight);
23720
23720
  --pf-c-progress-stepper__step-description--MarginLeft: var(--pf-c-progress-stepper--m-center__step-description--MarginLeft);
23721
- --pf-c-progress-stepper__step-description--TextAlign: var(--pf-c-progress-stepper--m-center__step-description--TextAlign);
23721
+ --pf-c-progress-stepper__step-description--TextAlign: var(--pf-c-progress-stepper--m-center__step-description--TextAlign, auto);
23722
23722
  --pf-c-progress-stepper--m-vertical__step-main--MarginRight: var(--pf-c-progress-stepper--m-vertical--m-center__step-main--MarginRight);
23723
23723
  --pf-c-progress-stepper--m-vertical__step-main--MarginLeft: var(--pf-c-progress-stepper--m-vertical--m-center__step-main--MarginLeft);
23724
23724
  grid-template-columns: var(--pf-c-progress-stepper--m-center--GridTemplateColumns);
@@ -23846,7 +23846,10 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
23846
23846
  }
23847
23847
 
23848
23848
  .pf-c-progress-stepper__step-main {
23849
+ min-width: 0;
23849
23850
  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);
23851
+ text-align: var(--pf-c-progress-stepper--step-main--TextAlign, auto);
23852
+ overflow-wrap: anywhere;
23850
23853
  }
23851
23854
  .pf-c-progress-stepper__step:not(:last-of-type) > .pf-c-progress-stepper__step-main::before {
23852
23855
  position: absolute;