@patternfly/patternfly 6.5.0-prerelease.46 → 6.5.0-prerelease.48

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 (83) hide show
  1. package/components/Accordion/accordion.css +1 -1
  2. package/components/Accordion/accordion.scss +1 -1
  3. package/components/Alert/alert.css +2 -1
  4. package/components/Alert/alert.scss +2 -1
  5. package/components/Card/card.css +1 -1
  6. package/components/Card/card.scss +1 -1
  7. package/components/ClipboardCopy/clipboard-copy.css +1 -1
  8. package/components/ClipboardCopy/clipboard-copy.scss +1 -1
  9. package/components/DataList/data-list.css +1 -1
  10. package/components/DataList/data-list.scss +1 -1
  11. package/components/DualListSelector/dual-list-selector.css +1 -1
  12. package/components/DualListSelector/dual-list-selector.scss +1 -1
  13. package/components/ExpandableSection/expandable-section.css +2 -2
  14. package/components/ExpandableSection/expandable-section.scss +2 -2
  15. package/components/Form/form.css +1 -1
  16. package/components/Form/form.scss +1 -1
  17. package/components/JumpLinks/jump-links.css +1 -1
  18. package/components/JumpLinks/jump-links.scss +1 -1
  19. package/components/Nav/nav.css +1 -1
  20. package/components/Nav/nav.scss +1 -1
  21. package/components/NotificationDrawer/notification-drawer.css +1 -1
  22. package/components/NotificationDrawer/notification-drawer.scss +1 -1
  23. package/components/Table/table.css +2 -2
  24. package/components/Table/table.scss +2 -2
  25. package/components/Tabs/tabs.css +2 -2
  26. package/components/Tabs/tabs.scss +2 -2
  27. package/components/Toolbar/toolbar.css +1 -1
  28. package/components/Toolbar/toolbar.scss +1 -1
  29. package/components/TreeView/tree-view.css +1 -1
  30. package/components/TreeView/tree-view.scss +1 -1
  31. package/components/Wizard/wizard.css +1 -1
  32. package/components/Wizard/wizard.scss +1 -1
  33. package/components/_index.css +20 -19
  34. package/docs/components/Accordion/examples/Accordion.md +390 -30
  35. package/docs/components/Alert/examples/Alert.md +494 -38
  36. package/docs/components/Breadcrumb/examples/Breadcrumb.md +299 -23
  37. package/docs/components/CalendarMonth/examples/CalendarMonth.md +16 -16
  38. package/docs/components/Card/examples/Card.md +52 -4
  39. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +78 -6
  40. package/docs/components/CodeBlock/examples/CodeBlock.md +26 -2
  41. package/docs/components/DataList/examples/DataList.md +221 -17
  42. package/docs/components/DualListSelector/examples/DualListSelector.md +169 -13
  43. package/docs/components/ExpandableSection/examples/ExpandableSection.md +91 -7
  44. package/docs/components/Form/examples/Form.md +78 -6
  45. package/docs/components/Icon/examples/Icon.md +26 -2
  46. package/docs/components/JumpLinks/examples/JumpLinks.md +52 -4
  47. package/docs/components/Menu/examples/Menu.md +1456 -112
  48. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +39 -3
  49. package/docs/components/Nav/examples/Navigation.md +710 -62
  50. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +52 -4
  51. package/docs/components/Table/examples/Table.md +819 -63
  52. package/docs/components/Tabs/examples/Tabs.md +321 -213
  53. package/docs/components/TreeView/examples/TreeView.md +1300 -100
  54. package/docs/components/Wizard/examples/Wizard.md +323 -59
  55. package/docs/demos/AboutModal/examples/AboutModal.md +39 -3
  56. package/docs/demos/Alert/examples/Alert.md +182 -14
  57. package/docs/demos/BackToTop/examples/BackToTop.md +39 -3
  58. package/docs/demos/Banner/examples/Banner.md +78 -6
  59. package/docs/demos/Card/examples/Card.md +242 -29
  60. package/docs/demos/CardView/examples/CardView.md +78 -6
  61. package/docs/demos/Compass/examples/Compass.md +71 -35
  62. package/docs/demos/Dashboard/examples/Dashboard.md +104 -8
  63. package/docs/demos/DataList/examples/DataList.md +234 -18
  64. package/docs/demos/DescriptionList/examples/DescriptionList.md +117 -9
  65. package/docs/demos/Drawer/examples/Drawer.md +141 -15
  66. package/docs/demos/Form/examples/BasicForms.md +143 -11
  67. package/docs/demos/JumpLinks/examples/JumpLinks.md +216 -27
  68. package/docs/demos/Masthead/examples/Masthead.md +355 -31
  69. package/docs/demos/Modal/examples/Modal.md +234 -18
  70. package/docs/demos/Nav/examples/Nav.md +320 -32
  71. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +247 -19
  72. package/docs/demos/Page/examples/Page.md +546 -42
  73. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +281 -29
  74. package/docs/demos/Skeleton/examples/Skeleton.md +39 -3
  75. package/docs/demos/Table/examples/Table.md +702 -54
  76. package/docs/demos/Tabs/examples/Tabs.md +238 -22
  77. package/docs/demos/Toolbar/examples/Toolbar.md +78 -6
  78. package/docs/demos/Wizard/examples/Wizard.md +621 -72
  79. package/package.json +1 -1
  80. package/patternfly-no-globals.css +20 -19
  81. package/patternfly.css +20 -19
  82. package/patternfly.min.css +1 -1
  83. package/patternfly.min.css.map +1 -1
