@patternfly/patternfly 6.0.0-alpha.81 → 6.0.0-alpha.83

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 (52) hide show
  1. package/components/MenuToggle/menu-toggle.css +229 -265
  2. package/components/MenuToggle/menu-toggle.scss +330 -370
  3. package/components/TextInputGroup/text-input-group.css +0 -14
  4. package/components/TextInputGroup/text-input-group.scss +3 -16
  5. package/components/Wizard/wizard.css +128 -205
  6. package/components/Wizard/wizard.scss +128 -180
  7. package/docs/components/Button/examples/Button.md +134 -134
  8. package/docs/components/CalendarMonth/examples/CalendarMonth.md +4 -4
  9. package/docs/components/Card/examples/Card.md +8 -8
  10. package/docs/components/DualListSelector/examples/DualListSelector.md +2 -2
  11. package/docs/components/Form/examples/Form.md +11 -11
  12. package/docs/components/Label/examples/Label.md +157 -157
  13. package/docs/components/MenuToggle/examples/MenuToggle.md +88 -51
  14. package/docs/components/Tabs/examples/Tabs.md +24 -24
  15. package/docs/components/Toolbar/examples/Toolbar.md +28 -28
  16. package/docs/components/Wizard/examples/Wizard.md +31 -7
  17. package/docs/demos/AboutModal/examples/AboutModal.md +2 -2
  18. package/docs/demos/Alert/examples/Alert.md +6 -6
  19. package/docs/demos/BackToTop/examples/BackToTop.md +2 -2
  20. package/docs/demos/Banner/examples/Banner.md +4 -4
  21. package/docs/demos/Button/examples/Button.md +1 -1
  22. package/docs/demos/CardView/examples/CardView.md +3 -3
  23. package/docs/demos/ContextSelector/examples/ContextSelector.md +7 -7
  24. package/docs/demos/Dashboard/examples/Dashboard.md +2 -2
  25. package/docs/demos/DataList/examples/DataList.md +13 -13
  26. package/docs/demos/DescriptionList/examples/DescriptionList.md +6 -6
  27. package/docs/demos/Drawer/examples/Drawer.md +10 -10
  28. package/docs/demos/Form/examples/BasicForms.md +12 -12
  29. package/docs/demos/JumpLinks/examples/JumpLinks.md +12 -12
  30. package/docs/demos/Masthead/examples/Masthead.md +9 -9
  31. package/docs/demos/Modal/examples/Modal.md +15 -15
  32. package/docs/demos/Nav/examples/Nav.md +12 -12
  33. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +10 -10
  34. package/docs/demos/Page/examples/Page.md +18 -18
  35. package/docs/demos/Page/examples/Penta.md +4 -4
  36. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +1 -1
  37. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +4 -4
  38. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +18 -18
  39. package/docs/demos/Skeleton/examples/Skeleton.md +2 -2
  40. package/docs/demos/Table/examples/Table.md +54 -54
  41. package/docs/demos/Tabs/examples/Tabs.md +12 -12
  42. package/docs/demos/Toolbar/examples/Toolbar.md +17 -17
  43. package/docs/demos/Wizard/examples/Wizard.md +126 -36
  44. package/package.json +1 -1
  45. package/patternfly-no-globals.css +370 -490
  46. package/patternfly-theme-dark-unversioned.css +370 -490
  47. package/patternfly.css +370 -490
  48. package/patternfly.min.css +1 -1
  49. package/patternfly.min.css.map +1 -1
  50. package/components/MenuToggle/themes/dark/menu-toggle.scss +0 -27
  51. package/components/TextInputGroup/themes/dark/text-input-group.scss +0 -11
  52. package/components/Wizard/themes/dark/wizard.scss +0 -12
package/docs/components/Button/examples/Button.md CHANGED
@@ -14,7 +14,7 @@ cssPrefix: pf-v5-c-button
14
14
  <button class="pf-v5-c-button pf-m-secondary" type="button">Secondary</button>
15
15
 
16
16
  <button
17
- class="pf-v5-c-button pf-m-secondary pf-m-danger"
17
+ class="pf-v5-c-button pf-m-danger pf-m-secondary"
18
18
  type="button"
19
19
  >Secondary danger</button>
20
20
 
@@ -29,9 +29,9 @@ cssPrefix: pf-v5-c-button
29
29
 
30
30
  <button class="pf-v5-c-button pf-m-link" type="button">Link</button>
31
31
 
32
- <button class="pf-v5-c-button pf-m-danger pf-m-link" type="button">Link danger</button>
32
+ <button class="pf-v5-c-button pf-m-link pf-m-danger" type="button">Link danger</button>
33
33
 
34
- <button class="pf-v5-c-button pf-m-link pf-m-inline" type="button">Inline link</button>
34
+ <button class="pf-v5-c-button pf-m-inline pf-m-link" type="button">Inline link</button>
35
35
 
36
36
  <button class="pf-v5-c-button pf-m-plain" type="button" aria-label="Remove">
37
37
  <i class="fas fa-times" aria-hidden="true"></i>
@@ -70,7 +70,7 @@ cssPrefix: pf-v5-c-button
70
70
  Secondary
71
71
  </button>
72
72
 
73
- <button class="pf-v5-c-button pf-m-secondary pf-m-danger" type="button">
73
+ <button class="pf-v5-c-button pf-m-danger pf-m-secondary" type="button">
74
74
  <span class="pf-v5-c-button__icon pf-m-start">
75
75
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
76
76
  </span>
@@ -108,14 +108,14 @@ cssPrefix: pf-v5-c-button
108
108
  Link
109
109
  </button>
110
110
 
111
- <button class="pf-v5-c-button pf-m-danger pf-m-link" type="button">
111
+ <button class="pf-v5-c-button pf-m-link pf-m-danger" type="button">
112
112
  <span class="pf-v5-c-button__icon pf-m-start">
113
113
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
114
114
  </span>
115
115
  Link danger
116
116
  </button>
117
117
 
118
- <button class="pf-v5-c-button pf-m-link pf-m-inline" type="button">
118
+ <button class="pf-v5-c-button pf-m-inline pf-m-link" type="button">
119
119
  <span class="pf-v5-c-button__icon pf-m-start">
120
120
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
121
121
  </span>
@@ -164,7 +164,7 @@ cssPrefix: pf-v5-c-button
164
164
  </span>
165
165
  </button>
166
166
 
167
- <button class="pf-v5-c-button pf-m-secondary pf-m-danger" type="button">
167
+ <button class="pf-v5-c-button pf-m-danger pf-m-secondary" type="button">
168
168
  Secondary danger
