@patternfly/patternfly 6.5.0-prerelease.62 → 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 (55) hide show
  1. package/components/Button/button.css +2 -2
  2. package/components/Button/button.scss +3 -3
  3. package/components/ClipboardCopy/clipboard-copy.css +7 -1
  4. package/components/ClipboardCopy/clipboard-copy.scss +10 -1
  5. package/components/Menu/menu.css +26 -19
  6. package/components/Menu/menu.scss +26 -19
  7. package/components/MenuToggle/menu-toggle.css +9 -5
  8. package/components/MenuToggle/menu-toggle.scss +12 -5
  9. package/components/_index.css +44 -27
  10. package/docs/components/Breadcrumb/examples/Breadcrumb.md +13 -1
  11. package/docs/components/CalendarMonth/examples/CalendarMonth.md +52 -4
  12. package/docs/components/Card/examples/Card.md +130 -10
  13. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +39 -38
  14. package/docs/components/DataList/examples/DataList.md +221 -17
  15. package/docs/components/DualListSelector/examples/DualListSelector.md +234 -18
  16. package/docs/components/Hint/examples/Hint.md +39 -3
  17. package/docs/components/InlineEdit/examples/InlineEdit.md +26 -2
  18. package/docs/components/InputGroup/examples/InputGroup.md +13 -1
  19. package/docs/components/Login/examples/Login.md +13 -1
  20. package/docs/components/Menu/examples/Menu.md +195 -15
  21. package/docs/components/MenuToggle/examples/MenuToggle.md +1331 -100
  22. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +481 -37
  23. package/docs/components/OverflowMenu/examples/overflow-menu.md +65 -5
  24. package/docs/components/Page/examples/Page.md +62 -15
  25. package/docs/components/Pagination/examples/Pagination.md +169 -13
  26. package/docs/components/Table/examples/Table.md +3461 -269
  27. package/docs/components/Toolbar/examples/Toolbar.md +507 -39
  28. package/docs/demos/AboutModal/examples/AboutModal.md +34 -4
  29. package/docs/demos/Alert/examples/Alert.md +102 -12
  30. package/docs/demos/BackToTop/examples/BackToTop.md +34 -4
  31. package/docs/demos/Banner/examples/Banner.md +68 -8
  32. package/docs/demos/Card/examples/Card.md +78 -6
  33. package/docs/demos/CardView/examples/CardView.md +214 -22
  34. package/docs/demos/Compass/examples/Compass.md +431 -56
  35. package/docs/demos/Dashboard/examples/Dashboard.md +71 -11
  36. package/docs/demos/DataList/examples/DataList.md +401 -53
  37. package/docs/demos/DescriptionList/examples/DescriptionList.md +115 -13
  38. package/docs/demos/Drawer/examples/Drawer.md +167 -17
  39. package/docs/demos/JumpLinks/examples/JumpLinks.md +188 -20
  40. package/docs/demos/Masthead/examples/Masthead.md +228 -30
  41. package/docs/demos/Modal/examples/Modal.md +204 -24
  42. package/docs/demos/Nav/examples/Nav.md +184 -28
  43. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +1015 -85
  44. package/docs/demos/Page/examples/Page.md +503 -58
  45. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +649 -97
  46. package/docs/demos/Skeleton/examples/Skeleton.md +34 -4
  47. package/docs/demos/Table/examples/Table.md +2641 -349
  48. package/docs/demos/Tabs/examples/Tabs.md +295 -31
  49. package/docs/demos/Toolbar/examples/Toolbar.md +675 -63
  50. package/docs/demos/Wizard/examples/Wizard.md +306 -36
  51. package/package.json +1 -1
  52. package/patternfly-no-globals.css +44 -27
  53. package/patternfly.css +44 -27
  54. package/patternfly.min.css +1 -1
  55. package/patternfly.min.css.map +1 -1
package/docs/demos/Nav/examples/Nav.md CHANGED
@@ -158,7 +158,19 @@ section: components
158
158
  aria-label="Settings"
