@patternfly/patternfly 6.5.0-prerelease.69 → 6.5.0-prerelease.70

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 (45) hide show
  1. package/components/Button/button.css +3 -3
  2. package/components/Button/button.scss +1 -1
  3. package/components/Card/card.css +1 -5
  4. package/components/Card/card.scss +2 -6
  5. package/components/Compass/compass.css +2 -2
  6. package/components/Compass/compass.scss +1 -1
  7. package/components/MenuToggle/menu-toggle.css +4 -4
  8. package/components/MenuToggle/menu-toggle.scss +1 -1
  9. package/components/Page/page.css +4 -4
  10. package/components/Page/page.scss +2 -2
  11. package/components/_index.css +14 -18
  12. package/docs/components/CodeEditor/examples/CodeEditor.md +39 -3
  13. package/docs/components/Compass/examples/Compass.md +2 -2
  14. package/docs/components/EmptyState/examples/EmptyState.md +78 -6
  15. package/docs/components/MenuToggle/examples/MenuToggle.md +51 -3
  16. package/docs/components/Page/examples/Page.md +2 -2
  17. package/docs/components/Toolbar/examples/Toolbar.md +10 -10
  18. package/docs/components/Wizard/examples/Wizard.md +13 -1
  19. package/docs/demos/AboutModal/examples/AboutModal.md +17 -1
  20. package/docs/demos/Alert/examples/Alert.md +51 -3
  21. package/docs/demos/BackToTop/examples/BackToTop.md +17 -1
  22. package/docs/demos/Banner/examples/Banner.md +34 -2
  23. package/docs/demos/CardView/examples/CardView.md +127 -123
  24. package/docs/demos/Compass/examples/Compass.md +3072 -1425
  25. package/docs/demos/Dashboard/examples/Dashboard.md +17 -1
  26. package/docs/demos/DataList/examples/DataList.md +78 -14
  27. package/docs/demos/DescriptionList/examples/DescriptionList.md +51 -3
  28. package/docs/demos/Drawer/examples/Drawer.md +85 -5
  29. package/docs/demos/JumpLinks/examples/JumpLinks.md +102 -6
  30. package/docs/demos/Masthead/examples/Masthead.md +29 -13
  31. package/docs/demos/Modal/examples/Modal.md +102 -6
  32. package/docs/demos/Nav/examples/Nav.md +144 -20
  33. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +85 -5
  34. package/docs/demos/Page/examples/Page.md +244 -20
  35. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +133 -21
  36. package/docs/demos/Skeleton/examples/Skeleton.md +17 -1
  37. package/docs/demos/Table/examples/Table.md +337 -69
  38. package/docs/demos/Tabs/examples/Tabs.md +104 -8
  39. package/docs/demos/Toolbar/examples/Toolbar.md +46 -14
  40. package/docs/demos/Wizard/examples/Wizard.md +153 -9
  41. package/package.json +2 -2
  42. package/patternfly-no-globals.css +14 -18
  43. package/patternfly.css +14 -18
  44. package/patternfly.min.css +1 -1
  45. package/patternfly.min.css.map +1 -1
@@ -873,7 +873,7 @@ wrapperTag: div
873
873
  <span class="pf-v6-c-menu-toggle__icon">
874
874
  <svg
875
875
  class="pf-v6-svg"
876
- viewBox="0 0 512 512"
876
+ viewBox="0 0 32 32"
877
877
  fill="currentColor"
878
878
  aria-hidden="true"
879
879
  role="img"
@@ -881,7 +881,7 @@ wrapperTag: div
881
881
  height="1em"
882
882
  >
883
883
  <path
884
- d="M487.976 0H24.028C2.71 0-8.047 25.866 7.058 40.971L192 225.941V432c0 7.831 3.821 15.17 10.237 19.662l80 55.98C298.02 518.69 320 507.493 320 487.98V225.941l184.947-184.97C520.021 25.896 509.338 0 487.976 0z"
884
+ d="M29.875 3.5V7a.876.876 0 0 1-.256.619l-9.744 9.744v10.638a.875.875 0 0 1-.599.83l-6 2a.876.876 0 0 1-.788-.12.874.874 0 0 1-.363-.71V17.363L2.381 7.619A.876.876 0 0 1 2.125 7V3.5c0-.758.617-1.375 1.375-1.375h25c.758 0 1.375.617 1.375 1.375Z"
885
885
  />