@@ -49,10 +49,21 @@ wrapperTag: div
49
49
  <span class="pf-v6-c-wizard__toggle-list-item">
50
50
  <span class="pf-v6-c-wizard__toggle-num">2</span>
51
51
  Configuration
52
- <i
53
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
54
- aria-hidden="true"
55
- ></i>
52
+ <span class="pf-v6-c-wizard__toggle-separator">
53
+ <svg
54
+ class="pf-v6-svg"
55
+ viewBox="0 0 20 20"
56
+ fill="currentColor"
57
+ aria-hidden="true"
58
+ role="img"
59
+ width="1em"
60
+ height="1em"
61
+ >
62
+ <path
63
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
64
+ />
65
+ </svg>
66
+ </span>
56
67
  </span>
57
68
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
58
69
  </span>
@@ -81,7 +92,19 @@ wrapperTag: div
81
92
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
82
93
  <span class="pf-v6-c-wizard__nav-link-toggle">
83
94
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
84
- <i class="fas fa-angle-right" aria-hidden="true"></i>
95
+ <svg
96
+ class="pf-v6-svg"
97
+ viewBox="0 0 20 20"
98
+ fill="currentColor"
99
+ aria-hidden="true"
100
+ role="img"
101
+ width="1em"
102
+ height="1em"
103
+ >
104
+ <path
105
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
106
+ />
107
+ </svg>
85
108
  </span>
86
109
  </span>
87
110
  </span>
@@ -347,10 +370,21 @@ wrapperTag: div
347
370
  <span class="pf-v6-c-wizard__toggle-list-item">
348
371
  <span class="pf-v6-c-wizard__toggle-num">2</span>
349
372
  Configuration
350
- <i
351
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
352
- aria-hidden="true"
353
- ></i>
373
+ <span class="pf-v6-c-wizard__toggle-separator">
374
+ <svg
375
+ class="pf-v6-svg"
376
+ viewBox="0 0 20 20"
377
+ fill="currentColor"
378
+ aria-hidden="true"
379
+ role="img"
380
+ width="1em"
381
+ height="1em"
382
+ >
383
+ <path
384
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
385
+ />
386
+ </svg>
387
+ </span>
354
388
  </span>
355
389
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
356
390
  </span>
@@ -379,7 +413,19 @@ wrapperTag: div
379
413
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
380
414
  <span class="pf-v6-c-wizard__nav-link-toggle">
381
415
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
382
- <i class="fas fa-angle-right" aria-hidden="true"></i>
416
+ <svg
417
+ class="pf-v6-svg"
418
+ viewBox="0 0 20 20"
419
+ fill="currentColor"
420
+ aria-hidden="true"
421
+ role="img"
422
+ width="1em"
423
+ height="1em"
424
+ >
425
+ <path
426
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
427
+ />
428
+ </svg>
383
429
  </span>
