@patternfly/patternfly 6.0.0-alpha.139 → 6.0.0-alpha.140

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 (34) hide show
  1. package/components/MultipleFileUpload/multiple-file-upload.css +1 -1
  2. package/components/MultipleFileUpload/multiple-file-upload.scss +1 -1
  3. package/components/Nav/nav.css +7 -0
  4. package/components/Nav/nav.scss +11 -0
  5. package/components/_index.css +8 -1
  6. package/docs/components/Nav/examples/Navigation.md +253 -194
  7. package/docs/demos/AboutModal/examples/AboutModal.md +15 -5
  8. package/docs/demos/Alert/examples/Alert.md +45 -15
  9. package/docs/demos/BackToTop/examples/BackToTop.md +15 -5
  10. package/docs/demos/Banner/examples/Banner.md +30 -10
  11. package/docs/demos/CardView/examples/CardView.md +33 -13
  12. package/docs/demos/ContextSelector/examples/ContextSelector.md +60 -20
  13. package/docs/demos/Dashboard/examples/Dashboard.md +15 -5
  14. package/docs/demos/DataList/examples/DataList.md +60 -20
  15. package/docs/demos/DescriptionList/examples/DescriptionList.md +45 -15
  16. package/docs/demos/Drawer/examples/Drawer.md +75 -25
  17. package/docs/demos/JumpLinks/examples/JumpLinks.md +90 -30
  18. package/docs/demos/Masthead/examples/Masthead.md +135 -45
  19. package/docs/demos/Modal/examples/Modal.md +90 -30
  20. package/docs/demos/Nav/examples/Nav.md +132 -46
  21. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +75 -25
  22. package/docs/demos/Page/examples/Page.md +141 -47
  23. package/docs/demos/Page/examples/Penta.md +36 -12
  24. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +105 -35
  25. package/docs/demos/Skeleton/examples/Skeleton.md +15 -5
  26. package/docs/demos/Table/examples/Table.md +225 -75
  27. package/docs/demos/Tabs/examples/Tabs.md +90 -30
  28. package/docs/demos/Toolbar/examples/Toolbar.md +30 -10
  29. package/docs/demos/Wizard/examples/Wizard.md +135 -45
  30. package/package.json +1 -1
  31. package/patternfly-no-globals.css +8 -1
  32. package/patternfly.css +8 -1
  33. package/patternfly.min.css +1 -1
  34. package/patternfly.min.css.map +1 -1
package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md CHANGED
@@ -208,23 +208,33 @@ section: components
208
208
  <nav class="pf-v6-c-nav" id="-page-primary-nav" aria-label="Global">
209
209
  <ul class="pf-v6-c-nav__list" role="list">
210
210
  <li class="pf-v6-c-nav__item">
211
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
211
+ <a href="#" class="pf-v6-c-nav__link">
212
+ <span class="pf-v6-c-nav__link-text">System panel</span>
213
+ </a>
212
214
  </li>
213
215
  <li class="pf-v6-c-nav__item">
214
216
  <a
215
217
  href="#"
216
218
  class="pf-v6-c-nav__link pf-m-current"
217
219
  aria-current="page"
218
- >Policy</a>
220
+ >
221
+ <span class="pf-v6-c-nav__link-text">Policy</span>
222
+ </a>
219
223
  </li>
220
224
  <li class="pf-v6-c-nav__item">
221
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
225
+ <a href="#" class="pf-v6-c-nav__link">
226
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
227
+ </a>
222
228
  </li>
223
229
  <li class="pf-v6-c-nav__item">
224
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
230
+ <a href="#" class="pf-v6-c-nav__link">
231
+ <span class="pf-v6-c-nav__link-text">Network services</span>
232
+ </a>
225
233
  </li>
226
234
  <li class="pf-v6-c-nav__item">
227
- <a href="#" class="pf-v6-c-nav__link">Server</a>
235
+ <a href="#" class="pf-v6-c-nav__link">
236
+ <span class="pf-v6-c-nav__link-text">Server</span>
237
+ </a>
228
238
  </li>
