@patternfly/patternfly 6.5.0-prerelease.63 → 6.5.0-prerelease.64

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 (31) hide show
  1. package/components/ClipboardCopy/clipboard-copy.css +7 -1
  2. package/components/ClipboardCopy/clipboard-copy.scss +10 -1
  3. package/components/_index.css +7 -1
  4. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +39 -38
  5. package/docs/components/Page/examples/Page.md +62 -15
  6. package/docs/demos/AboutModal/examples/AboutModal.md +8 -2
  7. package/docs/demos/Alert/examples/Alert.md +24 -6
  8. package/docs/demos/BackToTop/examples/BackToTop.md +8 -2
  9. package/docs/demos/Banner/examples/Banner.md +16 -4
  10. package/docs/demos/CardView/examples/CardView.md +8 -2
  11. package/docs/demos/Dashboard/examples/Dashboard.md +8 -2
  12. package/docs/demos/DataList/examples/DataList.md +32 -8
  13. package/docs/demos/DescriptionList/examples/DescriptionList.md +24 -6
  14. package/docs/demos/Drawer/examples/Drawer.md +24 -6
  15. package/docs/demos/JumpLinks/examples/JumpLinks.md +32 -8
  16. package/docs/demos/Masthead/examples/Masthead.md +72 -18
  17. package/docs/demos/Modal/examples/Modal.md +48 -12
  18. package/docs/demos/Nav/examples/Nav.md +80 -20
  19. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +40 -10
  20. package/docs/demos/Page/examples/Page.md +113 -28
  21. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +56 -14
  22. package/docs/demos/Skeleton/examples/Skeleton.md +8 -2
  23. package/docs/demos/Table/examples/Table.md +128 -32
  24. package/docs/demos/Tabs/examples/Tabs.md +48 -12
  25. package/docs/demos/Toolbar/examples/Toolbar.md +16 -4
  26. package/docs/demos/Wizard/examples/Wizard.md +72 -18
  27. package/package.json +1 -1
  28. package/patternfly-no-globals.css +7 -1
  29. package/patternfly.css +7 -1
  30. package/patternfly.min.css +1 -1
  31. package/patternfly.min.css.map +1 -1
@@ -332,9 +332,15 @@ wrapperTag: div
332
332
  </nav>
333
333
  </div>
334
334
  </section>
335
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
335
+ <section
336
+ class="pf-v6-c-page__main-section pf-m-limit-width"
337
+ aria-labelledby="main-title"
338
+ >
336
339
  <div class="pf-v6-c-page__main-body">
337
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
340
+ <h1
341
+ class="pf-v6-c-content--h1 pf-m-page-title"
342
+ id="main-title"
343
+ >Main title</h1>
338
344
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
339
345
  </div>
340
346
  </section>
@@ -1619,9 +1625,15 @@ wrapperTag: div
1619
1625
  </nav>
1620
1626
  </div>
1621
1627
  </section>
1622
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
1628
+ <section
1629
+ class="pf-v6-c-page__main-section pf-m-limit-width"
1630
+ aria-labelledby="main-title"
1631
+ >
1623
1632
  <div class="pf-v6-c-page__main-body">
1624
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
1633
+ <h1
1634
+ class="pf-v6-c-content--h1 pf-m-page-title"
1635
+ id="main-title"
1636
+ >Main title</h1>
1625
1637
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
1626
1638
  </div>
1627
1639
  </section>
@@ -3038,9 +3050,15 @@ wrapperTag: div
3038
3050
  </nav>
3039
3051
  </div>
3040
3052
  </section>
3041
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
3053
+ <section
3054
+ class="pf-v6-c-page__main-section pf-m-limit-width"
3055
+ aria-labelledby="main-title"
3056
+ >
3042
3057
  <div class="pf-v6-c-page__main-body">
3043
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
3058
+ <h1
3059
+ class="pf-v6-c-content--h1 pf-m-page-title"
3060
+ id="main-title"
3061
+ >Main title</h1>
3044
3062
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
3045
3063
  </div>
3046
3064
  </section>
@@ -4667,9 +4685,15 @@ wrapperTag: div
4667
4685
  </nav>
