@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
@@ -23,7 +23,19 @@ The overflow menu relies on groups (`.pf-v6-c-overflow-menu__group`) and items (
23
23
  id="overflow-menu-simple-toggle"
24
24
  >
25
25
  <span class="pf-v6-c-menu-toggle__icon">
26
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
26
+ <svg
27
+ class="pf-v6-svg"
28
+ viewBox="0 0 32 32"
29
+ fill="currentColor"
30
+ aria-hidden="true"
31
+ role="img"
32
+ width="1em"
33
+ height="1em"
34
+ >
35
+ <path
36
+ 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"
37
+ />
38
+ </svg>
27
39
  </span>
28
40
  </button>
29
41
  </div>
@@ -194,7 +206,19 @@ The action group consists of a primary and secondary action. Any additional acti
194
206
  id="overflow-menu-simple-additional-options-hidden-toggle"
195
207
  >
196
208
  <span class="pf-v6-c-menu-toggle__icon">
197
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
209
+ <svg
210
+ class="pf-v6-svg"
211
+ viewBox="0 0 32 32"
212
+ fill="currentColor"
213
+ aria-hidden="true"
214
+ role="img"
215
+ width="1em"
216
+ height="1em"
217
+ >
218
+ <path
219
+ 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"
220
+ />
221
+ </svg>
198
222
  </span>
199
223
  </button>
200
224
  </div>
@@ -308,7 +332,19 @@ The action group consists of a primary and secondary action. Any additional acti
308
332
  id="overflow-menu-simple-additional-options-visible-toggle"
309
333
  >
310
334
  <span class="pf-v6-c-menu-toggle__icon">
311
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
335
+ <svg
336
+ class="pf-v6-svg"
337
+ viewBox="0 0 32 32"
338
+ fill="currentColor"
339
+ aria-hidden="true"
340
+ role="img"
341
+ width="1em"
342
+ height="1em"
343
+ >
344
+ <path
345
+ 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"
346
+ />
347
+ </svg>
312
348
  </span>
313
349
  </button>
314
350
  </div>
@@ -340,7 +376,19 @@ The action group consists of a primary and secondary action. Any additional acti
340
376
  id="overflow-menu-persistent-hidden-toggle"
341
377
  >
342
378
  <span class="pf-v6-c-menu-toggle__icon">
343
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
379
+ <svg
380
+ class="pf-v6-svg"
381
+ viewBox="0 0 32 32"
382
+ fill="currentColor"
383
+ aria-hidden="true"
384
+ role="img"
385
+ width="1em"
386
+ height="1em"
387
+ >
388
+ <path
389
+ 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"
390
+ />
391
+ </svg>
344
392
  </span>
345
393
  </button>
346
394
  </div>
@@ -383,7 +431,19 @@ The action group consists of a primary and secondary action. Any additional acti
383
431
  id="overflow-menu-persistent-visible-example-toggle"
384
432
  >
385
433
  <span class="pf-v6-c-menu-toggle__icon">
386
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
434
+ <svg
435
+ class="pf-v6-svg"
436
+ viewBox="0 0 32 32"
437
+ fill="currentColor"
438
+ aria-hidden="true"
439
+ role="img"
440
+ width="1em"
441
+ height="1em"
442
+ >
443
+ <path
444
+ 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"
445
+ />
446
+ </svg>
387
447
  </span>
388
448
  </button>
389
449
  </div>
@@ -58,26 +58,38 @@ wrapperTag: div
58
58
  </div>
59
59
  <div class="pf-v6-c-page__main-container" tabindex="-1">
60
60
  <main class="pf-v6-c-page__main" tabindex="-1">
61
- <section class="pf-v6-c-page__main-section">
61
+ <section
62
+ class="pf-v6-c-page__main-section"
63
+ aria-label="Default main section example 1"
64
+ >
62
65
  <div class="pf-v6-c-page__main-body">
63
66
  This is a default
64
67
  <code>.pf-v6-c-page__main-section</code>.
65
68
  </div>
66
69
  </section>
67
- <section class="pf-v6-c-page__main-section pf-m-secondary">
70
+ <section
71
+ class="pf-v6-c-page__main-section pf-m-secondary"
72
+ aria-label="Secondary main section example 1"
73
+ >
68
74
  <div class="pf-v6-c-page__main-body">
69
75
  This
70
76
  <code>.pf-v6-c-page__main-section</code> uses
71
77
  <code>.pf-m-secondary</code>.
72
78
  </div>
73
79
  </section>
74
- <section class="pf-v6-c-page__main-section">
80
+ <section
81
+ class="pf-v6-c-page__main-section"
82
+ aria-label="Default main section example 2"
83
+ >
75
84
  <div class="pf-v6-c-page__main-body">
76
85
  This is a default
77
86
  <code>.pf-v6-c-page__main-section</code>.
78
87
  </div>
79
88
  </section>
80
- <section class="pf-v6-c-page__main-section pf-m-secondary">
89
+ <section
90
+ class="pf-v6-c-page__main-section pf-m-secondary"
91
+ aria-label="Multiple main body section example"
92
+ >
81
93
  <div
82
94
  class="pf-v6-c-page__main-body"
83
95
  >This is a page__main-body, one of three within one page__main-section.</div>
@@ -140,20 +152,29 @@ wrapperTag: div
140
152
  </header>
141
153
  <div class="pf-v6-c-page__main-container" tabindex="-1">
142
154
  <main class="pf-v6-c-page__main" tabindex="-1">
143
- <section class="pf-v6-c-page__main-section">
155
+ <section
156
+ class="pf-v6-c-page__main-section"
157
+ aria-label="Horizontal nav default main section example 1"
158
+ >
144
159
  <div class="pf-v6-c-page__main-body">
145
160
  This is a default
146
161
  <code>.pf-v6-c-page__main-section</code>.
147
162
  </div>
148
163
  </section>
149
- <section class="pf-v6-c-page__main-section pf-m-secondary">
164
+ <section
165
+ class="pf-v6-c-page__main-section pf-m-secondary"
166
+ aria-label="Horizontal nav secondary main section example"
167
+ >
150
168
  <div class="pf-v6-c-page__main-body">
151
169
  This
152
170
  <code>.pf-v6-c-page__main-section</code> uses
153
171
  <code>.pf-m-secondary</code>.
154
172
  </div>
155
173
  </section>
156
- <section class="pf-v6-c-page__main-section">
174
+ <section
175
+ class="pf-v6-c-page__main-section"
176
+ aria-label="Horizontal nav default main section example 2"
177
+ >
157
178
  <div class="pf-v6-c-page__main-body">
158
179
  This is a default
159
180
  <code>.pf-v6-c-page__main-section</code>.
@@ -221,7 +242,10 @@ wrapperTag: div
221
242
  </div>
222
243
  <div class="pf-v6-c-page__main-container" tabindex="-1">
223
244
  <main class="pf-v6-c-page__main" tabindex="-1">
224
- <section class="pf-v6-c-page__main-section">
245
+ <section
246
+ class="pf-v6-c-page__main-section"
247
+ aria-label="Sidebar body layout section"
248
+ >
225
249
  <div class="pf-v6-c-page__main-body"></div>
226
250
  </section>
227
251
  </main>
@@ -276,10 +300,16 @@ wrapperTag: div
276
300
  </header>
277
301
  <div class="pf-v6-c-page__main-container pf-m-fill" tabindex="-1">
278
302
  <main class="pf-v6-c-page__main" tabindex="-1">
279
- <section class="pf-v6-c-page__main-section">
303
+ <section
304
+ class="pf-v6-c-page__main-section"
305
+ aria-label="Regular page section example"
306
+ >
280
307
  <div class="pf-v6-c-page__main-body">A regular page section.</div>
281
308
  </section>
282
- <section class="pf-v6-c-page__main-section pf-m-fill">
309
+ <section
310
+ class="pf-v6-c-page__main-section pf-m-fill"
311
+ aria-label="Fill page section example"
312
+ >
283
313
  <div class="pf-v6-c-page__main-body">
284
314
  This section uses
285
315
  <code>.pf-m-fill</code> to fill the available space. The
@@ -287,7 +317,10 @@ wrapperTag: div
287
317
  <code>.pf-m-fill</code> in order for the section to have space to stretch to full height.
288
318
  </div>
289
319
  </section>
290
- <section class="pf-v6-c-page__main-section pf-m-no-fill">
320
+ <section
321
+ class="pf-v6-c-page__main-section pf-m-no-fill"
322
+ aria-label="No fill page section example"
323
+ >
291
324
  <div class="pf-v6-c-page__main-body">
292
325
  This section uses
293
326
  <code>.pf-m-no-fill</code> and will not fill the available space.
@@ -350,13 +383,19 @@ wrapperTag: div
350
383
  </div>
351
384
  <div class="pf-v6-c-page__main-container" tabindex="-1">
352
385
  <main class="pf-v6-c-page__main" tabindex="-1">
353
- <section class="pf-v6-c-page__main-section">
386
+ <section
387
+ class="pf-v6-c-page__main-section"
388
+ aria-label="Default padding main section example"
389
+ >
354
390
  <div class="pf-v6-c-page__main-body">
355
391
  This
356
392
  <code>.pf-v6-c-page__main-section</code> has default padding.
357
393
  </div>
358
394
  </section>
359
- <section class="pf-v6-c-page__main-section pf-m-no-padding">
395
+ <section
396
+ class="pf-v6-c-page__main-section pf-m-no-padding"
397
+ aria-label="No padding main section example"
398
+ >
360
399
  <div class="pf-v6-c-page__main-body">
361
400
  This
362
401
  <code>.pf-v6-c-page__main-section</code> uses
@@ -365,6 +404,7 @@ wrapperTag: div
365
404
  </section>
366
405
  <section
367
406
  class="pf-v6-c-page__main-section pf-m-no-padding pf-m-padding-on-md"
407
+ aria-label="Responsive padding main section example"
368
408
  >
369
409
  <div class="pf-v6-c-page__main-body">
370
410
  This
@@ -442,7 +482,10 @@ wrapperTag: div
442
482
  <section class="pf-v6-c-page__main-breadcrumb">
443
483
  <code>.pf-v6-c-page__main-breadcrumb</code> for breadcrumbs
444
484
  </section>
445
- <section class="pf-v6-c-page__main-section">
485
+ <section
486
+ class="pf-v6-c-page__main-section"
487
+ aria-label="Main section variations example"
488
+ >
446
489
  <div class="pf-v6-c-page__main-body">
447
490
  <code>.pf-v6-c-page__main-section</code> for main sections
448
491
  </div>
@@ -504,6 +547,7 @@ wrapperTag: div
504
547
  <main class="pf-v6-c-page__main" tabindex="-1">
505
548
  <section
506
549
  class="pf-v6-c-page__main-section pf-m-limit-width pf-m-align-center"
550
+ aria-label="Centered section example"
507
551
  >
508
552
  <div class="pf-v6-c-page__main-body">
509
553
  <div class="pf-v6-c-card">
@@ -560,7 +604,10 @@ wrapperTag: div
560
604
  </div>
561
605
  <div class="pf-v6-c-page__main-container" tabindex="-1">
562
606
  <main class="pf-v6-c-page__main" tabindex="-1">
563
- <section class="pf-v6-c-page__main-section">
607
+ <section
608
+ class="pf-v6-c-page__main-section"
609
+ aria-label="Dock main section example"
610
+ >
564
611
  <div class="pf-v6-c-page__main-body">
565
612
  This is a default
566
613
  <code>.pf-v6-c-page__main-section</code>.
@@ -25,7 +25,19 @@ cssPrefix: pf-v6-c-pagination
25
25
  </span>
26
26
  <span class="pf-v6-c-menu-toggle__controls">
27
27
  <span class="pf-v6-c-menu-toggle__toggle-icon">
28
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
28
+ <svg
29
+ class="pf-v6-svg"
30
+ viewBox="0 0 20 20"
31
+ fill="currentColor"
32
+ aria-hidden="true"
33
+ role="img"
34
+ width="1em"
35
+ height="1em"
36
+ >
37
+ <path
38
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
39
+ />
40
+ </svg>
29
41
  </span>
30
42
  </span>
31
43
  </button>
@@ -167,7 +179,19 @@ cssPrefix: pf-v6-c-pagination
167
179
  </span>
168
180
  <span class="pf-v6-c-menu-toggle__controls">
169
181
  <span class="pf-v6-c-menu-toggle__toggle-icon">
170
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
182
+ <svg
183
+ class="pf-v6-svg"
184
+ viewBox="0 0 20 20"
185
+ fill="currentColor"
186
+ aria-hidden="true"
187
+ role="img"
188
+ width="1em"
189
+ height="1em"
190
+ >
191
+ <path
192
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
193
+ />
194
+ </svg>
171
195
  </span>
172
196
  </span>
173
197
  </button>
@@ -319,7 +343,19 @@ cssPrefix: pf-v6-c-pagination
319
343
  </span>
320
344
  <span class="pf-v6-c-menu-toggle__controls">
321
345
  <span class="pf-v6-c-menu-toggle__toggle-icon">
322
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
346
+ <svg
347
+ class="pf-v6-svg"
348
+ viewBox="0 0 20 20"
349
+ fill="currentColor"
350
+ aria-hidden="true"
351
+ role="img"
352
+ width="1em"
353
+ height="1em"
354
+ >
355
+ <path
356
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
357
+ />
358
+ </svg>
323
359
  </span>
324
360
  </span>
325
361
  </button>
@@ -466,7 +502,19 @@ cssPrefix: pf-v6-c-pagination
466
502
  </span>
467
503
  <span class="pf-v6-c-menu-toggle__controls">
468
504
  <span class="pf-v6-c-menu-toggle__toggle-icon">
469
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
505
+ <svg
506
+ class="pf-v6-svg"
507
+ viewBox="0 0 20 20"
508
+ fill="currentColor"
509
+ aria-hidden="true"
510
+ role="img"
511
+ width="1em"
512
+ height="1em"
513
+ >
514
+ <path
515
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
516
+ />
517
+ </svg>
470
518
  </span>
471
519
  </span>
472
520
  </button>
@@ -614,7 +662,19 @@ cssPrefix: pf-v6-c-pagination
614
662
  </span>
615
663
  <span class="pf-v6-c-menu-toggle__controls">
616
664
  <span class="pf-v6-c-menu-toggle__toggle-icon">
617
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
665
+ <svg
666
+ class="pf-v6-svg"
667
+ viewBox="0 0 20 20"
668
+ fill="currentColor"
669
+ aria-hidden="true"
670
+ role="img"
671
+ width="1em"
672
+ height="1em"
673
+ >
674
+ <path
675
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
676
+ />
677
+ </svg>
618
678
  </span>
619
679
  </span>
620
680
  </button>
@@ -762,7 +822,19 @@ cssPrefix: pf-v6-c-pagination
762
822
  </span>
763
823
  <span class="pf-v6-c-menu-toggle__controls">
764
824
  <span class="pf-v6-c-menu-toggle__toggle-icon">
765
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
825
+ <svg
826
+ class="pf-v6-svg"
827
+ viewBox="0 0 20 20"
828
+ fill="currentColor"
829
+ aria-hidden="true"
830
+ role="img"
831
+ width="1em"
832
+ height="1em"
833
+ >
834
+ <path
835
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
836
+ />
837
+ </svg>
766
838
  </span>
767
839
  </span>
768
840
  </button>
@@ -905,7 +977,19 @@ cssPrefix: pf-v6-c-pagination
905
977
  </span>
906
978
  <span class="pf-v6-c-menu-toggle__controls">
907
979
  <span class="pf-v6-c-menu-toggle__toggle-icon">
908
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
980
+ <svg
981
+ class="pf-v6-svg"
982
+ viewBox="0 0 20 20"
983
+ fill="currentColor"
984
+ aria-hidden="true"
985
+ role="img"
986
+ width="1em"
987
+ height="1em"
988
+ >
989
+ <path
990
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
991
+ />
992
+ </svg>
909
993
  </span>
910
994
  </span>
911
995
  </button>
@@ -1049,7 +1133,19 @@ cssPrefix: pf-v6-c-pagination
1049
1133
  </span>
1050
1134
  <span class="pf-v6-c-menu-toggle__controls">
1051
1135
  <span class="pf-v6-c-menu-toggle__toggle-icon">
1052
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
1136
+ <svg
1137
+ class="pf-v6-svg"
1138
+ viewBox="0 0 20 20"
1139
+ fill="currentColor"
1140
+ aria-hidden="true"
1141
+ role="img"
1142
+ width="1em"
1143
+ height="1em"
1144
+ >
1145
+ <path
1146
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
1147
+ />
1148
+ </svg>
1053
1149
  </span>
1054
1150
  </span>
1055
1151
  </button>
@@ -1131,7 +1227,19 @@ cssPrefix: pf-v6-c-pagination
1131
1227
  </span>
1132
1228
  <span class="pf-v6-c-menu-toggle__controls">
1133
1229
  <span class="pf-v6-c-menu-toggle__toggle-icon">
1134
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
1230
+ <svg
1231
+ class="pf-v6-svg"
1232
+ viewBox="0 0 20 20"
1233
+ fill="currentColor"
1234
+ aria-hidden="true"
1235
+ role="img"
1236
+ width="1em"
1237
+ height="1em"
1238
+ >
1239
+ <path
1240
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
1241
+ />
1242
+ </svg>
1135
1243
  </span>
1136
1244
  </span>
1137
1245
  </button>
@@ -1273,7 +1381,19 @@ cssPrefix: pf-v6-c-pagination
1273
1381
  </span>
1274
1382
  <span class="pf-v6-c-menu-toggle__controls">
1275
1383
  <span class="pf-v6-c-menu-toggle__toggle-icon">
1276
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
1384
+ <svg
1385
+ class="pf-v6-svg"
1386
+ viewBox="0 0 20 20"
1387
+ fill="currentColor"
1388
+ aria-hidden="true"
1389
+ role="img"
1390
+ width="1em"
1391
+ height="1em"
1392
+ >
1393
+ <path
1394
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
1395
+ />
1396
+ </svg>
1277
1397
  </span>
1278
1398
  </span>
1279
1399
  </button>
@@ -1417,7 +1537,19 @@ cssPrefix: pf-v6-c-pagination
1417
1537
  </span>
1418
1538
  <span class="pf-v6-c-menu-toggle__controls">
1419
1539
  <span class="pf-v6-c-menu-toggle__toggle-icon">
1420
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
1540
+ <svg
1541
+ class="pf-v6-svg"
1542
+ viewBox="0 0 20 20"
1543
+ fill="currentColor"
1544
+ aria-hidden="true"
1545
+ role="img"
1546
+ width="1em"
1547
+ height="1em"
1548
+ >
1549
+ <path
1550
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
1551
+ />
1552
+ </svg>
1421
1553
  </span>
1422
1554
  </span>
1423
1555
  </button>
@@ -1559,7 +1691,19 @@ cssPrefix: pf-v6-c-pagination
1559
1691
  </span>
1560
1692
  <span class="pf-v6-c-menu-toggle__controls">
1561
1693
  <span class="pf-v6-c-menu-toggle__toggle-icon">
1562
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
1694
+ <svg
1695
+ class="pf-v6-svg"
1696
+ viewBox="0 0 20 20"
1697
+ fill="currentColor"
1698
+ aria-hidden="true"
1699
+ role="img"
1700
+ width="1em"
1701
+ height="1em"
1702
+ >
1703
+ <path
1704
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
1705
+ />
1706
+ </svg>
1563
1707
  </span>
1564
1708
  </span>
1565
1709
  </button>
@@ -1643,7 +1787,19 @@ cssPrefix: pf-v6-c-pagination
1643
1787
  </span>
1644
1788
  <span class="pf-v6-c-menu-toggle__controls">
1645
1789
  <span class="pf-v6-c-menu-toggle__toggle-icon">
1646
- <i class="fas fa-caret-down fa-fw" aria-hidden="true"></i>
1790
+ <svg
1791
+ class="pf-v6-svg"
1792
+ viewBox="0 0 20 20"
1793
+ fill="currentColor"
1794
+ aria-hidden="true"
1795
+ role="img"
1796
+ width="1em"
1797
+ height="1em"
1798
+ >
1799
+ <path
1800
+ d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
1801
+ />
1802
+ </svg>
1647
1803
  </span>
1648
1804
  </span>
1649
1805
  </button>