159
159
  >
160
160
  <span class="pf-v6-c-menu-toggle__icon">
161
- <i class="fas fa-cog" aria-hidden="true"></i>
161
+ <svg
162
+ class="pf-v6-svg"
163
+ viewBox="0 0 32 32"
164
+ fill="currentColor"
165
+ aria-hidden="true"
166
+ role="img"
167
+ width="1em"
168
+ height="1em"
169
+ >
170
+ <path
171
+ d="M30.168 12.894a.5.5 0 0 0-.488-.394h-2.732a11.512 11.512 0 0 0-.729-1.769l1.931-1.93a.5.5 0 0 0 .066-.625 14.693 14.693 0 0 0-4.393-4.392.498.498 0 0 0-.624.067l-1.93 1.93a11.512 11.512 0 0 0-1.769-.729V2.319a.5.5 0 0 0-.395-.489 14.81 14.81 0 0 0-6.211 0 .5.5 0 0 0-.395.489v2.733c-.614.196-1.207.439-1.769.729L8.8 3.851a.498.498 0 0 0-.624-.067 14.714 14.714 0 0 0-4.393 4.392.5.5 0 0 0 .066.625l1.931 1.93a11.512 11.512 0 0 0-.729 1.769H2.319a.5.5 0 0 0-.488.394 14.652 14.652 0 0 0 0 6.212.5.5 0 0 0 .488.394h2.732c.196.615.44 1.207.729 1.769l-1.931 1.93a.5.5 0 0 0-.066.625 14.673 14.673 0 0 0 4.393 4.392.498.498 0 0 0 .624-.067l1.93-1.93c.562.289 1.154.533 1.769.729v2.733a.5.5 0 0 0 .395.489 14.686 14.686 0 0 0 6.21 0 .5.5 0 0 0 .395-.489v-2.733a11.454 11.454 0 0 0 1.769-.729l1.93 1.93a.5.5 0 0 0 .624.067 14.714 14.714 0 0 0 4.393-4.392.5.5 0 0 0-.066-.625l-1.931-1.93c.289-.562.533-1.154.729-1.769h2.732a.5.5 0 0 0 .488-.394 14.652 14.652 0 0 0 0-6.212ZM16 21.25c-2.895 0-5.25-2.355-5.25-5.25s2.355-5.25 5.25-5.25 5.25 2.355 5.25 5.25-2.355 5.25-5.25 5.25Z"
172
+ />
173
+ </svg>
162
174
  </span>
163
175
  </button>
164
176
  </div>
@@ -184,7 +196,19 @@ section: components
184
196
  aria-label="Actions"
185
197
  >
186
198
  <span class="pf-v6-c-menu-toggle__icon">
187
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
199
+ <svg
200
+ class="pf-v6-svg"
201
+ viewBox="0 0 32 32"
202
+ fill="currentColor"
203
+ aria-hidden="true"
204
+ role="img"
205
+ width="1em"
206
+ height="1em"
207
+ >
208
+ <path
209
+ d="M12.25 5c0-2.068 1.683-3.75 3.75-3.75S19.75 2.932 19.75 5 18.067 8.75 16 8.75 12.25 7.068 12.25 5ZM16 12.25c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Zm0 11c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Z"
210
+ />
211
+ </svg>
188
212
  </span>
189
213
  </button>
190
214
  </div>
@@ -315,9 +339,15 @@ section: components
315
339
  </nav>
316
340
  </div>
317
341
  </section>
318
- <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
+ >
319
346
  <div class="pf-v6-c-page__main-body">
320
- <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>
321
351
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
322
352
  </div>
323
353
  </section>
@@ -518,7 +548,19 @@ section: components
518
548
  aria-label="Settings"
519
549
  >
520
550
  <span class="pf-v6-c-menu-toggle__icon">