4668
4686
  </div>
4669
4687
  </section>
4670
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
4688
+ <section
4689
+ class="pf-v6-c-page__main-section pf-m-limit-width"
4690
+ aria-labelledby="main-title"
4691
+ >
4671
4692
  <div class="pf-v6-c-page__main-body">
4672
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
4693
+ <h1
4694
+ class="pf-v6-c-content--h1 pf-m-page-title"
4695
+ id="main-title"
4696
+ >Main title</h1>
4673
4697
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
4674
4698
  </div>
4675
4699
  </section>
@@ -5874,9 +5898,15 @@ wrapperTag: div
5874
5898
  </nav>
5875
5899
  </div>
5876
5900
  </section>
5877
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
5901
+ <section
5902
+ class="pf-v6-c-page__main-section pf-m-limit-width"
5903
+ aria-labelledby="main-title"
5904
+ >
5878
5905
  <div class="pf-v6-c-page__main-body">
5879
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
5906
+ <h1
5907
+ class="pf-v6-c-content--h1 pf-m-page-title"
5908
+ id="main-title"
5909
+ >Main title</h1>
5880
5910
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
5881
5911
  </div>
5882
5912
  </section>
@@ -9567,9 +9597,15 @@ wrapperTag: div
9567
9597
  </nav>
9568
9598
  </div>
9569
9599
  </section>
9570
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
9600
+ <section
9601
+ class="pf-v6-c-page__main-section pf-m-limit-width"
9602
+ aria-labelledby="main-title"
9603
+ >
9571
9604
  <div class="pf-v6-c-page__main-body">
9572
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
9605
+ <h1
9606
+ class="pf-v6-c-content--h1 pf-m-page-title"
9607
+ id="main-title"
9608
+ >Main title</h1>
9573
9609
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
9574
9610
  </div>
9575
9611
  </section>
@@ -10023,9 +10059,15 @@ wrapperTag: div
10023
10059
  </nav>
10024
10060
  </div>
10025
10061
  </section>
10026
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
10062
+ <section
10063
+ class="pf-v6-c-page__main-section pf-m-limit-width"
10064
+ aria-labelledby="main-title"
10065
+ >
10027
10066
  <div class="pf-v6-c-page__main-body">
10028
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
10067
+ <h1
10068
+ class="pf-v6-c-content--h1 pf-m-page-title"
10069
+ id="main-title"
10070
+ >Main title</h1>
10029
10071
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
10030
10072
  </div>
10031
10073
  </section>
@@ -10473,9 +10515,15 @@ wrapperTag: div
10473
10515
  </nav>
10474
10516
  </div>
10475
10517
  </section>
10476
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
10518
+ <section
10519
+ class="pf-v6-c-page__main-section pf-m-limit-width"
10520
+ aria-labelledby="main-title"
10521
+ >
10477
10522
  <div class="pf-v6-c-page__main-body">
10478
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
10523
+ <h1
10524
+ class="pf-v6-c-content--h1 pf-m-page-title"
10525
+ id="main-title"
10526
+ >Main title</h1>
10479
10527
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
10480
10528
  </div>
10481
10529
  </section>
@@ -11780,9 +11828,15 @@ wrapperTag: div
11780
11828
  </nav>
11781
11829
  </div>
11782
11830
  </section>
11783
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
11831
+ <section
11832
+ class="pf-v6-c-page__main-section pf-m-limit-width"
11833
+ aria-labelledby="main-title"
11834
+ >
11784
11835
  <div class="pf-v6-c-page__main-body">
11785
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
11836
+ <h1
11837
+ class="pf-v6-c-content--h1 pf-m-page-title"
11838
+ id="main-title"
11839
+ >Main title</h1>
11786
11840
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
11787
11841
  </div>
11788
11842
  </section>
@@ -13165,9 +13219,15 @@ wrapperTag: div
13165
13219
  </nav>
13166
13220
  </div>
13167
13221
  </section>
13168
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
13222
+ <section
13223
+ class="pf-v6-c-page__main-section pf-m-limit-width"
13224
+ aria-labelledby="main-title"
13225
+ >
13169
13226
  <div class="pf-v6-c-page__main-body">