169
169
  <span class="pf-v5-c-button__icon pf-m-end">
170
170
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -202,14 +202,14 @@ cssPrefix: pf-v5-c-button
202
202
  </span>
203
203
  </button>
204
204
 
205
- <button class="pf-v5-c-button pf-m-danger pf-m-link" type="button">
205
+ <button class="pf-v5-c-button pf-m-link pf-m-danger" type="button">
206
206
  Link danger
207
207
  <span class="pf-v5-c-button__icon pf-m-end">
208
208
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
209
209
  </span>
210
210
  </button>
211
211
 
212
- <button class="pf-v5-c-button pf-m-link pf-m-inline" type="button">
212
+ <button class="pf-v5-c-button pf-m-inline pf-m-link" type="button">
213
213
  Inline link
214
214
  <span class="pf-v5-c-button__icon pf-m-end">
215
215
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -243,41 +243,41 @@ cssPrefix: pf-v5-c-button
243
243
  ### Clicked buttons
244
244
 
245
245
  ```html
246
- <button class="pf-v5-c-button pf-m-primary pf-m-clicked" type="button">Primary</button>
246
+ <button class="pf-v5-c-button pf-m-clicked pf-m-primary" type="button">Primary</button>
247
247
 
248
248
  <button
249
- class="pf-v5-c-button pf-m-secondary pf-m-clicked"
249
+ class="pf-v5-c-button pf-m-clicked pf-m-secondary"
250
250
  type="button"
251
251
  >Secondary</button>
252
252
 
253
253
  <button
254
- class="pf-v5-c-button pf-m-secondary pf-m-danger pf-m-clicked"
254
+ class="pf-v5-c-button pf-m-clicked pf-m-danger pf-m-secondary"
255
255
  type="button"
256
256
  >Secondary danger</button>
257
257
 
258
- <button class="pf-v5-c-button pf-m-tertiary pf-m-clicked" type="button">Tertiary</button>
258
+ <button class="pf-v5-c-button pf-m-clicked pf-m-tertiary" type="button">Tertiary</button>
259
259
 
260
- <button class="pf-v5-c-button pf-m-danger pf-m-clicked" type="button">Danger</button>
260
+ <button class="pf-v5-c-button pf-m-clicked pf-m-danger" type="button">Danger</button>
261
261
 
262
- <button class="pf-v5-c-button pf-m-warning pf-m-clicked" type="button">Warning</button>
262
+ <button class="pf-v5-c-button pf-m-clicked pf-m-warning" type="button">Warning</button>
263
263
 
264
264
  <br />
265
265
  <br />
266
266
 
267
- <button class="pf-v5-c-button pf-m-link pf-m-clicked" type="button">Link</button>
267
+ <button class="pf-v5-c-button pf-m-clicked pf-m-link" type="button">Link</button>
268
268
 
269
269
  <button
270
- class="pf-v5-c-button pf-m-danger pf-m-link pf-m-clicked"
270
+ class="pf-v5-c-button pf-m-clicked pf-m-link pf-m-danger"
271
271
  type="button"
272
272
  >Link danger</button>
273
273
 
274
274
  <button
275
- class="pf-v5-c-button pf-m-link pf-m-inline pf-m-clicked"
275
+ class="pf-v5-c-button pf-m-clicked pf-m-inline pf-m-link"
276
276
  type="button"
277
277
  >Inline link</button>
278
278
 
279
279
  <button
280
- class="pf-v5-c-button pf-m-plain pf-m-clicked"
280
+ class="pf-v5-c-button pf-m-clicked pf-m-plain"
281
281
  type="button"
282
282
  aria-label="Remove"
283
283
  >
@@ -287,10 +287,10 @@ cssPrefix: pf-v5-c-button
287
287
  <br />
288
288
  <br />
289
289
 
290
- <button class="pf-v5-c-button pf-m-control pf-m-clicked" type="button">Control</button>
290
+ <button class="pf-v5-c-button pf-m-clicked pf-m-control" type="button">Control</button>
291
291
 
292
292
  <button
293
- class="pf-v5-c-button pf-m-control pf-m-clicked"
293
+ class="pf-v5-c-button pf-m-clicked pf-m-control"
294
294
  type="button"
295
295
  aria-label="Copy input"
296
296
  >
@@ -303,14 +303,14 @@ cssPrefix: pf-v5-c-button
303
303
  <div>
304
304
  <strong>Icon</strong>
305
305
  </div>
306
- <button class="pf-v5-c-button pf-m-primary pf-m-clicked" type="button">
306
+ <button class="pf-v5-c-button pf-m-clicked pf-m-primary" type="button">
307
307
  <span class="pf-v5-c-button__icon pf-m-start">
308
308
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
309
309
  </span>
310
310
  Primary
311
311
  </button>
312
312
 
313
- <button class="pf-v5-c-button pf-m-secondary pf-m-clicked" type="button">
313
+ <button class="pf-v5-c-button pf-m-clicked pf-m-secondary" type="button">
314
314
  <span class="pf-v5-c-button__icon pf-m-start">
315
315
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
316
316
  </span>
@@ -318,7 +318,7 @@ cssPrefix: pf-v5-c-button
318
318
  </button>
319
319
 
320
320
  <button
321
- class="pf-v5-c-button pf-m-secondary pf-m-danger pf-m-clicked"
321
+ class="pf-v5-c-button pf-m-clicked pf-m-danger pf-m-secondary"
322
322
  type="button"
323
323
  >
324
324
  <span class="pf-v5-c-button__icon pf-m-start">
@@ -327,21 +327,21 @@ cssPrefix: pf-v5-c-button
327
327
  Secondary danger
328
328
  </button>
329
329
 
330
- <button class="pf-v5-c-button pf-m-tertiary pf-m-clicked" type="button">
330
+ <button class="pf-v5-c-button pf-m-clicked pf-m-tertiary" type="button">
331
331
  <span class="pf-v5-c-button__icon pf-m-start">
332
332
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
333
333
  </span>
334
334
  Tertiary
335
335
  </button>
336
336
 
337
- <button class="pf-v5-c-button pf-m-danger pf-m-clicked" type="button">
337
+ <button class="pf-v5-c-button pf-m-clicked pf-m-danger" type="button">
338
338
  <span class="pf-v5-c-button__icon pf-m-start">
339
339
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
340
340
  </span>
341
341
  Danger
342
342
  </button>
343
343
 
344
- <button class="pf-v5-c-button pf-m-warning pf-m-clicked" type="button">
344
+ <button class="pf-v5-c-button pf-m-clicked pf-m-warning" type="button">
345
345
  <span class="pf-v5-c-button__icon pf-m-start">
346
346
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
347
347
  </span>
@@ -351,21 +351,21 @@ cssPrefix: pf-v5-c-button
351
351
  <br />
352
352
  <br />
353
353
 
354
- <button class="pf-v5-c-button pf-m-link pf-m-clicked" type="button">
354
+ <button class="pf-v5-c-button pf-m-clicked pf-m-link" type="button">
355
355
  <span class="pf-v5-c-button__icon pf-m-start">
356
356
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
357
357
  </span>
358
358
  Link
359
359
  </button>
360
360
 
361
- <button class="pf-v5-c-button pf-m-danger pf-m-link pf-m-clicked" type="button">
361
+ <button class="pf-v5-c-button pf-m-clicked pf-m-link pf-m-danger" type="button">
362
362
  <span class="pf-v5-c-button__icon pf-m-start">
363
363
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
364
364
  </span>
365
365
  Link danger
366
366
  </button>
367
367
 
368
- <button class="pf-v5-c-button pf-m-link pf-m-inline pf-m-clicked" type="button">
368
+ <button class="pf-v5-c-button pf-m-clicked pf-m-inline pf-m-link" type="button">
369
369
  <span class="pf-v5-c-button__icon pf-m-start">
370
370
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
371
371
  </span>
@@ -373,7 +373,7 @@ cssPrefix: pf-v5-c-button
373
373
  </button>
374
374
 
375
375
  <button
376
- class="pf-v5-c-button pf-m-plain pf-m-clicked"
376
+ class="pf-v5-c-button pf-m-clicked pf-m-plain"
377
377
  type="button"
378
378
  aria-label="Remove"
379
379
  >
@@ -383,7 +383,7 @@ cssPrefix: pf-v5-c-button
383
383
  <br />
384
384
  <br />
385
385
 
386
- <button class="pf-v5-c-button pf-m-control pf-m-clicked" type="button">
386
+ <button class="pf-v5-c-button pf-m-clicked pf-m-control" type="button">
387
387
  <span class="pf-v5-c-button__icon pf-m-start">
388
388
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
389
389
  </span>
@@ -391,7 +391,7 @@ cssPrefix: pf-v5-c-button
391
391
  </button>
392
392
 
393
393
  <button
394
- class="pf-v5-c-button pf-m-control pf-m-clicked"
394
+ class="pf-v5-c-button pf-m-clicked pf-m-control"
395
395
  type="button"
396
396
  aria-label="Copy input"
397
397
  >
@@ -404,14 +404,14 @@ cssPrefix: pf-v5-c-button
404
404
  <div>
405
405
  <strong>Icon end</strong>
406
406
  </div>
407
- <button class="pf-v5-c-button pf-m-primary pf-m-clicked" type="button">
407
+ <button class="pf-v5-c-button pf-m-clicked pf-m-primary" type="button">
408
408
  Primary
409
409
  <span class="pf-v5-c-button__icon pf-m-end">
410
410
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
411
411
  </span>
412
412
  </button>
413
413
 
414
- <button class="pf-v5-c-button pf-m-secondary pf-m-clicked" type="button">
414
+ <button class="pf-v5-c-button pf-m-clicked pf-m-secondary" type="button">
415
415
  Secondary
416
416
  <span class="pf-v5-c-button__icon pf-m-end">
417
417
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -419,7 +419,7 @@ cssPrefix: pf-v5-c-button
419
419
  </button>
420
420
 
421
421
  <button
422
- class="pf-v5-c-button pf-m-secondary pf-m-danger pf-m-clicked"
422
+ class="pf-v5-c-button pf-m-clicked pf-m-danger pf-m-secondary"
423
423
  type="button"
424
424
  >
425
425
  Secondary danger
@@ -428,21 +428,21 @@ cssPrefix: pf-v5-c-button
428
428
  </span>
429
429
  </button>
430
430
 
431
- <button class="pf-v5-c-button pf-m-tertiary pf-m-clicked" type="button">
431
+ <button class="pf-v5-c-button pf-m-clicked pf-m-tertiary" type="button">
432
432
  Tertiary
433
433
  <span class="pf-v5-c-button__icon pf-m-end">
434
434
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
435
435
  </span>
436
436
  </button>
437
437
 
438
- <button class="pf-v5-c-button pf-m-danger pf-m-clicked" type="button">
438
+ <button class="pf-v5-c-button pf-m-clicked pf-m-danger" type="button">
439
439
  Danger
440
440
  <span class="pf-v5-c-button__icon pf-m-end">
441
441
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
442
442
  </span>
443
443
  </button>
444
444
 
445
- <button class="pf-v5-c-button pf-m-warning pf-m-clicked" type="button">
445
+ <button class="pf-v5-c-button pf-m-clicked pf-m-warning" type="button">
446
446
  Warning
447
447
  <span class="pf-v5-c-button__icon pf-m-end">
448
448
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -452,21 +452,21 @@ cssPrefix: pf-v5-c-button
452
452
  <br />
453
453
  <br />
454
454
 
455
- <button class="pf-v5-c-button pf-m-link pf-m-clicked" type="button">
455
+ <button class="pf-v5-c-button pf-m-clicked pf-m-link" type="button">
456
456
  Link
457
457
  <span class="pf-v5-c-button__icon pf-m-end">
458
458
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
459
459
  </span>
460
460
  </button>
461
461
 
462
- <button class="pf-v5-c-button pf-m-danger pf-m-link pf-m-clicked" type="button">
462
+ <button class="pf-v5-c-button pf-m-clicked pf-m-link pf-m-danger" type="button">
463
463
  Link danger
464
464
  <span class="pf-v5-c-button__icon pf-m-end">
465
465
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
466
466
  </span>
467
467
  </button>
468
468
 
469
- <button class="pf-v5-c-button pf-m-link pf-m-inline pf-m-clicked" type="button">
469
+ <button class="pf-v5-c-button pf-m-clicked pf-m-inline pf-m-link" type="button">
470
470
  Inline link
471
471
  <span class="pf-v5-c-button__icon pf-m-end">
472
472
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -474,7 +474,7 @@ cssPrefix: pf-v5-c-button
474
474
  </button>
475
475
 
476
476
  <button
477
- class="pf-v5-c-button pf-m-plain pf-m-clicked"
477
+ class="pf-v5-c-button pf-m-clicked pf-m-plain"
478
478
  type="button"
479
479
  aria-label="Remove"
480
480
  >
@@ -484,7 +484,7 @@ cssPrefix: pf-v5-c-button
484
484
  <br />
485
485
  <br />
486
486
 
487
- <button class="pf-v5-c-button pf-m-control pf-m-clicked" type="button">
487
+ <button class="pf-v5-c-button pf-m-clicked pf-m-control" type="button">
488
488
  Control
489
489
  <span class="pf-v5-c-button__icon pf-m-end">
490
490
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -492,7 +492,7 @@ cssPrefix: pf-v5-c-button
492
492
  </button>
493
493
 
494
494
  <button
495
- class="pf-v5-c-button pf-m-control pf-m-clicked"
495
+ class="pf-v5-c-button pf-m-clicked pf-m-control"
496
496
  type="button"
497
497
  aria-label="Copy input"
498
498
  >
@@ -504,38 +504,38 @@ cssPrefix: pf-v5-c-button
504
504
  ### Small buttons
505
505
 
506
506
  ```html