384
430
  </span>
385
431
  </span>
@@ -645,10 +691,21 @@ wrapperTag: div
645
691
  <span class="pf-v6-c-wizard__toggle-list-item">
646
692
  <span class="pf-v6-c-wizard__toggle-num">2</span>
647
693
  Configuration
648
- <i
649
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
650
- aria-hidden="true"
651
- ></i>
694
+ <span class="pf-v6-c-wizard__toggle-separator">
695
+ <svg
696
+ class="pf-v6-svg"
697
+ viewBox="0 0 20 20"
698
+ fill="currentColor"
699
+ aria-hidden="true"
700
+ role="img"
701
+ width="1em"
702
+ height="1em"
703
+ >
704
+ <path
705
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
706
+ />
707
+ </svg>
708
+ </span>
652
709
  </span>
653
710
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
654
711
  </span>
@@ -677,7 +734,19 @@ wrapperTag: div
677
734
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
678
735
  <span class="pf-v6-c-wizard__nav-link-toggle">
679
736
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
680
- <i class="fas fa-angle-right" aria-hidden="true"></i>
737
+ <svg
738
+ class="pf-v6-svg"
739
+ viewBox="0 0 20 20"
740
+ fill="currentColor"
741
+ aria-hidden="true"
742
+ role="img"
743
+ width="1em"
744
+ height="1em"
745
+ >
746
+ <path
747
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
748
+ />
749
+ </svg>
681
750
  </span>
682
751
  </span>
683
752
  </span>
@@ -986,10 +1055,21 @@ wrapperTag: div
986
1055
  <span class="pf-v6-c-wizard__toggle-list-item">
987
1056
  <span class="pf-v6-c-wizard__toggle-num">2</span>
988
1057
  Configuration
989
- <i
990
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
991
- aria-hidden="true"
992
- ></i>
1058
+ <span class="pf-v6-c-wizard__toggle-separator">
1059
+ <svg
1060
+ class="pf-v6-svg"
1061
+ viewBox="0 0 20 20"
1062
+ fill="currentColor"
1063
+ aria-hidden="true"
1064
+ role="img"
1065
+ width="1em"
1066
+ height="1em"
1067
+ >
1068
+ <path
1069
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
1070
+ />
1071
+ </svg>
1072
+ </span>
993
1073
  </span>
994
1074
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
995
1075
  </span>
@@ -1022,7 +1102,19 @@ wrapperTag: div
1022
1102
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
1023
1103
  <span class="pf-v6-c-wizard__nav-link-toggle">
1024
1104
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
1025
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1105
+ <svg
1106
+ class="pf-v6-svg"
1107
+ viewBox="0 0 20 20"
1108
+ fill="currentColor"
1109
+ aria-hidden="true"
1110
+ role="img"
1111
+ width="1em"
1112
+ height="1em"
1113
+ >
1114
+ <path
1115
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1116
+ />
1117
+ </svg>
1026
1118
  </span>
1027
1119
  </span>
1028
1120
  </span>
@@ -1284,10 +1376,21 @@ wrapperTag: div
1284
1376
  <span class="pf-v6-c-wizard__toggle-list-item">
1285
1377
  <span class="pf-v6-c-wizard__toggle-num">2</span>
1286
1378
  Configuration
1287
- <i
1288
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
1289
- aria-hidden="true"
1290
- ></i>
1379
+ <span class="pf-v6-c-wizard__toggle-separator">
1380
+ <svg
1381
+ class="pf-v6-svg"
1382
+ viewBox="0 0 20 20"
1383
+ fill="currentColor"
1384
+ aria-hidden="true"
1385
+ role="img"
1386
+ width="1em"
1387
+ height="1em"
1388
+ >
1389
+ <path
1390
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
1391
+ />
1392
+ </svg>
1393
+ </span>
1291
1394
  </span>
1292
1395
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
1293
1396
  </span>
@@ -1316,7 +1419,19 @@ wrapperTag: div
1316
1419
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
1317
1420
  <span class="pf-v6-c-wizard__nav-link-toggle">