886
886
  </svg>
887
887
  </span>
@@ -903,7 +903,7 @@ wrapperTag: div
903
903
  <span class="pf-v6-c-menu-toggle__icon">
904
904
  <svg
905
905
  class="pf-v6-svg"
906
- viewBox="0 0 512 512"
906
+ viewBox="0 0 32 32"
907
907
  fill="currentColor"
908
908
  aria-hidden="true"
909
909
  role="img"
@@ -911,7 +911,7 @@ wrapperTag: div
911
911
  height="1em"
912
912
  >
913
913
  <path
914
- d="M487.976 0H24.028C2.71 0-8.047 25.866 7.058 40.971L192 225.941V432c0 7.831 3.821 15.17 10.237 19.662l80 55.98C298.02 518.69 320 507.493 320 487.98V225.941l184.947-184.97C520.021 25.896 509.338 0 487.976 0z"
914
+ d="M29.875 3.5V7a.876.876 0 0 1-.256.619l-9.744 9.744v10.638a.875.875 0 0 1-.599.83l-6 2a.876.876 0 0 1-.788-.12.874.874 0 0 1-.363-.71V17.363L2.381 7.619A.876.876 0 0 1 2.125 7V3.5c0-.758.617-1.375 1.375-1.375h25c.758 0 1.375.617 1.375 1.375Z"
915
915
  />
916
916
  </svg>
917
917
  </span>
@@ -1313,7 +1313,7 @@ wrapperTag: div
1313
1313
  <span class="pf-v6-c-menu-toggle__icon">
1314
1314
  <svg
1315
1315
  class="pf-v6-svg"
1316
- viewBox="0 0 512 512"
1316
+ viewBox="0 0 32 32"
1317
1317
  fill="currentColor"
1318
1318
  aria-hidden="true"
1319
1319
  role="img"
@@ -1321,7 +1321,7 @@ wrapperTag: div
1321
1321
  height="1em"
1322
1322
  >
1323
1323
  <path
1324
- d="M487.976 0H24.028C2.71 0-8.047 25.866 7.058 40.971L192 225.941V432c0 7.831 3.821 15.17 10.237 19.662l80 55.98C298.02 518.69 320 507.493 320 487.98V225.941l184.947-184.97C520.021 25.896 509.338 0 487.976 0z"
1324
+ d="M29.875 3.5V7a.876.876 0 0 1-.256.619l-9.744 9.744v10.638a.875.875 0 0 1-.599.83l-6 2a.876.876 0 0 1-.788-.12.874.874 0 0 1-.363-.71V17.363L2.381 7.619A.876.876 0 0 1 2.125 7V3.5c0-.758.617-1.375 1.375-1.375h25c.758 0 1.375.617 1.375 1.375Z"
1325
1325
  />
1326
1326
  </svg>
1327
1327
  </span>
@@ -1343,7 +1343,7 @@ wrapperTag: div
1343
1343
  <span class="pf-v6-c-menu-toggle__icon">
1344
1344
  <svg
1345
1345
  class="pf-v6-svg"
1346
- viewBox="0 0 512 512"
1346
+ viewBox="0 0 32 32"
1347
1347
  fill="currentColor"
1348
1348
  aria-hidden="true"
1349
1349
  role="img"
@@ -1351,7 +1351,7 @@ wrapperTag: div
1351
1351
  height="1em"
1352
1352
  >
1353
1353
  <path
1354
- d="M487.976 0H24.028C2.71 0-8.047 25.866 7.058 40.971L192 225.941V432c0 7.831 3.821 15.17 10.237 19.662l80 55.98C298.02 518.69 320 507.493 320 487.98V225.941l184.947-184.97C520.021 25.896 509.338 0 487.976 0z"
1354
+ d="M29.875 3.5V7a.876.876 0 0 1-.256.619l-9.744 9.744v10.638a.875.875 0 0 1-.599.83l-6 2a.876.876 0 0 1-.788-.12.874.874 0 0 1-.363-.71V17.363L2.381 7.619A.876.876 0 0 1 2.125 7V3.5c0-.758.617-1.375 1.375-1.375h25c.758 0 1.375.617 1.375 1.375Z"
1355
1355
  />
1356
1356
  </svg>
1357
1357
  </span>