507
- <button class="pf-v5-c-button pf-m-primary pf-m-small" type="button">Primary</button>
507
+ <button class="pf-v5-c-button pf-m-small pf-m-primary" type="button">Primary</button>
508
508
 
509
- <button class="pf-v5-c-button pf-m-secondary pf-m-small" type="button">Secondary</button>
509
+ <button class="pf-v5-c-button pf-m-small pf-m-secondary" type="button">Secondary</button>
510
510
 
511
511
  <button
512
- class="pf-v5-c-button pf-m-secondary pf-m-danger pf-m-small"
512
+ class="pf-v5-c-button pf-m-small pf-m-danger pf-m-secondary"
513
513
  type="button"
514
514
  >Secondary danger</button>
515
515
 
516
- <button class="pf-v5-c-button pf-m-tertiary pf-m-small" type="button">Tertiary</button>
516
+ <button class="pf-v5-c-button pf-m-small pf-m-tertiary" type="button">Tertiary</button>
517
517
 
518
- <button class="pf-v5-c-button pf-m-danger pf-m-small" type="button">Danger</button>
518
+ <button class="pf-v5-c-button pf-m-small pf-m-danger" type="button">Danger</button>
519
519
 
520
- <button class="pf-v5-c-button pf-m-warning pf-m-small" type="button">Warning</button>
520
+ <button class="pf-v5-c-button pf-m-small pf-m-warning" type="button">Warning</button>
521
521
 