13170
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
13227
+ <h1
13228
+ class="pf-v6-c-content--h1 pf-m-page-title"
13229
+ id="main-title"
13230
+ >Main title</h1>
13171
13231
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
13172
13232
  </div>
13173
13233
  </section>
@@ -14469,9 +14529,15 @@ wrapperTag: div
14469
14529
  </nav>
14470
14530
  </div>
14471
14531
  </section>
14472
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
14532
+ <section
14533
+ class="pf-v6-c-page__main-section pf-m-limit-width"
14534
+ aria-labelledby="main-title"
14535
+ >
14473
14536
  <div class="pf-v6-c-page__main-body">
14474
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
14537
+ <h1
14538
+ class="pf-v6-c-content--h1 pf-m-page-title"
14539
+ id="main-title"
14540
+ >Main title</h1>
14475
14541
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
14476
14542
  </div>
14477
14543
  </section>
@@ -15818,9 +15884,15 @@ wrapperTag: div
15818
15884
  </nav>
15819
15885
  </div>
15820
15886
  </section>
15821
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
15887
+ <section
15888
+ class="pf-v6-c-page__main-section pf-m-limit-width"
15889
+ aria-labelledby="main-title"
15890
+ >
15822
15891
  <div class="pf-v6-c-page__main-body">
15823
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
15892
+ <h1
15893
+ class="pf-v6-c-content--h1 pf-m-page-title"
15894
+ id="main-title"
15895
+ >Main title</h1>
15824
15896
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
15825
15897
  </div>
15826
15898
  </section>
@@ -17203,9 +17275,15 @@ wrapperTag: div
17203
17275
  </nav>
17204
17276
  </div>
17205
17277
  </section>
17206
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
17278
+ <section
17279
+ class="pf-v6-c-page__main-section pf-m-limit-width"
17280
+ aria-labelledby="main-title"
17281
+ >
17207
17282
  <div class="pf-v6-c-page__main-body">
17208
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
17283
+ <h1
17284
+ class="pf-v6-c-content--h1 pf-m-page-title"
17285
+ id="main-title"
17286
+ >Main title</h1>
17209
17287
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
17210
17288
  </div>
17211
17289
  </section>
@@ -18586,9 +18664,15 @@ wrapperTag: div
18586
18664
  </nav>
18587
18665
  </div>
18588
18666
  </section>
18589
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
18667
+ <section
18668
+ class="pf-v6-c-page__main-section pf-m-limit-width"
18669
+ aria-labelledby="main-title"
18670
+ >
18590
18671
  <div class="pf-v6-c-page__main-body">
18591
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
18672
+ <h1
18673
+ class="pf-v6-c-content--h1 pf-m-page-title"
18674
+ id="main-title"
18675
+ >Main title</h1>
18592
18676
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
18593
18677
  </div>
18594
18678
  </section>
@@ -19931,9 +20015,15 @@ By default, table cell alignment is set to baseline. This retains vertical align
19931
20015
  </nav>
19932
20016
  </div>
19933
20017
  </section>
19934
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
20018
+ <section
20019
+ class="pf-v6-c-page__main-section pf-m-limit-width"
20020
+ aria-labelledby="main-title"
20021
+ >
19935
20022
  <div class="pf-v6-c-page__main-body">
19936
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
20023
+ <h1
20024
+ class="pf-v6-c-content--h1 pf-m-page-title"
20025
+ id="main-title"
20026
+ >Main title</h1>
19937
20027
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
19938
20028
  </div>
19939
20029
  </section>
@@ -20586,9 +20676,15 @@ Note that the table in the main content area uses the `pf-m-grid-lg` modifier an
20586
20676
  </nav>
20587
20677
  </div>
20588
20678
  </section>
20589
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
20679
+ <section
20680
+ class="pf-v6-c-page__main-section pf-m-limit-width"
20681
+ aria-labelledby="main-title"
20682
+ >
20590
20683
  <div class="pf-v6-c-page__main-body">