521
- <i class="fas fa-cog" aria-hidden="true"></i>
551
+ <svg
552
+ class="pf-v6-svg"
553
+ viewBox="0 0 32 32"
554
+ fill="currentColor"
555
+ aria-hidden="true"
556
+ role="img"
557
+ width="1em"
558
+ height="1em"
559
+ >
560
+ <path
561
+ d="M30.168 12.894a.5.5 0 0 0-.488-.394h-2.732a11.512 11.512 0 0 0-.729-1.769l1.931-1.93a.5.5 0 0 0 .066-.625 14.693 14.693 0 0 0-4.393-4.392.498.498 0 0 0-.624.067l-1.93 1.93a11.512 11.512 0 0 0-1.769-.729V2.319a.5.5 0 0 0-.395-.489 14.81 14.81 0 0 0-6.211 0 .5.5 0 0 0-.395.489v2.733c-.614.196-1.207.439-1.769.729L8.8 3.851a.498.498 0 0 0-.624-.067 14.714 14.714 0 0 0-4.393 4.392.5.5 0 0 0 .066.625l1.931 1.93a11.512 11.512 0 0 0-.729 1.769H2.319a.5.5 0 0 0-.488.394 14.652 14.652 0 0 0 0 6.212.5.5 0 0 0 .488.394h2.732c.196.615.44 1.207.729 1.769l-1.931 1.93a.5.5 0 0 0-.066.625 14.673 14.673 0 0 0 4.393 4.392.498.498 0 0 0 .624-.067l1.93-1.93c.562.289 1.154.533 1.769.729v2.733a.5.5 0 0 0 .395.489 14.686 14.686 0 0 0 6.21 0 .5.5 0 0 0 .395-.489v-2.733a11.454 11.454 0 0 0 1.769-.729l1.93 1.93a.5.5 0 0 0 .624.067 14.714 14.714 0 0 0 4.393-4.392.5.5 0 0 0-.066-.625l-1.931-1.93c.289-.562.533-1.154.729-1.769h2.732a.5.5 0 0 0 .488-.394 14.652 14.652 0 0 0 0-6.212ZM16 21.25c-2.895 0-5.25-2.355-5.25-5.25s2.355-5.25 5.25-5.25 5.25 2.355 5.25 5.25-2.355 5.25-5.25 5.25Z"
562
+ />
563
+ </svg>
522
564
  </span>
523
565
  </button>
524
566
  </div>
@@ -544,7 +586,19 @@ section: components
544
586
  aria-label="Actions"
545
587
  >
546
588
  <span class="pf-v6-c-menu-toggle__icon">
547
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
589
+ <svg
590
+ class="pf-v6-svg"
591
+ viewBox="0 0 32 32"
592
+ fill="currentColor"
593
+ aria-hidden="true"
594
+ role="img"
595
+ width="1em"
596
+ height="1em"
597
+ >
598
+ <path
599
+ d="M12.25 5c0-2.068 1.683-3.75 3.75-3.75S19.75 2.932 19.75 5 18.067 8.75 16 8.75 12.25 7.068 12.25 5ZM16 12.25c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Zm0 11c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Z"
600
+ />
601
+ </svg>
548
602
  </span>
549
603
  </button>
550
604
  </div>
@@ -713,9 +767,15 @@ section: components
713
767
  </nav>
714
768
  </div>
715
769
  </section>
716
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
770
+ <section
771
+ class="pf-v6-c-page__main-section pf-m-limit-width"
772
+ aria-labelledby="main-title"
773
+ >
717
774
  <div class="pf-v6-c-page__main-body">
718
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
775
+ <h1
776
+ class="pf-v6-c-content--h1 pf-m-page-title"
777
+ id="main-title"
778
+ >Main title</h1>
719
779
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
720
780
  </div>
721
781
  </section>
@@ -916,7 +976,19 @@ section: components
916
976
  aria-label="Settings"
917
977
  >
918
978
  <span class="pf-v6-c-menu-toggle__icon">
