@patternfly/patternfly 4.200.0 → 4.200.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.
- package/components/Wizard/wizard.css +2 -1
- package/components/Wizard/wizard.scss +3 -1
- package/docs/components/Wizard/examples/Wizard.md +59 -57
- package/docs/demos/Wizard/examples/Wizard.md +2581 -275
- package/package.json +1 -1
- package/patternfly-no-reset.css +2 -1
- package/patternfly.css +2 -1
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -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
|
|
|
@@ -531,6 +531,7 @@
|
|
|
531
531
|
}
|
|
532
532
|
|
|
533
533
|
.pf-c-wizard__footer {
|
|
534
|
+
position: relative;
|
|
534
535
|
z-index: var(--pf-c-wizard__footer--ZIndex);
|
|
535
536
|
display: flex;
|
|
536
537
|
flex-wrap: wrap;
|
|
@@ -549,7 +550,8 @@
|
|
|
549
550
|
// Limit shadow to a child of modal and main-wizard since we can ensure wizard footer is fixed in those usages
|
|
550
551
|
// Make a regular style in a breaking change release
|
|
551
552
|
.pf-c-page__main-wizard &,
|
|
552
|
-
.pf-c-modal-box
|
|
553
|
+
.pf-c-modal-box &,
|
|
554
|
+
.pf-c-drawer > & {
|
|
553
555
|
box-shadow: var(--pf-c-wizard__footer--BoxShadow);
|
|
554
556
|
}
|
|
555
557
|
}
|
|
@@ -497,45 +497,47 @@ wrapperTag: div
|
|
|
497
497
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
498
498
|
</span>
|
|
499
499
|
</button>
|
|
500
|
-
<div class="pf-c-
|
|
501
|
-
<div class="pf-c-
|
|
502
|
-
<
|
|
503
|
-
<
|
|
504
|
-
<
|
|
505
|
-
<
|
|
500
|
+
<div class="pf-c-wizard__outer-wrap">
|
|
501
|
+
<div class="pf-c-wizard__inner-wrap">
|
|
502
|
+
<nav class="pf-c-wizard__nav" aria-label="Steps">
|
|
503
|
+
<ol class="pf-c-wizard__nav-list">
|
|
504
|
+
<li class="pf-c-wizard__nav-item">
|
|
505
|
+
<button class="pf-c-wizard__nav-link">Information</button>
|
|
506
|
+
</li>
|
|
507
|
+
<li class="pf-c-wizard__nav-item">
|
|
508
|
+
<button class="pf-c-wizard__nav-link pf-m-current">Configuration</button>
|
|
509
|
+
<ol class="pf-c-wizard__nav-list">
|
|
510
|
+
<li class="pf-c-wizard__nav-item">
|
|
511
|
+
<button class="pf-c-wizard__nav-link">Substep A</button>
|
|
512
|
+
</li>
|
|
513
|
+
<li class="pf-c-wizard__nav-item">
|
|
514
|
+
<button
|
|
515
|
+
class="pf-c-wizard__nav-link pf-m-current"
|
|
516
|
+
aria-current="page"
|
|
517
|
+
>Substep B</button>
|
|
518
|
+
</li>
|
|
519
|
+
<li class="pf-c-wizard__nav-item">
|
|
520
|
+
<button class="pf-c-wizard__nav-link">Substep C</button>
|
|
521
|
+
</li>
|
|
522
|
+
</ol>
|
|
523
|
+
</li>
|
|
524
|
+
<li class="pf-c-wizard__nav-item">
|
|
525
|
+
<button class="pf-c-wizard__nav-link">Additional</button>
|
|
526
|
+
</li>
|
|
527
|
+
<li class="pf-c-wizard__nav-item">
|
|
528
|
+
<button class="pf-c-wizard__nav-link" disabled>Review</button>
|
|
529
|
+
</li>
|
|
530
|
+
</ol>
|
|
531
|
+
</nav>
|
|
532
|
+
<main class="pf-c-wizard__main" tabindex="0">
|
|
533
|
+
<div class="pf-c-drawer pf-m-expanded pf-m-inline">
|
|
534
|
+
<div class="pf-c-drawer__main">
|
|
535
|
+
<div class="pf-c-drawer__content">
|
|
506
536
|
<div class="pf-c-wizard__main-body">
|
|
507
|
-
<
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
</li>
|
|
512
|
-
<li class="pf-c-wizard__nav-item">
|
|
513
|
-
<button
|
|
514
|
-
class="pf-c-wizard__nav-link pf-m-current"
|
|
515
|
-
>Configuration</button>
|
|
516
|
-
<ol class="pf-c-wizard__nav-list">
|
|
517
|
-
<li class="pf-c-wizard__nav-item">
|
|
518
|
-
<button class="pf-c-wizard__nav-link">Substep A</button>
|
|
519
|
-
</li>
|
|
520
|
-
<li class="pf-c-wizard__nav-item">
|
|
521
|
-
<button
|
|
522
|
-
class="pf-c-wizard__nav-link pf-m-current"
|
|
523
|
-
aria-current="page"
|
|
524
|
-
>Substep B</button>
|
|
525
|
-
</li>
|
|
526
|
-
<li class="pf-c-wizard__nav-item">
|
|
527
|
-
<button class="pf-c-wizard__nav-link">Substep C</button>
|
|
528
|
-
</li>
|
|
529
|
-
</ol>
|
|
530
|
-
</li>
|
|
531
|
-
<li class="pf-c-wizard__nav-item">
|
|
532
|
-
<button class="pf-c-wizard__nav-link">Additional</button>
|
|
533
|
-
</li>
|
|
534
|
-
<li class="pf-c-wizard__nav-item">
|
|
535
|
-
<button class="pf-c-wizard__nav-link" disabled>Review</button>
|
|
536
|
-
</li>
|
|
537
|
-
</ol>
|
|
538
|
-
</nav>
|
|
537
|
+
<button
|
|
538
|
+
class="pf-c-button pf-u-hidden pf-m-link pf-m-inline pf-u-float-right pf-u-ml-md"
|
|
539
|
+
type="button"
|
|
540
|
+
>Open drawer</button>
|
|
539
541
|
<form novalidate class="pf-c-form">
|
|
540
542
|
<div class="pf-c-form__group">
|
|
541
543
|
<div class="pf-c-form__group-label">
|
|
@@ -700,7 +702,24 @@ wrapperTag: div
|
|
|
700
702
|
</div>
|
|
701
703
|
</form>
|
|
702
704
|
</div>
|
|
703
|
-
</
|
|
705
|
+
</div>
|
|
706
|
+
<div class="pf-c-drawer__panel pf-m-light-200 pf-m-width-33">
|
|
707
|
+
<div class="pf-c-drawer__body">
|
|
708
|
+
<div class="pf-c-drawer__head">
|
|
709
|
+
<div class="pf-c-drawer__actions">
|
|
710
|
+
<div class="pf-c-drawer__close">
|
|
711
|
+
<button
|
|
712
|
+
class="pf-c-button pf-m-plain"
|
|
713
|
+
type="button"
|
|
714
|
+
aria-label="Close drawer panel"
|
|
715
|
+
>
|
|
716
|
+
<i class="fas fa-times" aria-hidden="true"></i>
|
|
717
|
+
</button>
|
|
718
|
+
</div>
|
|
719
|
+
</div>drawer-panel
|
|
720
|
+
</div>
|
|
721
|
+
</div>
|
|
722
|
+
</div>
|
|
704
723
|
</div>
|
|
705
724
|
<footer class="pf-c-wizard__footer">
|
|
706
725
|
<button class="pf-c-button pf-m-primary" type="submit">Next</button>
|
|
@@ -710,24 +729,7 @@ wrapperTag: div
|
|
|
710
729
|
</div>
|
|
711
730
|
</footer>
|
|
712
731
|
</div>
|
|
713
|
-
</
|
|
714
|
-
<div class="pf-c-drawer__panel pf-m-light-200">
|
|
715
|
-
<div class="pf-c-drawer__body">
|
|
716
|
-
<div class="pf-c-drawer__head">
|
|
717
|
-
<div class="pf-c-drawer__actions">
|
|
718
|
-
<div class="pf-c-drawer__close">
|
|
719
|
-
<button
|
|
720
|
-
class="pf-c-button pf-m-plain"
|
|
721
|
-
type="button"
|
|
722
|
-
aria-label="Close drawer panel"
|
|
723
|
-
>
|
|
724
|
-
<i class="fas fa-times" aria-hidden="true"></i>
|
|
725
|
-
</button>
|
|
726
|
-
</div>
|
|
727
|
-
</div>drawer-panel
|
|
728
|
-
</div>
|
|
729
|
-
</div>
|
|
730
|
-
</div>
|
|
732
|
+
</main>
|
|
731
733
|
</div>
|
|
732
734
|
</div>
|
|
733
735
|
</div>
|