@@ -2475,7 +2475,23 @@ wrapperTag: div
2475
2475
  type="button"
2476
2476
  aria-expanded="false"
2477
2477
  aria-label="Settings"
2478
- ></button>
2478
+ >
2479
+ <span class="pf-v6-c-menu-toggle__icon">
2480
+ <svg
2481
+ class="pf-v6-svg"
2482
+ viewBox="0 0 32 32"
2483
+ fill="currentColor"
2484
+ aria-hidden="true"
2485
+ role="img"
2486
+ width="1em"
2487
+ height="1em"
2488
+ >
2489
+ <path
2490
+ 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"
2491
+ />
2492
+ </svg>
2493
+ </span>
2494
+ </button>
2479
2495
  </div>
2480
2496
  <div class="pf-v6-c-toolbar__item">
2481
2497
  <button
@@ -3183,7 +3199,7 @@ wrapperTag: div
3183
3199
  <span class="pf-v6-c-menu-toggle__icon">
3184
3200
  <svg
3185
3201
  class="pf-v6-svg"
3186
- viewBox="0 0 512 512"
3202
+ viewBox="0 0 32 32"
3187
3203
  fill="currentColor"
3188
3204
  aria-hidden="true"
3189
3205
  role="img"
@@ -3191,7 +3207,7 @@ wrapperTag: div
3191
3207
  height="1em"
3192
3208
  >
3193
3209
  <path
3194
- d="M487.976 0H24.028C2.71 0-8.047 25.866 7.058 40.971L192 225.941V432c0 7.831 3.821 15.17 10.237 19.662l80 55.98C298.02 518.69 320 507.493 320 487.98V225.941l184.947-184.97C520.021 25.896 509.338 0 487.976 0z"
3210
+ d="M29.875 3.5V7a.876.876 0 0 1-.256.619l-9.744 9.744v10.638a.875.875 0 0 1-.599.83l-6 2a.876.876 0 0 1-.788-.12.874.874 0 0 1-.363-.71V17.363L2.381 7.619A.876.876 0 0 1 2.125 7V3.5c0-.758.617-1.375 1.375-1.375h25c.758 0 1.375.617 1.375 1.375Z"
3195
3211
  />
3196
3212
  </svg>
3197
3213
  </span>
@@ -3245,7 +3261,7 @@ wrapperTag: div
3245
3261
  <span class="pf-v6-c-menu-toggle__icon">
3246
3262
  <svg
3247
3263
  class="pf-v6-svg"
3248
- viewBox="0 0 512 512"
3264
+ viewBox="0 0 32 32"
3249
3265
  fill="currentColor"
3250
3266
  aria-hidden="true"
3251
3267
  role="img"
@@ -3253,7 +3269,7 @@ wrapperTag: div
3253
3269
  height="1em"
3254
3270
  >
3255
3271
  <path
3256
- d="M487.976 0H24.028C2.71 0-8.047 25.866 7.058 40.971L192 225.941V432c0 7.831 3.821 15.17 10.237 19.662l80 55.98C298.02 518.69 320 507.493 320 487.98V225.941l184.947-184.97C520.021 25.896 509.338 0 487.976 0z"
3272
+ d="M29.875 3.5V7a.876.876 0 0 1-.256.619l-9.744 9.744v10.638a.875.875 0 0 1-.599.83l-6 2a.876.876 0 0 1-.788-.12.874.874 0 0 1-.363-.71V17.363L2.381 7.619A.876.876 0 0 1 2.125 7V3.5c0-.758.617-1.375 1.375-1.375h25c.758 0 1.375.617 1.375 1.375Z"
3257
3273
  />
3258
3274
  </svg>
3259
3275
  </span>
@@ -168,7 +168,23 @@ section: components
168
168
  type="button"
169
169
  aria-expanded="false"
170
170
  aria-label="Settings"
171
- ></button>
171
+ >
172
+ <span class="pf-v6-c-menu-toggle__icon">
173
+ <svg
174
+ class="pf-v6-svg"
175
+ viewBox="0 0 32 32"
176
+ fill="currentColor"
177
+ aria-hidden="true"
178
+ role="img"
179
+ width="1em"
180
+ height="1em"
181
+ >
182
+ <path
183
+ 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"
184
+ />
185
+ </svg>
186
+ </span>
187
+ </button>
172
188
  </div>
173
189
  <div class="pf-v6-c-toolbar__item">