229
239
  </ul>
230
240
  </nav>
@@ -839,23 +849,33 @@ section: components
839
849
  <nav class="pf-v6-c-nav" id="-page-primary-nav" aria-label="Global">
840
850
  <ul class="pf-v6-c-nav__list" role="list">
841
851
  <li class="pf-v6-c-nav__item">
842
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
852
+ <a href="#" class="pf-v6-c-nav__link">
853
+ <span class="pf-v6-c-nav__link-text">System panel</span>
854
+ </a>
843
855
  </li>
844
856
  <li class="pf-v6-c-nav__item">
845
857
  <a
846
858
  href="#"
847
859
  class="pf-v6-c-nav__link pf-m-current"
848
860
  aria-current="page"
849
- >Policy</a>
861
+ >
862
+ <span class="pf-v6-c-nav__link-text">Policy</span>
863
+ </a>
850
864
  </li>
851
865
  <li class="pf-v6-c-nav__item">
852
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
866
+ <a href="#" class="pf-v6-c-nav__link">
867
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
868
+ </a>
853
869
  </li>
854
870
  <li class="pf-v6-c-nav__item">
855
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
871
+ <a href="#" class="pf-v6-c-nav__link">
872
+ <span class="pf-v6-c-nav__link-text">Network services</span>
873
+ </a>
856
874
  </li>
857
875
  <li class="pf-v6-c-nav__item">
858
- <a href="#" class="pf-v6-c-nav__link">Server</a>
876
+ <a href="#" class="pf-v6-c-nav__link">
877
+ <span class="pf-v6-c-nav__link-text">Server</span>
878
+ </a>
859
879
  </li>
860
880
  </ul>
861
881
  </nav>
@@ -1470,23 +1490,33 @@ section: components
1470
1490
  <nav class="pf-v6-c-nav" id="-page-primary-nav" aria-label="Global">
1471
1491
  <ul class="pf-v6-c-nav__list" role="list">
1472
1492
  <li class="pf-v6-c-nav__item">
1473
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
1493
+ <a href="#" class="pf-v6-c-nav__link">
1494
+ <span class="pf-v6-c-nav__link-text">System panel</span>
1495
+ </a>
1474
1496
  </li>
1475
1497
  <li class="pf-v6-c-nav__item">
1476
1498
  <a
1477
1499
  href="#"
1478
1500
  class="pf-v6-c-nav__link pf-m-current"
1479
1501
  aria-current="page"
1480
- >Policy</a>
1502
+ >
1503
+ <span class="pf-v6-c-nav__link-text">Policy</span>
1504
+ </a>
1481
1505
  </li>
1482
1506
  <li class="pf-v6-c-nav__item">
1483
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
1507
+ <a href="#" class="pf-v6-c-nav__link">
1508
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
1509
+ </a>
1484
1510
  </li>
1485
1511
  <li class="pf-v6-c-nav__item">
1486
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
1512
+ <a href="#" class="pf-v6-c-nav__link">
1513
+ <span class="pf-v6-c-nav__link-text">Network services</span>
1514
+ </a>
1487
1515
  </li>
1488
1516
  <li class="pf-v6-c-nav__item">
1489
- <a href="#" class="pf-v6-c-nav__link">Server</a>
1517
+ <a href="#" class="pf-v6-c-nav__link">
1518
+ <span class="pf-v6-c-nav__link-text">Server</span>
1519
+ </a>
1490
1520
  </li>
1491
1521
  </ul>
1492
1522
  </nav>
@@ -2104,23 +2134,33 @@ section: components
2104
2134
  <nav class="pf-v6-c-nav" id="-page-primary-nav" aria-label="Global">
2105
2135
  <ul class="pf-v6-c-nav__list" role="list">
2106
2136
  <li class="pf-v6-c-nav__item">
2107
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
2137
+ <a href="#" class="pf-v6-c-nav__link">
2138
+ <span class="pf-v6-c-nav__link-text">System panel</span>
2139
+ </a>
2108
2140
  </li>