522
522
  <br />
523
523
  <br />
524
524
 
525
- <button class="pf-v5-c-button pf-m-link pf-m-small" type="button">Link</button>
525
+ <button class="pf-v5-c-button pf-m-small pf-m-link" type="button">Link</button>
526
526
 
527
527
  <button
528
- class="pf-v5-c-button pf-m-danger pf-m-link pf-m-small"
528
+ class="pf-v5-c-button pf-m-small pf-m-link pf-m-danger"
529
529
  type="button"
530
530
  >Link danger</button>
531
531
 
532
532
  <button
533
- class="pf-v5-c-button pf-m-link pf-m-inline pf-m-small"
533
+ class="pf-v5-c-button pf-m-small pf-m-inline pf-m-link"
534
534
  type="button"
535
535
  >Inline link</button>
536
536
 
537
537
  <button
538
- class="pf-v5-c-button pf-m-plain pf-m-small"
538
+ class="pf-v5-c-button pf-m-small pf-m-plain"
539
539
  type="button"
540
540
  aria-label="Remove"
541
541
  >
@@ -545,10 +545,10 @@ cssPrefix: pf-v5-c-button
545
545
  <br />
546
546
  <br />
547
547
 
548
- <button class="pf-v5-c-button pf-m-control pf-m-small" type="button">Control</button>
548
+ <button class="pf-v5-c-button pf-m-small pf-m-control" type="button">Control</button>
549
549
 
550
550
  <button
551
- class="pf-v5-c-button pf-m-control pf-m-small"
551
+ class="pf-v5-c-button pf-m-small pf-m-control"
552
552
  type="button"
553
553
  aria-label="Copy input"
554
554
  >
@@ -561,14 +561,14 @@ cssPrefix: pf-v5-c-button
561
561
  <div>
562
562
  <strong>Icon</strong>
563
563
  </div>
564
- <button class="pf-v5-c-button pf-m-primary pf-m-small" type="button">
564
+ <button class="pf-v5-c-button pf-m-small pf-m-primary" type="button">
565
565
  <span class="pf-v5-c-button__icon pf-m-start">
566
566
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
567
567
  </span>
568
568
  Primary
569
569
  </button>
570
570
 
571
- <button class="pf-v5-c-button pf-m-secondary pf-m-small" type="button">
571
+ <button class="pf-v5-c-button pf-m-small pf-m-secondary" type="button">
572
572
  <span class="pf-v5-c-button__icon pf-m-start">
573
573
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
574
574
  </span>
@@ -576,7 +576,7 @@ cssPrefix: pf-v5-c-button
576
576
  </button>
577
577
 
578
578
  <button
579
- class="pf-v5-c-button pf-m-secondary pf-m-danger pf-m-small"
579
+ class="pf-v5-c-button pf-m-small pf-m-danger pf-m-secondary"
580
580
  type="button"
581
581
  >
582
582
  <span class="pf-v5-c-button__icon pf-m-start">
@@ -585,21 +585,21 @@ cssPrefix: pf-v5-c-button
585
585
  Secondary danger
586
586
  </button>
587
587
 
588
- <button class="pf-v5-c-button pf-m-tertiary pf-m-small" type="button">
588
+ <button class="pf-v5-c-button pf-m-small pf-m-tertiary" type="button">
589
589
  <span class="pf-v5-c-button__icon pf-m-start">
590
590
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
591
591
  </span>
592
592
  Tertiary
593
593
  </button>
594
594
 
595
- <button class="pf-v5-c-button pf-m-danger pf-m-small" type="button">
595
+ <button class="pf-v5-c-button pf-m-small pf-m-danger" type="button">
596
596
  <span class="pf-v5-c-button__icon pf-m-start">
597
597
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
598
598
  </span>
599
599
  Danger
600
600
  </button>
601
601
 
602
- <button class="pf-v5-c-button pf-m-warning pf-m-small" type="button">
602
+ <button class="pf-v5-c-button pf-m-small pf-m-warning" type="button">
603
603
  <span class="pf-v5-c-button__icon pf-m-start">
604
604
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
605
605
  </span>
@@ -609,21 +609,21 @@ cssPrefix: pf-v5-c-button
609
609
  <br />
610
610
  <br />
611
611
 
612
- <button class="pf-v5-c-button pf-m-link pf-m-small" type="button">
612
+ <button class="pf-v5-c-button pf-m-small pf-m-link" type="button">
613
613
  <span class="pf-v5-c-button__icon pf-m-start">
614
614
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
615
615
  </span>