174
190
  <button
@@ -624,7 +640,23 @@ section: components
624
640
  type="button"
625
641
  aria-expanded="false"
626
642
  aria-label="Settings"
627
- ></button>
643
+ >
644
+ <span class="pf-v6-c-menu-toggle__icon">
645
+ <svg
646
+ class="pf-v6-svg"
647
+ viewBox="0 0 32 32"
648
+ fill="currentColor"
649
+ aria-hidden="true"
650
+ role="img"
651
+ width="1em"
652
+ height="1em"
653
+ >
654
+ <path
655
+ 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"
656
+ />
657
+ </svg>
658
+ </span>
659
+ </button>
628
660
  </div>
629
661
  <div class="pf-v6-c-toolbar__item">
630
662
  <button
@@ -1089,7 +1121,23 @@ section: components
1089
1121
  type="button"
1090
1122
  aria-expanded="false"
1091
1123
  aria-label="Settings"
1092
- ></button>
1124
+ >
1125
+ <span class="pf-v6-c-menu-toggle__icon">
1126
+ <svg
1127
+ class="pf-v6-svg"
1128
+ viewBox="0 0 32 32"
1129
+ fill="currentColor"
1130
+ aria-hidden="true"
1131
+ role="img"
1132
+ width="1em"
1133
+ height="1em"
1134
+ >
1135
+ <path
1136
+ 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"
1137
+ />
1138
+ </svg>
1139
+ </span>
1140
+ </button>
1093
1141
  </div>
1094
1142
  <div class="pf-v6-c-toolbar__item">
1095
1143
  <button
@@ -1544,7 +1592,23 @@ section: components
1544
1592
  type="button"
1545
1593
  aria-expanded="false"
1546
1594
  aria-label="Settings"
1547
- ></button>
1595
+ >
1596
+ <span class="pf-v6-c-menu-toggle__icon">
1597
+ <svg
1598
+ class="pf-v6-svg"
1599
+ viewBox="0 0 32 32"
1600
+ fill="currentColor"
1601
+ aria-hidden="true"
1602
+ role="img"
1603
+ width="1em"
1604
+ height="1em"
1605
+ >
1606
+ <path
1607
+ 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"
1608
+ />
1609
+ </svg>
1610
+ </span>
1611
+ </button>
1548
1612
  </div>
1549
1613
  <div class="pf-v6-c-toolbar__item">
1550
1614
  <button
@@ -1999,7 +2063,23 @@ section: components
1999
2063
  type="button"
2000
2064
  aria-expanded="false"
2001
2065
  aria-label="Settings"
2002
- ></button>
2066
+ >
2067
+ <span class="pf-v6-c-menu-toggle__icon">
2068
+ <svg
2069
+ class="pf-v6-svg"
2070
+ viewBox="0 0 32 32"
2071
+ fill="currentColor"
2072
+ aria-hidden="true"
2073
+ role="img"
2074
+ width="1em"
2075
+ height="1em"
2076
+ >
2077
+ <path
2078
+ 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"
2079
+ />
2080
+ </svg>
2081
+ </span>
2082
+ </button>
2003
2083
  </div>
2004
2084
  <div class="pf-v6-c-toolbar__item">
2005
2085
  <button
@@ -2454,7 +2534,23 @@ section: components
2454
2534
  type="button"
2455
2535
  aria-expanded="false"
2456
2536
  aria-label="Settings"
2457
- ></button>
2537
+ >
2538
+ <span class="pf-v6-c-menu-toggle__icon">
2539
+ <svg
2540
+ class="pf-v6-svg"
2541
+ viewBox="0 0 32 32"
2542
+ fill="currentColor"
2543
+ aria-hidden="true"
2544
+ role="img"
2545
+ width="1em"
2546
+ height="1em"
2547
+ >
2548
+ <path
2549
+ 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"
2550
+ />
2551
+ </svg>
2552
+ </span>
2553
+ </button>
2458
2554
  </div>
2459
2555
  <div class="pf-v6-c-toolbar__item">
2460
2556
  <button
@@ -168,7 +168,23 @@ section: components
168
168
  type="button"
169
169
  aria-expanded="false"
170
170
  aria-label="Settings"