2109
2141
  <li class="pf-v6-c-nav__item">
2110
2142
  <a
2111
2143
  href="#"
2112
2144
  class="pf-v6-c-nav__link pf-m-current"
2113
2145
  aria-current="page"
2114
- >Policy</a>
2146
+ >
2147
+ <span class="pf-v6-c-nav__link-text">Policy</span>
2148
+ </a>
2115
2149
  </li>
2116
2150
  <li class="pf-v6-c-nav__item">
2117
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
2151
+ <a href="#" class="pf-v6-c-nav__link">
2152
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
2153
+ </a>
2118
2154
  </li>
2119
2155
  <li class="pf-v6-c-nav__item">
2120
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
2156
+ <a href="#" class="pf-v6-c-nav__link">
2157
+ <span class="pf-v6-c-nav__link-text">Network services</span>
2158
+ </a>
2121
2159
  </li>
2122
2160
  <li class="pf-v6-c-nav__item">
2123
- <a href="#" class="pf-v6-c-nav__link">Server</a>
2161
+ <a href="#" class="pf-v6-c-nav__link">
2162
+ <span class="pf-v6-c-nav__link-text">Server</span>
2163
+ </a>
2124
2164
  </li>
2125
2165
  </ul>
2126
2166
  </nav>
@@ -2733,23 +2773,33 @@ section: components
2733
2773
  <nav class="pf-v6-c-nav" id="-page-primary-nav" aria-label="Global">
2734
2774
  <ul class="pf-v6-c-nav__list" role="list">
2735
2775
  <li class="pf-v6-c-nav__item">
2736
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
2776
+ <a href="#" class="pf-v6-c-nav__link">
2777
+ <span class="pf-v6-c-nav__link-text">System panel</span>
2778
+ </a>
2737
2779
  </li>
2738
2780
  <li class="pf-v6-c-nav__item">
2739
2781
  <a
2740
2782
  href="#"
2741
2783
  class="pf-v6-c-nav__link pf-m-current"
2742
2784
  aria-current="page"
2743
- >Policy</a>
2785
+ >
2786
+ <span class="pf-v6-c-nav__link-text">Policy</span>
2787
+ </a>
2744
2788
  </li>
2745
2789
  <li class="pf-v6-c-nav__item">
2746
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
2790
+ <a href="#" class="pf-v6-c-nav__link">
2791
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
2792
+ </a>
2747
2793
  </li>
2748
2794
  <li class="pf-v6-c-nav__item">
2749
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
2795
+ <a href="#" class="pf-v6-c-nav__link">
2796
+ <span class="pf-v6-c-nav__link-text">Network services</span>
2797
+ </a>
2750
2798
  </li>
2751
2799
  <li class="pf-v6-c-nav__item">
2752
- <a href="#" class="pf-v6-c-nav__link">Server</a>
2800
+ <a href="#" class="pf-v6-c-nav__link">
2801
+ <span class="pf-v6-c-nav__link-text">Server</span>
2802
+ </a>
2753
2803
  </li>
2754
2804
  </ul>
2755
2805
  </nav>
package/docs/demos/Page/examples/Page.md CHANGED
@@ -205,23 +205,33 @@ wrapperTag: div
205
205
  >
206
206
  <ul class="pf-v6-c-nav__list" role="list">
207
207
  <li class="pf-v6-c-nav__item">
208
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
208
+ <a href="#" class="pf-v6-c-nav__link">
209
+ <span class="pf-v6-c-nav__link-text">System panel</span>
210
+ </a>
209
211
  </li>
210
212
  <li class="pf-v6-c-nav__item">
211
213
  <a
212
214
  href="#"
213
215
  class="pf-v6-c-nav__link pf-m-current"
214
216
  aria-current="page"
215
- >Policy</a>
217
+ >
218
+ <span class="pf-v6-c-nav__link-text">Policy</span>
219
+ </a>
216
220
  </li>
