@patternfly/patternfly 6.5.0-prerelease.51 → 6.5.0-prerelease.53

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 (49) hide show
  1. package/components/Button/button.css +22 -2
  2. package/components/Button/button.scss +26 -2
  3. package/components/Card/card.css +20 -8
  4. package/components/Card/card.scss +26 -7
  5. package/components/Masthead/masthead.css +38 -4
  6. package/components/Masthead/masthead.scss +52 -4
  7. package/components/MenuToggle/menu-toggle.css +26 -2
  8. package/components/MenuToggle/menu-toggle.scss +30 -2
  9. package/components/Nav/nav.css +16 -8
  10. package/components/Nav/nav.scss +16 -8
  11. package/components/Page/page.css +59 -7
  12. package/components/Page/page.scss +79 -15
  13. package/components/_index.css +181 -31
  14. package/docs/components/Breadcrumb/examples/Breadcrumb.md +0 -1
  15. package/docs/components/Button/examples/Button.md +339 -0
  16. package/docs/components/Masthead/examples/masthead.md +1 -1
  17. package/docs/components/Menu/examples/Menu.md +0 -2
  18. package/docs/components/MenuToggle/examples/MenuToggle.md +1 -4
  19. package/docs/components/Pagination/examples/Pagination.md +0 -13
  20. package/docs/components/Toolbar/examples/Toolbar.md +0 -2
  21. package/docs/demos/AboutModal/examples/AboutModal.md +1 -0
  22. package/docs/demos/Alert/examples/Alert.md +3 -0
  23. package/docs/demos/BackToTop/examples/BackToTop.md +1 -0
  24. package/docs/demos/Banner/examples/Banner.md +2 -0
  25. package/docs/demos/Card/examples/Card.md +564 -86
  26. package/docs/demos/CardView/examples/CardView.md +16 -3
  27. package/docs/demos/Compass/examples/Compass.md +551 -134
  28. package/docs/demos/Dashboard/examples/Dashboard.md +435 -100
  29. package/docs/demos/DataList/examples/DataList.md +4 -8
  30. package/docs/demos/DescriptionList/examples/DescriptionList.md +3 -0
  31. package/docs/demos/Drawer/examples/Drawer.md +5 -0
  32. package/docs/demos/JumpLinks/examples/JumpLinks.md +6 -0
  33. package/docs/demos/Masthead/examples/Masthead.md +9 -58
  34. package/docs/demos/Modal/examples/Modal.md +6 -0
  35. package/docs/demos/Nav/examples/Nav.md +305 -160
  36. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +5 -0
  37. package/docs/demos/Page/examples/Page.md +14 -0
  38. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +7 -6
  39. package/docs/demos/Skeleton/examples/Skeleton.md +1 -0
  40. package/docs/demos/Table/examples/Table.md +16 -27
  41. package/docs/demos/Tabs/examples/Tabs.md +6 -0
  42. package/docs/demos/Toolbar/examples/Toolbar.md +2 -8
  43. package/docs/demos/Wizard/examples/Wizard.md +9 -0
  44. package/package.json +1 -1
  45. package/patternfly-no-globals.css +181 -31
  46. package/patternfly.css +181 -31
  47. package/patternfly.min.css +1 -1
  48. package/patternfly.min.css.map +1 -1
  49. package/sass-utilities/scss-variables.scss +3 -0
package/docs/demos/DataList/examples/DataList.md CHANGED
@@ -16,6 +16,7 @@ wrapperTag: div
16
16
  <span class="pf-v6-c-button__text">Skip to content</span>
17
17
  </a>
18
18
  </div>
19
+
19
20
  <header class="pf-v6-c-masthead" id="data-list-basic-example-docked">
20
21
  <div class="pf-v6-c-masthead__main">
21
22
  <span class="pf-v6-c-masthead__toggle">
@@ -397,7 +398,6 @@ wrapperTag: div
397
398
  class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
398
399
  type="button"
399
400
  aria-expanded="false"
400
- aria-label="Menu toggle"
401
401
  id="data-list-basic-example-toolbar-top-pagination"
402
402
  >
403
403
  <span class="pf-v6-c-menu-toggle__text">
@@ -925,7 +925,6 @@ wrapperTag: div
925
925
  class="pf-v6-c-menu-toggle pf-m-top pf-m-text pf-m-plain"
926
926
  type="button"
927
927
  aria-expanded="false"
928
- aria-label="Menu toggle"
929
928
  id="{{page--id}}-pagination-menu-toggle-bottom-example"
930
929
  >
931
930
  <span class="pf-v6-c-menu-toggle__text">