171
- ></button>
171
+ >
172
+ <span class="pf-v6-c-menu-toggle__icon">
173
+ <svg
174
+ class="pf-v6-svg"
175
+ viewBox="0 0 32 32"
176
+ fill="currentColor"
177
+ aria-hidden="true"
178
+ role="img"
179
+ width="1em"
180
+ height="1em"
181
+ >
182
+ <path
183
+ 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"
184
+ />
185
+ </svg>
186
+ </span>
187
+ </button>
172
188
  </div>
173
189
  <div class="pf-v6-c-toolbar__item">
174
190
  <button
@@ -566,7 +582,23 @@ section: components
566
582
  type="button"
567
583
  aria-expanded="false"
568
584
  aria-label="Settings"
569
- ></button>
585
+ >
586
+ <span class="pf-v6-c-menu-toggle__icon">
587
+ <svg
588
+ class="pf-v6-svg"
589
+ viewBox="0 0 32 32"
590
+ fill="currentColor"
591
+ aria-hidden="true"
592
+ role="img"
593
+ width="1em"
594
+ height="1em"
595
+ >
596
+ <path
597
+ 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"
598
+ />
599
+ </svg>
600
+ </span>
601
+ </button>
570
602
  </div>
571
603
  <div class="pf-v6-c-toolbar__item">
572
604
  <button
@@ -1002,7 +1034,23 @@ section: components
1002
1034
  type="button"
1003
1035
  aria-expanded="false"
1004
1036
  aria-label="Settings"
1005
- ></button>
1037
+ >
1038
+ <span class="pf-v6-c-menu-toggle__icon">
1039
+ <svg
1040
+ class="pf-v6-svg"
1041
+ viewBox="0 0 32 32"
1042
+ fill="currentColor"
1043
+ aria-hidden="true"
1044
+ role="img"
1045
+ width="1em"
1046
+ height="1em"
1047
+ >
1048
+ <path
1049
+ 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"
1050
+ />
1051
+ </svg>
1052
+ </span>
1053
+ </button>
1006
1054
  </div>
1007
1055
  <div class="pf-v6-c-toolbar__item">
1008
1056
  <button
@@ -1852,7 +1900,23 @@ section: components
1852
1900
  type="button"
1853
1901
  aria-expanded="false"
1854
1902
  aria-label="Settings"
1855
- ></button>
1903
+ >
1904
+ <span class="pf-v6-c-menu-toggle__icon">
1905
+ <svg
1906
+ class="pf-v6-svg"
1907
+ viewBox="0 0 32 32"
1908
+ fill="currentColor"
1909
+ aria-hidden="true"
1910
+ role="img"
1911
+ width="1em"
1912
+ height="1em"
1913
+ >
1914
+ <path
1915
+ 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"
1916
+ />
1917
+ </svg>
1918
+ </span>
1919
+ </button>
1856
1920
  </div>
1857
1921
  <div class="pf-v6-c-toolbar__item">
1858
1922
  <button
@@ -2465,7 +2529,7 @@ section: components
2465
2529
  ### Docked nav
2466
2530
 
2467
2531
  ```html isFullscreen isBeta
2468
- <div class="pf-v6-c-page pf-m-dock pf-m-no-sidebar" id="nav-docked-example">
2532
+ <div class="pf-v6-c-page pf-m-docked pf-m-no-sidebar" id="nav-docked-example">
2469
2533
  <header class="pf-v6-c-masthead pf-m-display-inline">
2470
2534
  <div class="pf-v6-c-masthead__main">
2471
2535
  <span class="pf-v6-c-masthead__toggle">
@@ -2840,7 +2904,7 @@ section: components
2840
2904
  >
2841
2905
  <div class="pf-v6-c-toolbar__item">
2842
2906
  <button
2843
- class="pf-v6-c-menu-toggle pf-m-dock pf-m-text pf-m-plain"
2907
+ class="pf-v6-c-menu-toggle pf-m-docked pf-m-text pf-m-plain"
2844
2908
  type="button"
2845
2909
  aria-expanded="false"
2846
2910
  aria-label="Applications"
@@ -2865,16 +2929,31 @@ section: components
2865
2929
  </div>
2866
2930
  <div class="pf-v6-c-toolbar__item">
2867
2931
  <button
2868
- class="pf-v6-c-button pf-m-dock pf-m-settings pf-m-plain"
2932
+ class="pf-v6-c-button pf-m-docked pf-m-settings pf-m-plain"
2869
2933
  type="button"
2870
2934
  aria-label="Settings"
2871
2935
  >
2936
+ <span class="pf-v6-c-button__icon pf-m-start">
2937
+ <svg
2938
+ class="pf-v6-svg"
2939
+ viewBox="0 0 32 32"
2940
+ fill="currentColor"
2941
+ aria-hidden="true"
2942
+ role="img"
2943
+ width="1em"
2944
+ height="1em"
2945
+ >
2946
+ <path
2947
+ 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"
2948
+ />
2949
+ </svg>
2950
+ </span>
2872
2951
  <span class="pf-v6-c-button__text">Settings</span>
2873
2952
  </button>
2874
2953
  </div>
2875
2954
  <div class="pf-v6-c-toolbar__item">
2876
2955
  <button
2877
- class="pf-v6-c-menu-toggle pf-m-dock pf-m-text pf-m-plain"
2956
+ class="pf-v6-c-menu-toggle pf-m-docked pf-m-text pf-m-plain"
2878
2957
  type="button"
2879
2958
  aria-expanded="false"
2880
2959
  aria-label="Help"
@@ -3041,7 +3120,7 @@ section: components
3041
3120
 
3042
3121
  ```html isFullscreen isBeta