20591
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
20684
+ <h1
20685
+ class="pf-v6-c-content--h1 pf-m-page-title"
20686
+ id="main-title"
20687
+ >Main title</h1>
20592
20688
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
20593
20689
  </div>
20594
20690
  </section>
@@ -339,9 +339,15 @@ section: components
339
339
  </nav>
340
340
  </div>
341
341
  </section>
342
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
342
+ <section
343
+ class="pf-v6-c-page__main-section pf-m-limit-width"
344
+ aria-labelledby="main-title"
345
+ >
343
346
  <div class="pf-v6-c-page__main-body">
344
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
347
+ <h1
348
+ class="pf-v6-c-content--h1 pf-m-page-title"
349
+ id="main-title"
350
+ >Main title</h1>
345
351
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
346
352
  </div>
347
353
  </section>
@@ -995,9 +1001,15 @@ section: components
995
1001
  </nav>
996
1002
  </div>
997
1003
  </section>
998
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
1004
+ <section
1005
+ class="pf-v6-c-page__main-section pf-m-limit-width"
1006
+ aria-labelledby="main-title"
1007
+ >
999
1008
  <div class="pf-v6-c-page__main-body">
1000
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
1009
+ <h1
1010
+ class="pf-v6-c-content--h1 pf-m-page-title"
1011
+ id="main-title"
1012
+ >Main title</h1>
1001
1013
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
1002
1014
  </div>
1003
1015
  </section>
@@ -1658,9 +1670,15 @@ section: components
1658
1670
  </nav>
1659
1671
  </div>
1660
1672
  </section>
1661
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
1673
+ <section
1674
+ class="pf-v6-c-page__main-section pf-m-limit-width"
1675
+ aria-labelledby="main-title"
1676
+ >
1662
1677
  <div class="pf-v6-c-page__main-body">
1663
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
1678
+ <h1
1679
+ class="pf-v6-c-content--h1 pf-m-page-title"
1680
+ id="main-title"
1681
+ >Main title</h1>
1664
1682
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
1665
1683
  </div>
1666
1684
  </section>
@@ -2238,9 +2256,15 @@ section: components
2238
2256
  </nav>
2239
2257
  </div>
2240
2258
  </section>
2241
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
2259
+ <section
2260
+ class="pf-v6-c-page__main-section pf-m-limit-width"
2261
+ aria-labelledby="main-title"
2262
+ >
2242
2263
  <div class="pf-v6-c-page__main-body">
2243
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
2264
+ <h1
2265
+ class="pf-v6-c-content--h1 pf-m-page-title"
2266
+ id="main-title"
2267
+ >Main title</h1>
2244
2268
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
2245
2269
  </div>
2246
2270
  </section>
@@ -3726,9 +3750,15 @@ section: components
3726
3750
  </nav>
3727
3751
  </div>
3728
3752
  </section>
3729
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
3753
+ <section
3754
+ class="pf-v6-c-page__main-section pf-m-limit-width"
3755
+ aria-labelledby="main-title"
3756
+ >
3730
3757
  <div class="pf-v6-c-page__main-body">
3731
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
3758
+ <h1
3759
+ class="pf-v6-c-content--h1 pf-m-page-title"
3760
+ id="main-title"
3761
+ >Main title</h1>
3732
3762
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
3733
3763
  </div>
3734
3764
  </section>
@@ -4113,9 +4143,15 @@ section: components
4113
4143
  </nav>
4114
4144
  </div>
4115
4145
  </section>
4116
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
4146
+ <section
4147
+ class="pf-v6-c-page__main-section pf-m-limit-width"
4148
+ aria-labelledby="main-title"
4149
+ >
4117
4150
  <div class="pf-v6-c-page__main-body">
4118
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
4151
+ <h1
4152
+ class="pf-v6-c-content--h1 pf-m-page-title"
4153
+ id="main-title"
4154
+ >Main title</h1>
4119
4155
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
4120
4156
  </div>
4121
4157
  </section>
@@ -569,9 +569,15 @@ section: components
569
569
  </nav>
570
570
  </div>
571
571
  </section>