@@ -1069,6 +1068,7 @@ wrapperTag: div
1069
1068
  <span class="pf-v6-c-button__text">Skip to content</span>
1070
1069
  </a>
1071
1070
  </div>
1071
+
1072
1072
  <header class="pf-v6-c-masthead" id="data-list-actionable-example-docked">
1073
1073
  <div class="pf-v6-c-masthead__main">
1074
1074
  <span class="pf-v6-c-masthead__toggle">
@@ -1482,7 +1482,6 @@ wrapperTag: div
1482
1482
  class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
1483
1483
  type="button"
1484
1484
  aria-expanded="false"
1485
- aria-label="Menu toggle"
1486
1485
  id="data-list-actionable-example-toolbar-top-pagination"
1487
1486
  >
1488
1487
  <span class="pf-v6-c-menu-toggle__text">
@@ -1952,7 +1951,6 @@ wrapperTag: div
1952
1951
  class="pf-v6-c-menu-toggle pf-m-top pf-m-text pf-m-plain"
1953
1952
  type="button"
1954
1953
  aria-expanded="false"
1955
- aria-label="Menu toggle"
1956
1954
  id="{{page--id}}-pagination-menu-toggle-bottom-example"
1957
1955
  >
1958
1956
  <span class="pf-v6-c-menu-toggle__text">
@@ -2096,6 +2094,7 @@ wrapperTag: div
2096
2094
  <span class="pf-v6-c-button__text">Skip to content</span>
2097
2095
  </a>
2098
2096
  </div>
2097
+
2099
2098
  <header class="pf-v6-c-masthead" id="data-list-expandable-example-docked">
2100
2099
  <div class="pf-v6-c-masthead__main">
2101
2100
  <span class="pf-v6-c-masthead__toggle">
@@ -2580,7 +2579,6 @@ wrapperTag: div
2580
2579
  class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
2581
2580
  type="button"
2582
2581
  aria-expanded="false"
2583
- aria-label="Menu toggle"
2584
2582
  id="data-list-expandable-example-toolbar-top-pagination"
2585
2583
  >
2586
2584
  <span class="pf-v6-c-menu-toggle__text">
@@ -3769,7 +3767,6 @@ wrapperTag: div
3769
3767
  class="pf-v6-c-menu-toggle pf-m-top pf-m-text pf-m-plain"
3770
3768
  type="button"
3771
3769
  aria-expanded="false"
3772
- aria-label="Menu toggle"
3773
3770
  id="{{page--id}}-pagination-menu-toggle-bottom-example"
3774
3771
  >
3775
3772
  <span class="pf-v6-c-menu-toggle__text">
@@ -3913,6 +3910,7 @@ wrapperTag: div
3913
3910
  <span class="pf-v6-c-button__text">Skip to content</span>
3914
3911
  </a>
3915
3912
  </div>
3913
+
3916
3914
  <header class="pf-v6-c-masthead" id="data-list-static-bottom-example-docked">
3917
3915
  <div class="pf-v6-c-masthead__main">
3918
3916
  <span class="pf-v6-c-masthead__toggle">
@@ -4339,7 +4337,6 @@ wrapperTag: div
4339
4337
  class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
4340
4338
  type="button"
4341
4339
  aria-expanded="false"
4342
- aria-label="Menu toggle"
4343
4340
  id="data-list-static-bottom-example-toolbar-top-pagination"
4344
4341
  >
4345
4342
  <span class="pf-v6-c-menu-toggle__text">
@@ -4867,7 +4864,6 @@ wrapperTag: div
4867
4864
  class="pf-v6-c-menu-toggle pf-m-top pf-m-text pf-m-plain"
4868
4865
  type="button"
4869
4866
  aria-expanded="false"
4870
- aria-label="Menu toggle"
4871
4867
  id="{{page--id}}pagination-menu-toggle-bottom-example-static"
4872
4868
  >
4873
4869
  <span class="pf-v6-c-menu-toggle__text">
package/docs/demos/DescriptionList/examples/DescriptionList.md CHANGED
@@ -16,6 +16,7 @@ cssPrefix: pf-d-description-list
16
16
  <span class="pf-v6-c-button__text">Skip to content</span>
17
17
  </a>
18
18
  </div>
19
+
19
20
  <header class="pf-v6-c-masthead" id="description-list-basic-example-docked">
20
21
  <div class="pf-v6-c-masthead__main">
21
22
  <span class="pf-v6-c-masthead__toggle">
@@ -438,6 +439,7 @@ cssPrefix: pf-d-description-list
438
439
  <span class="pf-v6-c-button__text">Skip to content</span>
