@patternfly/patternfly 4.222.3 → 5.0.0-alpha.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/README.md +2 -2
- package/RELEASE-NOTES.md +0 -11
- package/base/_fonts.scss +0 -188
- package/base/_globals.scss +0 -6
- package/base/_icons.scss +28 -0
- package/base/_variables.scss +0 -14
- package/base/patternfly-fonts.css +0 -120
- package/base/patternfly-globals.css +0 -4
- package/base/patternfly-icons.scss +0 -28
- package/base/patternfly-variables.css +6 -19
- package/components/AboutModalBox/about-modal-box.css +1 -28
- package/components/AboutModalBox/about-modal-box.scss +1 -27
- package/components/Accordion/accordion.css +64 -62
- package/components/Accordion/accordion.scss +62 -64
- package/components/Alert/alert.css +0 -4
- package/components/Alert/alert.scss +0 -7
- package/components/Banner/banner.css +1 -1
- package/components/Banner/banner.scss +1 -1
- package/components/Breadcrumb/breadcrumb.css +0 -6
- package/components/Breadcrumb/breadcrumb.scss +0 -9
- package/components/Button/button.css +0 -4
- package/components/Button/button.scss +0 -7
- package/components/Card/card.css +0 -4
- package/components/Card/card.scss +0 -7
- package/components/Check/check.css +4 -2
- package/components/Check/check.scss +2 -2
- package/components/Content/content.css +1 -11
- package/components/Content/content.scss +1 -15
- package/components/DataList/data-list.css +0 -15
- package/components/Divider/divider.css +0 -16
- package/components/Divider/divider.scss +0 -1
- package/components/Drawer/drawer.css +0 -14
- package/components/Drawer/drawer.scss +0 -5
- package/components/Dropdown/dropdown.css +0 -15
- package/components/Dropdown/dropdown.scss +0 -20
- package/components/EmptyState/empty-state.css +0 -4
- package/components/EmptyState/empty-state.scss +0 -9
- package/components/ExpandableSection/expandable-section.css +0 -4
- package/components/ExpandableSection/expandable-section.scss +0 -7
- package/components/Form/form.css +0 -1
- package/components/Form/form.scss +0 -1
- package/components/FormControl/form-control.css +1 -1
- package/components/FormControl/themes/dark/form-control.scss +1 -1
- package/components/InlineEdit/inline-edit.css +1 -12
- package/components/InlineEdit/inline-edit.scss +1 -10
- package/components/InputGroup/input-group.css +0 -14
- package/components/InputGroup/input-group.scss +0 -9
- package/components/InputGroup/themes/dark/input-group.scss +0 -8
- package/components/JumpLinks/jump-links.css +0 -43
- package/components/JumpLinks/jump-links.scss +0 -13
- package/components/Label/label.css +0 -3
- package/components/Label/label.scss +0 -4
- package/components/Menu/menu.css +0 -20
- package/components/Menu/menu.scss +0 -6
- package/components/NotificationDrawer/notification-drawer.css +1 -0
- package/components/NotificationDrawer/notification-drawer.scss +1 -0
- package/components/Page/page.css +0 -15
- package/components/Pagination/pagination.css +0 -175
- package/components/Pagination/pagination.scss +1 -49
- package/components/Progress/progress.css +0 -1
- package/components/Progress/progress.scss +0 -1
- package/components/Radio/radio.css +4 -2
- package/components/Radio/radio.scss +2 -2
- package/components/SimpleList/simple-list.css +1 -1
- package/components/SimpleList/simple-list.scss +1 -1
- package/components/SkipToContent/skip-to-content.css +1 -1
- package/components/SkipToContent/skip-to-content.scss +1 -1
- package/components/Slider/slider.css +7 -0
- package/components/Slider/slider.scss +9 -0
- package/components/Switch/switch.css +0 -1
- package/components/Switch/switch.scss +0 -1
- package/components/Table/table-grid.css +0 -10
- package/components/Table/table-grid.scss +0 -2
- package/components/Table/table-tree-view.css +0 -16
- package/components/Table/table-tree-view.scss +0 -4
- package/components/Table/table.css +0 -16
- package/components/Table/table.scss +0 -1
- package/components/Tabs/tabs.css +1 -34
- package/components/Tabs/tabs.scss +0 -15
- package/components/Title/title.css +0 -5
- package/components/Title/title.scss +0 -8
- package/components/Toolbar/toolbar.css +0 -31
- package/components/Toolbar/toolbar.scss +0 -6
- package/components/Wizard/wizard.css +0 -9
- package/components/Wizard/wizard.scss +0 -9
- package/docs/components/AboutModalBox/examples/AboutModalBox.md +4 -15
- package/docs/components/Accordion/examples/Accordion.md +67 -67
- package/docs/components/Dropdown/examples/Dropdown.md +0 -216
- package/docs/components/InputGroup/examples/InputGroup.md +0 -1
- package/docs/components/Pagination/examples/Pagination.md +30 -129
- package/docs/components/SkipToContent/examples/SkipToContent.md +3 -5
- package/docs/components/Slider/examples/Slider.md +6 -6
- package/docs/components/Tabs/examples/Tabs.md +1 -2
- package/docs/components/Wizard/examples/Wizard.md +6 -6
- package/docs/demos/AboutModal/examples/AboutModal.md +53 -49
- package/docs/demos/Alert/examples/Alert.md +18 -12
- package/docs/demos/BackToTop/examples/BackToTop.md +6 -4
- package/docs/demos/Banner/examples/Banner.md +14 -10
- package/docs/demos/Card/examples/Card.md +4 -4
- package/docs/demos/CardView/examples/CardView.md +6 -4
- package/docs/demos/ContextSelector/examples/ContextSelector.md +24 -16
- package/docs/demos/Dashboard/examples/Dashboard.md +7 -4
- package/docs/demos/DataList/examples/DataList.md +24 -16
- package/docs/demos/DescriptionList/examples/DescriptionList.md +18 -12
- package/docs/demos/Drawer/examples/Drawer.md +30 -20
- package/docs/demos/JumpLinks/examples/JumpLinks.md +36 -24
- package/docs/demos/Masthead/examples/Masthead.md +54 -36
- package/docs/demos/Modal/examples/Modal.md +36 -24
- package/docs/demos/Nav/examples/Nav.md +784 -721
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +30 -20
- package/docs/demos/Page/examples/Page.md +54 -36
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +44 -28
- package/docs/demos/Skeleton/examples/Skeleton.md +6 -4
- package/docs/demos/Table/examples/Table.md +84 -56
- package/docs/demos/Tabs/examples/Tabs.md +579 -70
- package/docs/demos/Toolbar/examples/Toolbar.md +6 -4
- package/docs/demos/Wizard/examples/Wizard.md +67 -45
- package/package.json +7 -6
- package/patternfly-base-no-reset.css +30 -139
- package/patternfly-base.css +30 -143
- package/patternfly-charts.css +1 -1
- package/patternfly-no-reset.css +118 -665
- package/patternfly.css +118 -669
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
- package/sass-utilities/mixins.scss +0 -6
- package/sass-utilities/placeholders.scss +0 -7
- package/sass-utilities/scss-variables.scss +6 -12
- package/assets/fonts/overpass-mono-webfont/example.html +0 -15
- package/assets/fonts/overpass-mono-webfont/overpass-mono-bold.woff +0 -0
- package/assets/fonts/overpass-mono-webfont/overpass-mono-bold.woff2 +0 -0
- package/assets/fonts/overpass-mono-webfont/overpass-mono-light.woff +0 -0
- package/assets/fonts/overpass-mono-webfont/overpass-mono-light.woff2 +0 -0
- package/assets/fonts/overpass-mono-webfont/overpass-mono-regular.woff +0 -0
- package/assets/fonts/overpass-mono-webfont/overpass-mono-regular.woff2 +0 -0
- package/assets/fonts/overpass-mono-webfont/overpass-mono-semibold.woff +0 -0
- package/assets/fonts/overpass-mono-webfont/overpass-mono-semibold.woff2 +0 -0
- package/assets/fonts/overpass-mono-webfont/overpass-mono.css +0 -39
- package/assets/fonts/overpass-webfont/example.html +0 -18
- package/assets/fonts/overpass-webfont/overpass-bold-italic.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-bold-italic.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-bold.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-bold.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-extrabold-italic.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-extrabold-italic.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-extrabold.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-extrabold.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-extralight-italic.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-extralight-italic.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-extralight.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-extralight.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-heavy-italic.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-heavy-italic.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-heavy.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-heavy.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-italic.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-italic.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-light-italic.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-light-italic.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-light.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-light.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-regular.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-regular.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-semibold-italic.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-semibold-italic.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-semibold.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-semibold.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-thin-italic.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-thin-italic.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass-thin.woff +0 -0
- package/assets/fonts/overpass-webfont/overpass-thin.woff2 +0 -0
- package/assets/fonts/overpass-webfont/overpass.css +0 -141
|
@@ -7,10 +7,12 @@ section: components
|
|
|
7
7
|
|
|
8
8
|
```html isFullscreen
|
|
9
9
|
<div class="pf-c-page" id="context-selector-in-masthead">
|
|
10
|
-
<
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
10
|
+
<div class="pf-c-skip-to-content">
|
|
11
|
+
<a
|
|
12
|
+
class="pf-c-button pf-m-primary"
|
|
13
|
+
href="#main-content-context-selector-in-masthead"
|
|
14
|
+
>Skip to content</a>
|
|
15
|
+
</div>
|
|
14
16
|
<header class="pf-c-masthead" id="context-selector-in-masthead-masthead">
|
|
15
17
|
<span class="pf-c-masthead__toggle">
|
|
16
18
|
<button
|
|
@@ -305,10 +307,12 @@ section: components
|
|
|
305
307
|
|
|
306
308
|
```html isFullscreen
|
|
307
309
|
<div class="pf-c-page" id="context-selector-in-sidebar-example">
|
|
308
|
-
<
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
310
|
+
<div class="pf-c-skip-to-content">
|
|
311
|
+
<a
|
|
312
|
+
class="pf-c-button pf-m-primary"
|
|
313
|
+
href="#main-content-context-selector-in-sidebar-example"
|
|
314
|
+
>Skip to content</a>
|
|
315
|
+
</div>
|
|
312
316
|
<header
|
|
313
317
|
class="pf-c-masthead"
|
|
314
318
|
id="context-selector-in-sidebar-example-masthead"
|
|
@@ -1343,10 +1347,12 @@ section: components
|
|
|
1343
1347
|
|
|
1344
1348
|
```html isFullscreen
|
|
1345
1349
|
<div class="pf-c-page" id="context-selector-in-sidebar-expanded-example">
|
|
1346
|
-
<
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
+
<div class="pf-c-skip-to-content">
|
|
1351
|
+
<a
|
|
1352
|
+
class="pf-c-button pf-m-primary"
|
|
1353
|
+
href="#main-content-context-selector-in-sidebar-expanded-example"
|
|
1354
|
+
>Skip to content</a>
|
|
1355
|
+
</div>
|
|
1350
1356
|
<header
|
|
1351
1357
|
class="pf-c-masthead"
|
|
1352
1358
|
id="context-selector-in-sidebar-expanded-example-masthead"
|
|
@@ -2383,10 +2389,12 @@ section: components
|
|
|
2383
2389
|
|
|
2384
2390
|
```html isFullscreen
|
|
2385
2391
|
<div class="pf-c-page" id="context-selector-in-page-content-example">
|
|
2386
|
-
<
|
|
2387
|
-
|
|
2388
|
-
|
|
2389
|
-
|
|
2392
|
+
<div class="pf-c-skip-to-content">
|
|
2393
|
+
<a
|
|
2394
|
+
class="pf-c-button pf-m-primary"
|
|
2395
|
+
href="#main-content-context-selector-in-page-content-example"
|
|
2396
|
+
>Skip to content</a>
|
|
2397
|
+
</div>
|
|
2390
2398
|
<header
|
|
2391
2399
|
class="pf-c-masthead"
|
|
2392
2400
|
id="context-selector-in-page-content-example-masthead"
|
|
@@ -9,10 +9,12 @@ cssPrefix: pf-d-dashboard
|
|
|
9
9
|
|
|
10
10
|
```html isFullscreen
|
|
11
11
|
<div class="pf-c-page" id="dashboard-demo">
|
|
12
|
-
<
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
<div class="pf-c-skip-to-content">
|
|
13
|
+
<a
|
|
14
|
+
class="pf-c-button pf-m-primary"
|
|
15
|
+
href="#main-content-dashboard-demo"
|
|
16
|
+
>Skip to content</a>
|
|
17
|
+
</div>
|
|
16
18
|
<header class="pf-c-masthead" id="dashboard-demo-masthead">
|
|
17
19
|
<span class="pf-c-masthead__toggle">
|
|
18
20
|
<button
|
|
@@ -867,6 +869,7 @@ cssPrefix: pf-d-dashboard
|
|
|
867
869
|
</div>
|
|
868
870
|
</div>
|
|
869
871
|
</section>
|
|
872
|
+
|
|
870
873
|
<section class="pf-c-page__main-section pf-m-limit-width">
|
|
871
874
|
<div class="pf-c-page__main-body">
|
|
872
875
|
<div class="pf-l-grid pf-m-gutter">
|
|
@@ -8,10 +8,12 @@ wrapperTag: div
|
|
|
8
8
|
|
|
9
9
|
```html isFullscreen
|
|
10
10
|
<div class="pf-c-page" id="data-list-basic-example">
|
|
11
|
-
<
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
11
|
+
<div class="pf-c-skip-to-content">
|
|
12
|
+
<a
|
|
13
|
+
class="pf-c-button pf-m-primary"
|
|
14
|
+
href="#main-content-data-list-basic-example"
|
|
15
|
+
>Skip to content</a>
|
|
16
|
+
</div>
|
|
15
17
|
<header class="pf-c-masthead" id="data-list-basic-example-masthead">
|
|
16
18
|
<span class="pf-c-masthead__toggle">
|
|
17
19
|
<button
|
|
@@ -1521,10 +1523,12 @@ wrapperTag: div
|
|
|
1521
1523
|
|
|
1522
1524
|
```html isFullscreen
|
|
1523
1525
|
<div class="pf-c-page" id="data-list-actionable-example">
|
|
1524
|
-
<
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1526
|
+
<div class="pf-c-skip-to-content">
|
|
1527
|
+
<a
|
|
1528
|
+
class="pf-c-button pf-m-primary"
|
|
1529
|
+
href="#main-content-data-list-actionable-example"
|
|
1530
|
+
>Skip to content</a>
|
|
1531
|
+
</div>
|
|
1528
1532
|
<header class="pf-c-masthead" id="data-list-actionable-example-masthead">
|
|
1529
1533
|
<span class="pf-c-masthead__toggle">
|
|
1530
1534
|
<button
|
|
@@ -3012,10 +3016,12 @@ wrapperTag: div
|
|
|
3012
3016
|
|
|
3013
3017
|
```html isFullscreen
|
|
3014
3018
|
<div class="pf-c-page" id="data-list-expandable-example">
|
|
3015
|
-
<
|
|
3016
|
-
|
|
3017
|
-
|
|
3018
|
-
|
|
3019
|
+
<div class="pf-c-skip-to-content">
|
|
3020
|
+
<a
|
|
3021
|
+
class="pf-c-button pf-m-primary"
|
|
3022
|
+
href="#main-content-data-list-expandable-example"
|
|
3023
|
+
>Skip to content</a>
|
|
3024
|
+
</div>
|
|
3019
3025
|
<header class="pf-c-masthead" id="data-list-expandable-example-masthead">
|
|
3020
3026
|
<span class="pf-c-masthead__toggle">
|
|
3021
3027
|
<button
|
|
@@ -5112,10 +5118,12 @@ wrapperTag: div
|
|
|
5112
5118
|
|
|
5113
5119
|
```html isFullscreen
|
|
5114
5120
|
<div class="pf-c-page" id="data-list-static-bottom-example">
|
|
5115
|
-
<
|
|
5116
|
-
|
|
5117
|
-
|
|
5118
|
-
|
|
5121
|
+
<div class="pf-c-skip-to-content">
|
|
5122
|
+
<a
|
|
5123
|
+
class="pf-c-button pf-m-primary"
|
|
5124
|
+
href="#main-content-data-list-static-bottom-example"
|
|
5125
|
+
>Skip to content</a>
|
|
5126
|
+
</div>
|
|
5119
5127
|
<header class="pf-c-masthead" id="data-list-static-bottom-example-masthead">
|
|
5120
5128
|
<span class="pf-c-masthead__toggle">
|
|
5121
5129
|
<button
|
|
@@ -9,10 +9,12 @@ cssPrefix: pf-d-description-list
|
|
|
9
9
|
|
|
10
10
|
```html isFullscreen
|
|
11
11
|
<div class="pf-c-page" id="description-list-basic-example">
|
|
12
|
-
<
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
<div class="pf-c-skip-to-content">
|
|
13
|
+
<a
|
|
14
|
+
class="pf-c-button pf-m-primary"
|
|
15
|
+
href="#main-content-description-list-basic-example"
|
|
16
|
+
>Skip to content</a>
|
|
17
|
+
</div>
|
|
16
18
|
<header class="pf-c-masthead" id="description-list-basic-example-masthead">
|
|
17
19
|
<span class="pf-c-masthead__toggle">
|
|
18
20
|
<button
|
|
@@ -978,10 +980,12 @@ cssPrefix: pf-d-description-list
|
|
|
978
980
|
|
|
979
981
|
```html isFullscreen
|
|
980
982
|
<div class="pf-c-page" id="description-list-in-drawer-example">
|
|
981
|
-
<
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
983
|
+
<div class="pf-c-skip-to-content">
|
|
984
|
+
<a
|
|
985
|
+
class="pf-c-button pf-m-primary"
|
|
986
|
+
href="#main-content-description-list-in-drawer-example"
|
|
987
|
+
>Skip to content</a>
|
|
988
|
+
</div>
|
|
985
989
|
<header
|
|
986
990
|
class="pf-c-masthead"
|
|
987
991
|
id="description-list-in-drawer-example-masthead"
|
|
@@ -2235,10 +2239,12 @@ cssPrefix: pf-d-description-list
|
|
|
2235
2239
|
|
|
2236
2240
|
```html isFullscreen
|
|
2237
2241
|
<div class="pf-c-page" id="description-list-complex-content-example">
|
|
2238
|
-
<
|
|
2239
|
-
|
|
2240
|
-
|
|
2241
|
-
|
|
2242
|
+
<div class="pf-c-skip-to-content">
|
|
2243
|
+
<a
|
|
2244
|
+
class="pf-c-button pf-m-primary"
|
|
2245
|
+
href="#main-content-description-list-complex-content-example"
|
|
2246
|
+
>Skip to content</a>
|
|
2247
|
+
</div>
|
|
2242
2248
|
<header
|
|
2243
2249
|
class="pf-c-masthead"
|
|
2244
2250
|
id="description-list-complex-content-example-masthead"
|
|
@@ -8,10 +8,12 @@ wrapperTag: div
|
|
|
8
8
|
|
|
9
9
|
```html isFullscreen
|
|
10
10
|
<div class="pf-c-page" id="drawer-collapsed-example">
|
|
11
|
-
<
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
11
|
+
<div class="pf-c-skip-to-content">
|
|
12
|
+
<a
|
|
13
|
+
class="pf-c-button pf-m-primary"
|
|
14
|
+
href="#main-content-drawer-collapsed-example"
|
|
15
|
+
>Skip to content</a>
|
|
16
|
+
</div>
|
|
15
17
|
<header class="pf-c-masthead" id="drawer-collapsed-example-masthead">
|
|
16
18
|
<span class="pf-c-masthead__toggle">
|
|
17
19
|
<button
|
|
@@ -1110,10 +1112,12 @@ wrapperTag: div
|
|
|
1110
1112
|
|
|
1111
1113
|
```html isFullscreen
|
|
1112
1114
|
<div class="pf-c-page" id="drawer-expanded-example">
|
|
1113
|
-
<
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
|
|
1115
|
+
<div class="pf-c-skip-to-content">
|
|
1116
|
+
<a
|
|
1117
|
+
class="pf-c-button pf-m-primary"
|
|
1118
|
+
href="#main-content-drawer-expanded-example"
|
|
1119
|
+
>Skip to content</a>
|
|
1120
|
+
</div>
|
|
1117
1121
|
<header class="pf-c-masthead" id="drawer-expanded-example-masthead">
|
|
1118
1122
|
<span class="pf-c-masthead__toggle">
|
|
1119
1123
|
<button
|
|
@@ -2036,10 +2040,12 @@ wrapperTag: div
|
|
|
2036
2040
|
|
|
2037
2041
|
```html isFullscreen
|
|
2038
2042
|
<div class="pf-c-page" id="drawer-expanded-bottom-example">
|
|
2039
|
-
<
|
|
2040
|
-
|
|
2041
|
-
|
|
2042
|
-
|
|
2043
|
+
<div class="pf-c-skip-to-content">
|
|
2044
|
+
<a
|
|
2045
|
+
class="pf-c-button pf-m-primary"
|
|
2046
|
+
href="#main-content-drawer-expanded-bottom-example"
|
|
2047
|
+
>Skip to content</a>
|
|
2048
|
+
</div>
|
|
2043
2049
|
<header class="pf-c-masthead" id="drawer-expanded-bottom-example-masthead">
|
|
2044
2050
|
<span class="pf-c-masthead__toggle">
|
|
2045
2051
|
<button
|
|
@@ -2962,10 +2968,12 @@ wrapperTag: div
|
|
|
2962
2968
|
|
|
2963
2969
|
```html isFullscreen
|
|
2964
2970
|
<div class="pf-c-page" id="drawer-jump-links">
|
|
2965
|
-
<
|
|
2966
|
-
|
|
2967
|
-
|
|
2968
|
-
|
|
2971
|
+
<div class="pf-c-skip-to-content">
|
|
2972
|
+
<a
|
|
2973
|
+
class="pf-c-button pf-m-primary"
|
|
2974
|
+
href="#main-content-drawer-jump-links"
|
|
2975
|
+
>Skip to content</a>
|
|
2976
|
+
</div>
|
|
2969
2977
|
<header class="pf-c-masthead" id="drawer-jump-links-masthead">
|
|
2970
2978
|
<span class="pf-c-masthead__toggle">
|
|
2971
2979
|
<button
|
|
@@ -3915,10 +3923,12 @@ wrapperTag: div
|
|
|
3915
3923
|
|
|
3916
3924
|
```html isFullscreen
|
|
3917
3925
|
<div class="pf-c-page" id="drawer-expanded-jump-links">
|
|
3918
|
-
<
|
|
3919
|
-
|
|
3920
|
-
|
|
3921
|
-
|
|
3926
|
+
<div class="pf-c-skip-to-content">
|
|
3927
|
+
<a
|
|
3928
|
+
class="pf-c-button pf-m-primary"
|
|
3929
|
+
href="#main-content-drawer-expanded-jump-links"
|
|
3930
|
+
>Skip to content</a>
|
|
3931
|
+
</div>
|
|
3922
3932
|
<header class="pf-c-masthead" id="drawer-expanded-jump-links-masthead">
|
|
3923
3933
|
<span class="pf-c-masthead__toggle">
|
|
3924
3934
|
<button
|
|
@@ -7,10 +7,12 @@ section: components
|
|
|
7
7
|
|
|
8
8
|
```html isFullscreen
|
|
9
9
|
<div class="pf-c-page" id="jump-links-collapsed-mobile-example">
|
|
10
|
-
<
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
10
|
+
<div class="pf-c-skip-to-content">
|
|
11
|
+
<a
|
|
12
|
+
class="pf-c-button pf-m-primary"
|
|
13
|
+
href="#main-content-jump-links-collapsed-mobile-example"
|
|
14
|
+
>Skip to content</a>
|
|
15
|
+
</div>
|
|
14
16
|
<header
|
|
15
17
|
class="pf-c-masthead"
|
|
16
18
|
id="jump-links-collapsed-mobile-example-masthead"
|
|
@@ -991,10 +993,12 @@ section: components
|
|
|
991
993
|
|
|
992
994
|
```html isFullscreen
|
|
993
995
|
<div class="pf-c-page" id="jump-links-vertical-expanded-mobile-example">
|
|
994
|
-
<
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
996
|
+
<div class="pf-c-skip-to-content">
|
|
997
|
+
<a
|
|
998
|
+
class="pf-c-button pf-m-primary"
|
|
999
|
+
href="#main-content-jump-links-vertical-expanded-mobile-example"
|
|
1000
|
+
>Skip to content</a>
|
|
1001
|
+
</div>
|
|
998
1002
|
<header
|
|
999
1003
|
class="pf-c-masthead"
|
|
1000
1004
|
id="jump-links-vertical-expanded-mobile-example-masthead"
|
|
@@ -1975,10 +1979,12 @@ section: components
|
|
|
1975
1979
|
|
|
1976
1980
|
```html isFullscreen
|
|
1977
1981
|
<div class="pf-c-page" id="jump-links-vertical-toggle-text-mobile-example">
|
|
1978
|
-
<
|
|
1979
|
-
|
|
1980
|
-
|
|
1981
|
-
|
|
1982
|
+
<div class="pf-c-skip-to-content">
|
|
1983
|
+
<a
|
|
1984
|
+
class="pf-c-button pf-m-primary"
|
|
1985
|
+
href="#main-content-jump-links-vertical-toggle-text-mobile-example"
|
|
1986
|
+
>Skip to content</a>
|
|
1987
|
+
</div>
|
|
1982
1988
|
<header
|
|
1983
1989
|
class="pf-c-masthead"
|
|
1984
1990
|
id="jump-links-vertical-toggle-text-mobile-example-masthead"
|
|
@@ -2959,10 +2965,12 @@ section: components
|
|
|
2959
2965
|
|
|
2960
2966
|
```html isFullscreen
|
|
2961
2967
|
<div class="pf-c-page" id="jump-links-horizontal-example">
|
|
2962
|
-
<
|
|
2963
|
-
|
|
2964
|
-
|
|
2965
|
-
|
|
2968
|
+
<div class="pf-c-skip-to-content">
|
|
2969
|
+
<a
|
|
2970
|
+
class="pf-c-button pf-m-primary"
|
|
2971
|
+
href="#main-content-jump-links-horizontal-example"
|
|
2972
|
+
>Skip to content</a>
|
|
2973
|
+
</div>
|
|
2966
2974
|
<header class="pf-c-masthead" id="jump-links-horizontal-example-masthead">
|
|
2967
2975
|
<span class="pf-c-masthead__toggle">
|
|
2968
2976
|
<button
|
|
@@ -3892,10 +3900,12 @@ section: components
|
|
|
3892
3900
|
|
|
3893
3901
|
```html isFullscreen
|
|
3894
3902
|
<div class="pf-c-page" id="jump-links-drawer">
|
|
3895
|
-
<
|
|
3896
|
-
|
|
3897
|
-
|
|
3898
|
-
|
|
3903
|
+
<div class="pf-c-skip-to-content">
|
|
3904
|
+
<a
|
|
3905
|
+
class="pf-c-button pf-m-primary"
|
|
3906
|
+
href="#main-content-jump-links-drawer"
|
|
3907
|
+
>Skip to content</a>
|
|
3908
|
+
</div>
|
|
3899
3909
|
<header class="pf-c-masthead" id="jump-links-drawer-masthead">
|
|
3900
3910
|
<span class="pf-c-masthead__toggle">
|
|
3901
3911
|
<button
|
|
@@ -4845,10 +4855,12 @@ section: components
|
|
|
4845
4855
|
|
|
4846
4856
|
```html isFullscreen
|
|
4847
4857
|
<div class="pf-c-page" id="jump-links-drawer-expanded">
|
|
4848
|
-
<
|
|
4849
|
-
|
|
4850
|
-
|
|
4851
|
-
|
|
4858
|
+
<div class="pf-c-skip-to-content">
|
|
4859
|
+
<a
|
|
4860
|
+
class="pf-c-button pf-m-primary"
|
|
4861
|
+
href="#main-content-jump-links-drawer-expanded"
|
|
4862
|
+
>Skip to content</a>
|
|
4863
|
+
</div>
|
|
4852
4864
|
<header class="pf-c-masthead" id="jump-links-drawer-expanded-masthead">
|
|
4853
4865
|
<span class="pf-c-masthead__toggle">
|
|
4854
4866
|
<button
|
|
@@ -8,10 +8,12 @@ wrapperTag: div
|
|
|
8
8
|
|
|
9
9
|
```html isFullscreen
|
|
10
10
|
<div class="pf-c-page" id="masthead-basic-example">
|
|
11
|
-
<
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
11
|
+
<div class="pf-c-skip-to-content">
|
|
12
|
+
<a
|
|
13
|
+
class="pf-c-button pf-m-primary"
|
|
14
|
+
href="#main-content-masthead-basic-example"
|
|
15
|
+
>Skip to content</a>
|
|
16
|
+
</div>
|
|
15
17
|
<header class="pf-c-masthead" id="masthead-basic-example-masthead">
|
|
16
18
|
<span class="pf-c-masthead__toggle">
|
|
17
19
|
<button
|
|
@@ -229,10 +231,12 @@ wrapperTag: div
|
|
|
229
231
|
|
|
230
232
|
```html isFullscreen
|
|
231
233
|
<div class="pf-c-page" id="masthead-context-selecton-drilldown-example">
|
|
232
|
-
<
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
234
|
+
<div class="pf-c-skip-to-content">
|
|
235
|
+
<a
|
|
236
|
+
class="pf-c-button pf-m-primary"
|
|
237
|
+
href="#main-content-masthead-context-selecton-drilldown-example"
|
|
238
|
+
>Skip to content</a>
|
|
239
|
+
</div>
|
|
236
240
|
<header
|
|
237
241
|
class="pf-c-masthead"
|
|
238
242
|
id="masthead-context-selecton-drilldown-example-masthead"
|
|
@@ -631,10 +635,12 @@ wrapperTag: div
|
|
|
631
635
|
|
|
632
636
|
```html isFullscreen
|
|
633
637
|
<div class="pf-c-page" id="masthead-toolbar-filters-example">
|
|
634
|
-
<
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
+
<div class="pf-c-skip-to-content">
|
|
639
|
+
<a
|
|
640
|
+
class="pf-c-button pf-m-primary"
|
|
641
|
+
href="#main-content-masthead-toolbar-filters-example"
|
|
642
|
+
>Skip to content</a>
|
|
643
|
+
</div>
|
|
638
644
|
<header class="pf-c-masthead" id="masthead-toolbar-filters-example-masthead">
|
|
639
645
|
<span class="pf-c-masthead__toggle">
|
|
640
646
|
<button
|
|
@@ -961,10 +967,12 @@ wrapperTag: div
|
|
|
961
967
|
|
|
962
968
|
```html isFullscreen
|
|
963
969
|
<div class="pf-c-page" id="masthead-toggle-group-filters-example">
|
|
964
|
-
<
|
|
965
|
-
|
|
966
|
-
|
|
967
|
-
|
|
970
|
+
<div class="pf-c-skip-to-content">
|
|
971
|
+
<a
|
|
972
|
+
class="pf-c-button pf-m-primary"
|
|
973
|
+
href="#main-content-masthead-toggle-group-filters-example"
|
|
974
|
+
>Skip to content</a>
|
|
975
|
+
</div>
|
|
968
976
|
<header
|
|
969
977
|
class="pf-c-masthead"
|
|
970
978
|
id="masthead-toggle-group-filters-example-masthead"
|
|
@@ -1294,10 +1302,12 @@ wrapperTag: div
|
|
|
1294
1302
|
|
|
1295
1303
|
```html isFullscreen
|
|
1296
1304
|
<div class="pf-c-page" id="masthead-expandable-search-example">
|
|
1297
|
-
<
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1305
|
+
<div class="pf-c-skip-to-content">
|
|
1306
|
+
<a
|
|
1307
|
+
class="pf-c-button pf-m-primary"
|
|
1308
|
+
href="#main-content-masthead-expandable-search-example"
|
|
1309
|
+
>Skip to content</a>
|
|
1310
|
+
</div>
|
|
1301
1311
|
<header
|
|
1302
1312
|
class="pf-c-masthead"
|
|
1303
1313
|
id="masthead-expandable-search-example-masthead"
|
|
@@ -1479,10 +1489,12 @@ wrapperTag: div
|
|
|
1479
1489
|
|
|
1480
1490
|
```html isFullscreen
|
|
1481
1491
|
<div class="pf-c-page" id="masthead-expandable-search-expanded-example">
|
|
1482
|
-
<
|
|
1483
|
-
|
|
1484
|
-
|
|
1485
|
-
|
|
1492
|
+
<div class="pf-c-skip-to-content">
|
|
1493
|
+
<a
|
|
1494
|
+
class="pf-c-button pf-m-primary"
|
|
1495
|
+
href="#main-content-masthead-expandable-search-expanded-example"
|
|
1496
|
+
>Skip to content</a>
|
|
1497
|
+
</div>
|
|
1486
1498
|
<header
|
|
1487
1499
|
class="pf-c-masthead"
|
|
1488
1500
|
id="masthead-expandable-search-expanded-example-masthead"
|
|
@@ -1680,10 +1692,12 @@ wrapperTag: div
|
|
|
1680
1692
|
|
|
1681
1693
|
```html isFullscreen
|
|
1682
1694
|
<div class="pf-c-page" id="masthead-advanced-with-menu-example">
|
|
1683
|
-
<
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
|
|
1695
|
+
<div class="pf-c-skip-to-content">
|
|
1696
|
+
<a
|
|
1697
|
+
class="pf-c-button pf-m-primary"
|
|
1698
|
+
href="#main-content-masthead-advanced-with-menu-example"
|
|
1699
|
+
>Skip to content</a>
|
|
1700
|
+
</div>
|
|
1687
1701
|
<header
|
|
1688
1702
|
class="pf-c-masthead"
|
|
1689
1703
|
id="masthead-advanced-with-menu-example-masthead"
|
|
@@ -2594,10 +2608,12 @@ wrapperTag: div
|
|
|
2594
2608
|
|
|
2595
2609
|
```html isFullscreen
|
|
2596
2610
|
<div class="pf-c-page" id="masthead-horizontal-nav">
|
|
2597
|
-
<
|
|
2598
|
-
|
|
2599
|
-
|
|
2600
|
-
|
|
2611
|
+
<div class="pf-c-skip-to-content">
|
|
2612
|
+
<a
|
|
2613
|
+
class="pf-c-button pf-m-primary"
|
|
2614
|
+
href="#main-content-masthead-horizontal-nav"
|
|
2615
|
+
>Skip to content</a>
|
|
2616
|
+
</div>
|
|
2601
2617
|
<header class="pf-c-masthead" id="masthead-horizontal-nav-masthead">
|
|
2602
2618
|
<div class="pf-c-masthead__main">
|
|
2603
2619
|
<a class="pf-c-masthead__brand" href="#">
|
|
@@ -3515,10 +3531,12 @@ wrapperTag: div
|
|
|
3515
3531
|
class="pf-c-page"
|
|
3516
3532
|
id="masthead-toggle-group-filters-expanded-mobile-example"
|
|
3517
3533
|
>
|
|
3518
|
-
<
|
|
3519
|
-
|
|
3520
|
-
|
|
3521
|
-
|
|
3534
|
+
<div class="pf-c-skip-to-content">
|
|
3535
|
+
<a
|
|
3536
|
+
class="pf-c-button pf-m-primary"
|
|
3537
|
+
href="#main-content-masthead-toggle-group-filters-expanded-mobile-example"
|
|
3538
|
+
>Skip to content</a>
|
|
3539
|
+
</div>
|
|
3522
3540
|
<header
|
|
3523
3541
|
class="pf-c-masthead"
|
|
3524
3542
|
id="masthead-toggle-group-filters-expanded-mobile-example-masthead"
|
|
@@ -7,10 +7,12 @@ section: components
|
|
|
7
7
|
|
|
8
8
|
```html isFullscreen
|
|
9
9
|
<div class="pf-c-page" id="modal-basic-example">
|
|
10
|
-
<
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
10
|
+
<div class="pf-c-skip-to-content">
|
|
11
|
+
<a
|
|
12
|
+
class="pf-c-button pf-m-primary"
|
|
13
|
+
href="#main-content-modal-basic-example"
|
|
14
|
+
>Skip to content</a>
|
|
15
|
+
</div>
|
|
14
16
|
<header class="pf-c-masthead" id="modal-basic-example-masthead">
|
|
15
17
|
<span class="pf-c-masthead__toggle">
|
|
16
18
|
<button
|
|
@@ -954,10 +956,12 @@ section: components
|
|
|
954
956
|
|
|
955
957
|
```html isFullscreen
|
|
956
958
|
<div class="pf-c-page" id="modal-scrollable-content-example">
|
|
957
|
-
<
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
959
|
+
<div class="pf-c-skip-to-content">
|
|
960
|
+
<a
|
|
961
|
+
class="pf-c-button pf-m-primary"
|
|
962
|
+
href="#main-content-modal-scrollable-content-example"
|
|
963
|
+
>Skip to content</a>
|
|
964
|
+
</div>
|
|
961
965
|
<header class="pf-c-masthead" id="modal-scrollable-content-example-masthead">
|
|
962
966
|
<span class="pf-c-masthead__toggle">
|
|
963
967
|
<button
|
|
@@ -1910,10 +1914,12 @@ section: components
|
|
|
1910
1914
|
|
|
1911
1915
|
```html isFullscreen
|
|
1912
1916
|
<div class="pf-c-page" id="modal-medium-example">
|
|
1913
|
-
<
|
|
1914
|
-
|
|
1915
|
-
|
|
1916
|
-
|
|
1917
|
+
<div class="pf-c-skip-to-content">
|
|
1918
|
+
<a
|
|
1919
|
+
class="pf-c-button pf-m-primary"
|
|
1920
|
+
href="#main-content-modal-medium-example"
|
|
1921
|
+
>Skip to content</a>
|
|
1922
|
+
</div>
|
|
1917
1923
|
<header class="pf-c-masthead" id="modal-medium-example-masthead">
|
|
1918
1924
|
<span class="pf-c-masthead__toggle">
|
|
1919
1925
|
<button
|
|
@@ -2856,10 +2862,12 @@ section: components
|
|
|
2856
2862
|
|
|
2857
2863
|
```html isFullscreen
|
|
2858
2864
|
<div class="pf-c-page" id="modal-large-example">
|
|
2859
|
-
<
|
|
2860
|
-
|
|
2861
|
-
|
|
2862
|
-
|
|
2865
|
+
<div class="pf-c-skip-to-content">
|
|
2866
|
+
<a
|
|
2867
|
+
class="pf-c-button pf-m-primary"
|
|
2868
|
+
href="#main-content-modal-large-example"
|
|
2869
|
+
>Skip to content</a>
|
|
2870
|
+
</div>
|
|
2863
2871
|
<header class="pf-c-masthead" id="modal-large-example-masthead">
|
|
2864
2872
|
<span class="pf-c-masthead__toggle">
|
|
2865
2873
|
<button
|
|
@@ -3802,10 +3810,12 @@ section: components
|
|
|
3802
3810
|
|
|
3803
3811
|
```html isFullscreen
|
|
3804
3812
|
<div class="pf-c-page" id="modal-large-example">
|
|
3805
|
-
<
|
|
3806
|
-
|
|
3807
|
-
|
|
3808
|
-
|
|
3813
|
+
<div class="pf-c-skip-to-content">
|
|
3814
|
+
<a
|
|
3815
|
+
class="pf-c-button pf-m-primary"
|
|
3816
|
+
href="#main-content-modal-large-example"
|
|
3817
|
+
>Skip to content</a>
|
|
3818
|
+
</div>
|
|
3809
3819
|
<header class="pf-c-masthead" id="modal-large-example-masthead">
|
|
3810
3820
|
<span class="pf-c-masthead__toggle">
|
|
3811
3821
|
<button
|
|
@@ -4748,10 +4758,12 @@ section: components
|
|
|
4748
4758
|
|
|
4749
4759
|
```html isFullscreen
|
|
4750
4760
|
<div class="pf-c-page" id="modal-with-form-example">
|
|
4751
|
-
<
|
|
4752
|
-
|
|
4753
|
-
|
|
4754
|
-
|
|
4761
|
+
<div class="pf-c-skip-to-content">
|
|
4762
|
+
<a
|
|
4763
|
+
class="pf-c-button pf-m-primary"
|
|
4764
|
+
href="#main-content-modal-with-form-example"
|
|
4765
|
+
>Skip to content</a>
|
|
4766
|
+
</div>
|
|
4755
4767
|
<header class="pf-c-masthead" id="modal-with-form-example-masthead">
|
|
4756
4768
|
<span class="pf-c-masthead__toggle">
|
|
4757
4769
|
<button
|