919
- <i class="fas fa-cog" aria-hidden="true"></i>
979
+ <svg
980
+ class="pf-v6-svg"
981
+ viewBox="0 0 32 32"
982
+ fill="currentColor"
983
+ aria-hidden="true"
984
+ role="img"
985
+ width="1em"
986
+ height="1em"
987
+ >
988
+ <path
989
+ d="M30.168 12.894a.5.5 0 0 0-.488-.394h-2.732a11.512 11.512 0 0 0-.729-1.769l1.931-1.93a.5.5 0 0 0 .066-.625 14.693 14.693 0 0 0-4.393-4.392.498.498 0 0 0-.624.067l-1.93 1.93a11.512 11.512 0 0 0-1.769-.729V2.319a.5.5 0 0 0-.395-.489 14.81 14.81 0 0 0-6.211 0 .5.5 0 0 0-.395.489v2.733c-.614.196-1.207.439-1.769.729L8.8 3.851a.498.498 0 0 0-.624-.067 14.714 14.714 0 0 0-4.393 4.392.5.5 0 0 0 .066.625l1.931 1.93a11.512 11.512 0 0 0-.729 1.769H2.319a.5.5 0 0 0-.488.394 14.652 14.652 0 0 0 0 6.212.5.5 0 0 0 .488.394h2.732c.196.615.44 1.207.729 1.769l-1.931 1.93a.5.5 0 0 0-.066.625 14.673 14.673 0 0 0 4.393 4.392.498.498 0 0 0 .624-.067l1.93-1.93c.562.289 1.154.533 1.769.729v2.733a.5.5 0 0 0 .395.489 14.686 14.686 0 0 0 6.21 0 .5.5 0 0 0 .395-.489v-2.733a11.454 11.454 0 0 0 1.769-.729l1.93 1.93a.5.5 0 0 0 .624.067 14.714 14.714 0 0 0 4.393-4.392.5.5 0 0 0-.066-.625l-1.931-1.93c.289-.562.533-1.154.729-1.769h2.732a.5.5 0 0 0 .488-.394 14.652 14.652 0 0 0 0-6.212ZM16 21.25c-2.895 0-5.25-2.355-5.25-5.25s2.355-5.25 5.25-5.25 5.25 2.355 5.25 5.25-2.355 5.25-5.25 5.25Z"
990
+ />
991
+ </svg>
920
992
  </span>
921
993
  </button>
922
994
  </div>
@@ -942,7 +1014,19 @@ section: components
942
1014
  aria-label="Actions"
943
1015
  >
944
1016
  <span class="pf-v6-c-menu-toggle__icon">
945
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1017
+ <svg
1018
+ class="pf-v6-svg"
1019
+ viewBox="0 0 32 32"
1020
+ fill="currentColor"
1021
+ aria-hidden="true"
1022
+ role="img"
1023
+ width="1em"
1024
+ height="1em"
1025
+ >
1026
+ <path
1027
+ d="M12.25 5c0-2.068 1.683-3.75 3.75-3.75S19.75 2.932 19.75 5 18.067 8.75 16 8.75 12.25 7.068 12.25 5ZM16 12.25c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Zm0 11c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Z"
1028
+ />
1029
+ </svg>
946
1030
  </span>
947
1031
  </button>
948
1032
  </div>
@@ -1201,9 +1285,15 @@ section: components
1201
1285
  </nav>
1202
1286
  </div>
1203
1287
  </section>
1204
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
1288
+ <section
1289
+ class="pf-v6-c-page__main-section pf-m-limit-width"
1290
+ aria-labelledby="main-title"
1291
+ >
1205
1292
  <div class="pf-v6-c-page__main-body">
1206
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
1293
+ <h1
1294
+ class="pf-v6-c-content--h1 pf-m-page-title"
1295
+ id="main-title"
1296
+ >Main title</h1>
1207
1297
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
1208
1298
  </div>
1209
1299
  </section>
@@ -1519,9 +1609,15 @@ section: components
1519
1609
  </nav>
1520
1610
  </div>
1521
1611
  </section>