439
440
  </a>
440
441
  </div>
442
+
441
443
  <header
442
444
  class="pf-v6-c-masthead"
443
445
  id="description-list-in-drawer-example-docked"
@@ -1149,6 +1151,7 @@ cssPrefix: pf-d-description-list
1149
1151
  <span class="pf-v6-c-button__text">Skip to content</span>
1150
1152
  </a>
1151
1153
  </div>
1154
+
1152
1155
  <header
1153
1156
  class="pf-v6-c-masthead"
1154
1157
  id="description-list-complex-content-example-docked"
package/docs/demos/Drawer/examples/Drawer.md CHANGED
@@ -16,6 +16,7 @@ wrapperTag: div
16
16
  <span class="pf-v6-c-button__text">Skip to content</span>
17
17
  </a>
18
18
  </div>
19
+
19
20
  <header class="pf-v6-c-masthead" id="drawer-collapsed-example-docked">
20
21
  <div class="pf-v6-c-masthead__main">
21
22
  <span class="pf-v6-c-masthead__toggle">
@@ -559,6 +560,7 @@ wrapperTag: div
559
560
  <span class="pf-v6-c-button__text">Skip to content</span>
560
561
  </a>
561
562
  </div>
563
+
562
564
  <header class="pf-v6-c-masthead" id="drawer-expanded-example-docked">
563
565
  <div class="pf-v6-c-masthead__main">
564
566
  <span class="pf-v6-c-masthead__toggle">
@@ -938,6 +940,7 @@ wrapperTag: div
938
940
  <span class="pf-v6-c-button__text">Skip to content</span>
939
941
  </a>
940
942
  </div>
943
+
941
944
  <header class="pf-v6-c-masthead" id="drawer-expanded-bottom-example-docked">
942
945
  <div class="pf-v6-c-masthead__main">
943
946
  <span class="pf-v6-c-masthead__toggle">
@@ -1317,6 +1320,7 @@ wrapperTag: div
1317
1320
  <span class="pf-v6-c-button__text">Skip to content</span>
1318
1321
  </a>
1319
1322
  </div>
1323
+
1320
1324
  <header class="pf-v6-c-masthead" id="drawer-jump-links-docked">
1321
1325
  <div class="pf-v6-c-masthead__main">
1322
1326
  <span class="pf-v6-c-masthead__toggle">
@@ -1760,6 +1764,7 @@ wrapperTag: div
1760
1764
  <span class="pf-v6-c-button__text">Skip to content</span>
1761
1765
  </a>
1762
1766
  </div>
1767
+
1763
1768
  <header class="pf-v6-c-masthead" id="drawer-expanded-jump-links-docked">
1764
1769
  <div class="pf-v6-c-masthead__main">
1765
1770
  <span class="pf-v6-c-masthead__toggle">
package/docs/demos/JumpLinks/examples/JumpLinks.md CHANGED
@@ -15,6 +15,7 @@ section: components
15
15
  <span class="pf-v6-c-button__text">Skip to content</span>
16
16
  </a>
17
17
  </div>
18
+
18
19
  <header
19
20
  class="pf-v6-c-masthead"
20
21
  id="jump-links-collapsed-mobile-example-docked"
@@ -494,6 +495,7 @@ section: components
494
495
  <span class="pf-v6-c-button__text">Skip to content</span>
495
496
  </a>
496
497
  </div>
498
+
497
499
  <header
498
500
  class="pf-v6-c-masthead"
499
501
  id="jump-links-vertical-expanded-mobile-example-docked"
@@ -973,6 +975,7 @@ section: components
973
975
  <span class="pf-v6-c-button__text">Skip to content</span>
974
976
  </a>
975
977
  </div>
978
+
976
979
  <header
977
980
  class="pf-v6-c-masthead"
978
981
  id="jump-links-vertical-toggle-text-mobile-example-docked"
@@ -1452,6 +1455,7 @@ section: components
1452
1455
  <span class="pf-v6-c-button__text">Skip to content</span>
1453
1456
  </a>
1454
1457
  </div>
1458
+
1455
1459
  <header class="pf-v6-c-masthead" id="jump-links-horizontal-example-docked">
1456
1460
  <div class="pf-v6-c-masthead__main">
1457
1461
  <span class="pf-v6-c-masthead__toggle">
@@ -1865,6 +1869,7 @@ section: components
1865
1869
  <span class="pf-v6-c-button__text">Skip to content</span>
1866
1870
  </a>
1867
1871
  </div>
1872
+
1868
1873
  <header class="pf-v6-c-masthead" id="jump-links-drawer-docked">
