@patternfly/patternfly 6.3.0-prerelease.4 → 6.3.0-prerelease.41
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 +1 -1
- package/assets/images/icon-help.hbs +3 -0
- package/assets/images/icon-outlined-star.hbs +3 -0
- package/assets/images/icon-star.hbs +3 -0
- package/base/patternfly-common.css +46 -11
- package/base/patternfly-common.scss +58 -13
- package/components/Accordion/accordion.css +72 -3
- package/components/Accordion/accordion.scss +78 -6
- package/components/Alert/alert-group.css +52 -31
- package/components/Alert/alert-group.scss +77 -46
- package/components/Button/button.css +154 -6
- package/components/Button/button.scss +160 -8
- package/components/CodeEditor/code-editor.css +3 -0
- package/components/CodeEditor/code-editor.scss +3 -1
- package/components/DataList/data-list.css +2 -2
- package/components/DataList/data-list.scss +2 -2
- package/components/DualListSelector/dual-list-selector.css +36 -0
- package/components/DualListSelector/dual-list-selector.scss +43 -0
- package/components/ExpandableSection/expandable-section.css +63 -1
- package/components/ExpandableSection/expandable-section.scss +76 -2
- package/components/FileUpload/file-upload.css +3 -3
- package/components/FileUpload/file-upload.scss +3 -3
- package/components/Form/form.css +40 -1
- package/components/Form/form.scss +47 -1
- package/components/FormControl/form-control.css +16 -0
- package/components/FormControl/form-control.scss +9 -0
- package/components/InputGroup/input-group.css +80 -0
- package/components/InputGroup/input-group.scss +95 -0
- package/components/Menu/menu.css +24 -4
- package/components/Menu/menu.scss +20 -5
- package/components/MenuToggle/menu-toggle.css +38 -4
- package/components/MenuToggle/menu-toggle.scss +48 -3
- package/components/Nav/nav.css +22 -8
- package/components/Nav/nav.scss +22 -9
- package/components/Page/page.css +66 -6
- package/components/Page/page.scss +48 -5
- package/components/Progress/progress.css +16 -0
- package/components/Progress/progress.scss +11 -1
- package/components/ProgressStepper/progress-stepper.scss +1 -0
- package/components/Skeleton/skeleton.css +22 -2
- package/components/Skeleton/skeleton.scss +25 -3
- package/components/Spinner/spinner.css +5 -0
- package/components/Spinner/spinner.scss +6 -0
- package/components/Table/table-grid.css +51 -5
- package/components/Table/table-grid.scss +22 -1
- package/components/Table/table.css +83 -1
- package/components/Table/table.scss +123 -1
- package/components/Tabs/tabs.css +25 -15
- package/components/Tabs/tabs.scss +26 -13
- package/components/TextInputGroup/text-input-group.css +16 -0
- package/components/TextInputGroup/text-input-group.scss +8 -0
- package/components/Timestamp/timestamp.css +4 -0
- package/components/Timestamp/timestamp.scss +7 -0
- package/components/TreeView/tree-view.css +39 -0
- package/components/TreeView/tree-view.scss +42 -2
- package/components/Truncate/truncate.css +1 -0
- package/components/Truncate/truncate.scss +3 -0
- package/components/_index.css +933 -92
- package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
- package/docs/components/Button/examples/Button.md +161 -6
- package/docs/components/Card/examples/Card.md +8 -8
- package/docs/components/CodeBlock/examples/CodeBlock.md +5 -5
- package/docs/components/CodeEditor/examples/CodeEditor.md +26 -2
- package/docs/components/DataList/examples/DataList.md +23 -23
- package/docs/components/Divider/examples/Divider.md +1 -1
- package/docs/components/Drawer/examples/Drawer.md +4 -0
- package/docs/components/DualListSelector/examples/DualListSelector.md +534 -16
- package/docs/components/ExpandableSection/examples/ExpandableSection.md +17 -12
- package/docs/components/Form/examples/Form.md +1179 -114
- package/docs/components/Hint/examples/Hint.md +3 -3
- package/docs/components/InlineEdit/examples/InlineEdit.md +2 -2
- package/docs/components/InputGroup/examples/InputGroup.md +5 -1
- package/docs/components/JumpLinks/examples/JumpLinks.md +1 -1
- package/docs/components/Masthead/examples/masthead.md +90 -12
- package/docs/components/Menu/examples/Menu.md +122 -6
- package/docs/components/MenuToggle/examples/MenuToggle.md +93 -55
- package/docs/components/ModalBox/examples/ModalBox.md +13 -1
- package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +2 -10
- package/docs/components/OverflowMenu/examples/overflow-menu.md +5 -5
- package/docs/components/Page/examples/Page.md +148 -14
- package/docs/components/Pagination/examples/Pagination.md +12 -12
- package/docs/components/ProgressStepper/examples/ProgressStepper.md +32 -6
- package/docs/components/Slider/examples/Slider.md +2 -2
- package/docs/components/Spinner/examples/Spinner.md +10 -0
- package/docs/components/Table/examples/Table.md +9457 -6178
- package/docs/components/Tabs/examples/Tabs.md +1214 -6729
- package/docs/components/TextInputGroup/examples/TextInputGroup.md +45 -5
- package/docs/components/Toolbar/examples/Toolbar.md +7 -7
- package/docs/demos/AboutModal/examples/AboutModal.md +22 -3
- package/docs/demos/Alert/examples/Alert.md +66 -9
- package/docs/demos/BackToTop/examples/BackToTop.md +22 -3
- package/docs/demos/Banner/examples/Banner.md +47 -6
- package/docs/demos/Card/examples/Card.md +5 -62
- package/docs/demos/CardView/examples/CardView.md +24 -5
- package/docs/demos/Dashboard/examples/Dashboard.md +24 -5
- package/docs/demos/DataList/examples/DataList.md +100 -24
- package/docs/demos/DescriptionList/examples/DescriptionList.md +66 -47
- package/docs/demos/Drawer/examples/Drawer.md +110 -53
- package/docs/demos/Form/examples/BasicForms.md +142 -22
- package/docs/demos/JumpLinks/examples/JumpLinks.md +132 -18
- package/docs/demos/Masthead/examples/Masthead.md +171 -19
- package/docs/demos/Modal/examples/Modal.md +171 -21
- package/docs/demos/Nav/examples/Nav.md +113 -18
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +110 -15
- package/docs/demos/Page/examples/Page.md +661 -40
- package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -1
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +160 -103
- package/docs/demos/Skeleton/examples/Skeleton.md +22 -3
- package/docs/demos/Table/examples/Table.md +516 -178
- package/docs/demos/Tabs/examples/Tabs.md +137 -593
- package/docs/demos/Toolbar/examples/Toolbar.md +72 -34
- package/docs/demos/Wizard/examples/Wizard.md +198 -27
- package/package.json +6 -6
- package/patternfly-base-no-globals.css +45 -11
- package/patternfly-base.css +45 -11
- package/patternfly-no-globals.css +978 -103
- package/patternfly.css +978 -103
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
- package/sass-utilities/mixins.scss +54 -0
|
@@ -19,12 +19,31 @@ section: components
|
|
|
19
19
|
<div class="pf-v6-c-masthead__main">
|
|
20
20
|
<span class="pf-v6-c-masthead__toggle">
|
|
21
21
|
<button
|
|
22
|
-
class="pf-v6-c-button pf-m-plain"
|
|
22
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
23
23
|
type="button"
|
|
24
24
|
aria-label="Global navigation"
|
|
25
25
|
>
|
|
26
26
|
<span class="pf-v6-c-button__icon">
|
|
27
|
-
<
|
|
27
|
+
<svg
|
|
28
|
+
viewBox="0 0 10 10"
|
|
29
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
30
|
+
width="1em"
|
|
31
|
+
height="1em"
|
|
32
|
+
>
|
|
33
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
34
|
+
<path
|
|
35
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
36
|
+
d="M1,5 L9,5"
|
|
37
|
+
/>
|
|
38
|
+
<path
|
|
39
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
40
|
+
d="M1,5 L1,5 L1,5"
|
|
41
|
+
/>
|
|
42
|
+
<path
|
|
43
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
44
|
+
d="M9,9 L1,9"
|
|
45
|
+
/>
|
|
46
|
+
</svg>
|
|
28
47
|
</span>
|
|
29
48
|
</button>
|
|
30
49
|
</span>
|
|
@@ -132,7 +151,7 @@ section: components
|
|
|
132
151
|
</div>
|
|
133
152
|
<div class="pf-v6-c-toolbar__item">
|
|
134
153
|
<button
|
|
135
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
154
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
136
155
|
type="button"
|
|
137
156
|
aria-expanded="false"
|
|
138
157
|
aria-label="Settings"
|
|
@@ -370,12 +389,31 @@ section: components
|
|
|
370
389
|
<div class="pf-v6-c-masthead__main">
|
|
371
390
|
<span class="pf-v6-c-masthead__toggle">
|
|
372
391
|
<button
|
|
373
|
-
class="pf-v6-c-button pf-m-plain"
|
|
392
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
374
393
|
type="button"
|
|
375
394
|
aria-label="Global navigation"
|
|
376
395
|
>
|
|
377
396
|
<span class="pf-v6-c-button__icon">
|
|
378
|
-
<
|
|
397
|
+
<svg
|
|
398
|
+
viewBox="0 0 10 10"
|
|
399
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
400
|
+
width="1em"
|
|
401
|
+
height="1em"
|
|
402
|
+
>
|
|
403
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
404
|
+
<path
|
|
405
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
406
|
+
d="M1,5 L9,5"
|
|
407
|
+
/>
|
|
408
|
+
<path
|
|
409
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
410
|
+
d="M1,5 L1,5 L1,5"
|
|
411
|
+
/>
|
|
412
|
+
<path
|
|
413
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
414
|
+
d="M9,9 L1,9"
|
|
415
|
+
/>
|
|
416
|
+
</svg>
|
|
379
417
|
</span>
|
|
380
418
|
</button>
|
|
381
419
|
</span>
|
|
@@ -483,7 +521,7 @@ section: components
|
|
|
483
521
|
</div>
|
|
484
522
|
<div class="pf-v6-c-toolbar__item">
|
|
485
523
|
<button
|
|
486
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
524
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
487
525
|
type="button"
|
|
488
526
|
aria-expanded="false"
|
|
489
527
|
aria-label="Settings"
|
|
@@ -727,12 +765,31 @@ section: components
|
|
|
727
765
|
<div class="pf-v6-c-masthead__main">
|
|
728
766
|
<span class="pf-v6-c-masthead__toggle">
|
|
729
767
|
<button
|
|
730
|
-
class="pf-v6-c-button pf-m-plain"
|
|
768
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
731
769
|
type="button"
|
|
732
770
|
aria-label="Global navigation"
|
|
733
771
|
>
|
|
734
772
|
<span class="pf-v6-c-button__icon">
|
|
735
|
-
<
|
|
773
|
+
<svg
|
|
774
|
+
viewBox="0 0 10 10"
|
|
775
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
776
|
+
width="1em"
|
|
777
|
+
height="1em"
|
|
778
|
+
>
|
|
779
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
780
|
+
<path
|
|
781
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
782
|
+
d="M1,5 L9,5"
|
|
783
|
+
/>
|
|
784
|
+
<path
|
|
785
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
786
|
+
d="M1,5 L1,5 L1,5"
|
|
787
|
+
/>
|
|
788
|
+
<path
|
|
789
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
790
|
+
d="M9,9 L1,9"
|
|
791
|
+
/>
|
|
792
|
+
</svg>
|
|
736
793
|
</span>
|
|
737
794
|
</button>
|
|
738
795
|
</span>
|
|
@@ -840,7 +897,7 @@ section: components
|
|
|
840
897
|
</div>
|
|
841
898
|
<div class="pf-v6-c-toolbar__item">
|
|
842
899
|
<button
|
|
843
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
900
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
844
901
|
type="button"
|
|
845
902
|
aria-expanded="false"
|
|
846
903
|
aria-label="Settings"
|
|
@@ -1074,12 +1131,31 @@ section: components
|
|
|
1074
1131
|
<div class="pf-v6-c-masthead__main">
|
|
1075
1132
|
<span class="pf-v6-c-masthead__toggle">
|
|
1076
1133
|
<button
|
|
1077
|
-
class="pf-v6-c-button pf-m-plain"
|
|
1134
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
1078
1135
|
type="button"
|
|
1079
1136
|
aria-label="Global navigation"
|
|
1080
1137
|
>
|
|
1081
1138
|
<span class="pf-v6-c-button__icon">
|
|
1082
|
-
<
|
|
1139
|
+
<svg
|
|
1140
|
+
viewBox="0 0 10 10"
|
|
1141
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
1142
|
+
width="1em"
|
|
1143
|
+
height="1em"
|
|
1144
|
+
>
|
|
1145
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
1146
|
+
<path
|
|
1147
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
1148
|
+
d="M1,5 L9,5"
|
|
1149
|
+
/>
|
|
1150
|
+
<path
|
|
1151
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
1152
|
+
d="M1,5 L1,5 L1,5"
|
|
1153
|
+
/>
|
|
1154
|
+
<path
|
|
1155
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
1156
|
+
d="M9,9 L1,9"
|
|
1157
|
+
/>
|
|
1158
|
+
</svg>
|
|
1083
1159
|
</span>
|
|
1084
1160
|
</button>
|
|
1085
1161
|
</span>
|
|
@@ -1187,7 +1263,7 @@ section: components
|
|
|
1187
1263
|
</div>
|
|
1188
1264
|
<div class="pf-v6-c-toolbar__item">
|
|
1189
1265
|
<button
|
|
1190
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
1266
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
1191
1267
|
type="button"
|
|
1192
1268
|
aria-expanded="false"
|
|
1193
1269
|
aria-label="Settings"
|
|
@@ -1421,12 +1497,31 @@ section: components
|
|
|
1421
1497
|
<div class="pf-v6-c-masthead__main">
|
|
1422
1498
|
<span class="pf-v6-c-masthead__toggle">
|
|
1423
1499
|
<button
|
|
1424
|
-
class="pf-v6-c-button pf-m-plain"
|
|
1500
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
1425
1501
|
type="button"
|
|
1426
1502
|
aria-label="Global navigation"
|
|
1427
1503
|
>
|
|
1428
1504
|
<span class="pf-v6-c-button__icon">
|
|
1429
|
-
<
|
|
1505
|
+
<svg
|
|
1506
|
+
viewBox="0 0 10 10"
|
|
1507
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
1508
|
+
width="1em"
|
|
1509
|
+
height="1em"
|
|
1510
|
+
>
|
|
1511
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
1512
|
+
<path
|
|
1513
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
1514
|
+
d="M1,5 L9,5"
|
|
1515
|
+
/>
|
|
1516
|
+
<path
|
|
1517
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
1518
|
+
d="M1,5 L1,5 L1,5"
|
|
1519
|
+
/>
|
|
1520
|
+
<path
|
|
1521
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
1522
|
+
d="M9,9 L1,9"
|
|
1523
|
+
/>
|
|
1524
|
+
</svg>
|
|
1430
1525
|
</span>
|
|
1431
1526
|
</button>
|
|
1432
1527
|
</span>
|
|
@@ -1534,7 +1629,7 @@ section: components
|
|
|
1534
1629
|
</div>
|
|
1535
1630
|
<div class="pf-v6-c-toolbar__item">
|
|
1536
1631
|
<button
|
|
1537
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
1632
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
1538
1633
|
type="button"
|
|
1539
1634
|
aria-expanded="false"
|
|
1540
1635
|
aria-label="Settings"
|
|
@@ -1768,12 +1863,31 @@ section: components
|
|
|
1768
1863
|
<div class="pf-v6-c-masthead__main">
|
|
1769
1864
|
<span class="pf-v6-c-masthead__toggle">
|
|
1770
1865
|
<button
|
|
1771
|
-
class="pf-v6-c-button pf-m-plain"
|
|
1866
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
1772
1867
|
type="button"
|
|
1773
1868
|
aria-label="Global navigation"
|
|
1774
1869
|
>
|
|
1775
1870
|
<span class="pf-v6-c-button__icon">
|
|
1776
|
-
<
|
|
1871
|
+
<svg
|
|
1872
|
+
viewBox="0 0 10 10"
|
|
1873
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
1874
|
+
width="1em"
|
|
1875
|
+
height="1em"
|
|
1876
|
+
>
|
|
1877
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
1878
|
+
<path
|
|
1879
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
1880
|
+
d="M1,5 L9,5"
|
|
1881
|
+
/>
|
|
1882
|
+
<path
|
|
1883
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
1884
|
+
d="M1,5 L1,5 L1,5"
|
|
1885
|
+
/>
|
|
1886
|
+
<path
|
|
1887
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
1888
|
+
d="M9,9 L1,9"
|
|
1889
|
+
/>
|
|
1890
|
+
</svg>
|
|
1777
1891
|
</span>
|
|
1778
1892
|
</button>
|
|
1779
1893
|
</span>
|
|
@@ -1881,7 +1995,7 @@ section: components
|
|
|
1881
1995
|
</div>
|
|
1882
1996
|
<div class="pf-v6-c-toolbar__item">
|
|
1883
1997
|
<button
|
|
1884
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
1998
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
1885
1999
|
type="button"
|
|
1886
2000
|
aria-expanded="false"
|
|
1887
2001
|
aria-label="Settings"
|
|
@@ -2096,7 +2210,19 @@ section: components
|
|
|
2096
2210
|
aria-describedby="-form-name"
|
|
2097
2211
|
>
|
|
2098
2212
|
<span class="pf-v6-c-button__icon">
|
|
2099
|
-
<
|
|
2213
|
+
<svg
|
|
2214
|
+
class="pf-v6-svg"
|
|
2215
|
+
viewBox="0 0 1024 1024"
|
|
2216
|
+
fill="currentColor"
|
|
2217
|
+
aria-hidden="true"
|
|
2218
|
+
role="img"
|
|
2219
|
+
width="1em"
|
|
2220
|
+
height="1em"
|
|
2221
|
+
>
|
|
2222
|
+
<path
|
|
2223
|
+
d="M521.3,576 C627.5,576 713.7,502 713.7,413.7 C713.7,325.4 627.6,253.6 521.3,253.6 C366,253.6 334.5,337.7 329.2,407.2 C329.2,414.3 335.2,416 343.5,416 L445,416 C450.5,416 458,415.5 460.8,406.5 C460.8,362.6 582.9,357.1 582.9,413.6 C582.9,441.9 556.2,470.9 521.3,473 C486.4,475.1 447.3,479.8 447.3,521.7 L447.3,553.8 C447.3,570.8 456.1,576 472,576 C487.9,576 521.3,576 521.3,576 M575.3,751.3 L575.3,655.3 C575.313862,651.055109 573.620137,646.982962 570.6,644 C567.638831,640.947672 563.552355,639.247987 559.3,639.29884 L463.3,639.29884 C459.055109,639.286138 454.982962,640.979863 452,644 C448.947672,646.961169 447.247987,651.047645 447.29884,655.3 L447.29884,751.3 C447.286138,755.544891 448.979863,759.617038 452,762.6 C454.961169,765.652328 459.047645,767.352013 463.3,767.30116 L559.3,767.30116 C563.544891,767.313862 567.617038,765.620137 570.6,762.6 C573.659349,759.643612 575.360354,755.553963 575.3,751.3 M512,896 C300.2,896 128,723.9 128,512 C128,300.3 300.2,128 512,128 C723.8,128 896,300.2 896,512 C896,723.8 723.7,896 512,896 M512.1,0 C229.7,0 0,229.8 0,512 C0,794.2 229.8,1024 512.1,1024 C794.4,1024 1024,794.3 1024,512 C1024,229.7 794.4,0 512.1,0"
|
|
2224
|
+
/>
|
|
2225
|
+
</svg>
|
|
2100
2226
|
</span>
|
|
2101
2227
|
</span></span>
|
|
2102
2228
|
</div>
|
|
@@ -2121,7 +2247,19 @@ section: components
|
|
|
2121
2247
|
aria-describedby="-form-email"
|
|
2122
2248
|
>
|
|
2123
2249
|
<span class="pf-v6-c-button__icon">
|
|
2124
|
-
<
|
|
2250
|
+
<svg
|
|
2251
|
+
class="pf-v6-svg"
|
|
2252
|
+
viewBox="0 0 1024 1024"
|
|
2253
|
+
fill="currentColor"
|
|
2254
|
+
aria-hidden="true"
|
|
2255
|
+
role="img"
|
|
2256
|
+
width="1em"
|
|
2257
|
+
height="1em"
|
|
2258
|
+
>
|
|
2259
|
+
<path
|
|
2260
|
+
d="M521.3,576 C627.5,576 713.7,502 713.7,413.7 C713.7,325.4 627.6,253.6 521.3,253.6 C366,253.6 334.5,337.7 329.2,407.2 C329.2,414.3 335.2,416 343.5,416 L445,416 C450.5,416 458,415.5 460.8,406.5 C460.8,362.6 582.9,357.1 582.9,413.6 C582.9,441.9 556.2,470.9 521.3,473 C486.4,475.1 447.3,479.8 447.3,521.7 L447.3,553.8 C447.3,570.8 456.1,576 472,576 C487.9,576 521.3,576 521.3,576 M575.3,751.3 L575.3,655.3 C575.313862,651.055109 573.620137,646.982962 570.6,644 C567.638831,640.947672 563.552355,639.247987 559.3,639.29884 L463.3,639.29884 C459.055109,639.286138 454.982962,640.979863 452,644 C448.947672,646.961169 447.247987,651.047645 447.29884,655.3 L447.29884,751.3 C447.286138,755.544891 448.979863,759.617038 452,762.6 C454.961169,765.652328 459.047645,767.352013 463.3,767.30116 L559.3,767.30116 C563.544891,767.313862 567.617038,765.620137 570.6,762.6 C573.659349,759.643612 575.360354,755.553963 575.3,751.3 M512,896 C300.2,896 128,723.9 128,512 C128,300.3 300.2,128 512,128 C723.8,128 896,300.2 896,512 C896,723.8 723.7,896 512,896 M512.1,0 C229.7,0 0,229.8 0,512 C0,794.2 229.8,1024 512.1,1024 C794.4,1024 1024,794.3 1024,512 C1024,229.7 794.4,0 512.1,0"
|
|
2261
|
+
/>
|
|
2262
|
+
</svg>
|
|
2125
2263
|
</span>
|
|
2126
2264
|
</span></span>
|
|
2127
2265
|
</div>
|
|
@@ -2146,7 +2284,19 @@ section: components
|
|
|
2146
2284
|
aria-describedby="-form-address"
|
|
2147
2285
|
>
|
|
2148
2286
|
<span class="pf-v6-c-button__icon">
|
|
2149
|
-
<
|
|
2287
|
+
<svg
|
|
2288
|
+
class="pf-v6-svg"
|
|
2289
|
+
viewBox="0 0 1024 1024"
|
|
2290
|
+
fill="currentColor"
|
|
2291
|
+
aria-hidden="true"
|
|
2292
|
+
role="img"
|
|
2293
|
+
width="1em"
|
|
2294
|
+
height="1em"
|
|
2295
|
+
>
|
|
2296
|
+
<path
|
|
2297
|
+
d="M521.3,576 C627.5,576 713.7,502 713.7,413.7 C713.7,325.4 627.6,253.6 521.3,253.6 C366,253.6 334.5,337.7 329.2,407.2 C329.2,414.3 335.2,416 343.5,416 L445,416 C450.5,416 458,415.5 460.8,406.5 C460.8,362.6 582.9,357.1 582.9,413.6 C582.9,441.9 556.2,470.9 521.3,473 C486.4,475.1 447.3,479.8 447.3,521.7 L447.3,553.8 C447.3,570.8 456.1,576 472,576 C487.9,576 521.3,576 521.3,576 M575.3,751.3 L575.3,655.3 C575.313862,651.055109 573.620137,646.982962 570.6,644 C567.638831,640.947672 563.552355,639.247987 559.3,639.29884 L463.3,639.29884 C459.055109,639.286138 454.982962,640.979863 452,644 C448.947672,646.961169 447.247987,651.047645 447.29884,655.3 L447.29884,751.3 C447.286138,755.544891 448.979863,759.617038 452,762.6 C454.961169,765.652328 459.047645,767.352013 463.3,767.30116 L559.3,767.30116 C563.544891,767.313862 567.617038,765.620137 570.6,762.6 C573.659349,759.643612 575.360354,755.553963 575.3,751.3 M512,896 C300.2,896 128,723.9 128,512 C128,300.3 300.2,128 512,128 C723.8,128 896,300.2 896,512 C896,723.8 723.7,896 512,896 M512.1,0 C229.7,0 0,229.8 0,512 C0,794.2 229.8,1024 512.1,1024 C794.4,1024 1024,794.3 1024,512 C1024,229.7 794.4,0 512.1,0"
|
|
2298
|
+
/>
|
|
2299
|
+
</svg>
|
|
2150
2300
|
</span>
|
|
2151
2301
|
</span></span>
|
|
2152
2302
|
</div>
|
|
@@ -19,12 +19,31 @@ section: components
|
|
|
19
19
|
<div class="pf-v6-c-masthead__main">
|
|
20
20
|
<span class="pf-v6-c-masthead__toggle">
|
|
21
21
|
<button
|
|
22
|
-
class="pf-v6-c-button pf-m-plain"
|
|
22
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
23
23
|
type="button"
|
|
24
24
|
aria-label="Global navigation"
|
|
25
25
|
>
|
|
26
26
|
<span class="pf-v6-c-button__icon">
|
|
27
|
-
<
|
|
27
|
+
<svg
|
|
28
|
+
viewBox="0 0 10 10"
|
|
29
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
30
|
+
width="1em"
|
|
31
|
+
height="1em"
|
|
32
|
+
>
|
|
33
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
34
|
+
<path
|
|
35
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
36
|
+
d="M1,5 L9,5"
|
|
37
|
+
/>
|
|
38
|
+
<path
|
|
39
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
40
|
+
d="M1,5 L1,5 L1,5"
|
|
41
|
+
/>
|
|
42
|
+
<path
|
|
43
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
44
|
+
d="M9,9 L1,9"
|
|
45
|
+
/>
|
|
46
|
+
</svg>
|
|
28
47
|
</span>
|
|
29
48
|
</button>
|
|
30
49
|
</span>
|
|
@@ -132,7 +151,7 @@ section: components
|
|
|
132
151
|
</div>
|
|
133
152
|
<div class="pf-v6-c-toolbar__item">
|
|
134
153
|
<button
|
|
135
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
154
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
136
155
|
type="button"
|
|
137
156
|
aria-expanded="false"
|
|
138
157
|
aria-label="Settings"
|
|
@@ -321,12 +340,31 @@ section: components
|
|
|
321
340
|
<div class="pf-v6-c-masthead__main">
|
|
322
341
|
<span class="pf-v6-c-masthead__toggle">
|
|
323
342
|
<button
|
|
324
|
-
class="pf-v6-c-button pf-m-plain"
|
|
343
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
325
344
|
type="button"
|
|
326
345
|
aria-label="Global navigation"
|
|
327
346
|
>
|
|
328
347
|
<span class="pf-v6-c-button__icon">
|
|
329
|
-
<
|
|
348
|
+
<svg
|
|
349
|
+
viewBox="0 0 10 10"
|
|
350
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
351
|
+
width="1em"
|
|
352
|
+
height="1em"
|
|
353
|
+
>
|
|
354
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
355
|
+
<path
|
|
356
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
357
|
+
d="M1,5 L9,5"
|
|
358
|
+
/>
|
|
359
|
+
<path
|
|
360
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
361
|
+
d="M1,5 L1,5 L1,5"
|
|
362
|
+
/>
|
|
363
|
+
<path
|
|
364
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
365
|
+
d="M9,9 L1,9"
|
|
366
|
+
/>
|
|
367
|
+
</svg>
|
|
330
368
|
</span>
|
|
331
369
|
</button>
|
|
332
370
|
</span>
|
|
@@ -434,7 +472,7 @@ section: components
|
|
|
434
472
|
</div>
|
|
435
473
|
<div class="pf-v6-c-toolbar__item">
|
|
436
474
|
<button
|
|
437
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
475
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
438
476
|
type="button"
|
|
439
477
|
aria-expanded="false"
|
|
440
478
|
aria-label="Settings"
|
|
@@ -655,12 +693,31 @@ section: components
|
|
|
655
693
|
<div class="pf-v6-c-masthead__main">
|
|
656
694
|
<span class="pf-v6-c-masthead__toggle">
|
|
657
695
|
<button
|
|
658
|
-
class="pf-v6-c-button pf-m-plain"
|
|
696
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
659
697
|
type="button"
|
|
660
698
|
aria-label="Global navigation"
|
|
661
699
|
>
|
|
662
700
|
<span class="pf-v6-c-button__icon">
|
|
663
|
-
<
|
|
701
|
+
<svg
|
|
702
|
+
viewBox="0 0 10 10"
|
|
703
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
704
|
+
width="1em"
|
|
705
|
+
height="1em"
|
|
706
|
+
>
|
|
707
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
708
|
+
<path
|
|
709
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
710
|
+
d="M1,5 L9,5"
|
|
711
|
+
/>
|
|
712
|
+
<path
|
|
713
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
714
|
+
d="M1,5 L1,5 L1,5"
|
|
715
|
+
/>
|
|
716
|
+
<path
|
|
717
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
718
|
+
d="M9,9 L1,9"
|
|
719
|
+
/>
|
|
720
|
+
</svg>
|
|
664
721
|
</span>
|
|
665
722
|
</button>
|
|
666
723
|
</span>
|
|
@@ -768,7 +825,7 @@ section: components
|
|
|
768
825
|
</div>
|
|
769
826
|
<div class="pf-v6-c-toolbar__item">
|
|
770
827
|
<button
|
|
771
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
828
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
772
829
|
type="button"
|
|
773
830
|
aria-expanded="false"
|
|
774
831
|
aria-label="Settings"
|
|
@@ -1036,7 +1093,7 @@ section: components
|
|
|
1036
1093
|
### Horizontal nav
|
|
1037
1094
|
|
|
1038
1095
|
```html isFullscreen
|
|
1039
|
-
<div class="pf-v6-c-page" id="nav-horizontal-example">
|
|
1096
|
+
<div class="pf-v6-c-page pf-m-no-sidebar" id="nav-horizontal-example">
|
|
1040
1097
|
<div class="pf-v6-c-skip-to-content">
|
|
1041
1098
|
<a
|
|
1042
1099
|
class="pf-v6-c-button pf-m-primary"
|
|
@@ -1216,7 +1273,7 @@ section: components
|
|
|
1216
1273
|
</div>
|
|
1217
1274
|
<div class="pf-v6-c-toolbar__item">
|
|
1218
1275
|
<button
|
|
1219
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
1276
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
1220
1277
|
type="button"
|
|
1221
1278
|
aria-expanded="false"
|
|
1222
1279
|
aria-label="Settings"
|
|
@@ -1364,12 +1421,31 @@ section: components
|
|
|
1364
1421
|
<div class="pf-v6-c-masthead__main">
|
|
1365
1422
|
<span class="pf-v6-c-masthead__toggle">
|
|
1366
1423
|
<button
|
|
1367
|
-
class="pf-v6-c-button pf-m-plain"
|
|
1424
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
1368
1425
|
type="button"
|
|
1369
1426
|
aria-label="Global navigation"
|
|
1370
1427
|
>
|
|
1371
1428
|
<span class="pf-v6-c-button__icon">
|
|
1372
|
-
<
|
|
1429
|
+
<svg
|
|
1430
|
+
viewBox="0 0 10 10"
|
|
1431
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
1432
|
+
width="1em"
|
|
1433
|
+
height="1em"
|
|
1434
|
+
>
|
|
1435
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
1436
|
+
<path
|
|
1437
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
1438
|
+
d="M1,5 L9,5"
|
|
1439
|
+
/>
|
|
1440
|
+
<path
|
|
1441
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
1442
|
+
d="M1,5 L1,5 L1,5"
|
|
1443
|
+
/>
|
|
1444
|
+
<path
|
|
1445
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
1446
|
+
d="M9,9 L1,9"
|
|
1447
|
+
/>
|
|
1448
|
+
</svg>
|
|
1373
1449
|
</span>
|
|
1374
1450
|
</button>
|
|
1375
1451
|
</span>
|
|
@@ -1477,7 +1553,7 @@ section: components
|
|
|
1477
1553
|
</div>
|
|
1478
1554
|
<div class="pf-v6-c-toolbar__item">
|
|
1479
1555
|
<button
|
|
1480
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
1556
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
1481
1557
|
type="button"
|
|
1482
1558
|
aria-expanded="false"
|
|
1483
1559
|
aria-label="Settings"
|
|
@@ -1678,7 +1754,7 @@ section: components
|
|
|
1678
1754
|
### Horizontal nav with horizontal subnav
|
|
1679
1755
|
|
|
1680
1756
|
```html isFullscreen
|
|
1681
|
-
<div class="pf-v6-c-page" id="nav-horizontal-example">
|
|
1757
|
+
<div class="pf-v6-c-page pf-m-no-sidebar" id="nav-horizontal-example">
|
|
1682
1758
|
<div class="pf-v6-c-skip-to-content">
|
|
1683
1759
|
<a
|
|
1684
1760
|
class="pf-v6-c-button pf-m-primary"
|
|
@@ -1694,12 +1770,31 @@ section: components
|
|
|
1694
1770
|
<div class="pf-v6-c-masthead__main">
|
|
1695
1771
|
<span class="pf-v6-c-masthead__toggle">
|
|
1696
1772
|
<button
|
|
1697
|
-
class="pf-v6-c-button pf-m-plain"
|
|
1773
|
+
class="pf-v6-c-button pf-m-hamburger pf-m-plain"
|
|
1698
1774
|
type="button"
|
|
1699
1775
|
aria-label="Global navigation"
|
|
1700
1776
|
>
|
|
1701
1777
|
<span class="pf-v6-c-button__icon">
|
|
1702
|
-
<
|
|
1778
|
+
<svg
|
|
1779
|
+
viewBox="0 0 10 10"
|
|
1780
|
+
class="pf-v6-c-button--hamburger-icon pf-v6-svg"
|
|
1781
|
+
width="1em"
|
|
1782
|
+
height="1em"
|
|
1783
|
+
>
|
|
1784
|
+
<path class="pf-v6-c-button--hamburger-icon--top" d="M1,1 L9,1" />
|
|
1785
|
+
<path
|
|
1786
|
+
class="pf-v6-c-button--hamburger-icon--middle"
|
|
1787
|
+
d="M1,5 L9,5"
|
|
1788
|
+
/>
|
|
1789
|
+
<path
|
|
1790
|
+
class="pf-v6-c-button--hamburger-icon--arrow"
|
|
1791
|
+
d="M1,5 L1,5 L1,5"
|
|
1792
|
+
/>
|
|
1793
|
+
<path
|
|
1794
|
+
class="pf-v6-c-button--hamburger-icon--bottom"
|
|
1795
|
+
d="M9,9 L1,9"
|
|
1796
|
+
/>
|
|
1797
|
+
</svg>
|
|
1703
1798
|
</span>
|
|
1704
1799
|
</button>
|
|
1705
1800
|
</span>
|
|
@@ -1872,7 +1967,7 @@ section: components
|
|
|
1872
1967
|
</div>
|
|
1873
1968
|
<div class="pf-v6-c-toolbar__item">
|
|
1874
1969
|
<button
|
|
1875
|
-
class="pf-v6-c-menu-toggle pf-m-plain"
|
|
1970
|
+
class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
|
|
1876
1971
|
type="button"
|
|
1877
1972
|
aria-expanded="false"
|
|
1878
1973
|
aria-label="Settings"
|