616
616
  Link
617
617
  </button>
618
618
 
619
- <button class="pf-v5-c-button pf-m-danger pf-m-link pf-m-small" type="button">
619
+ <button class="pf-v5-c-button pf-m-small pf-m-link pf-m-danger" type="button">
620
620
  <span class="pf-v5-c-button__icon pf-m-start">
621
621
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
622
622
  </span>
623
623
  Link danger
624
624
  </button>
625
625
 
626
- <button class="pf-v5-c-button pf-m-link pf-m-inline pf-m-small" type="button">
626
+ <button class="pf-v5-c-button pf-m-small pf-m-inline pf-m-link" type="button">
627
627
  <span class="pf-v5-c-button__icon pf-m-start">
628
628
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
629
629
  </span>
@@ -631,7 +631,7 @@ cssPrefix: pf-v5-c-button
631
631
  </button>
632
632
 
633
633
  <button
634
- class="pf-v5-c-button pf-m-plain pf-m-small"
634
+ class="pf-v5-c-button pf-m-small pf-m-plain"
635
635
  type="button"
636
636
  aria-label="Remove"
637
637
  >
@@ -641,7 +641,7 @@ cssPrefix: pf-v5-c-button
641
641
  <br />
642
642
  <br />
643
643
 
644
- <button class="pf-v5-c-button pf-m-control pf-m-small" type="button">
644
+ <button class="pf-v5-c-button pf-m-small pf-m-control" type="button">
645
645
  <span class="pf-v5-c-button__icon pf-m-start">
646
646
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
647
647
  </span>
@@ -649,7 +649,7 @@ cssPrefix: pf-v5-c-button
649
649
  </button>
650
650
 
651
651
  <button
652
- class="pf-v5-c-button pf-m-control pf-m-small"
652
+ class="pf-v5-c-button pf-m-small pf-m-control"
653
653
  type="button"
654
654
  aria-label="Copy input"
655
655
  >
@@ -662,14 +662,14 @@ cssPrefix: pf-v5-c-button
662
662
  <div>
663
663
  <strong>Icon end</strong>
664
664
  </div>
665
- <button class="pf-v5-c-button pf-m-primary pf-m-small" type="button">
665
+ <button class="pf-v5-c-button pf-m-small pf-m-primary" type="button">
666
666
  Primary
667
667
  <span class="pf-v5-c-button__icon pf-m-end">
668
668
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
669
669
  </span>
670
670
  </button>
671
671
 
672
- <button class="pf-v5-c-button pf-m-secondary pf-m-small" type="button">
672
+ <button class="pf-v5-c-button pf-m-small pf-m-secondary" type="button">
673
673
  Secondary
674
674
  <span class="pf-v5-c-button__icon pf-m-end">
675
675
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -677,7 +677,7 @@ cssPrefix: pf-v5-c-button
677
677
  </button>
678
678
 
679
679
  <button
680
- class="pf-v5-c-button pf-m-secondary pf-m-danger pf-m-small"
680
+ class="pf-v5-c-button pf-m-small pf-m-danger pf-m-secondary"
681
681
  type="button"
682
682
  >
683
683
  Secondary danger
@@ -686,21 +686,21 @@ cssPrefix: pf-v5-c-button
686
686
  </span>
687
687
  </button>
688
688
 
689
- <button class="pf-v5-c-button pf-m-tertiary pf-m-small" type="button">
689
+ <button class="pf-v5-c-button pf-m-small pf-m-tertiary" type="button">
690
690
  Tertiary
691
691
  <span class="pf-v5-c-button__icon pf-m-end">
692
692
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
693
693
  </span>
694
694
  </button>
695
695
 
696
- <button class="pf-v5-c-button pf-m-danger pf-m-small" type="button">
696
+ <button class="pf-v5-c-button pf-m-small pf-m-danger" type="button">
697
697
  Danger
698
698
  <span class="pf-v5-c-button__icon pf-m-end">
699
699
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
700
700
  </span>
701
701
  </button>
702
702
 
703
- <button class="pf-v5-c-button pf-m-warning pf-m-small" type="button">
703
+ <button class="pf-v5-c-button pf-m-small pf-m-warning" type="button">
704
704
  Warning
705
705
  <span class="pf-v5-c-button__icon pf-m-end">
706
706
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -710,21 +710,21 @@ cssPrefix: pf-v5-c-button
710
710
  <br />
711
711
  <br />
712
712
 
713
- <button class="pf-v5-c-button pf-m-link pf-m-small" type="button">
713
+ <button class="pf-v5-c-button pf-m-small pf-m-link" type="button">
714
714
  Link
715
715
  <span class="pf-v5-c-button__icon pf-m-end">
716
716
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
717
717
  </span>
718
718
  </button>
719
719
 
720
- <button class="pf-v5-c-button pf-m-danger pf-m-link pf-m-small" type="button">
720
+ <button class="pf-v5-c-button pf-m-small pf-m-link pf-m-danger" type="button">
721
721
  Link danger
722
722
  <span class="pf-v5-c-button__icon pf-m-end">
723
723
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
724
724
  </span>
725
725
  </button>
726
726
 
727
- <button class="pf-v5-c-button pf-m-link pf-m-inline pf-m-small" type="button">
727
+ <button class="pf-v5-c-button pf-m-small pf-m-inline pf-m-link" type="button">
728
728
  Inline link
729
729
  <span class="pf-v5-c-button__icon pf-m-end">
730
730
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -732,7 +732,7 @@ cssPrefix: pf-v5-c-button
732
732
  </button>
733
733
 
734
734
  <button
735
- class="pf-v5-c-button pf-m-plain pf-m-small"
735
+ class="pf-v5-c-button pf-m-small pf-m-plain"
736
736
  type="button"
737
737
  aria-label="Remove"
738
738
  >
@@ -742,7 +742,7 @@ cssPrefix: pf-v5-c-button
742
742
  <br />
743
743
  <br />
744
744
 
745
- <button class="pf-v5-c-button pf-m-control pf-m-small" type="button">
745
+ <button class="pf-v5-c-button pf-m-small pf-m-control" type="button">
746
746
  Control
747
747
  <span class="pf-v5-c-button__icon pf-m-end">
748
748
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -750,7 +750,7 @@ cssPrefix: pf-v5-c-button
750
750
  </button>
751
751
 
752
752
  <button
753
- class="pf-v5-c-button pf-m-control pf-m-small"
753
+ class="pf-v5-c-button pf-m-small pf-m-control"
754
754
  type="button"
755
755
  aria-label="Copy input"
756
756
  >