217
221
  <li class="pf-v6-c-nav__item">
218
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
222
+ <a href="#" class="pf-v6-c-nav__link">
223
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
224
+ </a>
219
225
  </li>
220
226
  <li class="pf-v6-c-nav__item">
221
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
227
+ <a href="#" class="pf-v6-c-nav__link">
228
+ <span class="pf-v6-c-nav__link-text">Network services</span>
229
+ </a>
222
230
  </li>
223
231
  <li class="pf-v6-c-nav__item">
224
- <a href="#" class="pf-v6-c-nav__link">Server</a>
232
+ <a href="#" class="pf-v6-c-nav__link">
233
+ <span class="pf-v6-c-nav__link-text">Server</span>
234
+ </a>
225
235
  </li>
226
236
  </ul>
227
237
  </nav>
@@ -528,23 +538,33 @@ wrapperTag: div
528
538
  >
529
539
  <ul class="pf-v6-c-nav__list" role="list">
530
540
  <li class="pf-v6-c-nav__item">
531
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
541
+ <a href="#" class="pf-v6-c-nav__link">
542
+ <span class="pf-v6-c-nav__link-text">System panel</span>
543
+ </a>
532
544
  </li>
533
545
  <li class="pf-v6-c-nav__item">
534
546
  <a
535
547
  href="#"
536
548
  class="pf-v6-c-nav__link pf-m-current"
537
549
  aria-current="page"
538
- >Policy</a>
550
+ >
551
+ <span class="pf-v6-c-nav__link-text">Policy</span>
552
+ </a>
539
553
  </li>
540
554
  <li class="pf-v6-c-nav__item">
541
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
555
+ <a href="#" class="pf-v6-c-nav__link">
556
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
557
+ </a>
542
558
  </li>
543
559
  <li class="pf-v6-c-nav__item">
544
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
560
+ <a href="#" class="pf-v6-c-nav__link">
561
+ <span class="pf-v6-c-nav__link-text">Network services</span>
562
+ </a>
545
563
  </li>
546
564
  <li class="pf-v6-c-nav__item">
547
- <a href="#" class="pf-v6-c-nav__link">Server</a>
565
+ <a href="#" class="pf-v6-c-nav__link">
566
+ <span class="pf-v6-c-nav__link-text">Server</span>
567
+ </a>
548
568
  </li>
549
569
  </ul>
550
570
  </nav>
@@ -856,23 +876,33 @@ wrapperTag: div
856
876
  >
857
877
  <ul class="pf-v6-c-nav__list" role="list">
858
878
  <li class="pf-v6-c-nav__item">
859
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
879
+ <a href="#" class="pf-v6-c-nav__link">
880
+ <span class="pf-v6-c-nav__link-text">System panel</span>
881
+ </a>
860
882
  </li>
861
883
  <li class="pf-v6-c-nav__item">
862
884
  <a
863
885
  href="#"
864
886
  class="pf-v6-c-nav__link pf-m-current"
865
887
  aria-current="page"
866
- >Policy</a>
888
+ >
889
+ <span class="pf-v6-c-nav__link-text">Policy</span>
890
+ </a>
867
891
  </li>
868
892
  <li class="pf-v6-c-nav__item">
869
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
893
+ <a href="#" class="pf-v6-c-nav__link">
894
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
895
+ </a>
870
896
  </li>
871
897
  <li class="pf-v6-c-nav__item">
872
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
898
+ <a href="#" class="pf-v6-c-nav__link">
899
+ <span class="pf-v6-c-nav__link-text">Network services</span>
900
+ </a>
873
901
  </li>
874
902
  <li class="pf-v6-c-nav__item">
875
- <a href="#" class="pf-v6-c-nav__link">Server</a>
903
+ <a href="#" class="pf-v6-c-nav__link">
904
+ <span class="pf-v6-c-nav__link-text">Server</span>
905
+ </a>
876
906
  </li>
877
907
  </ul>
878
908
  </nav>