572
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
572
+ <section
573
+ class="pf-v6-c-page__main-section pf-m-limit-width"
574
+ aria-labelledby="main-title"
575
+ >
573
576
  <div class="pf-v6-c-page__main-body">
574
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
577
+ <h1
578
+ class="pf-v6-c-content--h1 pf-m-page-title"
579
+ id="main-title"
580
+ >Main title</h1>
575
581
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
576
582
  </div>
577
583
  </section>
@@ -3618,9 +3624,15 @@ section: components
3618
3624
  </nav>
3619
3625
  </div>
3620
3626
  </section>
3621
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
3627
+ <section
3628
+ class="pf-v6-c-page__main-section pf-m-limit-width"
3629
+ aria-labelledby="main-title"
3630
+ >
3622
3631
  <div class="pf-v6-c-page__main-body">
3623
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
3632
+ <h1
3633
+ class="pf-v6-c-content--h1 pf-m-page-title"
3634
+ id="main-title"
3635
+ >Main title</h1>
3624
3636
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
3625
3637
  </div>
3626
3638
  </section>
@@ -340,9 +340,15 @@ wrapperTag: div
340
340
  </nav>
341
341
  </div>
342
342
  </section>
343
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
343
+ <section
344
+ class="pf-v6-c-page__main-section pf-m-limit-width"
345
+ aria-labelledby="main-title"
346
+ >
344
347
  <div class="pf-v6-c-page__main-body">
345
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
348
+ <h1
349
+ class="pf-v6-c-content--h1 pf-m-page-title"
350
+ id="main-title"
351
+ >Main title</h1>
346
352
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
347
353
  </div>
348
354
  </section>
@@ -1061,9 +1067,15 @@ wrapperTag: div
1061
1067
  </nav>
1062
1068
  </div>
1063
1069
  </section>
1064
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
1070
+ <section
1071
+ class="pf-v6-c-page__main-section pf-m-limit-width"
1072
+ aria-labelledby="main-title"
1073
+ >
1065
1074
  <div class="pf-v6-c-page__main-body">
1066
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
1075
+ <h1
1076
+ class="pf-v6-c-content--h1 pf-m-page-title"
1077
+ id="main-title"
1078
+ >Main title</h1>
1067
1079
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
1068
1080
  </div>
1069
1081
  </section>
@@ -1764,9 +1776,15 @@ wrapperTag: div
1764
1776
  </nav>
1765
1777
  </div>
1766
1778
  </section>
1767
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
1779
+ <section
1780
+ class="pf-v6-c-page__main-section pf-m-limit-width"
1781
+ aria-labelledby="main-title"
1782
+ >
1768
1783
  <div class="pf-v6-c-page__main-body">
1769
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
1784
+ <h1
1785
+ class="pf-v6-c-content--h1 pf-m-page-title"
1786
+ id="main-title"
1787
+ >Main title</h1>
1770
1788
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
1771
1789
  </div>
1772
1790
  </section>
@@ -2563,9 +2581,15 @@ wrapperTag: div
2563
2581
  </nav>
2564
2582
  </div>
2565
2583
  </section>
2566
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
2584
+ <section
2585
+ class="pf-v6-c-page__main-section pf-m-limit-width"
2586
+ aria-labelledby="main-title"
2587
+ >
2567
2588
  <div class="pf-v6-c-page__main-body">
2568
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
2589
+ <h1
2590
+ class="pf-v6-c-content--h1 pf-m-page-title"
2591
+ id="main-title"
2592
+ >Main title</h1>
2569
2593
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
2570
2594
  </div>
2571
2595
  </section>
@@ -3358,9 +3382,15 @@ wrapperTag: div
3358
3382
  </nav>
3359
3383
  </div>
3360
3384
  </section>
3361
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
3385
+ <section
3386
+ class="pf-v6-c-page__main-section pf-m-limit-width"
3387
+ aria-labelledby="main-title"
3388
+ >
3362
3389
  <div class="pf-v6-c-page__main-body">
3363
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
3390
+ <h1
3391
+ class="pf-v6-c-content--h1 pf-m-page-title"
3392
+ id="main-title"
3393
+ >Main title</h1>
3364
3394
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
3365
3395
  </div>