1318
1421
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
1319
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1422
+ <svg
1423
+ class="pf-v6-svg"
1424
+ viewBox="0 0 20 20"
1425
+ fill="currentColor"
1426
+ aria-hidden="true"
1427
+ role="img"
1428
+ width="1em"
1429
+ height="1em"
1430
+ >
1431
+ <path
1432
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1433
+ />
1434
+ </svg>
1320
1435
  </span>
1321
1436
  </span>
1322
1437
  </span>
@@ -1582,10 +1697,21 @@ wrapperTag: div
1582
1697
  <span class="pf-v6-c-wizard__toggle-list-item">
1583
1698
  <span class="pf-v6-c-wizard__toggle-num">2</span>
1584
1699
  Configuration
1585
- <i
1586
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
1587
- aria-hidden="true"
1588
- ></i>
1700
+ <span class="pf-v6-c-wizard__toggle-separator">
1701
+ <svg
1702
+ class="pf-v6-svg"
1703
+ viewBox="0 0 20 20"
1704
+ fill="currentColor"
1705
+ aria-hidden="true"
1706
+ role="img"
1707
+ width="1em"
1708
+ height="1em"
1709
+ >
1710
+ <path
1711
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
1712
+ />
1713
+ </svg>
1714
+ </span>
1589
1715
  </span>
1590
1716
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
1591
1717
  </span>
@@ -1775,10 +1901,21 @@ wrapperTag: div
1775
1901
  <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
1776
1902
  </span>
1777
1903
  Configuration
1778
- <i
1779
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
1780
- aria-hidden="true"
1781
- ></i>
1904
+ <span class="pf-v6-c-wizard__toggle-separator">
1905
+ <svg
1906
+ class="pf-v6-svg"
1907
+ viewBox="0 0 20 20"
1908
+ fill="currentColor"
1909
+ aria-hidden="true"
1910
+ role="img"
1911
+ width="1em"
1912
+ height="1em"
1913
+ >
1914
+ <path
1915
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
1916
+ />
1917
+ </svg>
1918
+ </span>
1782
1919
  </span>
1783
1920
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
1784
1921
  </span>
@@ -1810,7 +1947,19 @@ wrapperTag: div
1810
1947
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
1811
1948
  <span class="pf-v6-c-wizard__nav-link-toggle">
1812
1949
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
1813
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1950
+ <svg
1951
+ class="pf-v6-svg"
1952
+ viewBox="0 0 20 20"
1953
+ fill="currentColor"
1954
+ aria-hidden="true"
1955
+ role="img"
1956
+ width="1em"
1957
+ height="1em"
1958
+ >
1959
+ <path
1960
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1961
+ />
1962
+ </svg>
1814
1963
  </span>
1815
1964
  </span>
1816
1965
  </span>
@@ -2078,10 +2227,21 @@ wrapperTag: div
2078
2227
  <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
2079
2228
  </span>
2080
2229
  Configuration
2081
- <i
2082
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
2083
- aria-hidden="true"
2084
- ></i>
2230
+ <span class="pf-v6-c-wizard__toggle-separator">
2231
+ <svg
2232
+ class="pf-v6-svg"
2233
+ viewBox="0 0 20 20"
2234
+ fill="currentColor"
2235
+ aria-hidden="true"
2236
+ role="img"
2237
+ width="1em"
2238
+ height="1em"
2239
+ >
2240
+ <path
2241
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
2242
+ />
2243
+ </svg>
2244
+ </span>
2085
2245
  </span>
2086
2246
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
2087
2247
  </span>
@@ -2113,7 +2273,19 @@ wrapperTag: div
2113
2273
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
2114
2274
  <span class="pf-v6-c-wizard__nav-link-toggle">
2115
2275
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
2116
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2276
+ <svg
2277
+ class="pf-v6-svg"
2278
+ viewBox="0 0 20 20"
2279
+ fill="currentColor"
2280
+ aria-hidden="true"
2281
+ role="img"
2282
+ width="1em"
2283
+ height="1em"
2284
+ >
2285
+ <path
2286
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2287
+ />
2288
+ </svg>
2117
2289
  </span>