@@ -898,10 +928,14 @@ wrapperTag: div
898
928
  href="#"
899
929
  class="pf-v6-c-nav__link pf-m-current"
900
930
  aria-current="page"
901
- >Horizontal subnav item 1</a>
931
+ >
932
+ <span class="pf-v6-c-nav__link-text">Horizontal subnav item 1</span>
933
+ </a>
902
934
  </li>
903
935
  <li class="pf-v6-c-nav__item">
904
- <a href="#" class="pf-v6-c-nav__link">Horizontal subnav item 2</a>
936
+ <a href="#" class="pf-v6-c-nav__link">
937
+ <span class="pf-v6-c-nav__link-text">Horizontal subnav item 2</span>
938
+ </a>
905
939
  </li>
906
940
  </ul>
907
941
  </nav>
@@ -1317,23 +1351,33 @@ wrapperTag: div
1317
1351
  >
1318
1352
  <ul class="pf-v6-c-nav__list" role="list">
1319
1353
  <li class="pf-v6-c-nav__item">
1320
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
1354
+ <a href="#" class="pf-v6-c-nav__link">
1355
+ <span class="pf-v6-c-nav__link-text">System panel</span>
1356
+ </a>
1321
1357
  </li>
1322
1358
  <li class="pf-v6-c-nav__item">
1323
1359
  <a
1324
1360
  href="#"
1325
1361
  class="pf-v6-c-nav__link pf-m-current"
1326
1362
  aria-current="page"
1327
- >Policy</a>
1363
+ >
1364
+ <span class="pf-v6-c-nav__link-text">Policy</span>
1365
+ </a>
1328
1366
  </li>
1329
1367
  <li class="pf-v6-c-nav__item">
1330
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
1368
+ <a href="#" class="pf-v6-c-nav__link">
1369
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
1370
+ </a>
1331
1371
  </li>
1332
1372
  <li class="pf-v6-c-nav__item">
1333
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
1373
+ <a href="#" class="pf-v6-c-nav__link">
1374
+ <span class="pf-v6-c-nav__link-text">Network services</span>
1375
+ </a>
1334
1376
  </li>
1335
1377
  <li class="pf-v6-c-nav__item">
1336
- <a href="#" class="pf-v6-c-nav__link">Server</a>
1378
+ <a href="#" class="pf-v6-c-nav__link">
1379
+ <span class="pf-v6-c-nav__link-text">Server</span>
1380
+ </a>
1337
1381
  </li>
1338
1382
  </ul>
1339
1383
  </nav>
@@ -1757,23 +1801,33 @@ wrapperTag: div
1757
1801
  >
1758
1802
  <ul class="pf-v6-c-nav__list" role="list">
1759
1803
  <li class="pf-v6-c-nav__item">
1760
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
1804
+ <a href="#" class="pf-v6-c-nav__link">
1805
+ <span class="pf-v6-c-nav__link-text">System panel</span>
1806
+ </a>
1761
1807
  </li>
1762
1808
  <li class="pf-v6-c-nav__item">
1763
1809
  <a
1764
1810
  href="#"
1765
1811
  class="pf-v6-c-nav__link pf-m-current"
1766
1812
  aria-current="page"
1767
- >Policy</a>
1813
+ >
1814
+ <span class="pf-v6-c-nav__link-text">Policy</span>
1815
+ </a>
1768
1816
  </li>
1769
1817
  <li class="pf-v6-c-nav__item">
1770
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
1818
+ <a href="#" class="pf-v6-c-nav__link">
1819
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
1820
+ </a>
1771
1821
  </li>
1772
1822
  <li class="pf-v6-c-nav__item">
1773
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
1823
+ <a href="#" class="pf-v6-c-nav__link">
1824
+ <span class="pf-v6-c-nav__link-text">Network services</span>
1825
+ </a>
1774
1826
  </li>
1775
1827
  <li class="pf-v6-c-nav__item">