3366
3396
  </section>
@@ -4028,9 +4058,15 @@ wrapperTag: div
4028
4058
  </nav>
4029
4059
  </div>
4030
4060
  </section>
4031
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
4061
+ <section
4062
+ class="pf-v6-c-page__main-section pf-m-limit-width"
4063
+ aria-labelledby="main-title"
4064
+ >
4032
4065
  <div class="pf-v6-c-page__main-body">
4033
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
4066
+ <h1
4067
+ class="pf-v6-c-content--h1 pf-m-page-title"
4068
+ id="main-title"
4069
+ >Main title</h1>
4034
4070
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
4035
4071
  </div>
4036
4072
  </section>
@@ -4681,9 +4717,15 @@ wrapperTag: div
4681
4717
  </nav>
4682
4718
  </div>
4683
4719
  </section>
4684
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
4720
+ <section
4721
+ class="pf-v6-c-page__main-section pf-m-limit-width"
4722
+ aria-labelledby="main-title"
4723
+ >
4685
4724
  <div class="pf-v6-c-page__main-body">
4686
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
4725
+ <h1
4726
+ class="pf-v6-c-content--h1 pf-m-page-title"
4727
+ id="main-title"
4728
+ >Main title</h1>
4687
4729
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
4688
4730
  </div>
4689
4731
  </section>
@@ -5316,9 +5358,15 @@ wrapperTag: div
5316
5358
  </nav>
5317
5359
  </div>
5318
5360
  </section>
5319
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
5361
+ <section
5362
+ class="pf-v6-c-page__main-section pf-m-limit-width"
5363
+ aria-labelledby="main-title"
5364
+ >
5320
5365
  <div class="pf-v6-c-page__main-body">
5321
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
5366
+ <h1
5367
+ class="pf-v6-c-content--h1 pf-m-page-title"
5368
+ id="main-title"
5369
+ >Main title</h1>
5322
5370
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
5323
5371
  </div>
5324
5372
  </section>
@@ -6034,9 +6082,15 @@ wrapperTag: div
6034
6082
  </nav>
6035
6083
  </div>
6036
6084
  </section>
6037
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
6085
+ <section
6086
+ class="pf-v6-c-page__main-section pf-m-limit-width"
6087
+ aria-labelledby="main-title"
6088
+ >
6038
6089
  <div class="pf-v6-c-page__main-body">
6039
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
6090
+ <h1
6091
+ class="pf-v6-c-content--h1 pf-m-page-title"
6092
+ id="main-title"
6093
+ >Main title</h1>
6040
6094
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
6041
6095
  </div>
6042
6096
  </section>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "6.5.0-prerelease.63",
4
+ "version": "6.5.0-prerelease.64",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -12432,7 +12432,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
12432
12432
  --pf-v6-c-clipboard-copy__expandable-content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
12433
12433
  --pf-v6-c-clipboard-copy__expandable-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
12434
12434
  --pf-v6-c-clipboard-copy__expandable-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
12435
- --pf-v6-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
12435
+ --pf-v6-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-t--global--background--color--control--default);
12436
12436
  --pf-v6-c-clipboard-copy__expandable-content--BorderBlockStartWidth: var(--pf-t--global--border--width--control--default);
12437
12437
  --pf-v6-c-clipboard-copy__expandable-content--BorderInlineEndWidth: var(--pf-t--global--border--width--control--default);
12438
12438
  --pf-v6-c-clipboard-copy__expandable-content--BorderBlockEndWidth: var(--pf-t--global--border--width--control--default);
@@ -12440,6 +12440,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
12440
12440
  --pf-v6-c-clipboard-copy__expandable-content--BorderColor: var(--pf-t--global--border--color--control--default);
12441
12441
  --pf-v6-c-clipboard-copy__expandable-content--BorderRadius: var(--pf-t--global--border--radius--control--form-element);
12442
12442
  --pf-v6-c-clipboard-copy__expandable-content--OutlineOffset: var(--pf-t--global--spacer--xs);