@@ -767,7 +767,7 @@ cssPrefix: pf-v5-c-button
767
767
  <button class="pf-v5-c-button pf-m-secondary" type="button" disabled>Secondary</button>
768
768
 
769
769
  <button
770
- class="pf-v5-c-button pf-m-secondary pf-m-danger"
770
+ class="pf-v5-c-button pf-m-danger pf-m-secondary"
771
771
  type="button"
772
772
  disabled
773
773
  >Secondary danger</button>
@@ -784,13 +784,13 @@ cssPrefix: pf-v5-c-button
784
784
  <button class="pf-v5-c-button pf-m-link" type="button" disabled>Link</button>
785
785
 
786
786
  <button
787
- class="pf-v5-c-button pf-m-danger pf-m-link"
787
+ class="pf-v5-c-button pf-m-link pf-m-danger"
788
788
  type="button"
789
789
  disabled
790
790
  >Link danger</button>
791
791
 
792
792
  <button
793
- class="pf-v5-c-button pf-m-link pf-m-inline"
793
+ class="pf-v5-c-button pf-m-inline pf-m-link"
794
794
  type="button"
795
795
  disabled
796
796
  >Inline link</button>
@@ -839,7 +839,7 @@ cssPrefix: pf-v5-c-button
839
839
  </button>
840
840
 
841
841
  <button
842
- class="pf-v5-c-button pf-m-secondary pf-m-danger"
842
+ class="pf-v5-c-button pf-m-danger pf-m-secondary"
843
843
  type="button"
844
844
  disabled
845
845
  >
@@ -880,14 +880,14 @@ cssPrefix: pf-v5-c-button
880
880
  Link
881
881
  </button>
882
882
 
883
- <button class="pf-v5-c-button pf-m-danger pf-m-link" type="button" disabled>
883
+ <button class="pf-v5-c-button pf-m-link pf-m-danger" type="button" disabled>
884
884
  <span class="pf-v5-c-button__icon pf-m-start">
885
885
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
886
886
  </span>
887
887
  Link danger
888
888
  </button>
889
889
 
890
- <button class="pf-v5-c-button pf-m-link pf-m-inline" type="button" disabled>
890
+ <button class="pf-v5-c-button pf-m-inline pf-m-link" type="button" disabled>
891
891
  <span class="pf-v5-c-button__icon pf-m-start">
892
892
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
893
893
  </span>
@@ -943,7 +943,7 @@ cssPrefix: pf-v5-c-button
943
943
  </button>
944
944
 
945
945
  <button
946
- class="pf-v5-c-button pf-m-secondary pf-m-danger"
946
+ class="pf-v5-c-button pf-m-danger pf-m-secondary"
947
947
  type="button"
948
948
  disabled
949
949
  >
@@ -984,14 +984,14 @@ cssPrefix: pf-v5-c-button
984
984
  </span>
985
985
  </button>
986
986
 
987
- <button class="pf-v5-c-button pf-m-danger pf-m-link" type="button" disabled>
987
+ <button class="pf-v5-c-button pf-m-link pf-m-danger" type="button" disabled>
988
988
  Link danger
989
989
  <span class="pf-v5-c-button__icon pf-m-end">
990
990
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
991
991
  </span>
992
992
  </button>
993
993
 
994
- <button class="pf-v5-c-button pf-m-link pf-m-inline" type="button" disabled>
994
+ <button class="pf-v5-c-button pf-m-inline pf-m-link" type="button" disabled>
995
995
  Inline link
996
996
  <span class="pf-v5-c-button__icon pf-m-end">
997
997
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
@@ -1032,37 +1032,37 @@ cssPrefix: pf-v5-c-button
1032
1032
 