3043
3122
  <div
3044
- class="pf-v6-c-page pf-m-dock pf-m-no-sidebar"
3123
+ class="pf-v6-c-page pf-m-docked pf-m-no-sidebar"
3045
3124
  id="nav-docked-expanded-example"
3046
3125
  >
3047
3126
  <header class="pf-v6-c-masthead pf-m-display-inline">
@@ -3418,7 +3497,7 @@ section: components
3418
3497
  >
3419
3498
  <div class="pf-v6-c-toolbar__item">
3420
3499
  <button
3421
- class="pf-v6-c-menu-toggle pf-m-dock pf-m-text pf-m-plain"
3500
+ class="pf-v6-c-menu-toggle pf-m-docked pf-m-text pf-m-plain"
3422
3501
  type="button"
3423
3502
  aria-expanded="false"
3424
3503
  aria-label="Applications"
@@ -3443,16 +3522,31 @@ section: components
3443
3522
  </div>
3444
3523
  <div class="pf-v6-c-toolbar__item">
3445
3524
  <button
3446
- class="pf-v6-c-button pf-m-dock pf-m-settings pf-m-plain"
3525
+ class="pf-v6-c-button pf-m-docked pf-m-settings pf-m-plain"
3447
3526
  type="button"
3448
3527
  aria-label="Settings"
3449
3528
  >
3529
+ <span class="pf-v6-c-button__icon pf-m-start">
3530
+ <svg
3531
+ class="pf-v6-svg"
3532
+ viewBox="0 0 32 32"
3533
+ fill="currentColor"
3534
+ aria-hidden="true"
3535
+ role="img"
3536
+ width="1em"
3537
+ height="1em"
3538
+ >
3539
+ <path
3540
+ 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"
3541
+ />
3542
+ </svg>
3543
+ </span>
3450
3544
  <span class="pf-v6-c-button__text">Settings</span>
3451
3545
  </button>
3452
3546
  </div>
3453
3547
  <div class="pf-v6-c-toolbar__item">
3454
3548
  <button
3455
- class="pf-v6-c-menu-toggle pf-m-dock pf-m-text pf-m-plain"
3549
+ class="pf-v6-c-menu-toggle pf-m-docked pf-m-text pf-m-plain"
3456
3550
  type="button"
3457
3551
  aria-expanded="false"
3458
3552
  aria-label="Help"
@@ -3618,7 +3712,7 @@ section: components
3618
3712
  ### Docked nav text expanded
3619
3713
 