1776
- <a href="#" class="pf-v6-c-nav__link">Server</a>
1828
+ <a href="#" class="pf-v6-c-nav__link">
1829
+ <span class="pf-v6-c-nav__link-text">Server</span>
1830
+ </a>
1777
1831
  </li>
1778
1832
  </ul>
1779
1833
  </nav>
@@ -2197,23 +2251,33 @@ wrapperTag: div
2197
2251
  >
2198
2252
  <ul class="pf-v6-c-nav__list" role="list">
2199
2253
  <li class="pf-v6-c-nav__item">
2200
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
2254
+ <a href="#" class="pf-v6-c-nav__link">
2255
+ <span class="pf-v6-c-nav__link-text">System panel</span>
2256
+ </a>
2201
2257
  </li>
2202
2258
  <li class="pf-v6-c-nav__item">
2203
2259
  <a
2204
2260
  href="#"
2205
2261
  class="pf-v6-c-nav__link pf-m-current"
2206
2262
  aria-current="page"
2207
- >Policy</a>
2263
+ >
2264
+ <span class="pf-v6-c-nav__link-text">Policy</span>
2265
+ </a>
2208
2266
  </li>
2209
2267
  <li class="pf-v6-c-nav__item">
2210
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
2268
+ <a href="#" class="pf-v6-c-nav__link">
2269
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
2270
+ </a>
2211
2271
  </li>
2212
2272
  <li class="pf-v6-c-nav__item">
2213
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
2273
+ <a href="#" class="pf-v6-c-nav__link">
2274
+ <span class="pf-v6-c-nav__link-text">Network services</span>
2275
+ </a>
2214
2276
  </li>
2215
2277
  <li class="pf-v6-c-nav__item">
2216
- <a href="#" class="pf-v6-c-nav__link">Server</a>
2278
+ <a href="#" class="pf-v6-c-nav__link">
2279
+ <span class="pf-v6-c-nav__link-text">Server</span>
2280
+ </a>
2217
2281
  </li>
2218
2282
  </ul>
2219
2283
  </nav>
@@ -2637,23 +2701,33 @@ wrapperTag: div
2637
2701
  >
2638
2702
  <ul class="pf-v6-c-nav__list" role="list">
2639
2703
  <li class="pf-v6-c-nav__item">
2640
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
2704
+ <a href="#" class="pf-v6-c-nav__link">
2705
+ <span class="pf-v6-c-nav__link-text">System panel</span>
2706
+ </a>
2641
2707
  </li>
2642
2708
  <li class="pf-v6-c-nav__item">
2643
2709
  <a
2644
2710
  href="#"
2645
2711
  class="pf-v6-c-nav__link pf-m-current"
2646
2712
  aria-current="page"
2647
- >Policy</a>
2713
+ >
2714
+ <span class="pf-v6-c-nav__link-text">Policy</span>
2715
+ </a>
2648
2716
  </li>
2649
2717
  <li class="pf-v6-c-nav__item">
2650
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
2718
+ <a href="#" class="pf-v6-c-nav__link">
2719
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
2720
+ </a>
2651
2721
  </li>
2652
2722
  <li class="pf-v6-c-nav__item">
2653
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
2723
+ <a href="#" class="pf-v6-c-nav__link">
2724
+ <span class="pf-v6-c-nav__link-text">Network services</span>
2725
+ </a>
2654
2726
  </li>
2655
2727
  <li class="pf-v6-c-nav__item">
2656
- <a href="#" class="pf-v6-c-nav__link">Server</a>
2728
+ <a href="#" class="pf-v6-c-nav__link">
2729
+ <span class="pf-v6-c-nav__link-text">Server</span>
2730
+ </a>
2657
2731
  </li>
2658
2732
  </ul>
2659
2733
  </nav>
@@ -3079,23 +3153,33 @@ wrapperTag: div
3079
3153
  >
3080
3154
  <ul class="pf-v6-c-nav__list" role="list">
3081
3155
  <li class="pf-v6-c-nav__item">