1869
1874
  <div class="pf-v6-c-masthead__main">
1870
1875
  <span class="pf-v6-c-masthead__toggle">
@@ -2308,6 +2313,7 @@ section: components
2308
2313
  <span class="pf-v6-c-button__text">Skip to content</span>
2309
2314
  </a>
2310
2315
  </div>
2316
+
2311
2317
  <header class="pf-v6-c-masthead" id="jump-links-drawer-expanded-docked">
2312
2318
  <div class="pf-v6-c-masthead__main">
2313
2319
  <span class="pf-v6-c-masthead__toggle">
package/docs/demos/Masthead/examples/Masthead.md CHANGED
@@ -16,6 +16,7 @@ wrapperTag: div
16
16
  <span class="pf-v6-c-button__text">Skip to content</span>
17
17
  </a>
18
18
  </div>
19
+
19
20
  <header class="pf-v6-c-masthead" id="masthead-basic-example-docked">
20
21
  <div class="pf-v6-c-masthead__main">
21
22
  <span class="pf-v6-c-masthead__toggle">
@@ -330,6 +331,7 @@ wrapperTag: div
330
331
  <span class="pf-v6-c-button__text">Skip to content</span>
331
332
  </a>
332
333
  </div>
334
+
333
335
  <header
334
336
  class="pf-v6-c-masthead"
335
337
  id="masthead-context-selecton-drilldown-example-docked"
@@ -676,6 +678,7 @@ wrapperTag: div
676
678
  <span class="pf-v6-c-button__text">Skip to content</span>
677
679
  </a>
678
680
  </div>
681
+
679
682
  <header class="pf-v6-c-masthead" id="masthead-toolbar-filters-example-docked">
680
683
  <div class="pf-v6-c-masthead__main">
681
684
  <span class="pf-v6-c-masthead__toggle">
@@ -1056,6 +1059,7 @@ wrapperTag: div
1056
1059
  <span class="pf-v6-c-button__text">Skip to content</span>
1057
1060
  </a>
1058
1061
  </div>
1062
+
1059
1063
  <header
1060
1064
  class="pf-v6-c-masthead"
1061
1065
  id="masthead-toggle-group-filters-example-docked"
@@ -1439,6 +1443,7 @@ wrapperTag: div
1439
1443
  <span class="pf-v6-c-button__text">Skip to content</span>
1440
1444
  </a>
1441
1445
  </div>
1446
+
1442
1447
  <header
1443
1448
  class="pf-v6-c-masthead"
1444
1449
  id="masthead-expandable-search-example-docked"
@@ -1771,6 +1776,7 @@ wrapperTag: div
1771
1776
  <span class="pf-v6-c-button__text">Skip to content</span>
1772
1777
  </a>
1773
1778
  </div>
1779
+
1774
1780
  <header
1775
1781
  class="pf-v6-c-masthead"
1776
1782
  id="masthead-expandable-search-expanded-example-docked"
@@ -2121,6 +2127,7 @@ wrapperTag: div
2121
2127
  <span class="pf-v6-c-button__text">Skip to content</span>
2122
2128
  </a>
2123
2129
  </div>
2130
+
2124
2131
  <header
2125
2132
  class="pf-v6-c-masthead"
2126
2133
  id="masthead-advanced-with-menu-example-docked"
@@ -2481,6 +2488,7 @@ wrapperTag: div
2481
2488
  <span class="pf-v6-c-button__text">Skip to content</span>
2482
2489
  </a>
2483
2490
  </div>
2491
+
2484
2492
  <header class="pf-v6-c-masthead" id="masthead-horizontal-nav-docked">
2485
2493
  <div class="pf-v6-c-masthead__main">
2486
2494
  <div class="pf-v6-c-masthead__brand">
@@ -2655,64 +2663,6 @@ wrapperTag: div
2655
2663
  </div>
2656
2664
  </nav>
2657
2665
  </div>