3620
3714
  ```html isFullscreen isBeta
3621
- <div class="pf-v6-c-page pf-m-dock pf-m-no-sidebar" id="nav-docked-example">
3715
+ <div class="pf-v6-c-page pf-m-docked pf-m-no-sidebar" id="nav-docked-example">
3622
3716
  <header class="pf-v6-c-masthead pf-m-display-inline">
3623
3717
  <div class="pf-v6-c-masthead__main">
3624
3718
  <span class="pf-v6-c-masthead__toggle">
@@ -3993,7 +4087,7 @@ section: components
3993
4087
  >
3994
4088
  <div class="pf-v6-c-toolbar__item">
3995
4089
  <button
3996
- class="pf-v6-c-menu-toggle pf-m-dock pf-m-text pf-m-plain"
4090
+ class="pf-v6-c-menu-toggle pf-m-docked pf-m-text pf-m-plain"
3997
4091
  type="button"
3998
4092
  aria-expanded="false"
3999
4093
  aria-label="Applications"
@@ -4018,16 +4112,31 @@ section: components
4018
4112
  </div>
4019
4113
  <div class="pf-v6-c-toolbar__item">
4020
4114
  <button
4021
- class="pf-v6-c-button pf-m-dock pf-m-settings pf-m-plain"
4115
+ class="pf-v6-c-button pf-m-docked pf-m-settings pf-m-plain"
4022
4116
  type="button"
4023
4117
  aria-label="Settings"
4024
4118
  >
4119
+ <span class="pf-v6-c-button__icon pf-m-start">
4120
+ <svg
4121
+ class="pf-v6-svg"
4122
+ viewBox="0 0 32 32"
4123
+ fill="currentColor"
4124
+ aria-hidden="true"
4125
+ role="img"
4126
+ width="1em"
4127
+ height="1em"
4128
+ >
4129
+ <path
4130
+ 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"
4131
+ />
4132
+ </svg>
4133
+ </span>
4025
4134
  <span class="pf-v6-c-button__text">Settings</span>
4026
4135
  </button>
4027
4136
  </div>
4028
4137
  <div class="pf-v6-c-toolbar__item">
4029
4138
  <button
4030
- class="pf-v6-c-menu-toggle pf-m-dock pf-m-text pf-m-plain"
4139
+ class="pf-v6-c-menu-toggle pf-m-docked pf-m-text pf-m-plain"
4031
4140
  type="button"
4032
4141
  aria-expanded="false"
4033
4142
  aria-label="Help"
@@ -4194,7 +4303,7 @@ section: components
4194
4303
 
4195
4304
  ```html isFullscreen isBeta
4196
4305
  <div
4197
- class="pf-v6-c-page pf-m-dock pf-m-no-sidebar"
4306
+ class="pf-v6-c-page pf-m-docked pf-m-no-sidebar"
4198
4307
  id="nav-docked-expanded-example"
4199
4308
  >
4200
4309
  <header class="pf-v6-c-masthead pf-m-display-inline">
@@ -4571,7 +4680,7 @@ section: components
4571
4680
  >
4572
4681
  <div class="pf-v6-c-toolbar__item">
4573
4682
  <button
4574
- class="pf-v6-c-menu-toggle pf-m-dock pf-m-text pf-m-plain"
4683
+ class="pf-v6-c-menu-toggle pf-m-docked pf-m-text pf-m-plain"
4575
4684
  type="button"
4576
4685
  aria-expanded="false"
4577
4686
  aria-label="Applications"
@@ -4596,16 +4705,31 @@ section: components
4596
4705
  </div>
4597
4706
  <div class="pf-v6-c-toolbar__item">
4598
4707
  <button
4599
- class="pf-v6-c-button pf-m-dock pf-m-settings pf-m-plain"
4708
+ class="pf-v6-c-button pf-m-docked pf-m-settings pf-m-plain"
4600
4709
  type="button"
4601
4710
  aria-label="Settings"
4602
4711
  >
4712
+ <span class="pf-v6-c-button__icon pf-m-start">
4713
+ <svg
4714
+ class="pf-v6-svg"
4715
+ viewBox="0 0 32 32"
4716
+ fill="currentColor"
4717
+ aria-hidden="true"
4718
+ role="img"
4719
+ width="1em"
4720
+ height="1em"
4721
+ >
4722
+ <path
4723
+ 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"
4724
+ />
4725
+ </svg>
4726
+ </span>
4603
4727
  <span class="pf-v6-c-button__text">Settings</span>
4604
4728
  </button>
4605
4729
  </div>
4606
4730
  <div class="pf-v6-c-toolbar__item">
4607
4731
  <button
4608
- class="pf-v6-c-menu-toggle pf-m-dock pf-m-text pf-m-plain"
4732
+ class="pf-v6-c-menu-toggle pf-m-docked pf-m-text pf-m-plain"
4609
4733
  type="button"
4610
4734
  aria-expanded="false"
4611
4735
  aria-label="Help"