3082
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
3156
+ <a href="#" class="pf-v6-c-nav__link">
3157
+ <span class="pf-v6-c-nav__link-text">System panel</span>
3158
+ </a>
3083
3159
  </li>
3084
3160
  <li class="pf-v6-c-nav__item">
3085
3161
  <a
3086
3162
  href="#"
3087
3163
  class="pf-v6-c-nav__link pf-m-current"
3088
3164
  aria-current="page"
3089
- >Policy</a>
3165
+ >
3166
+ <span class="pf-v6-c-nav__link-text">Policy</span>
3167
+ </a>
3090
3168
  </li>
3091
3169
  <li class="pf-v6-c-nav__item">
3092
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
3170
+ <a href="#" class="pf-v6-c-nav__link">
3171
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
3172
+ </a>
3093
3173
  </li>
3094
3174
  <li class="pf-v6-c-nav__item">
3095
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
3175
+ <a href="#" class="pf-v6-c-nav__link">
3176
+ <span class="pf-v6-c-nav__link-text">Network services</span>
3177
+ </a>
3096
3178
  </li>
3097
3179
  <li class="pf-v6-c-nav__item">
3098
- <a href="#" class="pf-v6-c-nav__link">Server</a>
3180
+ <a href="#" class="pf-v6-c-nav__link">
3181
+ <span class="pf-v6-c-nav__link-text">Server</span>
3182
+ </a>
3099
3183
  </li>
3100
3184
  </ul>
3101
3185
  </nav>
@@ -3526,23 +3610,33 @@ wrapperTag: div
3526
3610
  >
3527
3611
  <ul class="pf-v6-c-nav__list" role="list">
3528
3612
  <li class="pf-v6-c-nav__item">
3529
- <a href="#" class="pf-v6-c-nav__link">System panel</a>
3613
+ <a href="#" class="pf-v6-c-nav__link">
3614
+ <span class="pf-v6-c-nav__link-text">System panel</span>
3615
+ </a>
3530
3616
  </li>
3531
3617
  <li class="pf-v6-c-nav__item">
3532
3618
  <a
3533
3619
  href="#"
3534
3620
  class="pf-v6-c-nav__link pf-m-current"
3535
3621
  aria-current="page"
3536
- >Policy</a>
3622
+ >
3623
+ <span class="pf-v6-c-nav__link-text">Policy</span>
3624
+ </a>
3537
3625
  </li>
3538
3626
  <li class="pf-v6-c-nav__item">
3539
- <a href="#" class="pf-v6-c-nav__link">Authentication</a>
3627
+ <a href="#" class="pf-v6-c-nav__link">
3628
+ <span class="pf-v6-c-nav__link-text">Authentication</span>
3629
+ </a>
3540
3630
  </li>
3541
3631
  <li class="pf-v6-c-nav__item">
3542
- <a href="#" class="pf-v6-c-nav__link">Network services</a>
3632
+ <a href="#" class="pf-v6-c-nav__link">
3633
+ <span class="pf-v6-c-nav__link-text">Network services</span>
3634
+ </a>
3543
3635
  </li>
3544
3636
  <li class="pf-v6-c-nav__item">
3545
- <a href="#" class="pf-v6-c-nav__link">Server</a>
3637
+ <a href="#" class="pf-v6-c-nav__link">
3638
+ <span class="pf-v6-c-nav__link-text">Server</span>
3639
+ </a>
3546
3640
  </li>
3547
3641
  </ul>
3548
3642
  </nav>
package/docs/demos/Page/examples/Penta.md CHANGED
@@ -139,32 +139,48 @@ wrapperTag: div
139
139
  <h2 class="pf-v6-c-nav__section-title" id="grouped-title1">Cluster</h2>
140
140
  <ul class="pf-v6-c-nav__list" role="list">
141
141
  <li class="pf-v6-c-nav__item">
142
- <a href="#" class="pf-v6-c-nav__link">Dashboard</a>
142
+ <a href="#" class="pf-v6-c-nav__link">
143
+ <span class="pf-v6-c-nav__link-text">Dashboard</span>
144
+ </a>
143
145
  </li>