2118
2290
  </span>
2119
2291
  </span>
@@ -2381,10 +2553,21 @@ wrapperTag: div
2381
2553
  <i class="fas fa-check-circle" aria-hidden="true"></i>
2382
2554
  </span>
2383
2555
  Configuration
2384
- <i
2385
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
2386
- aria-hidden="true"
2387
- ></i>
2556
+ <span class="pf-v6-c-wizard__toggle-separator">
2557
+ <svg
2558
+ class="pf-v6-svg"
2559
+ viewBox="0 0 20 20"
2560
+ fill="currentColor"
2561
+ aria-hidden="true"
2562
+ role="img"
2563
+ width="1em"
2564
+ height="1em"
2565
+ >
2566
+ <path
2567
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
2568
+ />
2569
+ </svg>
2570
+ </span>
2388
2571
  </span>
2389
2572
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
2390
2573
  </span>
@@ -2416,7 +2599,19 @@ wrapperTag: div
2416
2599
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
2417
2600
  <span class="pf-v6-c-wizard__nav-link-toggle">
2418
2601
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
2419
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2602
+ <svg
2603
+ class="pf-v6-svg"
2604
+ viewBox="0 0 20 20"
2605
+ fill="currentColor"
2606
+ aria-hidden="true"
2607
+ role="img"
2608
+ width="1em"
2609
+ height="1em"
2610
+ >
2611
+ <path
2612
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2613
+ />
2614
+ </svg>
2420
2615
  </span>
2421
2616
  </span>
2422
2617
  </span>
@@ -2684,10 +2879,21 @@ wrapperTag: div
2684
2879
  <i class="fas fa-check-circle" aria-hidden="true"></i>
2685
2880
  </span>
2686
2881
  Configuration
2687
- <i
2688
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
2689
- aria-hidden="true"
2690
- ></i>
2882
+ <span class="pf-v6-c-wizard__toggle-separator">
2883
+ <svg
2884
+ class="pf-v6-svg"
2885
+ viewBox="0 0 20 20"
2886
+ fill="currentColor"
2887
+ aria-hidden="true"
2888
+ role="img"
2889
+ width="1em"
2890
+ height="1em"
2891
+ >
2892
+ <path
2893
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
2894
+ />
2895
+ </svg>
2896
+ </span>
2691
2897
  </span>
2692
2898
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
2693
2899
  </span>
@@ -2719,7 +2925,19 @@ wrapperTag: div
2719
2925
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
2720
2926
  <span class="pf-v6-c-wizard__nav-link-toggle">
2721
2927
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
2722
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2928
+ <svg
2929
+ class="pf-v6-svg"
2930
+ viewBox="0 0 20 20"
2931
+ fill="currentColor"
2932
+ aria-hidden="true"
2933
+ role="img"
2934
+ width="1em"
2935
+ height="1em"
2936
+ >
2937
+ <path
2938
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2939
+ />
2940
+ </svg>
2723
2941
  </span>
2724
2942
  </span>
2725
2943
  </span>
@@ -2987,10 +3205,21 @@ wrapperTag: div
2987
3205
  <i class="fas fa-exclamation-triangle" aria-hidden="true"></i>
2988
3206
  </span>
2989
3207
  Configuration
2990
- <i
2991
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
2992
- aria-hidden="true"
2993
- ></i>
3208
+ <span class="pf-v6-c-wizard__toggle-separator">
3209
+ <svg
3210
+ class="pf-v6-svg"
3211
+ viewBox="0 0 20 20"
3212
+ fill="currentColor"
3213
+ aria-hidden="true"
3214
+ role="img"
3215
+ width="1em"
3216
+ height="1em"
3217
+ >
3218
+ <path
3219
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
3220
+ />
3221
+ </svg>
3222
+ </span>
2994
3223
  </span>
2995
3224
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
2996
3225
  </span>
@@ -3022,7 +3251,19 @@ wrapperTag: div
3022
3251
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
3023
3252
  <span class="pf-v6-c-wizard__nav-link-toggle">
