@patternfly/patternfly 4.180.0 → 4.180.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/MenuToggle/menu-toggle.css +6 -6
- package/components/MenuToggle/menu-toggle.scss +7 -6
- package/docs/components/Page/examples/Page.md +11 -2
- package/docs/components/Table/examples/Table.md +8 -0
- package/docs/components/Wizard/examples/Wizard.md +6 -6
- package/docs/demos/Alert/examples/Alert.md +20 -40
- package/docs/demos/BackToTop/examples/BackToTop.md +149 -249
- package/docs/demos/ContextSelector/examples/ContextSelector.md +80 -160
- package/docs/demos/Drawer/examples/Drawer.md +60 -120
- package/docs/demos/JumpLinks/examples/JumpLinks.md +80 -31
- package/docs/demos/Masthead/examples/Masthead.md +140 -280
- package/docs/demos/Nav/examples/Nav.md +203 -343
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +100 -200
- package/docs/demos/Page/examples/Page.md +575 -1123
- package/docs/demos/Tabs/examples/Tabs.md +11 -19
- package/docs/demos/Wizard/examples/Wizard.md +6 -2
- package/package.json +1 -1
- package/patternfly-no-reset.css +6 -6
- package/patternfly.css +6 -6
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -1257,7 +1257,7 @@ section: components
|
|
|
1257
1257
|
>
|
|
1258
1258
|
<section class="pf-c-page__main-section pf-m-limit-width pf-m-light">
|
|
1259
1259
|
<div class="pf-c-page__main-body">
|
|
1260
|
-
<h1 class="pf-c-title pf-m-2xl
|
|
1260
|
+
<h1 class="pf-c-title pf-m-2xl">Overview</h1>
|
|
1261
1261
|
</div>
|
|
1262
1262
|
</section>
|
|
1263
1263
|
<section class="pf-c-page__main-tabs pf-m-limit-width">
|
|
@@ -1300,13 +1300,13 @@ section: components
|
|
|
1300
1300
|
<div class="pf-l-grid__item pf-m-6-col-on-md pf-m-8-col-on-xl">
|
|
1301
1301
|
<div class="pf-c-card pf-m-full-height">
|
|
1302
1302
|
<div class="pf-c-card__header">
|
|
1303
|
-
<h2 class="pf-c-title pf-m-lg
|
|
1303
|
+
<h2 class="pf-c-title pf-m-lg">Status</h2>
|
|
1304
1304
|
</div>
|
|
1305
1305
|
<div class="pf-c-card__body">
|
|
1306
1306
|
<div class="pf-l-flex pf-m-column">
|
|
1307
1307
|
<div class="pf-l-flex__item">
|
|
1308
1308
|
<div
|
|
1309
|
-
class="pf-c-tabs pf-m-
|
|
1309
|
+
class="pf-c-tabs pf-m-secondary"
|
|
1310
1310
|
id="nested-tabs-example-tabs-subtabs"
|
|
1311
1311
|
>
|
|
1312
1312
|
<ul class="pf-c-tabs__list">
|
|
@@ -1409,18 +1409,14 @@ section: components
|
|
|
1409
1409
|
<div class="pf-l-flex__item pf-m-flex-1">
|
|
1410
1410
|
<div class="pf-c-card pf-m-full-height">
|
|
1411
1411
|
<div class="pf-c-card__header">
|
|
1412
|
-
<h3
|
|
1413
|
-
class="pf-c-title pf-m-lg pf-u-font-weight-light"
|
|
1414
|
-
>Title of card</h3>
|
|
1412
|
+
<h3 class="pf-c-title pf-m-lg">Title of card</h3>
|
|
1415
1413
|
</div>
|
|
1416
1414
|
</div>
|
|
1417
1415
|
</div>
|
|
1418
1416
|
<div class="pf-l-flex__item pf-m-flex-1">
|
|
1419
1417
|
<div class="pf-c-card pf-m-full-height">
|
|
1420
1418
|
<div class="pf-c-card__header">
|
|
1421
|
-
<h3
|
|
1422
|
-
class="pf-c-title pf-m-lg pf-u-font-weight-light"
|
|
1423
|
-
>Title of card</h3>
|
|
1419
|
+
<h3 class="pf-c-title pf-m-lg">Title of card</h3>
|
|
1424
1420
|
</div>
|
|
1425
1421
|
</div>
|
|
1426
1422
|
</div>
|
|
@@ -5110,7 +5106,7 @@ section: components
|
|
|
5110
5106
|
<div class="pf-l-grid pf-m-gutter">
|
|
5111
5107
|
<div class="pf-l-grid__item">
|
|
5112
5108
|
<div
|
|
5113
|
-
class="pf-c-tabs pf-m-
|
|
5109
|
+
class="pf-c-tabs pf-m-inset-none pf-m-secondary"
|
|
5114
5110
|
id="modal-tabs-example-tabs"
|
|
5115
5111
|
>
|
|
5116
5112
|
<ul class="pf-c-tabs__list">
|
|
@@ -6709,7 +6705,7 @@ section: components
|
|
|
6709
6705
|
>
|
|
6710
6706
|
<section class="pf-c-page__main-section pf-m-limit-width pf-m-light">
|
|
6711
6707
|
<div class="pf-c-page__main-body">
|
|
6712
|
-
<h1 class="pf-c-title pf-m-2xl
|
|
6708
|
+
<h1 class="pf-c-title pf-m-2xl">Overview</h1>
|
|
6713
6709
|
</div>
|
|
6714
6710
|
</section>
|
|
6715
6711
|
<section class="pf-c-page__main-tabs pf-m-limit-width">
|
|
@@ -6778,13 +6774,13 @@ section: components
|
|
|
6778
6774
|
<div class="pf-l-grid__item pf-m-6-col-on-md pf-m-8-col-on-xl">
|
|
6779
6775
|
<div class="pf-c-card pf-m-full-height">
|
|
6780
6776
|
<div class="pf-c-card__header">
|
|
6781
|
-
<h2 class="pf-c-title pf-m-lg
|
|
6777
|
+
<h2 class="pf-c-title pf-m-lg">Status</h2>
|
|
6782
6778
|
</div>
|
|
6783
6779
|
<div class="pf-c-card__body">
|
|
6784
6780
|
<div class="pf-l-flex pf-m-column">
|
|
6785
6781
|
<div class="pf-l-flex__item">
|
|
6786
6782
|
<div
|
|
6787
|
-
class="pf-c-tabs pf-m-
|
|
6783
|
+
class="pf-c-tabs pf-m-secondary"
|
|
6788
6784
|
id="gray-tabs-example-tabs-subtabs"
|
|
6789
6785
|
>
|
|
6790
6786
|
<ul class="pf-c-tabs__list">
|
|
@@ -6887,18 +6883,14 @@ section: components
|
|
|
6887
6883
|
<div class="pf-l-flex__item pf-m-flex-1">
|
|
6888
6884
|
<div class="pf-c-card pf-m-full-height">
|
|
6889
6885
|
<div class="pf-c-card__header">
|
|
6890
|
-
<h3
|
|
6891
|
-
class="pf-c-title pf-m-lg pf-u-font-weight-light"
|
|
6892
|
-
>Title of card</h3>
|
|
6886
|
+
<h3 class="pf-c-title pf-m-lg">Title of card</h3>
|
|
6893
6887
|
</div>
|
|
6894
6888
|
</div>
|
|
6895
6889
|
</div>
|
|
6896
6890
|
<div class="pf-l-flex__item pf-m-flex-1">
|
|
6897
6891
|
<div class="pf-c-card pf-m-full-height">
|
|
6898
6892
|
<div class="pf-c-card__header">
|
|
6899
|
-
<h3
|
|
6900
|
-
class="pf-c-title pf-m-lg pf-u-font-weight-light"
|
|
6901
|
-
>Title of card</h3>
|
|
6893
|
+
<h3 class="pf-c-title pf-m-lg">Title of card</h3>
|
|
6902
6894
|
</div>
|
|
6903
6895
|
</div>
|
|
6904
6896
|
</div>
|
|
@@ -25,7 +25,9 @@ wrapperTag: div
|
|
|
25
25
|
</button>
|
|
26
26
|
<h1 class="pf-c-title pf-m-3xl pf-c-wizard__title">Wizard title</h1>
|
|
27
27
|
|
|
28
|
-
<
|
|
28
|
+
<div
|
|
29
|
+
class="pf-c-wizard__description"
|
|
30
|
+
>Here is where the description goes</div>
|
|
29
31
|
</div>
|
|
30
32
|
<button
|
|
31
33
|
aria-label="Wizard Header Toggle"
|
|
@@ -268,7 +270,9 @@ wrapperTag: div
|
|
|
268
270
|
</button>
|
|
269
271
|
<h1 class="pf-c-title pf-m-3xl pf-c-wizard__title">Wizard title</h1>
|
|
270
272
|
|
|
271
|
-
<
|
|
273
|
+
<div
|
|
274
|
+
class="pf-c-wizard__description"
|
|
275
|
+
>Here is where the description goes</div>
|
|
272
276
|
</div>
|
|
273
277
|
<button
|
|
274
278
|
aria-label="Wizard Header Toggle"
|
package/package.json
CHANGED
package/patternfly-no-reset.css
CHANGED
|
@@ -17147,34 +17147,32 @@ ul.pf-c-list {
|
|
|
17147
17147
|
--pf-c-menu-toggle__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain__toggle-icon--Color);
|
|
17148
17148
|
}
|
|
17149
17149
|
.pf-c-menu-toggle.pf-m-plain:not(.pf-m-text) {
|
|
17150
|
-
--pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-plain--Color);
|
|
17151
|
-
--pf-c-menu-toggle--hover--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
|
|
17152
|
-
--pf-c-menu-toggle--focus--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
|
|
17153
|
-
--pf-c-menu-toggle--active--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
|
|
17154
|
-
--pf-c-menu-toggle--disabled--Color: var(--pf-c-menu-toggle--m-plain--disabled--Color);
|
|
17155
17150
|
--pf-c-menu-toggle--PaddingRight: var(--pf-c-menu-toggle--m-plain--PaddingRight);
|
|
17156
17151
|
--pf-c-menu-toggle--PaddingLeft: var(--pf-c-menu-toggle--m-plain--PaddingLeft);
|
|
17157
17152
|
--pf-c-menu-toggle--disabled--BackgroundColor: transparent;
|
|
17158
|
-
--pf-c-menu-toggle--m-expanded--Color: var(--pf-c-menu-toggle--m-plain--m-expanded--Color);
|
|
17159
17153
|
display: inline-block;
|
|
17154
|
+
color: var(--pf-c-menu-toggle--m-plain--Color);
|
|
17160
17155
|
}
|
|
17161
17156
|
.pf-c-menu-toggle:hover {
|
|
17162
17157
|
--pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--hover--BackgroundColor);
|
|
17163
17158
|
--pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--hover--after--BorderBottomWidth);
|
|
17164
17159
|
--pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--hover--after--BorderBottomColor);
|
|
17165
17160
|
--pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--hover__toggle-icon--Color);
|
|
17161
|
+
--pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
|
|
17166
17162
|
}
|
|
17167
17163
|
.pf-c-menu-toggle:focus {
|
|
17168
17164
|
--pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--focus--BackgroundColor);
|
|
17169
17165
|
--pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--focus--after--BorderBottomWidth);
|
|
17170
17166
|
--pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--focus--after--BorderBottomColor);
|
|
17171
17167
|
--pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--focus__toggle-icon--Color);
|
|
17168
|
+
--pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--focus--Color);
|
|
17172
17169
|
}
|
|
17173
17170
|
.pf-c-menu-toggle:active {
|
|
17174
17171
|
--pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--active--BackgroundColor);
|
|
17175
17172
|
--pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--active--after--BorderBottomWidth);
|
|
17176
17173
|
--pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--active--after--BorderBottomColor);
|
|
17177
17174
|
--pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--active__toggle-icon--Color);
|
|
17175
|
+
--pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--active--Color);
|
|
17178
17176
|
}
|
|
17179
17177
|
.pf-c-menu-toggle.pf-m-expanded {
|
|
17180
17178
|
--pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-expanded--Color);
|
|
@@ -17182,10 +17180,12 @@ ul.pf-c-list {
|
|
|
17182
17180
|
--pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-expanded--after--BorderBottomWidth);
|
|
17183
17181
|
--pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--m-expanded--after--BorderBottomColor);
|
|
17184
17182
|
--pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--m-expanded__toggle-icon--Color);
|
|
17183
|
+
--pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--m-expanded--Color);
|
|
17185
17184
|
}
|
|
17186
17185
|
.pf-c-menu-toggle:disabled {
|
|
17187
17186
|
--pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--disabled--Color);
|
|
17188
17187
|
--pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--disabled--BackgroundColor);
|
|
17188
|
+
--pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--disabled--Color);
|
|
17189
17189
|
pointer-events: none;
|
|
17190
17190
|
}
|
|
17191
17191
|
.pf-c-menu-toggle.pf-m-primary::before, .pf-c-menu-toggle.pf-m-primary::after, .pf-c-menu-toggle.pf-m-plain::before, .pf-c-menu-toggle.pf-m-plain::after, .pf-c-menu-toggle:disabled::before, .pf-c-menu-toggle:disabled::after {
|
package/patternfly.css
CHANGED
|
@@ -17269,34 +17269,32 @@ ul.pf-c-list {
|
|
|
17269
17269
|
--pf-c-menu-toggle__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain__toggle-icon--Color);
|
|
17270
17270
|
}
|
|
17271
17271
|
.pf-c-menu-toggle.pf-m-plain:not(.pf-m-text) {
|
|
17272
|
-
--pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-plain--Color);
|
|
17273
|
-
--pf-c-menu-toggle--hover--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
|
|
17274
|
-
--pf-c-menu-toggle--focus--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
|
|
17275
|
-
--pf-c-menu-toggle--active--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
|
|
17276
|
-
--pf-c-menu-toggle--disabled--Color: var(--pf-c-menu-toggle--m-plain--disabled--Color);
|
|
17277
17272
|
--pf-c-menu-toggle--PaddingRight: var(--pf-c-menu-toggle--m-plain--PaddingRight);
|
|
17278
17273
|
--pf-c-menu-toggle--PaddingLeft: var(--pf-c-menu-toggle--m-plain--PaddingLeft);
|
|
17279
17274
|
--pf-c-menu-toggle--disabled--BackgroundColor: transparent;
|
|
17280
|
-
--pf-c-menu-toggle--m-expanded--Color: var(--pf-c-menu-toggle--m-plain--m-expanded--Color);
|
|
17281
17275
|
display: inline-block;
|
|
17276
|
+
color: var(--pf-c-menu-toggle--m-plain--Color);
|
|
17282
17277
|
}
|
|
17283
17278
|
.pf-c-menu-toggle:hover {
|
|
17284
17279
|
--pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--hover--BackgroundColor);
|
|
17285
17280
|
--pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--hover--after--BorderBottomWidth);
|
|
17286
17281
|
--pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--hover--after--BorderBottomColor);
|
|
17287
17282
|
--pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--hover__toggle-icon--Color);
|
|
17283
|
+
--pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
|
|
17288
17284
|
}
|
|
17289
17285
|
.pf-c-menu-toggle:focus {
|
|
17290
17286
|
--pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--focus--BackgroundColor);
|
|
17291
17287
|
--pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--focus--after--BorderBottomWidth);
|
|
17292
17288
|
--pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--focus--after--BorderBottomColor);
|
|
17293
17289
|
--pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--focus__toggle-icon--Color);
|
|
17290
|
+
--pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--focus--Color);
|
|
17294
17291
|
}
|
|
17295
17292
|
.pf-c-menu-toggle:active {
|
|
17296
17293
|
--pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--active--BackgroundColor);
|
|
17297
17294
|
--pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--active--after--BorderBottomWidth);
|
|
17298
17295
|
--pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--active--after--BorderBottomColor);
|
|
17299
17296
|
--pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--active__toggle-icon--Color);
|
|
17297
|
+
--pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--active--Color);
|
|
17300
17298
|
}
|
|
17301
17299
|
.pf-c-menu-toggle.pf-m-expanded {
|
|
17302
17300
|
--pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-expanded--Color);
|
|
@@ -17304,10 +17302,12 @@ ul.pf-c-list {
|
|
|
17304
17302
|
--pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-expanded--after--BorderBottomWidth);
|
|
17305
17303
|
--pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--m-expanded--after--BorderBottomColor);
|
|
17306
17304
|
--pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--m-expanded__toggle-icon--Color);
|
|
17305
|
+
--pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--m-expanded--Color);
|
|
17307
17306
|
}
|
|
17308
17307
|
.pf-c-menu-toggle:disabled {
|
|
17309
17308
|
--pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--disabled--Color);
|
|
17310
17309
|
--pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--disabled--BackgroundColor);
|
|
17310
|
+
--pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--disabled--Color);
|
|
17311
17311
|
pointer-events: none;
|
|
17312
17312
|
}
|
|
17313
17313
|
.pf-c-menu-toggle.pf-m-primary::before, .pf-c-menu-toggle.pf-m-primary::after, .pf-c-menu-toggle.pf-m-plain::before, .pf-c-menu-toggle.pf-m-plain::after, .pf-c-menu-toggle:disabled::before, .pf-c-menu-toggle:disabled::after {
|