12443
+ --pf-v6-c-clipboard-copy--m-readonly__expandable-content--BackgroundColor: var(--pf-t--global--background--color--control--read-only);
12444
+ --pf-v6-c-clipboard-copy--m-readonly__expandable-content--BorderColor: var(--pf-t--global--border--color--control--read-only);
12443
12445
  --pf-v6-c-clipboard-copy__group--Gap: var(--pf-t--global--spacer--gap--control-to-control--default);
12444
12446
  --pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart: var(--pf-t--global--spacer--xs);
12445
12447
  --pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
@@ -12468,6 +12470,10 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
12468
12470
  .pf-v6-c-clipboard-copy.pf-m-inline.pf-m-truncate {
12469
12471
  display: inline-flex;
12470
12472
  }
12473
+ .pf-v6-c-clipboard-copy.pf-m-readonly {
12474
+ --pf-v6-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-v6-c-clipboard-copy--m-readonly__expandable-content--BackgroundColor);
12475
+ --pf-v6-c-clipboard-copy__expandable-content--BorderColor: var(--pf-v6-c-clipboard-copy--m-readonly__expandable-content--BorderColor);
12476
+ }
12471
12477
 
12472
12478
  .pf-v6-c-clipboard-copy__group {
12473
12479
  display: flex;
package/patternfly.css CHANGED
@@ -12579,7 +12579,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
12579
12579
  --pf-v6-c-clipboard-copy__expandable-content--PaddingInlineEnd: var(--pf-t--global--spacer--md);
12580
12580
  --pf-v6-c-clipboard-copy__expandable-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
12581
12581
  --pf-v6-c-clipboard-copy__expandable-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
12582
- --pf-v6-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
12582
+ --pf-v6-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-t--global--background--color--control--default);
12583
12583
  --pf-v6-c-clipboard-copy__expandable-content--BorderBlockStartWidth: var(--pf-t--global--border--width--control--default);
12584
12584
  --pf-v6-c-clipboard-copy__expandable-content--BorderInlineEndWidth: var(--pf-t--global--border--width--control--default);
12585
12585
  --pf-v6-c-clipboard-copy__expandable-content--BorderBlockEndWidth: var(--pf-t--global--border--width--control--default);
@@ -12587,6 +12587,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
12587
12587
  --pf-v6-c-clipboard-copy__expandable-content--BorderColor: var(--pf-t--global--border--color--control--default);
12588
12588
  --pf-v6-c-clipboard-copy__expandable-content--BorderRadius: var(--pf-t--global--border--radius--control--form-element);
12589
12589
  --pf-v6-c-clipboard-copy__expandable-content--OutlineOffset: var(--pf-t--global--spacer--xs);
12590
+ --pf-v6-c-clipboard-copy--m-readonly__expandable-content--BackgroundColor: var(--pf-t--global--background--color--control--read-only);
12591
+ --pf-v6-c-clipboard-copy--m-readonly__expandable-content--BorderColor: var(--pf-t--global--border--color--control--read-only);
12590
12592
  --pf-v6-c-clipboard-copy__group--Gap: var(--pf-t--global--spacer--gap--control-to-control--default);
12591
12593
  --pf-v6-c-clipboard-copy--m-inline--PaddingInlineStart: var(--pf-t--global--spacer--xs);
12592
12594
  --pf-v6-c-clipboard-copy--m-inline--PaddingInlineEnd: var(--pf-t--global--spacer--xs);
@@ -12615,6 +12617,10 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
12615
12617
  .pf-v6-c-clipboard-copy.pf-m-inline.pf-m-truncate {
12616
12618
  display: inline-flex;
12617
12619
  }
12620
+ .pf-v6-c-clipboard-copy.pf-m-readonly {
12621
+ --pf-v6-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-v6-c-clipboard-copy--m-readonly__expandable-content--BackgroundColor);
12622
+ --pf-v6-c-clipboard-copy__expandable-content--BorderColor: var(--pf-v6-c-clipboard-copy--m-readonly__expandable-content--BorderColor);
12623
+ }
12618
12624
 
12619
12625
  .pf-v6-c-clipboard-copy__group {
12620
12626
  display: flex;