1522
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
1612
+ <section
1613
+ class="pf-v6-c-page__main-section pf-m-limit-width"
1614
+ aria-labelledby="main-title"
1615
+ >
1523
1616
  <div class="pf-v6-c-page__main-body">
1524
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
1617
+ <h1
1618
+ class="pf-v6-c-content--h1 pf-m-page-title"
1619
+ id="main-title"
1620
+ >Main title</h1>
1525
1621
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
1526
1622
  </div>
1527
1623
  </section>
@@ -1722,7 +1818,19 @@ section: components
1722
1818
  aria-label="Settings"
1723
1819
  >
1724
1820
  <span class="pf-v6-c-menu-toggle__icon">
1725
- <i class="fas fa-cog" aria-hidden="true"></i>
1821
+ <svg
1822
+ class="pf-v6-svg"
1823
+ viewBox="0 0 32 32"
1824
+ fill="currentColor"
1825
+ aria-hidden="true"
1826
+ role="img"
1827
+ width="1em"
1828
+ height="1em"
1829
+ >
1830
+ <path
1831
+ d="M30.168 12.894a.5.5 0 0 0-.488-.394h-2.732a11.512 11.512 0 0 0-.729-1.769l1.931-1.93a.5.5 0 0 0 .066-.625 14.693 14.693 0 0 0-4.393-4.392.498.498 0 0 0-.624.067l-1.93 1.93a11.512 11.512 0 0 0-1.769-.729V2.319a.5.5 0 0 0-.395-.489 14.81 14.81 0 0 0-6.211 0 .5.5 0 0 0-.395.489v2.733c-.614.196-1.207.439-1.769.729L8.8 3.851a.498.498 0 0 0-.624-.067 14.714 14.714 0 0 0-4.393 4.392.5.5 0 0 0 .066.625l1.931 1.93a11.512 11.512 0 0 0-.729 1.769H2.319a.5.5 0 0 0-.488.394 14.652 14.652 0 0 0 0 6.212.5.5 0 0 0 .488.394h2.732c.196.615.44 1.207.729 1.769l-1.931 1.93a.5.5 0 0 0-.066.625 14.673 14.673 0 0 0 4.393 4.392.498.498 0 0 0 .624-.067l1.93-1.93c.562.289 1.154.533 1.769.729v2.733a.5.5 0 0 0 .395.489 14.686 14.686 0 0 0 6.21 0 .5.5 0 0 0 .395-.489v-2.733a11.454 11.454 0 0 0 1.769-.729l1.93 1.93a.5.5 0 0 0 .624.067 14.714 14.714 0 0 0 4.393-4.392.5.5 0 0 0-.066-.625l-1.931-1.93c.289-.562.533-1.154.729-1.769h2.732a.5.5 0 0 0 .488-.394 14.652 14.652 0 0 0 0-6.212ZM16 21.25c-2.895 0-5.25-2.355-5.25-5.25s2.355-5.25 5.25-5.25 5.25 2.355 5.25 5.25-2.355 5.25-5.25 5.25Z"
1832
+ />
1833
+ </svg>
1726
1834
  </span>
1727
1835
  </button>
1728
1836
  </div>
@@ -1748,7 +1856,19 @@ section: components
1748
1856
  aria-label="Actions"
1749
1857
  >
1750
1858
  <span class="pf-v6-c-menu-toggle__icon">
1751
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1859
+ <svg
1860
+ class="pf-v6-svg"
1861
+ viewBox="0 0 32 32"
1862
+ fill="currentColor"
1863
+ aria-hidden="true"
1864
+ role="img"
1865
+ width="1em"
1866
+ height="1em"
1867
+ >
1868
+ <path
1869
+ d="M12.25 5c0-2.068 1.683-3.75 3.75-3.75S19.75 2.932 19.75 5 18.067 8.75 16 8.75 12.25 7.068 12.25 5ZM16 12.25c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Zm0 11c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Z"
1870
+ />
1871
+ </svg>
1752
1872
  </span>
1753
1873
  </button>
1754
1874
  </div>