1033
1033
  ```html
1034
1034
  <button
1035
- class="pf-v5-c-button pf-m-primary pf-m-aria-disabled"
1035
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-primary"
1036
1036
  type="button"
1037
1037
  aria-disabled="true"
1038
1038
  >Primary</button>
1039
1039
 
1040
1040
  <button
1041
- class="pf-v5-c-button pf-m-secondary pf-m-aria-disabled"
1041
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-secondary"
1042
1042
  type="button"
1043
1043
  aria-disabled="true"
1044
1044
  >Secondary</button>
1045
1045
 
1046
1046
  <button
1047
- class="pf-v5-c-button pf-m-secondary pf-m-danger pf-m-aria-disabled"
1047
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-danger pf-m-secondary"
1048
1048
  type="button"
1049
1049
  aria-disabled="true"
1050
1050
  >Secondary danger</button>
1051
1051
 
1052
1052
  <button
1053
- class="pf-v5-c-button pf-m-tertiary pf-m-aria-disabled"
1053
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-tertiary"
1054
1054
  type="button"
1055
1055
  aria-disabled="true"
1056
1056
  >Tertiary</button>
1057
1057
 
1058
1058
  <button
1059
- class="pf-v5-c-button pf-m-danger pf-m-aria-disabled"
1059
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-danger"
1060
1060
  type="button"
1061
1061
  aria-disabled="true"
1062
1062
  >Danger</button>
1063
1063
 
1064
1064
  <button
1065
- class="pf-v5-c-button pf-m-warning pf-m-aria-disabled"
1065
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-warning"
1066
1066
  type="button"
1067
1067
  aria-disabled="true"
1068
1068
  >Warning</button>
@@ -1071,25 +1071,25 @@ cssPrefix: pf-v5-c-button
1071
1071
  <br />
1072
1072
 
1073
1073
  <button
1074
- class="pf-v5-c-button pf-m-link pf-m-aria-disabled"
1074
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-link"
1075
1075
  type="button"
1076
1076
  aria-disabled="true"
1077
1077
  >Link</button>
1078
1078
 
1079
1079
  <button
1080
- class="pf-v5-c-button pf-m-danger pf-m-link pf-m-aria-disabled"
1080
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-link pf-m-danger"
1081
1081
  type="button"
1082
1082
  aria-disabled="true"
1083
1083
  >Link danger</button>
1084
1084
 
1085
1085
  <button
1086
- class="pf-v5-c-button pf-m-link pf-m-inline pf-m-aria-disabled"
1086
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-inline pf-m-link"
1087
1087
  type="button"
1088
1088
  aria-disabled="true"
1089
1089
  >Inline link</button>
1090
1090
 
1091
1091
  <button
1092
- class="pf-v5-c-button pf-m-plain pf-m-aria-disabled"
1092
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-plain"
1093
1093
  type="button"
1094
1094
  aria-disabled="true"
1095
1095
  aria-label="Remove"
@@ -1101,13 +1101,13 @@ cssPrefix: pf-v5-c-button
1101
1101
  <br />
1102
1102
 
1103
1103
  <button
1104
- class="pf-v5-c-button pf-m-control pf-m-aria-disabled"
1104
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-control"
1105
1105
  type="button"
1106
1106
  aria-disabled="true"
1107
1107
  >Control</button>
1108
1108
 
1109
1109
  <button
1110
- class="pf-v5-c-button pf-m-control pf-m-aria-disabled"
1110
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-control"
1111
1111
  type="button"
1112
1112
  aria-disabled="true"
1113
1113
  aria-label="Copy input"
@@ -1122,7 +1122,7 @@ cssPrefix: pf-v5-c-button
1122
1122
  <strong>Icon</strong>
1123
1123
  </div>
1124
1124
  <button
1125
- class="pf-v5-c-button pf-m-primary pf-m-aria-disabled"
1125
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-primary"
1126
1126
  type="button"
1127
1127
  aria-disabled="true"
1128
1128
  >
@@ -1133,7 +1133,7 @@ cssPrefix: pf-v5-c-button
1133
1133
  </button>
1134
1134
 
1135
1135
  <button
1136
- class="pf-v5-c-button pf-m-secondary pf-m-aria-disabled"
1136
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-secondary"
1137
1137
  type="button"
1138
1138
  aria-disabled="true"
1139
1139
  >
@@ -1144,7 +1144,7 @@ cssPrefix: pf-v5-c-button
1144
1144
  </button>
1145
1145
 
1146
1146
  <button
1147
- class="pf-v5-c-button pf-m-secondary pf-m-danger pf-m-aria-disabled"
1147
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-danger pf-m-secondary"
1148
1148
  type="button"
1149
1149
  aria-disabled="true"
1150
1150
  >
@@ -1155,7 +1155,7 @@ cssPrefix: pf-v5-c-button
1155
1155
  </button>
1156
1156
 
1157
1157
  <button
1158
- class="pf-v5-c-button pf-m-tertiary pf-m-aria-disabled"
1158
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-tertiary"
1159
1159
  type="button"
1160
1160
  aria-disabled="true"
1161
1161
  >
@@ -1166,7 +1166,7 @@ cssPrefix: pf-v5-c-button
1166
1166
  </button>
1167
1167
 
1168
1168
  <button
1169
- class="pf-v5-c-button pf-m-danger pf-m-aria-disabled"
1169
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-danger"
1170
1170
  type="button"
1171
1171
  aria-disabled="true"
1172
1172
  >
@@ -1177,7 +1177,7 @@ cssPrefix: pf-v5-c-button
1177
1177
  </button>
1178
1178
 
1179
1179
  <button
1180
- class="pf-v5-c-button pf-m-warning pf-m-aria-disabled"
1180
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-warning"
1181
1181
  type="button"
1182
1182
  aria-disabled="true"
1183
1183
  >
@@ -1191,7 +1191,7 @@ cssPrefix: pf-v5-c-button
1191
1191
  <br />
1192
1192
 
1193
1193
  <button
1194
- class="pf-v5-c-button pf-m-link pf-m-aria-disabled"
1194
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-link"
1195
1195
  type="button"
1196
1196
  aria-disabled="true"
1197
1197
  >
@@ -1202,7 +1202,7 @@ cssPrefix: pf-v5-c-button
1202
1202
  </button>
1203
1203
 
1204
1204
  <button
1205
- class="pf-v5-c-button pf-m-danger pf-m-link pf-m-aria-disabled"
1205
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-link pf-m-danger"
1206
1206
  type="button"
1207
1207
  aria-disabled="true"
1208
1208
  >
@@ -1213,7 +1213,7 @@ cssPrefix: pf-v5-c-button
1213
1213
  </button>
1214
1214
 
1215
1215
  <button
1216
- class="pf-v5-c-button pf-m-link pf-m-inline pf-m-aria-disabled"
1216
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-inline pf-m-link"
1217
1217
  type="button"
1218
1218
  aria-disabled="true"
1219
1219
  >
@@ -1224,7 +1224,7 @@ cssPrefix: pf-v5-c-button
1224
1224
  </button>
1225
1225
 
1226
1226
  <button
1227
- class="pf-v5-c-button pf-m-plain pf-m-aria-disabled"
1227
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-plain"
1228
1228
  type="button"
1229
1229
  aria-disabled="true"
1230
1230
  aria-label="Remove"
@@ -1236,7 +1236,7 @@ cssPrefix: pf-v5-c-button
1236
1236
  <br />
1237
1237
 
1238
1238
  <button
1239
- class="pf-v5-c-button pf-m-control pf-m-aria-disabled"
1239
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-control"
1240
1240
  type="button"
1241
1241
  aria-disabled="true"
1242
1242
  >
@@ -1247,7 +1247,7 @@ cssPrefix: pf-v5-c-button
1247
1247
  </button>
1248
1248
 
1249
1249
  <button
1250
- class="pf-v5-c-button pf-m-control pf-m-aria-disabled"
1250
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-control"
1251
1251
  type="button"
1252
1252
  aria-disabled="true"
1253
1253
  aria-label="Copy input"
@@ -1262,7 +1262,7 @@ cssPrefix: pf-v5-c-button
1262
1262
  <strong>Icon end</strong>
1263
1263
  </div>
1264
1264
  <button
1265
- class="pf-v5-c-button pf-m-primary pf-m-aria-disabled"
1265
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-primary"
1266
1266
  type="button"
1267
1267
  aria-disabled="true"
1268
1268
  >
@@ -1273,7 +1273,7 @@ cssPrefix: pf-v5-c-button
1273
1273
  </button>
1274
1274
 
1275
1275
  <button
1276
- class="pf-v5-c-button pf-m-secondary pf-m-aria-disabled"
1276
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-secondary"
1277
1277
  type="button"
1278
1278
  aria-disabled="true"
1279
1279
  >
@@ -1284,7 +1284,7 @@ cssPrefix: pf-v5-c-button
1284
1284
  </button>
1285
1285
 
1286
1286
  <button
1287
- class="pf-v5-c-button pf-m-secondary pf-m-danger pf-m-aria-disabled"
1287
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-danger pf-m-secondary"
1288
1288
  type="button"
1289
1289
  aria-disabled="true"
1290
1290
  >
@@ -1295,7 +1295,7 @@ cssPrefix: pf-v5-c-button
1295
1295
  </button>
1296
1296
 
1297
1297
  <button
1298
- class="pf-v5-c-button pf-m-tertiary pf-m-aria-disabled"
1298
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-tertiary"
1299
1299
  type="button"
1300
1300
  aria-disabled="true"
1301
1301
  >
@@ -1306,7 +1306,7 @@ cssPrefix: pf-v5-c-button
1306
1306
  </button>
1307
1307
 
1308
1308
  <button
1309
- class="pf-v5-c-button pf-m-danger pf-m-aria-disabled"
1309
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-danger"
1310
1310
  type="button"
1311
1311
  aria-disabled="true"
1312
1312
  >
@@ -1317,7 +1317,7 @@ cssPrefix: pf-v5-c-button
1317
1317
  </button>
1318
1318
 
1319
1319
  <button
1320
- class="pf-v5-c-button pf-m-warning pf-m-aria-disabled"
1320
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-warning"
1321
1321
  type="button"
1322
1322
  aria-disabled="true"
1323
1323
  >
@@ -1331,7 +1331,7 @@ cssPrefix: pf-v5-c-button
1331
1331
  <br />
1332
1332
 
1333
1333
  <button
1334
- class="pf-v5-c-button pf-m-link pf-m-aria-disabled"
1334
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-link"
1335
1335
  type="button"
1336
1336
  aria-disabled="true"
1337
1337
  >
@@ -1342,7 +1342,7 @@ cssPrefix: pf-v5-c-button
1342
1342
  </button>
1343
1343
 
1344
1344
  <button
1345
- class="pf-v5-c-button pf-m-danger pf-m-link pf-m-aria-disabled"
1345
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-link pf-m-danger"
1346
1346
  type="button"
1347
1347
  aria-disabled="true"
1348
1348
  >
@@ -1353,7 +1353,7 @@ cssPrefix: pf-v5-c-button
1353
1353
  </button>
1354
1354
 
1355
1355
  <button
1356
- class="pf-v5-c-button pf-m-link pf-m-inline pf-m-aria-disabled"
1356
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-inline pf-m-link"
1357
1357
  type="button"
1358
1358
  aria-disabled="true"
1359
1359
  >
@@ -1364,7 +1364,7 @@ cssPrefix: pf-v5-c-button
1364
1364
  </button>
1365
1365
 
1366
1366
  <button
1367
- class="pf-v5-c-button pf-m-plain pf-m-aria-disabled"
1367
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-plain"
1368
1368
  type="button"
1369
1369
  aria-disabled="true"
1370
1370
  aria-label="Remove"
@@ -1376,7 +1376,7 @@ cssPrefix: pf-v5-c-button
1376
1376
  <br />
1377
1377
 
1378
1378
  <button
1379
- class="pf-v5-c-button pf-m-control pf-m-aria-disabled"
1379
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-control"
1380
1380
  type="button"
1381
1381
  aria-disabled="true"
1382
1382
  >
@@ -1387,7 +1387,7 @@ cssPrefix: pf-v5-c-button
1387
1387
  </button>
1388
1388
 
1389
1389
  <button
1390
- class="pf-v5-c-button pf-m-control pf-m-aria-disabled"
1390
+ class="pf-v5-c-button pf-m-aria-disabled pf-m-control"
1391
1391
  type="button"
1392
1392
  aria-disabled="true"
1393
1393
  aria-label="Copy input"
@@ -1455,7 +1455,7 @@ cssPrefix: pf-v5-c-button
1455
1455
  <strong>Plain no padding</strong>
1456
1456
  <br />
1457
1457
  <span
1458
- class="pf-v5-c-button pf-m-plain pf-m-no-padding"
1458
+ class="pf-v5-c-button pf-m-no-padding pf-m-plain"
1459
1459
  type="button"
1460
1460
  role="button"
1461
1461
  tabindex="0"
@@ -1578,12 +1578,12 @@ Sed hendrerit nisi in cursus maximus. Ut malesuada nisi turpis, in condimentum v
1578
1578
 
1579
1579
  ```html
