@patternfly/patternfly 6.0.0-alpha.17 → 6.0.0-alpha.18
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.
- package/assets/images/logo__pf--reverse-on-md.svg +1 -1
- package/assets/images/pf-c-brand__logo-on-lg-white.svg +32 -0
- package/assets/images/pf-c-brand__logo-on-md-white.svg +42 -0
- package/assets/images/pf-c-brand__logo-on-sm-white.svg +17 -0
- package/assets/images/pf-c-brand__logo-on-sm.svg +1 -1
- package/assets/images/pf-c-brand__logo-on-xl-white.svg +39 -0
- package/assets/images/pf_logo_white.hbs +35 -0
- package/assets/images/pf_logo_white.svg +38 -0
- package/base/_globals.scss +1 -1
- package/base/patternfly-variables.css +1 -1
- package/base/tokens/_tokens-font.scss +2 -2
- package/components/Accordion/accordion.css +10 -1
- package/components/Accordion/accordion.scss +13 -1
- package/components/Alert/alert.css +1 -1
- package/components/Alert/alert.scss +1 -1
- package/components/Button/button.css +1 -1
- package/components/Button/button.scss +1 -3
- package/components/Check/check.css +10 -8
- package/components/Check/check.scss +15 -10
- package/components/Dropdown/dropdown.css +1 -3
- package/components/Dropdown/dropdown.scss +2 -6
- package/components/Menu/menu.css +3 -0
- package/components/Menu/menu.scss +7 -3
- package/components/MenuToggle/menu-toggle.css +2 -3
- package/components/MenuToggle/menu-toggle.scss +2 -6
- package/components/Page/page.css +1 -1
- package/components/Page/page.scss +1 -1
- package/components/Radio/radio.css +13 -10
- package/components/Radio/radio.scss +17 -11
- package/components/Switch/switch.css +1 -1
- package/components/Switch/switch.scss +1 -1
- package/components/Table/table.css +6 -2
- package/components/Table/table.scss +7 -2
- package/components/Toolbar/toolbar.css +9 -1
- package/components/Toolbar/toolbar.scss +16 -3
- package/docs/components/Accordion/examples/Accordion.md +95 -0
- package/docs/components/Brand/examples/Brand.css +12 -0
- package/docs/components/Brand/examples/Brand.md +75 -32
- package/docs/components/Card/examples/Card.md +110 -2
- package/docs/components/LogViewer/examples/LogViewer.md +130 -130
- package/docs/components/Menu/examples/Menu.md +507 -473
- package/docs/components/MenuToggle/examples/MenuToggle.md +106 -114
- package/docs/components/Nav/examples/Navigation.md +140 -113
- package/docs/components/TextInputGroup/examples/TextInputGroup.md +9 -9
- package/docs/components/Toolbar/examples/Toolbar.md +480 -2807
- package/docs/demos/CardView/examples/CardView.md +32 -51
- package/docs/demos/DataList/examples/DataList.md +184 -320
- package/docs/demos/Masthead/examples/Masthead.md +51 -210
- package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +2 -1
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +83 -271
- package/docs/demos/Table/examples/Table.md +1017 -1800
- package/docs/demos/Tabs/examples/Tabs.md +2 -2
- package/docs/demos/Toolbar/examples/Toolbar.css +10 -0
- package/docs/demos/Toolbar/examples/Toolbar.md +703 -1027
- package/package.json +2 -2
- package/patternfly-base-no-globals-theme-dark-unversioned.css +1 -1
- package/patternfly-base-no-globals.css +1 -1
- package/patternfly-base-theme-dark-unversioned.css +1 -1
- package/patternfly-base.css +1 -1
- package/patternfly-no-globals.css +59 -33
- package/patternfly-theme-dark-unversioned.css +59 -33
- package/patternfly.css +59 -33
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -274,17 +274,17 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
274
274
|
### Split button (checkbox)
|
|
275
275
|
|
|
276
276
|
```html
|
|
277
|
-
<div
|
|
277
|
+
<div
|
|
278
|
+
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-disabled"
|
|
279
|
+
id="split-button-checkbox-disabled-example"
|
|
280
|
+
>
|
|
278
281
|
<label
|
|
279
282
|
class="pf-v5-c-check pf-m-standalone"
|
|
280
|
-
|
|
281
|
-
for="split-button-checkbox-disabled-example-check-input"
|
|
283
|
+
for="split-button-checkbox-disabled-example-input"
|
|
282
284
|
>
|
|
283
285
|
<input
|
|
284
286
|
class="pf-v5-c-check__input"
|
|
285
287
|
type="checkbox"
|
|
286
|
-
id="split-button-checkbox-disabled-example-check-input"
|
|
287
|
-
name="split-button-checkbox-disabled-example-check-input"
|
|
288
288
|
aria-label="Standalone check"
|
|
289
289
|
disabled
|
|
290
290
|
/>
|
|
@@ -305,17 +305,17 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
305
305
|
</button>
|
|
306
306
|
</div>
|
|
307
307
|
|
|
308
|
-
<div
|
|
308
|
+
<div
|
|
309
|
+
class="pf-v5-c-menu-toggle pf-m-split-button"
|
|
310
|
+
id="split-button-checkbox-example"
|
|
311
|
+
>
|
|
309
312
|
<label
|
|
310
313
|
class="pf-v5-c-check pf-m-standalone"
|
|
311
|
-
|
|
312
|
-
for="split-button-checkbox-example-check-input"
|
|
314
|
+
for="split-button-checkbox-example-input"
|
|
313
315
|
>
|
|
314
316
|
<input
|
|
315
317
|
class="pf-v5-c-check__input"
|
|
316
318
|
type="checkbox"
|
|
317
|
-
id="split-button-checkbox-example-check-input"
|
|
318
|
-
name="split-button-checkbox-example-check-input"
|
|
319
319
|
aria-label="Standalone check"
|
|
320
320
|
/>
|
|
321
321
|
</label>
|
|
@@ -334,17 +334,17 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
334
334
|
</button>
|
|
335
335
|
</div>
|
|
336
336
|
|
|
337
|
-
<div
|
|
337
|
+
<div
|
|
338
|
+
class="pf-v5-c-menu-toggle pf-m-expanded pf-m-split-button"
|
|
339
|
+
id="split-button-checkbox-expanded-example"
|
|
340
|
+
>
|
|
338
341
|
<label
|
|
339
342
|
class="pf-v5-c-check pf-m-standalone"
|
|
340
|
-
|
|
341
|
-
for="split-button-checkbox-expanded-example-check-input"
|
|
343
|
+
for="split-button-checkbox-expanded-example-input"
|
|
342
344
|
>
|
|
343
345
|
<input
|
|
344
346
|
class="pf-v5-c-check__input"
|
|
345
347
|
type="checkbox"
|
|
346
|
-
id="split-button-checkbox-expanded-example-check-input"
|
|
347
|
-
name="split-button-checkbox-expanded-example-check-input"
|
|
348
348
|
aria-label="Standalone check"
|
|
349
349
|
/>
|
|
350
350
|
</label>
|
|
@@ -368,20 +368,16 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
368
368
|
### Split button (checkbox with toggle text)
|
|
369
369
|
|
|
370
370
|
```html
|
|
371
|
-
<div
|
|
371
|
+
<div
|
|
372
|
+
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-disabled"
|
|
373
|
+
id="split-button-checkbox-with-toggle-text-disabled-example"
|
|
374
|
+
>
|
|
372
375
|
<label
|
|
373
376
|
class="pf-v5-c-check"
|
|
374
|
-
|
|
375
|
-
for="split-button-checkbox-with-toggle-text-disabled-example-check-input"
|
|
377
|
+
for="split-button-checkbox-with-toggle-text-disabled-example-input"
|
|
376
378
|
>
|
|
377
|
-
<input
|
|
378
|
-
|
|
379
|
-
type="checkbox"
|
|
380
|
-
id="split-button-checkbox-with-toggle-text-disabled-example-check-input"
|
|
381
|
-
name="split-button-checkbox-with-toggle-text-disabled-example-check-input"
|
|
382
|
-
disabled
|
|
383
|
-
/>
|
|
384
|
-
<span class="pf-v5-c-check__label pf-m-disabled">10 selected</span>
|
|
379
|
+
<input class="pf-v5-c-check__input" type="checkbox" disabled />
|
|
380
|
+
<label class="pf-v5-c-check__label pf-m-disabled" for="-input">10 selected</label>
|
|
385
381
|
</label>
|
|
386
382
|
<button
|
|
387
383
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -399,19 +395,16 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
399
395
|
</button>
|
|
400
396
|
</div>
|
|
401
397
|
|
|
402
|
-
<div
|
|
398
|
+
<div
|
|
399
|
+
class="pf-v5-c-menu-toggle pf-m-split-button"
|
|
400
|
+
id="split-button-checkbox-with-toggle-text-example"
|
|
401
|
+
>
|
|
403
402
|
<label
|
|
404
403
|
class="pf-v5-c-check"
|
|
405
|
-
|
|
406
|
-
for="split-button-checkbox-with-toggle-text-example-check-input"
|
|
404
|
+
for="split-button-checkbox-with-toggle-text-example-input"
|
|
407
405
|
>
|
|
408
|
-
<input
|
|
409
|
-
|
|
410
|
-
type="checkbox"
|
|
411
|
-
id="split-button-checkbox-with-toggle-text-example-check-input"
|
|
412
|
-
name="split-button-checkbox-with-toggle-text-example-check-input"
|
|
413
|
-
/>
|
|
414
|
-
<span class="pf-v5-c-check__label">10 selected</span>
|
|
406
|
+
<input class="pf-v5-c-check__input" type="checkbox" />
|
|
407
|
+
<label class="pf-v5-c-check__label" for="-input">10 selected</label>
|
|
415
408
|
</label>
|
|
416
409
|
<button
|
|
417
410
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -428,19 +421,16 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
428
421
|
</button>
|
|
429
422
|
</div>
|
|
430
423
|
|
|
431
|
-
<div
|
|
424
|
+
<div
|
|
425
|
+
class="pf-v5-c-menu-toggle pf-m-expanded pf-m-split-button"
|
|
426
|
+
id="split-button-checkbox-with-toggle-text-expanded-example"
|
|
427
|
+
>
|
|
432
428
|
<label
|
|
433
429
|
class="pf-v5-c-check"
|
|
434
|
-
|
|
435
|
-
for="split-button-checkbox-with-toggle-text-expanded-example-check-input"
|
|
430
|
+
for="split-button-checkbox-with-toggle-text-expanded-example-input"
|
|
436
431
|
>
|
|
437
|
-
<input
|
|
438
|
-
|
|
439
|
-
type="checkbox"
|
|
440
|
-
id="split-button-checkbox-with-toggle-text-expanded-example-check-input"
|
|
441
|
-
name="split-button-checkbox-with-toggle-text-expanded-example-check-input"
|
|
442
|
-
/>
|
|
443
|
-
<span class="pf-v5-c-check__label">10 selected</span>
|
|
432
|
+
<input class="pf-v5-c-check__input" type="checkbox" />
|
|
433
|
+
<label class="pf-v5-c-check__label" for="-input">10 selected</label>
|
|
444
434
|
</label>
|
|
445
435
|
<button
|
|
446
436
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -462,20 +452,16 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
462
452
|
### Split button, primary
|
|
463
453
|
|
|
464
454
|
```html
|
|
465
|
-
<div
|
|
455
|
+
<div
|
|
456
|
+
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-primary"
|
|
457
|
+
id="split-button-checkbox-primary-disabled-example"
|
|
458
|
+
>
|
|
466
459
|
<label
|
|
467
460
|
class="pf-v5-c-check"
|
|
468
|
-
|
|
469
|
-
for="split-button-checkbox-primary-disabled-example-check-input"
|
|
461
|
+
for="split-button-checkbox-primary-disabled-example-input"
|
|
470
462
|
>
|
|
471
|
-
<input
|
|
472
|
-
|
|
473
|
-
type="checkbox"
|
|
474
|
-
id="split-button-checkbox-primary-disabled-example-check-input"
|
|
475
|
-
name="split-button-checkbox-primary-disabled-example-check-input"
|
|
476
|
-
disabled
|
|
477
|
-
/>
|
|
478
|
-
<span class="pf-v5-c-check__label pf-m-disabled">10 selected</span>
|
|
463
|
+
<input class="pf-v5-c-check__input" type="checkbox" disabled />
|
|
464
|
+
<label class="pf-v5-c-check__label pf-m-disabled" for="-input">10 selected</label>
|
|
479
465
|
</label>
|
|
480
466
|
<button
|
|
481
467
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -493,19 +479,16 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
493
479
|
</button>
|
|
494
480
|
</div>
|
|
495
481
|
|
|
496
|
-
<div
|
|
482
|
+
<div
|
|
483
|
+
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-primary"
|
|
484
|
+
id="split-button-checkbox-primary-example"
|
|
485
|
+
>
|
|
497
486
|
<label
|
|
498
487
|
class="pf-v5-c-check"
|
|
499
|
-
|
|
500
|
-
for="split-button-checkbox-primary-example-check-input"
|
|
488
|
+
for="split-button-checkbox-primary-example-input"
|
|
501
489
|
>
|
|
502
|
-
<input
|
|
503
|
-
|
|
504
|
-
type="checkbox"
|
|
505
|
-
id="split-button-checkbox-primary-example-check-input"
|
|
506
|
-
name="split-button-checkbox-primary-example-check-input"
|
|
507
|
-
/>
|
|
508
|
-
<span class="pf-v5-c-check__label">10 selected</span>
|
|
490
|
+
<input class="pf-v5-c-check__input" type="checkbox" />
|
|
491
|
+
<label class="pf-v5-c-check__label" for="-input">10 selected</label>
|
|
509
492
|
</label>
|
|
510
493
|
<button
|
|
511
494
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -522,19 +505,16 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
522
505
|
</button>
|
|
523
506
|
</div>
|
|
524
507
|
|
|
525
|
-
<div
|
|
508
|
+
<div
|
|
509
|
+
class="pf-v5-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-primary"
|
|
510
|
+
id="split-button-checkbox-primary-expanded-example"
|
|
511
|
+
>
|
|
526
512
|
<label
|
|
527
513
|
class="pf-v5-c-check"
|
|
528
|
-
|
|
529
|
-
for="split-button-checkbox-primary-expanded-example-check-input"
|
|
514
|
+
for="split-button-checkbox-primary-expanded-example-input"
|
|
530
515
|
>
|
|
531
|
-
<input
|
|
532
|
-
|
|
533
|
-
type="checkbox"
|
|
534
|
-
id="split-button-checkbox-primary-expanded-example-check-input"
|
|
535
|
-
name="split-button-checkbox-primary-expanded-example-check-input"
|
|
536
|
-
/>
|
|
537
|
-
<span class="pf-v5-c-check__label">10 selected</span>
|
|
516
|
+
<input class="pf-v5-c-check__input" type="checkbox" />
|
|
517
|
+
<label class="pf-v5-c-check__label" for="-input">10 selected</label>
|
|
538
518
|
</label>
|
|
539
519
|
<button
|
|
540
520
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -556,20 +536,16 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
556
536
|
### Split button, secondary
|
|
557
537
|
|
|
558
538
|
```html
|
|
559
|
-
<div
|
|
539
|
+
<div
|
|
540
|
+
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-secondary"
|
|
541
|
+
id="split-button-checkbox-secondary-disabled-example"
|
|
542
|
+
>
|
|
560
543
|
<label
|
|
561
544
|
class="pf-v5-c-check"
|
|
562
|
-
|
|
563
|
-
for="split-button-checkbox-secondary-disabled-example-check-input"
|
|
545
|
+
for="split-button-checkbox-secondary-disabled-example-input"
|
|
564
546
|
>
|
|
565
|
-
<input
|
|
566
|
-
|
|
567
|
-
type="checkbox"
|
|
568
|
-
id="split-button-checkbox-secondary-disabled-example-check-input"
|
|
569
|
-
name="split-button-checkbox-secondary-disabled-example-check-input"
|
|
570
|
-
disabled
|
|
571
|
-
/>
|
|
572
|
-
<span class="pf-v5-c-check__label pf-m-disabled">10 selected</span>
|
|
547
|
+
<input class="pf-v5-c-check__input" type="checkbox" disabled />
|
|
548
|
+
<label class="pf-v5-c-check__label pf-m-disabled" for="-input">10 selected</label>
|
|
573
549
|
</label>
|
|
574
550
|
<button
|
|
575
551
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -587,19 +563,16 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
587
563
|
</button>
|
|
588
564
|
</div>
|
|
589
565
|
|
|
590
|
-
<div
|
|
566
|
+
<div
|
|
567
|
+
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-secondary"
|
|
568
|
+
id="split-button-checkbox-secondary-example"
|
|
569
|
+
>
|
|
591
570
|
<label
|
|
592
571
|
class="pf-v5-c-check"
|
|
593
|
-
|
|
594
|
-
for="split-button-checkbox-secondary-example-check-input"
|
|
572
|
+
for="split-button-checkbox-secondary-example-input"
|
|
595
573
|
>
|
|
596
|
-
<input
|
|
597
|
-
|
|
598
|
-
type="checkbox"
|
|
599
|
-
id="split-button-checkbox-secondary-example-check-input"
|
|
600
|
-
name="split-button-checkbox-secondary-example-check-input"
|
|
601
|
-
/>
|
|
602
|
-
<span class="pf-v5-c-check__label">10 selected</span>
|
|
574
|
+
<input class="pf-v5-c-check__input" type="checkbox" />
|
|
575
|
+
<label class="pf-v5-c-check__label" for="-input">10 selected</label>
|
|
603
576
|
</label>
|
|
604
577
|
<button
|
|
605
578
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -616,19 +589,16 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
616
589
|
</button>
|
|
617
590
|
</div>
|
|
618
591
|
|
|
619
|
-
<div
|
|
592
|
+
<div
|
|
593
|
+
class="pf-v5-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-secondary"
|
|
594
|
+
id="split-button-checkbox-secondary-expanded-example"
|
|
595
|
+
>
|
|
620
596
|
<label
|
|
621
597
|
class="pf-v5-c-check"
|
|
622
|
-
|
|
623
|
-
for="split-button-checkbox-secondary-expanded-example-check-input"
|
|
598
|
+
for="split-button-checkbox-secondary-expanded-example-input"
|
|
624
599
|
>
|
|
625
|
-
<input
|
|
626
|
-
|
|
627
|
-
type="checkbox"
|
|
628
|
-
id="split-button-checkbox-secondary-expanded-example-check-input"
|
|
629
|
-
name="split-button-checkbox-secondary-expanded-example-check-input"
|
|
630
|
-
/>
|
|
631
|
-
<span class="pf-v5-c-check__label">10 selected</span>
|
|
600
|
+
<input class="pf-v5-c-check__input" type="checkbox" />
|
|
601
|
+
<label class="pf-v5-c-check__label" for="-input">10 selected</label>
|
|
632
602
|
</label>
|
|
633
603
|
<button
|
|
634
604
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -650,7 +620,10 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
650
620
|
### Split button (action)
|
|
651
621
|
|
|
652
622
|
```html
|
|
653
|
-
<div
|
|
623
|
+
<div
|
|
624
|
+
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-action pf-m-disabled"
|
|
625
|
+
id="split-button-checkbox-with-toggle-action-disabled-example"
|
|
626
|
+
>
|
|
654
627
|
<button class="pf-v5-c-menu-toggle__button" type="button" disabled>Action</button>
|
|
655
628
|
<button
|
|
656
629
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -668,7 +641,10 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
668
641
|
</button>
|
|
669
642
|
</div>
|
|
670
643
|
|
|
671
|
-
<div
|
|
644
|
+
<div
|
|
645
|
+
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-action"
|
|
646
|
+
id="split-button-checkbox-with-toggle-action-example"
|
|
647
|
+
>
|
|
672
648
|
<button class="pf-v5-c-menu-toggle__button" type="button">Action</button>
|
|
673
649
|
<button
|
|
674
650
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -685,7 +661,10 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
685
661
|
</button>
|
|
686
662
|
</div>
|
|
687
663
|
|
|
688
|
-
<div
|
|
664
|
+
<div
|
|
665
|
+
class="pf-v5-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-action"
|
|
666
|
+
id="split-button-checkbox-with-toggle-action-expanded-example"
|
|
667
|
+
>
|
|
689
668
|
<button class="pf-v5-c-menu-toggle__button" type="button">Action</button>
|
|
690
669
|
<button
|
|
691
670
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -709,6 +688,7 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
709
688
|
```html
|
|
710
689
|
<div
|
|
711
690
|
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-action pf-m-disabled pf-m-primary"
|
|
691
|
+
id="split-button-checkbox-with-toggle-action-primary-disabled-example"
|
|
712
692
|
>
|
|
713
693
|
<button class="pf-v5-c-menu-toggle__button" type="button" disabled>Action</button>
|
|
714
694
|
<button
|
|
@@ -727,7 +707,10 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
727
707
|
</button>
|
|
728
708
|
</div>
|
|
729
709
|
|
|
730
|
-
<div
|
|
710
|
+
<div
|
|
711
|
+
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-action pf-m-primary"
|
|
712
|
+
id="split-button-checkbox-with-toggle-action-primary-example"
|
|
713
|
+
>
|
|
731
714
|
<button class="pf-v5-c-menu-toggle__button" type="button">Action</button>
|
|
732
715
|
<button
|
|
733
716
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -746,6 +729,7 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
746
729
|
|
|
747
730
|
<div
|
|
748
731
|
class="pf-v5-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-action pf-m-primary"
|
|
732
|
+
id="split-button-checkbox-with-toggle-action-primary-expanded-example"
|
|
749
733
|
>
|
|
750
734
|
<button class="pf-v5-c-menu-toggle__button" type="button">Action</button>
|
|
751
735
|
<button
|
|
@@ -770,6 +754,7 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
770
754
|
```html
|
|
771
755
|
<div
|
|
772
756
|
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-action pf-m-disabled pf-m-secondary"
|
|
757
|
+
id="split-button-checkbox-with-toggle-action-secondary-disabled-example"
|
|
773
758
|
>
|
|
774
759
|
<button class="pf-v5-c-menu-toggle__button" type="button" disabled>Action</button>
|
|
775
760
|
<button
|
|
@@ -788,7 +773,10 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
788
773
|
</button>
|
|
789
774
|
</div>
|
|
790
775
|
|
|
791
|
-
<div
|
|
776
|
+
<div
|
|
777
|
+
class="pf-v5-c-menu-toggle pf-m-split-button pf-m-action pf-m-secondary"
|
|
778
|
+
id="split-button-checkbox-with-toggle-action-secondary-example"
|
|
779
|
+
>
|
|
792
780
|
<button class="pf-v5-c-menu-toggle__button" type="button">Action</button>
|
|
793
781
|
<button
|
|
794
782
|
class="pf-v5-c-menu-toggle__button"
|
|
@@ -807,6 +795,7 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
807
795
|
|
|
808
796
|
<div
|
|
809
797
|
class="pf-v5-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-action pf-m-secondary"
|
|
798
|
+
id="split-button-checkbox-with-toggle-action-secondary-expanded-example"
|
|
810
799
|
>
|
|
811
800
|
<button class="pf-v5-c-menu-toggle__button" type="button">Action</button>
|
|
812
801
|
<button
|
|
@@ -950,7 +939,10 @@ cssPrefix: pf-v5-c-menu-toggle
|
|
|
950
939
|
### Typeahead
|
|
951
940
|
|
|
952
941
|
```html
|
|
953
|
-
<div
|
|
942
|
+
<div
|
|
943
|
+
class="pf-v5-c-menu-toggle pf-m-typeahead pf-m-full-width"
|
|
944
|
+
id="typeahead-example"
|
|
945
|
+
>
|
|
954
946
|
<div class="pf-v5-c-text-input-group pf-m-plain">
|
|
955
947
|
<div class="pf-v5-c-text-input-group__main">
|
|
956
948
|
<span class="pf-v5-c-text-input-group__text">
|