144
146
  <li class="pf-v6-c-nav__item">
145
- <a href="#" class="pf-v6-c-nav__link">Builds</a>
147
+ <a href="#" class="pf-v6-c-nav__link">
148
+ <span class="pf-v6-c-nav__link-text">Builds</span>
149
+ </a>
146
150
  </li>
147
151
  <li class="pf-v6-c-nav__item">
148
- <a href="#" class="pf-v6-c-nav__link">Compute</a>
152
+ <a href="#" class="pf-v6-c-nav__link">
153
+ <span class="pf-v6-c-nav__link-text">Compute</span>
154
+ </a>
149
155
  </li>
150
156
  <li class="pf-v6-c-nav__item">
151
- <a href="#" class="pf-v6-c-nav__link">Networking</a>
157
+ <a href="#" class="pf-v6-c-nav__link">
158
+ <span class="pf-v6-c-nav__link-text">Networking</span>
159
+ </a>
152
160
  </li>
153
161
  <li class="pf-v6-c-nav__item">
154
- <a href="#" class="pf-v6-c-nav__link">Observe</a>
162
+ <a href="#" class="pf-v6-c-nav__link">
163
+ <span class="pf-v6-c-nav__link-text">Observe</span>
164
+ </a>
155
165
  </li>
156
166
  <li class="pf-v6-c-nav__item">
157
- <a href="#" class="pf-v6-c-nav__link">Operators</a>
167
+ <a href="#" class="pf-v6-c-nav__link">
168
+ <span class="pf-v6-c-nav__link-text">Operators</span>
169
+ </a>
158
170
  </li>
159
171
  <li class="pf-v6-c-nav__item">
160
172
  <a
161
173
  href="#"
162
174
  class="pf-v6-c-nav__link pf-m-current"
163
175
  aria-current="page"
164
- >Applications</a>
176
+ >
177
+ <span class="pf-v6-c-nav__link-text">Applications</span>
178
+ </a>
165
179
  </li>
166
180
  <li class="pf-v6-c-nav__item">
167
- <a href="#" class="pf-v6-c-nav__link">Workloads</a>
181
+ <a href="#" class="pf-v6-c-nav__link">
182
+ <span class="pf-v6-c-nav__link-text">Workloads</span>
183
+ </a>
168
184
  </li>
169
185
  </ul>
170
186
  </section>
@@ -173,16 +189,24 @@ wrapperTag: div
173
189
  <h2 class="pf-v6-c-nav__section-title" id="grouped-title2">Settings</h2>
174
190
  <ul class="pf-v6-c-nav__list" role="list">
175
191
  <li class="pf-v6-c-nav__item">
176
- <a href="#" class="pf-v6-c-nav__link">User Management</a>
192
+ <a href="#" class="pf-v6-c-nav__link">
193
+ <span class="pf-v6-c-nav__link-text">User Management</span>
194
+ </a>
177
195
  </li>
178
196
  <li class="pf-v6-c-nav__item">
179
- <a href="#" class="pf-v6-c-nav__link">Administration</a>
197
+ <a href="#" class="pf-v6-c-nav__link">
198
+ <span class="pf-v6-c-nav__link-text">Administration</span>
199
+ </a>
180
200
  </li>
181
201
  <li class="pf-v6-c-nav__item">
182
- <a href="#" class="pf-v6-c-nav__link">Import YAML</a>
202
+ <a href="#" class="pf-v6-c-nav__link">
203
+ <span class="pf-v6-c-nav__link-text">Import YAML</span>
204
+ </a>
183
205
  </li>
184
206
  <li class="pf-v6-c-nav__item">
185
- <a href="#" class="pf-v6-c-nav__link">Help and Support</a>
207
+ <a href="#" class="pf-v6-c-nav__link">
208
+ <span class="pf-v6-c-nav__link-text">Help and Support</span>
209
+ </a>
186
210
  </li>
187
211
  </ul>
188
212
  </section>