1580
1580
  <button
1581
- class="pf-v5-c-button pf-m-progress pf-m-primary"
1581
+ class="pf-v5-c-button pf-m-primary pf-m-progress"
1582
1582
  type="button"
1583
1583
  >Primary loader</button>
1584
1584
 
1585
1585
  <button
1586
- class="pf-v5-c-button pf-m-progress pf-m-in-progress pf-m-primary"
1586
+ class="pf-v5-c-button pf-m-primary pf-m-in-progress pf-m-progress"
1587
1587
  type="button"
1588
1588
  >
1589
1589
  <span class="pf-v5-c-button__progress">
@@ -1600,12 +1600,12 @@ Sed hendrerit nisi in cursus maximus. Ut malesuada nisi turpis, in condimentum v
1600
1600
  </button>
1601
1601
  <br />
1602
1602
  <button
1603
- class="pf-v5-c-button pf-m-progress pf-m-secondary"
1603
+ class="pf-v5-c-button pf-m-secondary pf-m-progress"
1604
1604
  type="button"
1605
1605
  >Secondary loader</button>
1606
1606
 
1607
1607
  <button
1608
- class="pf-v5-c-button pf-m-progress pf-m-in-progress pf-m-secondary"
1608
+ class="pf-v5-c-button pf-m-secondary pf-m-in-progress pf-m-progress"
1609
1609
  type="button"
1610
1610
  >
1611
1611
  <span class="pf-v5-c-button__progress">
@@ -1625,7 +1625,7 @@ Sed hendrerit nisi in cursus maximus. Ut malesuada nisi turpis, in condimentum v
1625
1625
  <i class="fas fa-upload" aria-hidden="true"></i>
1626
1626
  </button>
1627
1627
 
1628
- <button class="pf-v5-c-button pf-m-in-progress pf-m-plain" type="button">
1628
+ <button class="pf-v5-c-button pf-m-plain pf-m-in-progress" type="button">
1629
1629
  <span class="pf-v5-c-button__progress">
1630
1630
  <svg
1631
1631
  class="pf-v5-c-spinner pf-m-md"
@@ -1641,12 +1641,12 @@ Sed hendrerit nisi in cursus maximus. Ut malesuada nisi turpis, in condimentum v
1641
1641
  </button>
1642
1642
  <br />
1643
1643
  <button
1644
- class="pf-v5-c-button pf-m-inline pf-m-progress pf-m-link"
1644
+ class="pf-v5-c-button pf-m-link pf-m-progress pf-m-inline"
1645
1645
  type="button"
1646
1646
  >Inline loader</button>
1647
1647
 
1648
1648
  <button
1649
- class="pf-v5-c-button pf-m-inline pf-m-progress pf-m-in-progress pf-m-link"
1649
+ class="pf-v5-c-button pf-m-link pf-m-in-progress pf-m-progress pf-m-inline"
1650
1650
  type="button"
1651
1651
  >
1652
1652
  <span class="pf-v5-c-button__progress">