3024
3253
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
3025
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3254
+ <svg
3255
+ class="pf-v6-svg"
3256
+ viewBox="0 0 20 20"
3257
+ fill="currentColor"
3258
+ aria-hidden="true"
3259
+ role="img"
3260
+ width="1em"
3261
+ height="1em"
3262
+ >
3263
+ <path
3264
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
3265
+ />
3266
+ </svg>
3026
3267
  </span>
3027
3268
  </span>
3028
3269
  </span>
@@ -3290,10 +3531,21 @@ wrapperTag: div
3290
3531
  <i class="fas fa-exclamation-triangle" aria-hidden="true"></i>
3291
3532
  </span>
3292
3533
  Configuration
3293
- <i
3294
- class="fas fa-angle-right pf-v6-c-wizard__toggle-separator"
3295
- aria-hidden="true"
3296
- ></i>
3534
+ <span class="pf-v6-c-wizard__toggle-separator">
3535
+ <svg
3536
+ class="pf-v6-svg"
3537
+ viewBox="0 0 20 20"
3538
+ fill="currentColor"
3539
+ aria-hidden="true"
3540
+ role="img"
3541
+ width="1em"
3542
+ height="1em"
3543
+ >
3544
+ <path
3545
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
3546
+ />
3547
+ </svg>
3548
+ </span>
3297
3549
  </span>
3298
3550
  <span class="pf-v6-c-wizard__toggle-list-item">Substep B</span>
3299
3551
  </span>
@@ -3325,7 +3577,19 @@ wrapperTag: div
3325
3577
  <span class="pf-v6-c-wizard__nav-link-text">Configuration</span>
3326
3578
  <span class="pf-v6-c-wizard__nav-link-toggle">
3327
3579
  <span class="pf-v6-c-wizard__nav-link-toggle-icon">
3328
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3580
+ <svg
3581
+ class="pf-v6-svg"
3582
+ viewBox="0 0 20 20"
3583
+ fill="currentColor"
3584
+ aria-hidden="true"
3585
+ role="img"
3586
+ width="1em"
3587
+ height="1em"
3588
+ >
3589
+ <path
3590
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
3591
+ />
3592
+ </svg>
3329
3593
  </span>
3330
3594
  </span>
3331
3595
  </span>
@@ -251,21 +251,57 @@ This demo implements the about modal, including the backdrop.
251
251
  </li>
252
252
  <li class="pf-v6-c-breadcrumb__item">
253
253
  <span class="pf-v6-c-breadcrumb__item-divider">
254
- <i class="fas fa-angle-right" aria-hidden="true"></i>
254
+ <svg
255
+ class="pf-v6-svg"
256
+ viewBox="0 0 20 20"
257
+ fill="currentColor"
258
+ aria-hidden="true"
259
+ role="img"
260
+ width="1em"
261
+ height="1em"
262
+ >
263
+ <path
264
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
265
+ />
266
+ </svg>
255
267
  </span>
256
268
 
257
269
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
258
270
  </li>
259
271
  <li class="pf-v6-c-breadcrumb__item">
260
272
  <span class="pf-v6-c-breadcrumb__item-divider">
261
- <i class="fas fa-angle-right" aria-hidden="true"></i>
273
+ <svg
274
+ class="pf-v6-svg"
275
+ viewBox="0 0 20 20"
276
+ fill="currentColor"
277
+ aria-hidden="true"
278
+ role="img"
279
+ width="1em"
280
+ height="1em"
281
+ >
282
+ <path
283
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
284
+ />
285
+ </svg>
262
286
  </span>
263
287
 
264
288
  <a href="#" class="pf-v6-c-breadcrumb__link">Section title</a>
265
289
  </li>
266
290
  <li class="pf-v6-c-breadcrumb__item">
267
291
  <span class="pf-v6-c-breadcrumb__item-divider">
268
- <i class="fas fa-angle-right" aria-hidden="true"></i>
292
+ <svg
293
+ class="pf-v6-svg"
294
+ viewBox="0 0 20 20"
295
+ fill="currentColor"
296
+ aria-hidden="true"
297
+ role="img"
298
+ width="1em"
299
+ height="1em"
300
+ >
301
+ <path
302
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
303
+ />
304
+ </svg>
269
305
  </span>
270
306
 
271
307
  <a