2658
-
2659
- <div
2660
- class="pf-v6-c-toolbar__group pf-m-align-end pf-m-spacer-none pf-m-spacer-md-on-md pf-m-action-group-plain"
2661
- >
2662
- <div
2663
- class="pf-v6-c-toolbar__group pf-m-hidden pf-m-visible-on-lg pf-m-action-group-plain"
2664
- >
2665
- <div class="pf-v6-c-toolbar__item">
2666
- <button
2667
- class="pf-v6-c-menu-toggle pf-m-plain"
2668
- type="button"
2669
- aria-expanded="false"
2670
- aria-label="Application launcher"
2671
- >
2672
- <span class="pf-v6-c-menu-toggle__icon">
2673
- <i class="fas fa-th" aria-hidden="true"></i>
2674
- </span>
2675
- </button>
2676
- </div>
2677
- <div class="pf-v6-c-toolbar__item">
2678
- <button
2679
- class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
2680
- type="button"
2681
- aria-expanded="false"
2682
- aria-label="Settings"
2683
- >
2684
- <span class="pf-v6-c-menu-toggle__icon">
2685
- <i class="fas fa-cog" aria-hidden="true"></i>
2686
- </span>
2687
- </button>
2688
- </div>
2689
- <div class="pf-v6-c-toolbar__item">
2690
- <button
2691
- class="pf-v6-c-menu-toggle pf-m-plain"
2692
- type="button"
2693
- aria-expanded="false"
2694
- aria-label="Help"
2695
- >
2696
- <span class="pf-v6-c-menu-toggle__icon">
2697
- <i class="fas fa-question-circle" aria-hidden="true"></i>
2698
- </span>
2699
- </button>
2700
- </div>
2701
- </div>
2702
-
2703
- <div class="pf-v6-c-toolbar__item pf-m-hidden-on-lg">
2704
- <button
2705
- class="pf-v6-c-menu-toggle pf-m-plain"
2706
- type="button"
2707
- aria-expanded="false"
2708
- aria-label="Actions"
2709
- >
2710
- <span class="pf-v6-c-menu-toggle__icon">
2711
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
2712
- </span>
2713
- </button>
2714
- </div>
2715
- </div>
2716
2666
  </div>
2717
2667
  </div>
2718
2668
  </div>
@@ -2861,6 +2811,7 @@ wrapperTag: div
2861
2811
  <span class="pf-v6-c-button__text">Skip to content</span>
2862
2812
  </a>
2863
2813
  </div>
2814
+
2864
2815
  <header
2865
2816
  class="pf-v6-c-masthead"
2866
2817
  id="masthead-toggle-group-filters-expanded-mobile-example-docked"
package/docs/demos/Modal/examples/Modal.md CHANGED
@@ -15,6 +15,7 @@ section: components
15
15
  <span class="pf-v6-c-button__text">Skip to content</span>
16
16
  </a>
17
17
  </div>
18
+
18
19
  <header class="pf-v6-c-masthead" id="modal-basic-example-docked">
19
20
  <div class="pf-v6-c-masthead__main">
20
21
  <span class="pf-v6-c-masthead__toggle">
@@ -430,6 +431,7 @@ section: components
430
431
  <span class="pf-v6-c-button__text">Skip to content</span>
431
432
  </a>
432
433
  </div>
434
+
433
435
  <header class="pf-v6-c-masthead" id="modal-scrollable-content-example-docked">
434
436
  <div class="pf-v6-c-masthead__main">
435
437
  <span class="pf-v6-c-masthead__toggle">
@@ -854,6 +856,7 @@ section: components
854
856
  <span class="pf-v6-c-button__text">Skip to content</span>
855
857
  </a>
856
858
  </div>
859
+
857
860
  <header class="pf-v6-c-masthead" id="modal-medium-example-docked">
858
861
  <div class="pf-v6-c-masthead__main">
859
862
  <span class="pf-v6-c-masthead__toggle">
@@ -1268,6 +1271,7 @@ section: components
1268
1271
  <span class="pf-v6-c-button__text">Skip to content</span>
1269
1272
  </a>
1270
1273
  </div>
1274
+
1271
1275
  <header class="pf-v6-c-masthead" id="modal-large-example-docked">
1272
1276
  <div class="pf-v6-c-masthead__main">
1273
1277
  <span class="pf-v6-c-masthead__toggle">
@@ -1682,6 +1686,7 @@ section: components
1682
1686
  <span class="pf-v6-c-button__text">Skip to content</span>
1683
1687
  </a>
1684
1688
  </div>
1689
+
1685
1690
  <header class="pf-v6-c-masthead" id="modal-large-example-docked">
1686
1691
  <div class="pf-v6-c-masthead__main">
1687
1692
  <span class="pf-v6-c-masthead__toggle">
@@ -2096,6 +2101,7 @@ section: components
2096
2101
  <span class="pf-v6-c-button__text">Skip to content</span>
2097
2102
  </a>
2098
2103
  </div>
2104
+
2099
2105
  <header class="pf-v6-c-masthead" id="modal-with-form-example-docked">
2100
2106
  <div class="pf-v6-c-masthead__main">
2101
2107
  <span class="pf-v6-c-masthead__toggle">