@@ -1904,9 +2024,15 @@ section: components
1904
2024
  </nav>
1905
2025
  </div>
1906
2026
  </section>
1907
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
2027
+ <section
2028
+ class="pf-v6-c-page__main-section pf-m-limit-width"
2029
+ aria-labelledby="main-title"
2030
+ >
1908
2031
  <div class="pf-v6-c-page__main-body">
1909
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
2032
+ <h1
2033
+ class="pf-v6-c-content--h1 pf-m-page-title"
2034
+ id="main-title"
2035
+ >Main title</h1>
1910
2036
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
1911
2037
  </div>
1912
2038
  </section>
@@ -2250,9 +2376,15 @@ section: components
2250
2376
  </nav>
2251
2377
  </div>
2252
2378
  </section>
2253
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
2379
+ <section
2380
+ class="pf-v6-c-page__main-section pf-m-limit-width"
2381
+ aria-labelledby="main-title"
2382
+ >
2254
2383
  <div class="pf-v6-c-page__main-body">
2255
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
2384
+ <h1
2385
+ class="pf-v6-c-content--h1 pf-m-page-title"
2386
+ id="main-title"
2387
+ >Main title</h1>
2256
2388
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
2257
2389
  </div>
2258
2390
  </section>
@@ -2810,9 +2942,15 @@ section: components
2810
2942
  </nav>
2811
2943
  </div>
2812
2944
  </section>
2813
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
2945
+ <section
2946
+ class="pf-v6-c-page__main-section pf-m-limit-width"
2947
+ aria-labelledby="main-title"
2948
+ >
2814
2949
  <div class="pf-v6-c-page__main-body">
2815
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
2950
+ <h1
2951
+ class="pf-v6-c-content--h1 pf-m-page-title"
2952
+ id="main-title"
2953
+ >Main title</h1>
2816
2954
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
2817
2955
  </div>
2818
2956
  </section>
@@ -3373,9 +3511,15 @@ section: components
3373
3511
  </nav>
3374
3512
  </div>
3375
3513
  </section>
3376
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
3514
+ <section
3515
+ class="pf-v6-c-page__main-section pf-m-limit-width"
3516
+ aria-labelledby="main-title"
3517
+ >
3377
3518
  <div class="pf-v6-c-page__main-body">
3378
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
3519
+ <h1
3520
+ class="pf-v6-c-content--h1 pf-m-page-title"
3521
+ id="main-title"
3522
+ >Main title</h1>
3379
3523
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
3380
3524
  </div>
3381
3525
  </section>
@@ -3933,9 +4077,15 @@ section: components
3933
4077
  </nav>
3934
4078
  </div>
3935
4079
  </section>
3936
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
4080
+ <section
4081
+ class="pf-v6-c-page__main-section pf-m-limit-width"
4082
+ aria-labelledby="main-title"
4083
+ >
3937
4084
  <div class="pf-v6-c-page__main-body">
3938
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
4085
+ <h1
4086
+ class="pf-v6-c-content--h1 pf-m-page-title"
4087
+ id="main-title"
4088
+ >Main title</h1>
3939
4089
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
3940
4090
  </div>
3941
4091
  </section>
@@ -4496,9 +4646,15 @@ section: components
4496
4646
  </nav>
4497
4647
  </div>
4498
4648
  </section>
4499
- <section class="pf-v6-c-page__main-section pf-m-limit-width">
4649
+ <section
4650
+ class="pf-v6-c-page__main-section pf-m-limit-width"
4651
+ aria-labelledby="main-title"
4652
+ >
4500
4653
  <div class="pf-v6-c-page__main-body">
4501
- <h1 class="pf-v6-c-content--h1 pf-m-page-title">Main title</h1>
4654
+ <h1
4655
+ class="pf-v6-c-content--h1 pf-m-page-title"
4656
+ id="main-title"
4657
+ >Main title</h1>
4502
4658
  <p class="pf-v6-c-content--p">This is a full page demo.</p>
4503
4659
  </div>
4504
4660
  </section>