@patternfly/patternfly 5.2.0-prerelease.3 → 5.2.0-prerelease.5
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/base/_globals.scss +2 -4
- package/base/patternfly-globals.css +2 -2
- package/components/Accordion/accordion.css +10 -1
- package/components/Accordion/accordion.scss +13 -1
- package/docs/components/Accordion/examples/Accordion.md +95 -0
- 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 +462 -2791
- package/docs/demos/CardView/examples/CardView.md +32 -51
- package/docs/demos/DataList/examples/DataList.md +182 -318
- package/docs/demos/Masthead/examples/Masthead.md +48 -207
- package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +2 -1
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +80 -268
- package/docs/demos/Table/examples/Table.md +1004 -1787
- 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 +691 -1015
- package/package.json +2 -2
- package/patternfly-base-theme-dark-unversioned.css +2 -2
- package/patternfly-base.css +2 -2
- package/patternfly-no-globals.css +10 -1
- package/patternfly-theme-dark-unversioned.css +12 -3
- package/patternfly.css +12 -3
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
|
@@ -17,10 +17,10 @@ section: components
|
|
|
17
17
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group pf-m-show">
|
|
18
18
|
<div class="pf-v5-c-toolbar__toggle">
|
|
19
19
|
<button
|
|
20
|
-
class="pf-v5-c-
|
|
20
|
+
class="pf-v5-c-menu-toggle pf-m-plain"
|
|
21
21
|
type="button"
|
|
22
|
-
aria-label="Show filters"
|
|
23
22
|
aria-expanded="false"
|
|
23
|
+
aria-label="Show filters"
|
|
24
24
|
aria-controls="toolbar-attribute-value-search-filter-desktop-example-expandable-content"
|
|
25
25
|
>
|
|
26
26
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
@@ -33,72 +33,22 @@ section: components
|
|
|
33
33
|
role="group"
|
|
34
34
|
>
|
|
35
35
|
<div class="pf-v5-c-input-group__item">
|
|
36
|
-
<
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
<
|
|
43
|
-
class="
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
aria-labelledby="toolbar-attribute-value-search-filter-desktop-example-select-name-label toolbar-attribute-value-search-filter-desktop-example-select-name-toggle"
|
|
49
|
-
>
|
|
50
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
51
|
-
<span class="pf-v5-c-select__toggle-icon">
|
|
52
|
-
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
53
|
-
</span>
|
|
54
|
-
<span class="pf-v5-c-select__toggle-text">Name</span>
|
|
55
|
-
</div>
|
|
56
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
36
|
+
<button
|
|
37
|
+
class="pf-v5-c-menu-toggle"
|
|
38
|
+
type="button"
|
|
39
|
+
aria-expanded="false"
|
|
40
|
+
id="toolbar-attribute-value-search-filter-desktop-example-search-filter-menu"
|
|
41
|
+
>
|
|
42
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
43
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
44
|
+
</span>
|
|
45
|
+
<span class="pf-v5-c-menu-toggle__text">Name</span>
|
|
46
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
47
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
57
48
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
58
49
|
</span>
|
|
59
|
-
</
|
|
60
|
-
|
|
61
|
-
<ul
|
|
62
|
-
class="pf-v5-c-select__menu"
|
|
63
|
-
role="listbox"
|
|
64
|
-
aria-labelledby="toolbar-attribute-value-search-filter-desktop-example-select-name-label"
|
|
65
|
-
hidden
|
|
66
|
-
>
|
|
67
|
-
<li role="presentation">
|
|
68
|
-
<button
|
|
69
|
-
class="pf-v5-c-select__menu-item"
|
|
70
|
-
role="option"
|
|
71
|
-
>Running</button>
|
|
72
|
-
</li>
|
|
73
|
-
<li role="presentation">
|
|
74
|
-
<button
|
|
75
|
-
class="pf-v5-c-select__menu-item pf-m-selected"
|
|
76
|
-
role="option"
|
|
77
|
-
aria-selected="true"
|
|
78
|
-
>
|
|
79
|
-
Stopped
|
|
80
|
-
<span class="pf-v5-c-select__menu-item-icon">
|
|
81
|
-
<i class="fas fa-check" aria-hidden="true"></i>
|
|
82
|
-
</span>
|
|
83
|
-
</button>
|
|
84
|
-
</li>
|
|
85
|
-
<li role="presentation">
|
|
86
|
-
<button class="pf-v5-c-select__menu-item" role="option">Down</button>
|
|
87
|
-
</li>
|
|
88
|
-
<li role="presentation">
|
|
89
|
-
<button
|
|
90
|
-
class="pf-v5-c-select__menu-item"
|
|
91
|
-
role="option"
|
|
92
|
-
>Degraded</button>
|
|
93
|
-
</li>
|
|
94
|
-
<li role="presentation">
|
|
95
|
-
<button
|
|
96
|
-
class="pf-v5-c-select__menu-item"
|
|
97
|
-
role="option"
|
|
98
|
-
>Needs maintenance</button>
|
|
99
|
-
</li>
|
|
100
|
-
</ul>
|
|
101
|
-
</div>
|
|
50
|
+
</span>
|
|
51
|
+
</button>
|
|
102
52
|
</div>
|
|
103
53
|
<div class="pf-v5-c-input-group__item pf-m-fill">
|
|
104
54
|
<div class="pf-v5-c-text-input-group">
|
|
@@ -466,10 +416,10 @@ section: components
|
|
|
466
416
|
>
|
|
467
417
|
<div class="pf-v5-c-toolbar__toggle">
|
|
468
418
|
<button
|
|
469
|
-
class="pf-v5-c-
|
|
419
|
+
class="pf-v5-c-menu-toggle pf-m-plain"
|
|
470
420
|
type="button"
|
|
471
|
-
aria-label="Show filters"
|
|
472
421
|
aria-expanded="false"
|
|
422
|
+
aria-label="Show filters"
|
|
473
423
|
aria-controls="toolbar-with-validation-example-expandable-content"
|
|
474
424
|
>
|
|
475
425
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
@@ -482,153 +432,106 @@ section: components
|
|
|
482
432
|
aria-label="search filter"
|
|
483
433
|
role="group"
|
|
484
434
|
>
|
|
485
|
-
<div class="pf-v5-c-
|
|
486
|
-
<span
|
|
487
|
-
id="toolbar-with-validation-example-select-month-label"
|
|
488
|
-
hidden
|
|
489
|
-
>Choose one</span>
|
|
490
|
-
|
|
435
|
+
<div class="pf-v5-c-input-group__item">
|
|
491
436
|
<button
|
|
492
|
-
class="pf-v5-c-
|
|
437
|
+
class="pf-v5-c-menu-toggle"
|
|
493
438
|
type="button"
|
|
494
|
-
id="toolbar-with-validation-example-select-month-toggle"
|
|
495
|
-
aria-haspopup="true"
|
|
496
439
|
aria-expanded="false"
|
|
497
|
-
|
|
440
|
+
id="toolbar-with-validation-example-month"
|
|
498
441
|
>
|
|
499
|
-
<
|
|
500
|
-
<
|
|
501
|
-
|
|
442
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
443
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
444
|
+
</span>
|
|
445
|
+
<span class="pf-v5-c-menu-toggle__text">Last month</span>
|
|
446
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
447
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
448
|
+
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
502
449
|
</span>
|
|
503
|
-
<span class="pf-v5-c-select__toggle-text">Last month</span>
|
|
504
|
-
</div>
|
|
505
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
506
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
507
450
|
</span>
|
|
508
451
|
</button>
|
|
509
|
-
|
|
510
|
-
<ul
|
|
511
|
-
class="pf-v5-c-select__menu"
|
|
512
|
-
role="listbox"
|
|
513
|
-
aria-labelledby="toolbar-with-validation-example-select-month-label"
|
|
514
|
-
hidden
|
|
515
|
-
>
|
|
516
|
-
<li role="presentation">
|
|
517
|
-
<button
|
|
518
|
-
class="pf-v5-c-select__menu-item"
|
|
519
|
-
role="option"
|
|
520
|
-
>Running</button>
|
|
521
|
-
</li>
|
|
522
|
-
<li role="presentation">
|
|
523
|
-
<button
|
|
524
|
-
class="pf-v5-c-select__menu-item pf-m-selected"
|
|
525
|
-
role="option"
|
|
526
|
-
aria-selected="true"
|
|
527
|
-
>
|
|
528
|
-
Stopped
|
|
529
|
-
<span class="pf-v5-c-select__menu-item-icon">
|
|
530
|
-
<i class="fas fa-check" aria-hidden="true"></i>
|
|
531
|
-
</span>
|
|
532
|
-
</button>
|
|
533
|
-
</li>
|
|
534
|
-
<li role="presentation">
|
|
535
|
-
<button
|
|
536
|
-
class="pf-v5-c-select__menu-item"
|
|
537
|
-
role="option"
|
|
538
|
-
>Down</button>
|
|
539
|
-
</li>
|
|
540
|
-
<li role="presentation">
|
|
541
|
-
<button
|
|
542
|
-
class="pf-v5-c-select__menu-item"
|
|
543
|
-
role="option"
|
|
544
|
-
>Degraded</button>
|
|
545
|
-
</li>
|
|
546
|
-
<li role="presentation">
|
|
547
|
-
<button
|
|
548
|
-
class="pf-v5-c-select__menu-item"
|
|
549
|
-
role="option"
|
|
550
|
-
>Needs maintenance</button>
|
|
551
|
-
</li>
|
|
552
|
-
</ul>
|
|
553
452
|
</div>
|
|
554
|
-
<div class="pf-v5-c-
|
|
555
|
-
<div class="pf-v5-c-date-
|
|
556
|
-
<div
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
<span class="pf-v5-c-form-control">
|
|
562
|
-
<input
|
|
563
|
-
type="text"
|
|
564
|
-
value="2020-03-05"
|
|
565
|
-
id="toolbar-with-validation-example-helper-text-input"
|
|
566
|
-
name="toolbar-with-validation-example-helper-text-input"
|
|
567
|
-
aria-label="Date picker"
|
|
568
|
-
/>
|
|
569
|
-
</span>
|
|
570
|
-
<button
|
|
571
|
-
class="pf-v5-c-button pf-m-control"
|
|
572
|
-
type="button"
|
|
573
|
-
aria-label="Toggle date picker"
|
|
453
|
+
<div class="pf-v5-c-input-group__item">
|
|
454
|
+
<div class="pf-v5-c-date-picker">
|
|
455
|
+
<div class="pf-v5-c-date-picker__input">
|
|
456
|
+
<div
|
|
457
|
+
class="pf-v5-c-input-group"
|
|
458
|
+
aria-label="search filter"
|
|
459
|
+
role="group"
|
|
574
460
|
>
|
|
575
|
-
<
|
|
576
|
-
|
|
461
|
+
<span class="pf-v5-c-form-control">
|
|
462
|
+
<input
|
|
463
|
+
type="text"
|
|
464
|
+
value="2020-03-05"
|
|
465
|
+
id="toolbar-with-validation-example-helper-text-input"
|
|
466
|
+
name="toolbar-with-validation-example-helper-text-input"
|
|
467
|
+
aria-label="Date picker"
|
|
468
|
+
/>
|
|
469
|
+
</span>
|
|
470
|
+
<button
|
|
471
|
+
class="pf-v5-c-button pf-m-control"
|
|
472
|
+
type="button"
|
|
473
|
+
aria-label="Toggle date picker"
|
|
474
|
+
>
|
|
475
|
+
<i class="fas fa-calendar-alt" aria-hidden="true"></i>
|
|
476
|
+
</button>
|
|
477
|
+
</div>
|
|
577
478
|
</div>
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
479
|
+
<div class="pf-v5-c-date-picker__helper-text">
|
|
480
|
+
<div class="pf-v5-c-helper-text">
|
|
481
|
+
<div class="pf-v5-c-helper-text__item">
|
|
482
|
+
<span
|
|
483
|
+
class="pf-v5-c-helper-text__item-text"
|
|
484
|
+
>MM/DD/YYYY</span>
|
|
485
|
+
</div>
|
|
585
486
|
</div>
|
|
586
487
|
</div>
|
|
587
488
|
</div>
|
|
588
489
|
</div>
|
|
589
|
-
<div class="pf-v5-c-
|
|
590
|
-
<div class="pf-v5-c-date-
|
|
591
|
-
<div
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
<
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
<span
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
490
|
+
<div class="pf-v5-c-input-group__item">
|
|
491
|
+
<div class="pf-v5-c-date-picker">
|
|
492
|
+
<div class="pf-v5-c-date-picker__input">
|
|
493
|
+
<div
|
|
494
|
+
class="pf-v5-c-input-group"
|
|
495
|
+
aria-label="search filter"
|
|
496
|
+
role="group"
|
|
497
|
+
>
|
|
498
|
+
<span class="pf-v5-c-form-control pf-m-error">
|
|
499
|
+
<input
|
|
500
|
+
aria-invalid="true"
|
|
501
|
+
type="text"
|
|
502
|
+
value="2020-03-05"
|
|
503
|
+
id="toolbar-with-validation-example-invalid-input"
|
|
504
|
+
name="toolbar-with-validation-example-invalid-input"
|
|
505
|
+
aria-label="Date picker"
|
|
506
|
+
/>
|
|
507
|
+
<span class="pf-v5-c-form-control__utilities">
|
|
508
|
+
<span
|
|
509
|
+
class="pf-v5-c-form-control__icon pf-m-status"
|
|
510
|
+
>
|
|
511
|
+
<i
|
|
512
|
+
class="fas fa-exclamation-circle"
|
|
513
|
+
aria-hidden="true"
|
|
514
|
+
></i>
|
|
515
|
+
</span>
|
|
613
516
|
</span>
|
|
614
517
|
</span>
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
</
|
|
518
|
+
<button
|
|
519
|
+
class="pf-v5-c-button pf-m-control"
|
|
520
|
+
type="button"
|
|
521
|
+
aria-label="Toggle date picker"
|
|
522
|
+
>
|
|
523
|
+
<i class="fas fa-calendar-alt" aria-hidden="true"></i>
|
|
524
|
+
</button>
|
|
525
|
+
</div>
|
|
526
|
+
<div class="pf-v5-c-date-picker__helper-text"></div>
|
|
623
527
|
</div>
|
|
624
|
-
<div class="pf-v5-c-date-picker__helper-text"
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
>Max: 08/10/2022</span>
|
|
528
|
+
<div class="pf-v5-c-date-picker__helper-text">
|
|
529
|
+
<div class="pf-v5-c-helper-text">
|
|
530
|
+
<div class="pf-v5-c-helper-text__item">
|
|
531
|
+
<span
|
|
532
|
+
class="pf-v5-c-helper-text__item-text"
|
|
533
|
+
>Max: 08/10/2022</span>
|
|
534
|
+
</div>
|
|
632
535
|
</div>
|
|
633
536
|
</div>
|
|
634
537
|
</div>
|
|
@@ -643,75 +546,22 @@ section: components
|
|
|
643
546
|
role="group"
|
|
644
547
|
>
|
|
645
548
|
<div class="pf-v5-c-input-group__item">
|
|
646
|
-
<
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
<
|
|
653
|
-
class="
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
aria-labelledby="toolbar-with-validation-example-select-name-label toolbar-with-validation-example-select-name-toggle"
|
|
659
|
-
>
|
|
660
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
661
|
-
<span class="pf-v5-c-select__toggle-icon">
|
|
662
|
-
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
663
|
-
</span>
|
|
664
|
-
<span class="pf-v5-c-select__toggle-text">Description</span>
|
|
665
|
-
</div>
|
|
666
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
549
|
+
<button
|
|
550
|
+
class="pf-v5-c-menu-toggle"
|
|
551
|
+
type="button"
|
|
552
|
+
aria-expanded="false"
|
|
553
|
+
id="toolbar-with-validation-example-search-filter-menu"
|
|
554
|
+
>
|
|
555
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
556
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
557
|
+
</span>
|
|
558
|
+
<span class="pf-v5-c-menu-toggle__text">Description</span>
|
|
559
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
560
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
667
561
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
668
562
|
</span>
|
|
669
|
-
</
|
|
670
|
-
|
|
671
|
-
<ul
|
|
672
|
-
class="pf-v5-c-select__menu"
|
|
673
|
-
role="listbox"
|
|
674
|
-
aria-labelledby="toolbar-with-validation-example-select-name-label"
|
|
675
|
-
hidden
|
|
676
|
-
>
|
|
677
|
-
<li role="presentation">
|
|
678
|
-
<button
|
|
679
|
-
class="pf-v5-c-select__menu-item"
|
|
680
|
-
role="option"
|
|
681
|
-
>Running</button>
|
|
682
|
-
</li>
|
|
683
|
-
<li role="presentation">
|
|
684
|
-
<button
|
|
685
|
-
class="pf-v5-c-select__menu-item pf-m-selected"
|
|
686
|
-
role="option"
|
|
687
|
-
aria-selected="true"
|
|
688
|
-
>
|
|
689
|
-
Stopped
|
|
690
|
-
<span class="pf-v5-c-select__menu-item-icon">
|
|
691
|
-
<i class="fas fa-check" aria-hidden="true"></i>
|
|
692
|
-
</span>
|
|
693
|
-
</button>
|
|
694
|
-
</li>
|
|
695
|
-
<li role="presentation">
|
|
696
|
-
<button
|
|
697
|
-
class="pf-v5-c-select__menu-item"
|
|
698
|
-
role="option"
|
|
699
|
-
>Down</button>
|
|
700
|
-
</li>
|
|
701
|
-
<li role="presentation">
|
|
702
|
-
<button
|
|
703
|
-
class="pf-v5-c-select__menu-item"
|
|
704
|
-
role="option"
|
|
705
|
-
>Degraded</button>
|
|
706
|
-
</li>
|
|
707
|
-
<li role="presentation">
|
|
708
|
-
<button
|
|
709
|
-
class="pf-v5-c-select__menu-item"
|
|
710
|
-
role="option"
|
|
711
|
-
>Needs maintenance</button>
|
|
712
|
-
</li>
|
|
713
|
-
</ul>
|
|
714
|
-
</div>
|
|
563
|
+
</span>
|
|
564
|
+
</button>
|
|
715
565
|
</div>
|
|
716
566
|
<div class="pf-v5-c-input-group__item pf-m-fill">
|
|
717
567
|
<div class="pf-v5-c-text-input-group">
|
|
@@ -723,7 +573,7 @@ section: components
|
|
|
723
573
|
<input
|
|
724
574
|
class="pf-v5-c-text-input-group__text-input"
|
|
725
575
|
type="text"
|
|
726
|
-
placeholder="
|
|
576
|
+
placeholder="Description"
|
|
727
577
|
value
|
|
728
578
|
aria-label="Search input"
|
|
729
579
|
/>
|
|
@@ -1347,12 +1197,12 @@ section: components
|
|
|
1347
1197
|
<div class="pf-v5-c-toolbar__content">
|
|
1348
1198
|
<div class="pf-v5-c-toolbar__content-section">
|
|
1349
1199
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group">
|
|
1350
|
-
<div class="pf-v5-c-toolbar__toggle
|
|
1200
|
+
<div class="pf-v5-c-toolbar__toggle">
|
|
1351
1201
|
<button
|
|
1352
|
-
class="pf-v5-c-
|
|
1202
|
+
class="pf-v5-c-menu-toggle pf-m-plain pf-m-expanded"
|
|
1353
1203
|
type="button"
|
|
1354
|
-
aria-label="Show filters"
|
|
1355
1204
|
aria-expanded="true"
|
|
1205
|
+
aria-label="Show filters"
|
|
1356
1206
|
aria-controls="toolbar-attribute-value-search-filter-mobile-example-expandable-content"
|
|
1357
1207
|
>
|
|
1358
1208
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
@@ -1497,72 +1347,22 @@ section: components
|
|
|
1497
1347
|
role="group"
|
|
1498
1348
|
>
|
|
1499
1349
|
<div class="pf-v5-c-input-group__item">
|
|
1500
|
-
<
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
<
|
|
1507
|
-
class="
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
aria-labelledby="toolbar-attribute-value-search-filter-mobile-example-select-name-label toolbar-attribute-value-search-filter-mobile-example-select-name-toggle"
|
|
1513
|
-
>
|
|
1514
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
1515
|
-
<span class="pf-v5-c-select__toggle-icon">
|
|
1516
|
-
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1517
|
-
</span>
|
|
1518
|
-
<span class="pf-v5-c-select__toggle-text">Name</span>
|
|
1519
|
-
</div>
|
|
1520
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
1350
|
+
<button
|
|
1351
|
+
class="pf-v5-c-menu-toggle"
|
|
1352
|
+
type="button"
|
|
1353
|
+
aria-expanded="false"
|
|
1354
|
+
id="toolbar-attribute-value-search-filter-mobile-example-search-filter-menu"
|
|
1355
|
+
>
|
|
1356
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
1357
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1358
|
+
</span>
|
|
1359
|
+
<span class="pf-v5-c-menu-toggle__text">Name</span>
|
|
1360
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1361
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
1521
1362
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
1522
1363
|
</span>
|
|
1523
|
-
</
|
|
1524
|
-
|
|
1525
|
-
<ul
|
|
1526
|
-
class="pf-v5-c-select__menu"
|
|
1527
|
-
role="listbox"
|
|
1528
|
-
aria-labelledby="toolbar-attribute-value-search-filter-mobile-example-select-name-label"
|
|
1529
|
-
hidden
|
|
1530
|
-
>
|
|
1531
|
-
<li role="presentation">
|
|
1532
|
-
<button
|
|
1533
|
-
class="pf-v5-c-select__menu-item"
|
|
1534
|
-
role="option"
|
|
1535
|
-
>Running</button>
|
|
1536
|
-
</li>
|
|
1537
|
-
<li role="presentation">
|
|
1538
|
-
<button
|
|
1539
|
-
class="pf-v5-c-select__menu-item pf-m-selected"
|
|
1540
|
-
role="option"
|
|
1541
|
-
aria-selected="true"
|
|
1542
|
-
>
|
|
1543
|
-
Stopped
|
|
1544
|
-
<span class="pf-v5-c-select__menu-item-icon">
|
|
1545
|
-
<i class="fas fa-check" aria-hidden="true"></i>
|
|
1546
|
-
</span>
|
|
1547
|
-
</button>
|
|
1548
|
-
</li>
|
|
1549
|
-
<li role="presentation">
|
|
1550
|
-
<button class="pf-v5-c-select__menu-item" role="option">Down</button>
|
|
1551
|
-
</li>
|
|
1552
|
-
<li role="presentation">
|
|
1553
|
-
<button
|
|
1554
|
-
class="pf-v5-c-select__menu-item"
|
|
1555
|
-
role="option"
|
|
1556
|
-
>Degraded</button>
|
|
1557
|
-
</li>
|
|
1558
|
-
<li role="presentation">
|
|
1559
|
-
<button
|
|
1560
|
-
class="pf-v5-c-select__menu-item"
|
|
1561
|
-
role="option"
|
|
1562
|
-
>Needs maintenance</button>
|
|
1563
|
-
</li>
|
|
1564
|
-
</ul>
|
|
1565
|
-
</div>
|
|
1364
|
+
</span>
|
|
1365
|
+
</button>
|
|
1566
1366
|
</div>
|
|
1567
1367
|
<div class="pf-v5-c-input-group__item pf-m-fill">
|
|
1568
1368
|
<div class="pf-v5-c-text-input-group">
|
|
@@ -1595,155 +1395,116 @@ section: components
|
|
|
1595
1395
|
```html
|
|
1596
1396
|
<div
|
|
1597
1397
|
class="pf-v5-c-toolbar"
|
|
1598
|
-
id="toolbar-attribute-value-single-
|
|
1398
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example"
|
|
1599
1399
|
>
|
|
1600
1400
|
<div class="pf-v5-c-toolbar__content">
|
|
1601
1401
|
<div class="pf-v5-c-toolbar__content-section">
|
|
1602
1402
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group pf-m-show">
|
|
1603
1403
|
<div class="pf-v5-c-toolbar__toggle">
|
|
1604
1404
|
<button
|
|
1605
|
-
class="pf-v5-c-
|
|
1405
|
+
class="pf-v5-c-menu-toggle pf-m-plain"
|
|
1606
1406
|
type="button"
|
|
1607
|
-
aria-label="Show filters"
|
|
1608
1407
|
aria-expanded="false"
|
|
1609
|
-
aria-
|
|
1408
|
+
aria-label="Show filters"
|
|
1409
|
+
aria-controls="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-expandable-content"
|
|
1610
1410
|
>
|
|
1611
1411
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1612
1412
|
</button>
|
|
1613
1413
|
</div>
|
|
1614
1414
|
<div class="pf-v5-c-toolbar__group pf-m-filter-group">
|
|
1615
1415
|
<div class="pf-v5-c-toolbar__item">
|
|
1616
|
-
<
|
|
1617
|
-
|
|
1618
|
-
|
|
1619
|
-
|
|
1620
|
-
|
|
1621
|
-
|
|
1622
|
-
<
|
|
1623
|
-
class="
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
aria-labelledby="toolbar-attribute-value-single-select-filter-desktop-example-select-status-label toolbar-attribute-value-single-select-filter-desktop-example-select-status-toggle"
|
|
1629
|
-
>
|
|
1630
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
1631
|
-
<span class="pf-v5-c-select__toggle-icon">
|
|
1632
|
-
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1633
|
-
</span>
|
|
1634
|
-
<span class="pf-v5-c-select__toggle-text">Status</span>
|
|
1635
|
-
</div>
|
|
1636
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
1416
|
+
<button
|
|
1417
|
+
class="pf-v5-c-menu-toggle"
|
|
1418
|
+
type="button"
|
|
1419
|
+
aria-expanded="false"
|
|
1420
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-menu-toggle-status"
|
|
1421
|
+
>
|
|
1422
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
1423
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1424
|
+
</span>
|
|
1425
|
+
<span class="pf-v5-c-menu-toggle__text">Status</span>
|
|
1426
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1427
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
1637
1428
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
1638
1429
|
</span>
|
|
1639
|
-
</
|
|
1640
|
-
|
|
1641
|
-
<ul
|
|
1642
|
-
class="pf-v5-c-select__menu"
|
|
1643
|
-
role="listbox"
|
|
1644
|
-
aria-labelledby="toolbar-attribute-value-single-select-filter-desktop-example-select-status-label"
|
|
1645
|
-
hidden
|
|
1646
|
-
style="width: 175px"
|
|
1647
|
-
>
|
|
1648
|
-
<li role="presentation">
|
|
1649
|
-
<button
|
|
1650
|
-
class="pf-v5-c-select__menu-item"
|
|
1651
|
-
role="option"
|
|
1652
|
-
>Running</button>
|
|
1653
|
-
</li>
|
|
1654
|
-
<li role="presentation">
|
|
1655
|
-
<button
|
|
1656
|
-
class="pf-v5-c-select__menu-item pf-m-selected"
|
|
1657
|
-
role="option"
|
|
1658
|
-
aria-selected="true"
|
|
1659
|
-
>
|
|
1660
|
-
Stopped
|
|
1661
|
-
<span class="pf-v5-c-select__menu-item-icon">
|
|
1662
|
-
<i class="fas fa-check" aria-hidden="true"></i>
|
|
1663
|
-
</span>
|
|
1664
|
-
</button>
|
|
1665
|
-
</li>
|
|
1666
|
-
<li role="presentation">
|
|
1667
|
-
<button class="pf-v5-c-select__menu-item" role="option">Down</button>
|
|
1668
|
-
</li>
|
|
1669
|
-
<li role="presentation">
|
|
1670
|
-
<button
|
|
1671
|
-
class="pf-v5-c-select__menu-item"
|
|
1672
|
-
role="option"
|
|
1673
|
-
>Degraded</button>
|
|
1674
|
-
</li>
|
|
1675
|
-
<li role="presentation">
|
|
1676
|
-
<button
|
|
1677
|
-
class="pf-v5-c-select__menu-item"
|
|
1678
|
-
role="option"
|
|
1679
|
-
>Needs maintenance</button>
|
|
1680
|
-
</li>
|
|
1681
|
-
</ul>
|
|
1682
|
-
</div>
|
|
1430
|
+
</span>
|
|
1431
|
+
</button>
|
|
1683
1432
|
</div>
|
|
1684
1433
|
<div class="pf-v5-c-toolbar__item">
|
|
1685
|
-
<
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
<
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
id="toolbar-attribute-value-single-select-filter-desktop-example-select-status-two-toggle"
|
|
1695
|
-
aria-haspopup="true"
|
|
1696
|
-
aria-expanded="true"
|
|
1697
|
-
aria-labelledby="toolbar-attribute-value-single-select-filter-desktop-example-select-status-two-label toolbar-attribute-value-single-select-filter-desktop-example-select-status-two-toggle"
|
|
1698
|
-
>
|
|
1699
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
1700
|
-
<span class="pf-v5-c-select__toggle-text">Stopped</span>
|
|
1701
|
-
</div>
|
|
1702
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
1434
|
+
<button
|
|
1435
|
+
class="pf-v5-c-menu-toggle pf-m-expanded"
|
|
1436
|
+
type="button"
|
|
1437
|
+
aria-expanded="true"
|
|
1438
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-menu-toggle-stopped"
|
|
1439
|
+
>
|
|
1440
|
+
<span class="pf-v5-c-menu-toggle__text">Stopped</span>
|
|
1441
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1442
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
1703
1443
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
1704
1444
|
</span>
|
|
1705
|
-
</
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
1721
|
-
|
|
1722
|
-
|
|
1723
|
-
|
|
1724
|
-
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
|
|
1728
|
-
|
|
1729
|
-
|
|
1730
|
-
|
|
1731
|
-
|
|
1732
|
-
|
|
1733
|
-
|
|
1734
|
-
|
|
1735
|
-
|
|
1736
|
-
|
|
1737
|
-
|
|
1738
|
-
|
|
1739
|
-
|
|
1740
|
-
|
|
1741
|
-
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
|
|
1445
|
+
</span>
|
|
1446
|
+
</button>
|
|
1447
|
+
<div class="pf-v5-c-panel">
|
|
1448
|
+
<div class="pf-v5-c-menu" width="175px">
|
|
1449
|
+
<div class="pf-v5-c-menu__content">
|
|
1450
|
+
<section class="pf-v5-c-menu__group">
|
|
1451
|
+
<ul class="pf-v5-c-menu__list" role="menu">
|
|
1452
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1453
|
+
<button
|
|
1454
|
+
class="pf-v5-c-menu__item"
|
|
1455
|
+
type="button"
|
|
1456
|
+
role="menuitem"
|
|
1457
|
+
>
|
|
1458
|
+
<span class="pf-v5-c-menu__item-text">Running</span>
|
|
1459
|
+
</button>
|
|
1460
|
+
</li>
|
|
1461
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1462
|
+
<button
|
|
1463
|
+
class="pf-v5-c-menu__item pf-m-selected"
|
|
1464
|
+
type="button"
|
|
1465
|
+
role="menuitem"
|
|
1466
|
+
>
|
|
1467
|
+
<span class="pf-v5-c-menu__item-main">
|
|
1468
|
+
<span class="pf-v5-c-menu__item-text">Stopped</span>
|
|
1469
|
+
<span class="pf-v5-c-menu__item-select-icon">
|
|
1470
|
+
<i class="fas fa-check" aria-hidden="true"></i>
|
|
1471
|
+
</span>
|
|
1472
|
+
</span>
|
|
1473
|
+
</button>
|
|
1474
|
+
</li>
|
|
1475
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1476
|
+
<button
|
|
1477
|
+
class="pf-v5-c-menu__item"
|
|
1478
|
+
type="button"
|
|
1479
|
+
role="menuitem"
|
|
1480
|
+
>
|
|
1481
|
+
<span class="pf-v5-c-menu__item-text">Down</span>
|
|
1482
|
+
</button>
|
|
1483
|
+
</li>
|
|
1484
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1485
|
+
<button
|
|
1486
|
+
class="pf-v5-c-menu__item"
|
|
1487
|
+
type="button"
|
|
1488
|
+
role="menuitem"
|
|
1489
|
+
>
|
|
1490
|
+
<span class="pf-v5-c-menu__item-text">Degraded</span>
|
|
1491
|
+
</button>
|
|
1492
|
+
</li>
|
|
1493
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1494
|
+
<button
|
|
1495
|
+
class="pf-v5-c-menu__item"
|
|
1496
|
+
type="button"
|
|
1497
|
+
role="menuitem"
|
|
1498
|
+
>
|
|
1499
|
+
<span
|
|
1500
|
+
class="pf-v5-c-menu__item-text"
|
|
1501
|
+
>Needs maintenance</span>
|
|
1502
|
+
</button>
|
|
1503
|
+
</li>
|
|
1504
|
+
</ul>
|
|
1505
|
+
</section>
|
|
1506
|
+
</div>
|
|
1507
|
+
</div>
|
|
1747
1508
|
</div>
|
|
1748
1509
|
</div>
|
|
1749
1510
|
</div>
|
|
@@ -1751,7 +1512,7 @@ section: components
|
|
|
1751
1512
|
<div class="pf-v5-c-toolbar__item pf-m-overflow-menu">
|
|
1752
1513
|
<div
|
|
1753
1514
|
class="pf-v5-c-overflow-menu"
|
|
1754
|
-
id="toolbar-attribute-value-single-
|
|
1515
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-overflow-menu"
|
|
1755
1516
|
>
|
|
1756
1517
|
<div class="pf-v5-c-overflow-menu__content">
|
|
1757
1518
|
<div class="pf-v5-c-overflow-menu__group pf-m-button-group">
|
|
@@ -1775,7 +1536,7 @@ section: components
|
|
|
1775
1536
|
<button
|
|
1776
1537
|
class="pf-v5-c-button pf-v5-c-dropdown__toggle pf-m-plain"
|
|
1777
1538
|
type="button"
|
|
1778
|
-
id="toolbar-attribute-value-single-
|
|
1539
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-overflow-menu-dropdown-toggle"
|
|
1779
1540
|
aria-label="Overflow menu"
|
|
1780
1541
|
aria-expanded="false"
|
|
1781
1542
|
>
|
|
@@ -1784,7 +1545,7 @@ section: components
|
|
|
1784
1545
|
<ul
|
|
1785
1546
|
class="pf-v5-c-dropdown__menu"
|
|
1786
1547
|
role="menu"
|
|
1787
|
-
aria-labelledby="toolbar-attribute-value-single-
|
|
1548
|
+
aria-labelledby="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-overflow-menu-dropdown-toggle"
|
|
1788
1549
|
hidden
|
|
1789
1550
|
>
|
|
1790
1551
|
<li role="none">
|
|
@@ -1809,7 +1570,7 @@ section: components
|
|
|
1809
1570
|
<button
|
|
1810
1571
|
class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
|
|
1811
1572
|
type="button"
|
|
1812
|
-
id="toolbar-attribute-value-single-
|
|
1573
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-pagination-options-menu-toggle"
|
|
1813
1574
|
aria-haspopup="listbox"
|
|
1814
1575
|
aria-expanded="false"
|
|
1815
1576
|
>
|
|
@@ -1824,7 +1585,7 @@ section: components
|
|
|
1824
1585
|
<ul
|
|
1825
1586
|
class="pf-v5-c-options-menu__menu"
|
|
1826
1587
|
role="menu"
|
|
1827
|
-
aria-labelledby="toolbar-attribute-value-single-
|
|
1588
|
+
aria-labelledby="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-pagination-options-menu-toggle"
|
|
1828
1589
|
hidden
|
|
1829
1590
|
>
|
|
1830
1591
|
<li role="none">
|
|
@@ -1882,7 +1643,7 @@ section: components
|
|
|
1882
1643
|
</div>
|
|
1883
1644
|
<div
|
|
1884
1645
|
class="pf-v5-c-toolbar__expandable-content pf-m-hidden"
|
|
1885
|
-
id="toolbar-attribute-value-single-
|
|
1646
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-expandable-content"
|
|
1886
1647
|
hidden
|
|
1887
1648
|
></div>
|
|
1888
1649
|
</div>
|
|
@@ -1895,18 +1656,18 @@ section: components
|
|
|
1895
1656
|
```html
|
|
1896
1657
|
<div
|
|
1897
1658
|
class="pf-v5-c-toolbar"
|
|
1898
|
-
id="toolbar-attribute-value-single-
|
|
1659
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example"
|
|
1899
1660
|
>
|
|
1900
1661
|
<div class="pf-v5-c-toolbar__content">
|
|
1901
1662
|
<div class="pf-v5-c-toolbar__content-section">
|
|
1902
1663
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group">
|
|
1903
|
-
<div class="pf-v5-c-toolbar__toggle
|
|
1664
|
+
<div class="pf-v5-c-toolbar__toggle">
|
|
1904
1665
|
<button
|
|
1905
|
-
class="pf-v5-c-
|
|
1666
|
+
class="pf-v5-c-menu-toggle pf-m-plain pf-m-expanded"
|
|
1906
1667
|
type="button"
|
|
1907
|
-
aria-label="Show filters"
|
|
1908
1668
|
aria-expanded="true"
|
|
1909
|
-
aria-
|
|
1669
|
+
aria-label="Show filters"
|
|
1670
|
+
aria-controls="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-expandable-content"
|
|
1910
1671
|
>
|
|
1911
1672
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1912
1673
|
</button>
|
|
@@ -1915,14 +1676,14 @@ section: components
|
|
|
1915
1676
|
<div class="pf-v5-c-toolbar__item pf-m-overflow-menu">
|
|
1916
1677
|
<div
|
|
1917
1678
|
class="pf-v5-c-overflow-menu"
|
|
1918
|
-
id="toolbar-attribute-value-single-
|
|
1679
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-overflow-menu"
|
|
1919
1680
|
>
|
|
1920
1681
|
<div class="pf-v5-c-overflow-menu__control">
|
|
1921
1682
|
<div class="pf-v5-c-dropdown">
|
|
1922
1683
|
<button
|
|
1923
1684
|
class="pf-v5-c-button pf-v5-c-dropdown__toggle pf-m-plain"
|
|
1924
1685
|
type="button"
|
|
1925
|
-
id="toolbar-attribute-value-single-
|
|
1686
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-overflow-menu-dropdown-toggle"
|
|
1926
1687
|
aria-label="Overflow menu"
|
|
1927
1688
|
aria-expanded="false"
|
|
1928
1689
|
>
|
|
@@ -1931,7 +1692,7 @@ section: components
|
|
|
1931
1692
|
<ul
|
|
1932
1693
|
class="pf-v5-c-dropdown__menu"
|
|
1933
1694
|
role="menu"
|
|
1934
|
-
aria-labelledby="toolbar-attribute-value-single-
|
|
1695
|
+
aria-labelledby="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-overflow-menu-dropdown-toggle"
|
|
1935
1696
|
hidden
|
|
1936
1697
|
>
|
|
1937
1698
|
<li role="none">
|
|
@@ -1968,7 +1729,7 @@ section: components
|
|
|
1968
1729
|
<button
|
|
1969
1730
|
class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
|
|
1970
1731
|
type="button"
|
|
1971
|
-
id="toolbar-attribute-value-single-
|
|
1732
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-pagination-options-menu-toggle"
|
|
1972
1733
|
aria-haspopup="listbox"
|
|
1973
1734
|
aria-expanded="false"
|
|
1974
1735
|
>
|
|
@@ -1983,7 +1744,7 @@ section: components
|
|
|
1983
1744
|
<ul
|
|
1984
1745
|
class="pf-v5-c-options-menu__menu"
|
|
1985
1746
|
role="menu"
|
|
1986
|
-
aria-labelledby="toolbar-attribute-value-single-
|
|
1747
|
+
aria-labelledby="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-pagination-options-menu-toggle"
|
|
1987
1748
|
hidden
|
|
1988
1749
|
>
|
|
1989
1750
|
<li role="none">
|
|
@@ -2041,127 +1802,100 @@ section: components
|
|
|
2041
1802
|
</div>
|
|
2042
1803
|
<div
|
|
2043
1804
|
class="pf-v5-c-toolbar__expandable-content pf-m-expanded"
|
|
2044
|
-
id="toolbar-attribute-value-single-
|
|
1805
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-expandable-content"
|
|
2045
1806
|
>
|
|
2046
1807
|
<div class="pf-v5-c-toolbar__group pf-m-filter-group">
|
|
2047
1808
|
<div class="pf-v5-c-toolbar__item">
|
|
2048
|
-
<
|
|
2049
|
-
|
|
2050
|
-
|
|
2051
|
-
|
|
2052
|
-
|
|
2053
|
-
|
|
2054
|
-
<
|
|
2055
|
-
class="
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
|
|
2060
|
-
aria-labelledby="toolbar-attribute-value-single-select-filter-mobile-example-select-status-expanded-label toolbar-attribute-value-single-select-filter-mobile-example-select-status-expanded-toggle"
|
|
2061
|
-
>
|
|
2062
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
2063
|
-
<span class="pf-v5-c-select__toggle-icon">
|
|
2064
|
-
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2065
|
-
</span>
|
|
2066
|
-
<span class="pf-v5-c-select__toggle-text">Status</span>
|
|
2067
|
-
</div>
|
|
2068
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
1809
|
+
<button
|
|
1810
|
+
class="pf-v5-c-menu-toggle"
|
|
1811
|
+
type="button"
|
|
1812
|
+
aria-expanded="false"
|
|
1813
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-menu-toggle-status"
|
|
1814
|
+
>
|
|
1815
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
1816
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1817
|
+
</span>
|
|
1818
|
+
<span class="pf-v5-c-menu-toggle__text">Status</span>
|
|
1819
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1820
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
2069
1821
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2070
1822
|
</span>
|
|
2071
|
-
</
|
|
2072
|
-
|
|
2073
|
-
<ul
|
|
2074
|
-
class="pf-v5-c-select__menu"
|
|
2075
|
-
role="listbox"
|
|
2076
|
-
aria-labelledby="toolbar-attribute-value-single-select-filter-mobile-example-select-status-expanded-label"
|
|
2077
|
-
hidden
|
|
2078
|
-
>
|
|
2079
|
-
<li role="presentation">
|
|
2080
|
-
<button class="pf-v5-c-select__menu-item" role="option">Running</button>
|
|
2081
|
-
</li>
|
|
2082
|
-
<li role="presentation">
|
|
2083
|
-
<button
|
|
2084
|
-
class="pf-v5-c-select__menu-item pf-m-selected"
|
|
2085
|
-
role="option"
|
|
2086
|
-
aria-selected="true"
|
|
2087
|
-
>
|
|
2088
|
-
Stopped
|
|
2089
|
-
<span class="pf-v5-c-select__menu-item-icon">
|
|
2090
|
-
<i class="fas fa-check" aria-hidden="true"></i>
|
|
2091
|
-
</span>
|
|
2092
|
-
</button>
|
|
2093
|
-
</li>
|
|
2094
|
-
<li role="presentation">
|
|
2095
|
-
<button class="pf-v5-c-select__menu-item" role="option">Down</button>
|
|
2096
|
-
</li>
|
|
2097
|
-
<li role="presentation">
|
|
2098
|
-
<button class="pf-v5-c-select__menu-item" role="option">Degraded</button>
|
|
2099
|
-
</li>
|
|
2100
|
-
<li role="presentation">
|
|
2101
|
-
<button
|
|
2102
|
-
class="pf-v5-c-select__menu-item"
|
|
2103
|
-
role="option"
|
|
2104
|
-
>Needs maintenance</button>
|
|
2105
|
-
</li>
|
|
2106
|
-
</ul>
|
|
2107
|
-
</div>
|
|
1823
|
+
</span>
|
|
1824
|
+
</button>
|
|
2108
1825
|
</div>
|
|
2109
1826
|
<div class="pf-v5-c-toolbar__item">
|
|
2110
|
-
<
|
|
2111
|
-
|
|
2112
|
-
|
|
2113
|
-
|
|
2114
|
-
|
|
2115
|
-
|
|
2116
|
-
<
|
|
2117
|
-
|
|
2118
|
-
|
|
2119
|
-
id="toolbar-attribute-value-single-select-filter-mobile-example-select-status-two-expanded-toggle"
|
|
2120
|
-
aria-haspopup="true"
|
|
2121
|
-
aria-expanded="true"
|
|
2122
|
-
aria-labelledby="toolbar-attribute-value-single-select-filter-mobile-example-select-status-two-expanded-label toolbar-attribute-value-single-select-filter-mobile-example-select-status-two-expanded-toggle"
|
|
2123
|
-
>
|
|
2124
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
2125
|
-
<span class="pf-v5-c-select__toggle-text">Stopped</span>
|
|
2126
|
-
</div>
|
|
2127
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
1827
|
+
<button
|
|
1828
|
+
class="pf-v5-c-menu-toggle pf-m-expanded"
|
|
1829
|
+
type="button"
|
|
1830
|
+
aria-expanded="true"
|
|
1831
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-menu-toggle-stopped"
|
|
1832
|
+
>
|
|
1833
|
+
<span class="pf-v5-c-menu-toggle__text">Stopped</span>
|
|
1834
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1835
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
2128
1836
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2129
1837
|
</span>
|
|
2130
|
-
</
|
|
2131
|
-
|
|
2132
|
-
|
|
2133
|
-
|
|
2134
|
-
|
|
2135
|
-
|
|
2136
|
-
|
|
2137
|
-
|
|
2138
|
-
|
|
2139
|
-
|
|
2140
|
-
|
|
2141
|
-
|
|
2142
|
-
|
|
2143
|
-
|
|
2144
|
-
|
|
2145
|
-
|
|
2146
|
-
|
|
2147
|
-
|
|
2148
|
-
|
|
2149
|
-
|
|
2150
|
-
|
|
2151
|
-
|
|
2152
|
-
|
|
2153
|
-
|
|
2154
|
-
|
|
2155
|
-
|
|
2156
|
-
|
|
2157
|
-
|
|
2158
|
-
|
|
2159
|
-
|
|
2160
|
-
|
|
2161
|
-
|
|
2162
|
-
|
|
2163
|
-
|
|
2164
|
-
|
|
1838
|
+
</span>
|
|
1839
|
+
</button>
|
|
1840
|
+
<div class="pf-v5-c-panel">
|
|
1841
|
+
<div class="pf-v5-c-menu" width="175px">
|
|
1842
|
+
<div class="pf-v5-c-menu__content">
|
|
1843
|
+
<section class="pf-v5-c-menu__group">
|
|
1844
|
+
<ul class="pf-v5-c-menu__list" role="menu">
|
|
1845
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1846
|
+
<button
|
|
1847
|
+
class="pf-v5-c-menu__item"
|
|
1848
|
+
type="button"
|
|
1849
|
+
role="menuitem"
|
|
1850
|
+
>
|
|
1851
|
+
<span class="pf-v5-c-menu__item-text">Running</span>
|
|
1852
|
+
</button>
|
|
1853
|
+
</li>
|
|
1854
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1855
|
+
<button
|
|
1856
|
+
class="pf-v5-c-menu__item pf-m-selected"
|
|
1857
|
+
type="button"
|
|
1858
|
+
role="menuitem"
|
|
1859
|
+
>
|
|
1860
|
+
<span class="pf-v5-c-menu__item-main">
|
|
1861
|
+
<span class="pf-v5-c-menu__item-text">Stopped</span>
|
|
1862
|
+
<span class="pf-v5-c-menu__item-select-icon">
|
|
1863
|
+
<i class="fas fa-check" aria-hidden="true"></i>
|
|
1864
|
+
</span>
|
|
1865
|
+
</span>
|
|
1866
|
+
</button>
|
|
1867
|
+
</li>
|
|
1868
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1869
|
+
<button
|
|
1870
|
+
class="pf-v5-c-menu__item"
|
|
1871
|
+
type="button"
|
|
1872
|
+
role="menuitem"
|
|
1873
|
+
>
|
|
1874
|
+
<span class="pf-v5-c-menu__item-text">Down</span>
|
|
1875
|
+
</button>
|
|
1876
|
+
</li>
|
|
1877
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1878
|
+
<button
|
|
1879
|
+
class="pf-v5-c-menu__item"
|
|
1880
|
+
type="button"
|
|
1881
|
+
role="menuitem"
|
|
1882
|
+
>
|
|
1883
|
+
<span class="pf-v5-c-menu__item-text">Degraded</span>
|
|
1884
|
+
</button>
|
|
1885
|
+
</li>
|
|
1886
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1887
|
+
<button
|
|
1888
|
+
class="pf-v5-c-menu__item"
|
|
1889
|
+
type="button"
|
|
1890
|
+
role="menuitem"
|
|
1891
|
+
>
|
|
1892
|
+
<span class="pf-v5-c-menu__item-text">Needs maintenance</span>
|
|
1893
|
+
</button>
|
|
1894
|
+
</li>
|
|
1895
|
+
</ul>
|
|
1896
|
+
</section>
|
|
1897
|
+
</div>
|
|
1898
|
+
</div>
|
|
2165
1899
|
</div>
|
|
2166
1900
|
</div>
|
|
2167
1901
|
</div>
|
|
@@ -2171,194 +1905,188 @@ section: components
|
|
|
2171
1905
|
|
|
2172
1906
|
```
|
|
2173
1907
|
|
|
2174
|
-
### Toolbar attribute value checkbox
|
|
1908
|
+
### Toolbar attribute value checkbox menu toggle filter on desktop
|
|
2175
1909
|
|
|
2176
1910
|
```html
|
|
2177
1911
|
<div
|
|
2178
1912
|
class="pf-v5-c-toolbar"
|
|
2179
|
-
id="toolbar-attribute-value-checkbox-
|
|
1913
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example"
|
|
2180
1914
|
>
|
|
2181
1915
|
<div class="pf-v5-c-toolbar__content">
|
|
2182
1916
|
<div class="pf-v5-c-toolbar__content-section">
|
|
2183
1917
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group pf-m-show">
|
|
2184
1918
|
<div class="pf-v5-c-toolbar__toggle">
|
|
2185
1919
|
<button
|
|
2186
|
-
class="pf-v5-c-
|
|
1920
|
+
class="pf-v5-c-menu-toggle pf-m-plain"
|
|
2187
1921
|
type="button"
|
|
2188
|
-
aria-label="Show filters"
|
|
2189
1922
|
aria-expanded="false"
|
|
2190
|
-
aria-
|
|
1923
|
+
aria-label="Show filters"
|
|
1924
|
+
aria-controls="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-expandable-content"
|
|
2191
1925
|
>
|
|
2192
1926
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2193
1927
|
</button>
|
|
2194
1928
|
</div>
|
|
2195
1929
|
<div class="pf-v5-c-toolbar__group pf-m-filter-group">
|
|
2196
1930
|
<div class="pf-v5-c-toolbar__item">
|
|
2197
|
-
<
|
|
2198
|
-
|
|
2199
|
-
|
|
2200
|
-
|
|
2201
|
-
|
|
2202
|
-
|
|
2203
|
-
<
|
|
2204
|
-
class="
|
|
2205
|
-
|
|
2206
|
-
|
|
2207
|
-
|
|
2208
|
-
|
|
2209
|
-
aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-select-status-label toolbar-attribute-value-checkbox-select-filter-desktop-example-select-status-toggle"
|
|
2210
|
-
>
|
|
2211
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
2212
|
-
<span class="pf-v5-c-select__toggle-icon">
|
|
2213
|
-
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2214
|
-
</span>
|
|
2215
|
-
<span class="pf-v5-c-select__toggle-text">Status</span>
|
|
2216
|
-
</div>
|
|
2217
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
1931
|
+
<button
|
|
1932
|
+
class="pf-v5-c-menu-toggle"
|
|
1933
|
+
type="button"
|
|
1934
|
+
aria-expanded="false"
|
|
1935
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-menu-toggle-status"
|
|
1936
|
+
>
|
|
1937
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
1938
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1939
|
+
</span>
|
|
1940
|
+
<span class="pf-v5-c-menu-toggle__text">Status</span>
|
|
1941
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1942
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
2218
1943
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2219
1944
|
</span>
|
|
2220
|
-
</
|
|
2221
|
-
|
|
2222
|
-
<ul
|
|
2223
|
-
class="pf-v5-c-select__menu"
|
|
2224
|
-
role="listbox"
|
|
2225
|
-
aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-select-status-label"
|
|
2226
|
-
hidden
|
|
2227
|
-
style="width: 175px"
|
|
2228
|
-
>
|
|
2229
|
-
<li role="presentation">
|
|
2230
|
-
<button
|
|
2231
|
-
class="pf-v5-c-select__menu-item"
|
|
2232
|
-
role="option"
|
|
2233
|
-
>Running</button>
|
|
2234
|
-
</li>
|
|
2235
|
-
<li role="presentation">
|
|
2236
|
-
<button
|
|
2237
|
-
class="pf-v5-c-select__menu-item pf-m-selected"
|
|
2238
|
-
role="option"
|
|
2239
|
-
aria-selected="true"
|
|
2240
|
-
>
|
|
2241
|
-
Stopped
|
|
2242
|
-
<span class="pf-v5-c-select__menu-item-icon">
|
|
2243
|
-
<i class="fas fa-check" aria-hidden="true"></i>
|
|
2244
|
-
</span>
|
|
2245
|
-
</button>
|
|
2246
|
-
</li>
|
|
2247
|
-
<li role="presentation">
|
|
2248
|
-
<button class="pf-v5-c-select__menu-item" role="option">Down</button>
|
|
2249
|
-
</li>
|
|
2250
|
-
<li role="presentation">
|
|
2251
|
-
<button
|
|
2252
|
-
class="pf-v5-c-select__menu-item"
|
|
2253
|
-
role="option"
|
|
2254
|
-
>Degraded</button>
|
|
2255
|
-
</li>
|
|
2256
|
-
<li role="presentation">
|
|
2257
|
-
<button
|
|
2258
|
-
class="pf-v5-c-select__menu-item"
|
|
2259
|
-
role="option"
|
|
2260
|
-
>Needs maintenance</button>
|
|
2261
|
-
</li>
|
|
2262
|
-
</ul>
|
|
2263
|
-
</div>
|
|
1945
|
+
</span>
|
|
1946
|
+
</button>
|
|
2264
1947
|
</div>
|
|
2265
1948
|
<div class="pf-v5-c-toolbar__item">
|
|
2266
|
-
<
|
|
2267
|
-
|
|
2268
|
-
|
|
2269
|
-
|
|
2270
|
-
|
|
2271
|
-
|
|
2272
|
-
<
|
|
2273
|
-
|
|
2274
|
-
|
|
2275
|
-
id="toolbar-attribute-value-checkbox-select-filter-desktop-example-select-filter-status-toggle"
|
|
2276
|
-
aria-haspopup="true"
|
|
2277
|
-
aria-expanded="true"
|
|
2278
|
-
aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-select-filter-status-label toolbar-attribute-value-checkbox-select-filter-desktop-example-select-filter-status-toggle"
|
|
2279
|
-
>
|
|
2280
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
2281
|
-
<span class="pf-v5-c-select__toggle-text">Filter by status</span>
|
|
2282
|
-
</div>
|
|
2283
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
1949
|
+
<button
|
|
1950
|
+
class="pf-v5-c-menu-toggle pf-m-expanded"
|
|
1951
|
+
type="button"
|
|
1952
|
+
aria-expanded="true"
|
|
1953
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-menu-toggle-filter-by-status"
|
|
1954
|
+
>
|
|
1955
|
+
<span class="pf-v5-c-menu-toggle__text">Filter by status</span>
|
|
1956
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1957
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
2284
1958
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2285
1959
|
</span>
|
|
2286
|
-
</
|
|
2287
|
-
|
|
2288
|
-
|
|
2289
|
-
|
|
2290
|
-
|
|
2291
|
-
|
|
2292
|
-
|
|
2293
|
-
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
|
|
2297
|
-
|
|
2298
|
-
|
|
2299
|
-
|
|
2300
|
-
|
|
2301
|
-
|
|
2302
|
-
|
|
2303
|
-
|
|
2304
|
-
|
|
2305
|
-
|
|
2306
|
-
|
|
2307
|
-
|
|
2308
|
-
|
|
2309
|
-
|
|
2310
|
-
|
|
2311
|
-
|
|
2312
|
-
|
|
2313
|
-
|
|
2314
|
-
|
|
2315
|
-
|
|
2316
|
-
|
|
2317
|
-
|
|
2318
|
-
|
|
2319
|
-
|
|
2320
|
-
|
|
2321
|
-
|
|
2322
|
-
|
|
2323
|
-
|
|
2324
|
-
|
|
2325
|
-
|
|
2326
|
-
|
|
2327
|
-
|
|
2328
|
-
|
|
2329
|
-
|
|
2330
|
-
|
|
2331
|
-
|
|
2332
|
-
|
|
2333
|
-
|
|
2334
|
-
|
|
2335
|
-
|
|
2336
|
-
|
|
2337
|
-
|
|
2338
|
-
|
|
2339
|
-
|
|
2340
|
-
|
|
2341
|
-
|
|
2342
|
-
|
|
2343
|
-
|
|
2344
|
-
|
|
2345
|
-
|
|
2346
|
-
|
|
2347
|
-
|
|
2348
|
-
|
|
2349
|
-
|
|
2350
|
-
|
|
2351
|
-
|
|
2352
|
-
|
|
2353
|
-
|
|
2354
|
-
|
|
2355
|
-
|
|
2356
|
-
|
|
2357
|
-
|
|
2358
|
-
|
|
2359
|
-
|
|
2360
|
-
|
|
2361
|
-
|
|
1960
|
+
</span>
|
|
1961
|
+
</button>
|
|
1962
|
+
<div class="pf-v5-c-panel">
|
|
1963
|
+
<div class="pf-v5-c-menu">
|
|
1964
|
+
<div class="pf-v5-c-menu__content">
|
|
1965
|
+
<ul class="pf-v5-c-menu__list" role="menu">
|
|
1966
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
1967
|
+
<label
|
|
1968
|
+
class="pf-v5-c-menu__item"
|
|
1969
|
+
for="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check1"
|
|
1970
|
+
>
|
|
1971
|
+
<span class="pf-v5-c-menu__item-main">
|
|
1972
|
+
<span class="pf-v5-c-menu__item-check">
|
|
1973
|
+
<div
|
|
1974
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
1975
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check1"
|
|
1976
|
+
>
|
|
1977
|
+
<input
|
|
1978
|
+
class="pf-v5-c-check__input"
|
|
1979
|
+
type="checkbox"
|
|
1980
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check1-input"
|
|
1981
|
+
name="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check1-input"
|
|
1982
|
+
aria-label="Standalone check"
|
|
1983
|
+
/>
|
|
1984
|
+
</div>
|
|
1985
|
+
</span>
|
|
1986
|
+
<span class="pf-v5-c-menu__item-text">Active</span>
|
|
1987
|
+
</span>
|
|
1988
|
+
</label>
|
|
1989
|
+
</li>
|
|
1990
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
1991
|
+
<label
|
|
1992
|
+
class="pf-v5-c-menu__item"
|
|
1993
|
+
for="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check2"
|
|
1994
|
+
>
|
|
1995
|
+
<span class="pf-v5-c-menu__item-main">
|
|
1996
|
+
<span class="pf-v5-c-menu__item-check">
|
|
1997
|
+
<div
|
|
1998
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
1999
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check2"
|
|
2000
|
+
>
|
|
2001
|
+
<input
|
|
2002
|
+
class="pf-v5-c-check__input"
|
|
2003
|
+
type="checkbox"
|
|
2004
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check2-input"
|
|
2005
|
+
name="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check2-input"
|
|
2006
|
+
aria-label="Standalone check"
|
|
2007
|
+
checked
|
|
2008
|
+
/>
|
|
2009
|
+
</div>
|
|
2010
|
+
</span>
|
|
2011
|
+
<span class="pf-v5-c-menu__item-text">Cancelled</span>
|
|
2012
|
+
</span>
|
|
2013
|
+
</label>
|
|
2014
|
+
</li>
|
|
2015
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2016
|
+
<label
|
|
2017
|
+
class="pf-v5-c-menu__item"
|
|
2018
|
+
for="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check3"
|
|
2019
|
+
>
|
|
2020
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2021
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2022
|
+
<div
|
|
2023
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2024
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check3"
|
|
2025
|
+
>
|
|
2026
|
+
<input
|
|
2027
|
+
class="pf-v5-c-check__input"
|
|
2028
|
+
type="checkbox"
|
|
2029
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check3-input"
|
|
2030
|
+
name="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check3-input"
|
|
2031
|
+
aria-label="Standalone check"
|
|
2032
|
+
checked
|
|
2033
|
+
/>
|
|
2034
|
+
</div>
|
|
2035
|
+
</span>
|
|
2036
|
+
<span class="pf-v5-c-menu__item-text">Paused</span>
|
|
2037
|
+
</span>
|
|
2038
|
+
</label>
|
|
2039
|
+
</li>
|
|
2040
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2041
|
+
<label
|
|
2042
|
+
class="pf-v5-c-menu__item"
|
|
2043
|
+
for="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check4"
|
|
2044
|
+
>
|
|
2045
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2046
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2047
|
+
<div
|
|
2048
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2049
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check4"
|
|
2050
|
+
>
|
|
2051
|
+
<input
|
|
2052
|
+
class="pf-v5-c-check__input"
|
|
2053
|
+
type="checkbox"
|
|
2054
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check4-input"
|
|
2055
|
+
name="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check4-input"
|
|
2056
|
+
aria-label="Standalone check"
|
|
2057
|
+
/>
|
|
2058
|
+
</div>
|
|
2059
|
+
</span>
|
|
2060
|
+
<span class="pf-v5-c-menu__item-text">Warning</span>
|
|
2061
|
+
</span>
|
|
2062
|
+
</label>
|
|
2063
|
+
</li>
|
|
2064
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2065
|
+
<label
|
|
2066
|
+
class="pf-v5-c-menu__item"
|
|
2067
|
+
for="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check5"
|
|
2068
|
+
>
|
|
2069
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2070
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2071
|
+
<div
|
|
2072
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2073
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check5"
|
|
2074
|
+
>
|
|
2075
|
+
<input
|
|
2076
|
+
class="pf-v5-c-check__input"
|
|
2077
|
+
type="checkbox"
|
|
2078
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check5-input"
|
|
2079
|
+
name="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-status-menu-check5-input"
|
|
2080
|
+
aria-label="Standalone check"
|
|
2081
|
+
/>
|
|
2082
|
+
</div>
|
|
2083
|
+
</span>
|
|
2084
|
+
<span class="pf-v5-c-menu__item-text">Restarted</span>
|
|
2085
|
+
</span>
|
|
2086
|
+
</label>
|
|
2087
|
+
</li>
|
|
2088
|
+
</ul>
|
|
2089
|
+
</div>
|
|
2362
2090
|
</div>
|
|
2363
2091
|
</div>
|
|
2364
2092
|
</div>
|
|
@@ -2367,7 +2095,7 @@ section: components
|
|
|
2367
2095
|
<div class="pf-v5-c-toolbar__item pf-m-overflow-menu">
|
|
2368
2096
|
<div
|
|
2369
2097
|
class="pf-v5-c-overflow-menu"
|
|
2370
|
-
id="toolbar-attribute-value-checkbox-
|
|
2098
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-overflow-menu"
|
|
2371
2099
|
>
|
|
2372
2100
|
<div class="pf-v5-c-overflow-menu__content">
|
|
2373
2101
|
<div class="pf-v5-c-overflow-menu__group pf-m-button-group">
|
|
@@ -2391,7 +2119,7 @@ section: components
|
|
|
2391
2119
|
<button
|
|
2392
2120
|
class="pf-v5-c-button pf-v5-c-dropdown__toggle pf-m-plain"
|
|
2393
2121
|
type="button"
|
|
2394
|
-
id="toolbar-attribute-value-checkbox-
|
|
2122
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-overflow-menu-dropdown-toggle"
|
|
2395
2123
|
aria-label="Overflow menu"
|
|
2396
2124
|
aria-expanded="false"
|
|
2397
2125
|
>
|
|
@@ -2400,7 +2128,7 @@ section: components
|
|
|
2400
2128
|
<ul
|
|
2401
2129
|
class="pf-v5-c-dropdown__menu"
|
|
2402
2130
|
role="menu"
|
|
2403
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2131
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-overflow-menu-dropdown-toggle"
|
|
2404
2132
|
hidden
|
|
2405
2133
|
>
|
|
2406
2134
|
<li role="none">
|
|
@@ -2425,7 +2153,7 @@ section: components
|
|
|
2425
2153
|
<button
|
|
2426
2154
|
class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
|
|
2427
2155
|
type="button"
|
|
2428
|
-
id="toolbar-attribute-value-checkbox-
|
|
2156
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-pagination-options-menu-toggle"
|
|
2429
2157
|
aria-haspopup="listbox"
|
|
2430
2158
|
aria-expanded="false"
|
|
2431
2159
|
>
|
|
@@ -2440,7 +2168,7 @@ section: components
|
|
|
2440
2168
|
<ul
|
|
2441
2169
|
class="pf-v5-c-options-menu__menu"
|
|
2442
2170
|
role="menu"
|
|
2443
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2171
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-pagination-options-menu-toggle"
|
|
2444
2172
|
hidden
|
|
2445
2173
|
>
|
|
2446
2174
|
<li role="none">
|
|
@@ -2498,7 +2226,7 @@ section: components
|
|
|
2498
2226
|
</div>
|
|
2499
2227
|
<div
|
|
2500
2228
|
class="pf-v5-c-toolbar__expandable-content pf-m-hidden"
|
|
2501
|
-
id="toolbar-attribute-value-checkbox-
|
|
2229
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-expandable-content"
|
|
2502
2230
|
hidden
|
|
2503
2231
|
></div>
|
|
2504
2232
|
</div>
|
|
@@ -2508,28 +2236,28 @@ section: components
|
|
|
2508
2236
|
<div class="pf-v5-c-chip-group__main">
|
|
2509
2237
|
<span
|
|
2510
2238
|
class="pf-v5-c-chip-group__label"
|
|
2511
|
-
id="toolbar-attribute-value-checkbox-
|
|
2239
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-group-chip-group-label"
|
|
2512
2240
|
>Status</span>
|
|
2513
2241
|
<ul
|
|
2514
2242
|
class="pf-v5-c-chip-group__list"
|
|
2515
2243
|
role="list"
|
|
2516
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2244
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-group-chip-group-label"
|
|
2517
2245
|
>
|
|
2518
2246
|
<li class="pf-v5-c-chip-group__list-item">
|
|
2519
2247
|
<div class="pf-v5-c-chip">
|
|
2520
2248
|
<span class="pf-v5-c-chip__content">
|
|
2521
2249
|
<span
|
|
2522
2250
|
class="pf-v5-c-chip__text"
|
|
2523
|
-
id="toolbar-attribute-value-checkbox-
|
|
2251
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-group-chip-one"
|
|
2524
2252
|
>Canceled</span>
|
|
2525
2253
|
</span>
|
|
2526
2254
|
<span class="pf-v5-c-chip__actions">
|
|
2527
2255
|
<button
|
|
2528
2256
|
class="pf-v5-c-button pf-m-plain"
|
|
2529
2257
|
type="button"
|
|
2530
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2258
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupremove-chip-one toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupchip-one"
|
|
2531
2259
|
aria-label="Remove"
|
|
2532
|
-
id="toolbar-attribute-value-checkbox-
|
|
2260
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupremove-chip-one"
|
|
2533
2261
|
>
|
|
2534
2262
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2535
2263
|
</button>
|
|
@@ -2541,16 +2269,16 @@ section: components
|
|
|
2541
2269
|
<span class="pf-v5-c-chip__content">
|
|
2542
2270
|
<span
|
|
2543
2271
|
class="pf-v5-c-chip__text"
|
|
2544
|
-
id="toolbar-attribute-value-checkbox-
|
|
2272
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupchip-two"
|
|
2545
2273
|
>Paused</span>
|
|
2546
2274
|
</span>
|
|
2547
2275
|
<span class="pf-v5-c-chip__actions">
|
|
2548
2276
|
<button
|
|
2549
2277
|
class="pf-v5-c-button pf-m-plain"
|
|
2550
2278
|
type="button"
|
|
2551
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2279
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupremove-chip-two toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupchip-two"
|
|
2552
2280
|
aria-label="Remove"
|
|
2553
|
-
id="toolbar-attribute-value-checkbox-
|
|
2281
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupremove-chip-two"
|
|
2554
2282
|
>
|
|
2555
2283
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2556
2284
|
</button>
|
|
@@ -2562,16 +2290,16 @@ section: components
|
|
|
2562
2290
|
<span class="pf-v5-c-chip__content">
|
|
2563
2291
|
<span
|
|
2564
2292
|
class="pf-v5-c-chip__text"
|
|
2565
|
-
id="toolbar-attribute-value-checkbox-
|
|
2293
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupchip-three"
|
|
2566
2294
|
>Restarted</span>
|
|
2567
2295
|
</span>
|
|
2568
2296
|
<span class="pf-v5-c-chip__actions">
|
|
2569
2297
|
<button
|
|
2570
2298
|
class="pf-v5-c-button pf-m-plain"
|
|
2571
2299
|
type="button"
|
|
2572
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2300
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupremove-chip-three toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupchip-three"
|
|
2573
2301
|
aria-label="Remove"
|
|
2574
|
-
id="toolbar-attribute-value-checkbox-
|
|
2302
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupremove-chip-three"
|
|
2575
2303
|
>
|
|
2576
2304
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2577
2305
|
</button>
|
|
@@ -2593,23 +2321,23 @@ section: components
|
|
|
2593
2321
|
|
|
2594
2322
|
```
|
|
2595
2323
|
|
|
2596
|
-
### Toolbar attribute value checkbox
|
|
2324
|
+
### Toolbar attribute value checkbox menu toggle filter on mobile
|
|
2597
2325
|
|
|
2598
2326
|
```html
|
|
2599
2327
|
<div
|
|
2600
2328
|
class="pf-v5-c-toolbar"
|
|
2601
|
-
id="toolbar-attribute-value-checkbox-
|
|
2329
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example"
|
|
2602
2330
|
>
|
|
2603
2331
|
<div class="pf-v5-c-toolbar__content">
|
|
2604
2332
|
<div class="pf-v5-c-toolbar__content-section">
|
|
2605
2333
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group">
|
|
2606
|
-
<div class="pf-v5-c-toolbar__toggle
|
|
2334
|
+
<div class="pf-v5-c-toolbar__toggle">
|
|
2607
2335
|
<button
|
|
2608
|
-
class="pf-v5-c-
|
|
2336
|
+
class="pf-v5-c-menu-toggle pf-m-plain pf-m-expanded"
|
|
2609
2337
|
type="button"
|
|
2610
|
-
aria-label="Show filters"
|
|
2611
2338
|
aria-expanded="true"
|
|
2612
|
-
aria-
|
|
2339
|
+
aria-label="Show filters"
|
|
2340
|
+
aria-controls="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-expandable-content"
|
|
2613
2341
|
>
|
|
2614
2342
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2615
2343
|
</button>
|
|
@@ -2618,14 +2346,14 @@ section: components
|
|
|
2618
2346
|
<div class="pf-v5-c-toolbar__item pf-m-overflow-menu">
|
|
2619
2347
|
<div
|
|
2620
2348
|
class="pf-v5-c-overflow-menu"
|
|
2621
|
-
id="toolbar-attribute-value-checkbox-
|
|
2349
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-overflow-menu"
|
|
2622
2350
|
>
|
|
2623
2351
|
<div class="pf-v5-c-overflow-menu__control">
|
|
2624
2352
|
<div class="pf-v5-c-dropdown">
|
|
2625
2353
|
<button
|
|
2626
2354
|
class="pf-v5-c-button pf-v5-c-dropdown__toggle pf-m-plain"
|
|
2627
2355
|
type="button"
|
|
2628
|
-
id="toolbar-attribute-value-checkbox-
|
|
2356
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-overflow-menu-dropdown-toggle"
|
|
2629
2357
|
aria-label="Overflow menu"
|
|
2630
2358
|
aria-expanded="false"
|
|
2631
2359
|
>
|
|
@@ -2634,7 +2362,7 @@ section: components
|
|
|
2634
2362
|
<ul
|
|
2635
2363
|
class="pf-v5-c-dropdown__menu"
|
|
2636
2364
|
role="menu"
|
|
2637
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2365
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-overflow-menu-dropdown-toggle"
|
|
2638
2366
|
hidden
|
|
2639
2367
|
>
|
|
2640
2368
|
<li role="none">
|
|
@@ -2671,7 +2399,7 @@ section: components
|
|
|
2671
2399
|
<button
|
|
2672
2400
|
class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
|
|
2673
2401
|
type="button"
|
|
2674
|
-
id="toolbar-attribute-value-checkbox-
|
|
2402
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-pagination-options-menu-toggle"
|
|
2675
2403
|
aria-haspopup="listbox"
|
|
2676
2404
|
aria-expanded="false"
|
|
2677
2405
|
>
|
|
@@ -2686,7 +2414,7 @@ section: components
|
|
|
2686
2414
|
<ul
|
|
2687
2415
|
class="pf-v5-c-options-menu__menu"
|
|
2688
2416
|
role="menu"
|
|
2689
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2417
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-pagination-options-menu-toggle"
|
|
2690
2418
|
hidden
|
|
2691
2419
|
>
|
|
2692
2420
|
<li role="none">
|
|
@@ -2744,168 +2472,169 @@ section: components
|
|
|
2744
2472
|
</div>
|
|
2745
2473
|
<div
|
|
2746
2474
|
class="pf-v5-c-toolbar__expandable-content pf-m-expanded"
|
|
2747
|
-
id="toolbar-attribute-value-checkbox-
|
|
2475
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-expandable-content"
|
|
2748
2476
|
>
|
|
2749
2477
|
<div class="pf-v5-c-toolbar__group pf-m-filter-group">
|
|
2750
2478
|
<div class="pf-v5-c-toolbar__item">
|
|
2751
|
-
<
|
|
2752
|
-
|
|
2753
|
-
|
|
2754
|
-
|
|
2755
|
-
|
|
2756
|
-
|
|
2757
|
-
<
|
|
2758
|
-
class="
|
|
2759
|
-
|
|
2760
|
-
|
|
2761
|
-
|
|
2762
|
-
|
|
2763
|
-
aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-select-status-expanded-label toolbar-attribute-value-checkbox-select-filter-mobile-example-select-status-expanded-toggle"
|
|
2764
|
-
>
|
|
2765
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
2766
|
-
<span class="pf-v5-c-select__toggle-icon">
|
|
2767
|
-
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2768
|
-
</span>
|
|
2769
|
-
<span class="pf-v5-c-select__toggle-text">Status</span>
|
|
2770
|
-
</div>
|
|
2771
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
2479
|
+
<button
|
|
2480
|
+
class="pf-v5-c-menu-toggle"
|
|
2481
|
+
type="button"
|
|
2482
|
+
aria-expanded="false"
|
|
2483
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-menu-toggle-status"
|
|
2484
|
+
>
|
|
2485
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
2486
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2487
|
+
</span>
|
|
2488
|
+
<span class="pf-v5-c-menu-toggle__text">Status</span>
|
|
2489
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
2490
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
2772
2491
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2773
2492
|
</span>
|
|
2774
|
-
</
|
|
2775
|
-
|
|
2776
|
-
<ul
|
|
2777
|
-
class="pf-v5-c-select__menu"
|
|
2778
|
-
role="listbox"
|
|
2779
|
-
aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-select-status-expanded-label"
|
|
2780
|
-
hidden
|
|
2781
|
-
>
|
|
2782
|
-
<li role="presentation">
|
|
2783
|
-
<button class="pf-v5-c-select__menu-item" role="option">Running</button>
|
|
2784
|
-
</li>
|
|
2785
|
-
<li role="presentation">
|
|
2786
|
-
<button
|
|
2787
|
-
class="pf-v5-c-select__menu-item pf-m-selected"
|
|
2788
|
-
role="option"
|
|
2789
|
-
aria-selected="true"
|
|
2790
|
-
>
|
|
2791
|
-
Stopped
|
|
2792
|
-
<span class="pf-v5-c-select__menu-item-icon">
|
|
2793
|
-
<i class="fas fa-check" aria-hidden="true"></i>
|
|
2794
|
-
</span>
|
|
2795
|
-
</button>
|
|
2796
|
-
</li>
|
|
2797
|
-
<li role="presentation">
|
|
2798
|
-
<button class="pf-v5-c-select__menu-item" role="option">Down</button>
|
|
2799
|
-
</li>
|
|
2800
|
-
<li role="presentation">
|
|
2801
|
-
<button class="pf-v5-c-select__menu-item" role="option">Degraded</button>
|
|
2802
|
-
</li>
|
|
2803
|
-
<li role="presentation">
|
|
2804
|
-
<button
|
|
2805
|
-
class="pf-v5-c-select__menu-item"
|
|
2806
|
-
role="option"
|
|
2807
|
-
>Needs maintenance</button>
|
|
2808
|
-
</li>
|
|
2809
|
-
</ul>
|
|
2810
|
-
</div>
|
|
2493
|
+
</span>
|
|
2494
|
+
</button>
|
|
2811
2495
|
</div>
|
|
2812
2496
|
<div class="pf-v5-c-toolbar__item">
|
|
2813
|
-
<
|
|
2814
|
-
|
|
2815
|
-
|
|
2816
|
-
|
|
2817
|
-
|
|
2818
|
-
|
|
2819
|
-
<
|
|
2820
|
-
|
|
2821
|
-
|
|
2822
|
-
id="toolbar-attribute-value-checkbox-select-filter-mobile-example-select-filter-status-expanded-toggle"
|
|
2823
|
-
aria-haspopup="true"
|
|
2824
|
-
aria-expanded="false"
|
|
2825
|
-
aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-select-filter-status-expanded-label toolbar-attribute-value-checkbox-select-filter-mobile-example-select-filter-status-expanded-toggle"
|
|
2826
|
-
>
|
|
2827
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
2828
|
-
<span class="pf-v5-c-select__toggle-text">Filter by status</span>
|
|
2829
|
-
</div>
|
|
2830
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
2497
|
+
<button
|
|
2498
|
+
class="pf-v5-c-menu-toggle pf-m-expanded"
|
|
2499
|
+
type="button"
|
|
2500
|
+
aria-expanded="true"
|
|
2501
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-menu-toggle-filter-by-status"
|
|
2502
|
+
>
|
|
2503
|
+
<span class="pf-v5-c-menu-toggle__text">Filter by status</span>
|
|
2504
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
2505
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
2831
2506
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2832
2507
|
</span>
|
|
2833
|
-
</
|
|
2834
|
-
|
|
2835
|
-
|
|
2836
|
-
|
|
2837
|
-
|
|
2838
|
-
|
|
2839
|
-
|
|
2840
|
-
|
|
2841
|
-
|
|
2842
|
-
|
|
2843
|
-
|
|
2844
|
-
|
|
2845
|
-
|
|
2846
|
-
|
|
2847
|
-
|
|
2848
|
-
|
|
2849
|
-
|
|
2850
|
-
|
|
2851
|
-
|
|
2852
|
-
|
|
2853
|
-
|
|
2854
|
-
|
|
2855
|
-
|
|
2856
|
-
|
|
2857
|
-
|
|
2858
|
-
|
|
2859
|
-
|
|
2860
|
-
|
|
2861
|
-
|
|
2862
|
-
|
|
2863
|
-
|
|
2864
|
-
|
|
2865
|
-
|
|
2866
|
-
|
|
2867
|
-
|
|
2868
|
-
|
|
2869
|
-
|
|
2870
|
-
|
|
2871
|
-
|
|
2872
|
-
|
|
2873
|
-
|
|
2874
|
-
|
|
2875
|
-
|
|
2876
|
-
|
|
2877
|
-
|
|
2878
|
-
|
|
2879
|
-
|
|
2880
|
-
|
|
2881
|
-
|
|
2882
|
-
|
|
2883
|
-
|
|
2884
|
-
|
|
2885
|
-
|
|
2886
|
-
|
|
2887
|
-
|
|
2888
|
-
|
|
2889
|
-
|
|
2890
|
-
|
|
2891
|
-
|
|
2892
|
-
|
|
2893
|
-
|
|
2894
|
-
|
|
2895
|
-
|
|
2896
|
-
|
|
2897
|
-
|
|
2898
|
-
|
|
2899
|
-
|
|
2900
|
-
|
|
2901
|
-
|
|
2902
|
-
|
|
2903
|
-
|
|
2904
|
-
|
|
2905
|
-
|
|
2906
|
-
|
|
2907
|
-
|
|
2908
|
-
|
|
2508
|
+
</span>
|
|
2509
|
+
</button>
|
|
2510
|
+
<div class="pf-v5-c-panel">
|
|
2511
|
+
<div class="pf-v5-c-menu">
|
|
2512
|
+
<div class="pf-v5-c-menu__content">
|
|
2513
|
+
<ul class="pf-v5-c-menu__list" role="menu">
|
|
2514
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2515
|
+
<label
|
|
2516
|
+
class="pf-v5-c-menu__item"
|
|
2517
|
+
for="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check1"
|
|
2518
|
+
>
|
|
2519
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2520
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2521
|
+
<div
|
|
2522
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2523
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check1"
|
|
2524
|
+
>
|
|
2525
|
+
<input
|
|
2526
|
+
class="pf-v5-c-check__input"
|
|
2527
|
+
type="checkbox"
|
|
2528
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check1-input"
|
|
2529
|
+
name="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check1-input"
|
|
2530
|
+
aria-label="Standalone check"
|
|
2531
|
+
/>
|
|
2532
|
+
</div>
|
|
2533
|
+
</span>
|
|
2534
|
+
<span class="pf-v5-c-menu__item-text">Active</span>
|
|
2535
|
+
</span>
|
|
2536
|
+
</label>
|
|
2537
|
+
</li>
|
|
2538
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2539
|
+
<label
|
|
2540
|
+
class="pf-v5-c-menu__item"
|
|
2541
|
+
for="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check2"
|
|
2542
|
+
>
|
|
2543
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2544
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2545
|
+
<div
|
|
2546
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2547
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check2"
|
|
2548
|
+
>
|
|
2549
|
+
<input
|
|
2550
|
+
class="pf-v5-c-check__input"
|
|
2551
|
+
type="checkbox"
|
|
2552
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check2-input"
|
|
2553
|
+
name="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check2-input"
|
|
2554
|
+
aria-label="Standalone check"
|
|
2555
|
+
checked
|
|
2556
|
+
/>
|
|
2557
|
+
</div>
|
|
2558
|
+
</span>
|
|
2559
|
+
<span class="pf-v5-c-menu__item-text">Cancelled</span>
|
|
2560
|
+
</span>
|
|
2561
|
+
</label>
|
|
2562
|
+
</li>
|
|
2563
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2564
|
+
<label
|
|
2565
|
+
class="pf-v5-c-menu__item"
|
|
2566
|
+
for="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check3"
|
|
2567
|
+
>
|
|
2568
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2569
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2570
|
+
<div
|
|
2571
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2572
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check3"
|
|
2573
|
+
>
|
|
2574
|
+
<input
|
|
2575
|
+
class="pf-v5-c-check__input"
|
|
2576
|
+
type="checkbox"
|
|
2577
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check3-input"
|
|
2578
|
+
name="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check3-input"
|
|
2579
|
+
aria-label="Standalone check"
|
|
2580
|
+
checked
|
|
2581
|
+
/>
|
|
2582
|
+
</div>
|
|
2583
|
+
</span>
|
|
2584
|
+
<span class="pf-v5-c-menu__item-text">Paused</span>
|
|
2585
|
+
</span>
|
|
2586
|
+
</label>
|
|
2587
|
+
</li>
|
|
2588
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2589
|
+
<label
|
|
2590
|
+
class="pf-v5-c-menu__item"
|
|
2591
|
+
for="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check4"
|
|
2592
|
+
>
|
|
2593
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2594
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2595
|
+
<div
|
|
2596
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2597
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check4"
|
|
2598
|
+
>
|
|
2599
|
+
<input
|
|
2600
|
+
class="pf-v5-c-check__input"
|
|
2601
|
+
type="checkbox"
|
|
2602
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check4-input"
|
|
2603
|
+
name="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check4-input"
|
|
2604
|
+
aria-label="Standalone check"
|
|
2605
|
+
/>
|
|
2606
|
+
</div>
|
|
2607
|
+
</span>
|
|
2608
|
+
<span class="pf-v5-c-menu__item-text">Warning</span>
|
|
2609
|
+
</span>
|
|
2610
|
+
</label>
|
|
2611
|
+
</li>
|
|
2612
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2613
|
+
<label
|
|
2614
|
+
class="pf-v5-c-menu__item"
|
|
2615
|
+
for="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check5"
|
|
2616
|
+
>
|
|
2617
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2618
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2619
|
+
<div
|
|
2620
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2621
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check5"
|
|
2622
|
+
>
|
|
2623
|
+
<input
|
|
2624
|
+
class="pf-v5-c-check__input"
|
|
2625
|
+
type="checkbox"
|
|
2626
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check5-input"
|
|
2627
|
+
name="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check-toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-status-menu-check5-input"
|
|
2628
|
+
aria-label="Standalone check"
|
|
2629
|
+
/>
|
|
2630
|
+
</div>
|
|
2631
|
+
</span>
|
|
2632
|
+
<span class="pf-v5-c-menu__item-text">Restarted</span>
|
|
2633
|
+
</span>
|
|
2634
|
+
</label>
|
|
2635
|
+
</li>
|
|
2636
|
+
</ul>
|
|
2637
|
+
</div>
|
|
2909
2638
|
</div>
|
|
2910
2639
|
</div>
|
|
2911
2640
|
</div>
|
|
@@ -2914,28 +2643,28 @@ section: components
|
|
|
2914
2643
|
<div class="pf-v5-c-chip-group__main">
|
|
2915
2644
|
<span
|
|
2916
2645
|
class="pf-v5-c-chip-group__label"
|
|
2917
|
-
id="toolbar-attribute-value-checkbox-
|
|
2646
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-group-chip-group-label"
|
|
2918
2647
|
>Status</span>
|
|
2919
2648
|
<ul
|
|
2920
2649
|
class="pf-v5-c-chip-group__list"
|
|
2921
2650
|
role="list"
|
|
2922
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2651
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-group-chip-group-label"
|
|
2923
2652
|
>
|
|
2924
2653
|
<li class="pf-v5-c-chip-group__list-item">
|
|
2925
2654
|
<div class="pf-v5-c-chip">
|
|
2926
2655
|
<span class="pf-v5-c-chip__content">
|
|
2927
2656
|
<span
|
|
2928
2657
|
class="pf-v5-c-chip__text"
|
|
2929
|
-
id="toolbar-attribute-value-checkbox-
|
|
2658
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupchip-one"
|
|
2930
2659
|
>Canceled</span>
|
|
2931
2660
|
</span>
|
|
2932
2661
|
<span class="pf-v5-c-chip__actions">
|
|
2933
2662
|
<button
|
|
2934
2663
|
class="pf-v5-c-button pf-m-plain"
|
|
2935
2664
|
type="button"
|
|
2936
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2665
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupremove-chip-one toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupchip-one"
|
|
2937
2666
|
aria-label="Remove"
|
|
2938
|
-
id="toolbar-attribute-value-checkbox-
|
|
2667
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupremove-chip-one"
|
|
2939
2668
|
>
|
|
2940
2669
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2941
2670
|
</button>
|
|
@@ -2947,16 +2676,16 @@ section: components
|
|
|
2947
2676
|
<span class="pf-v5-c-chip__content">
|
|
2948
2677
|
<span
|
|
2949
2678
|
class="pf-v5-c-chip__text"
|
|
2950
|
-
id="toolbar-attribute-value-checkbox-
|
|
2679
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupchip-two"
|
|
2951
2680
|
>Paused</span>
|
|
2952
2681
|
</span>
|
|
2953
2682
|
<span class="pf-v5-c-chip__actions">
|
|
2954
2683
|
<button
|
|
2955
2684
|
class="pf-v5-c-button pf-m-plain"
|
|
2956
2685
|
type="button"
|
|
2957
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2686
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupremove-chip-two toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupchip-two"
|
|
2958
2687
|
aria-label="Remove"
|
|
2959
|
-
id="toolbar-attribute-value-checkbox-
|
|
2688
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupremove-chip-two"
|
|
2960
2689
|
>
|
|
2961
2690
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2962
2691
|
</button>
|
|
@@ -2968,16 +2697,16 @@ section: components
|
|
|
2968
2697
|
<span class="pf-v5-c-chip__content">
|
|
2969
2698
|
<span
|
|
2970
2699
|
class="pf-v5-c-chip__text"
|
|
2971
|
-
id="toolbar-attribute-value-checkbox-
|
|
2700
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupchip-three"
|
|
2972
2701
|
>Restarted</span>
|
|
2973
2702
|
</span>
|
|
2974
2703
|
<span class="pf-v5-c-chip__actions">
|
|
2975
2704
|
<button
|
|
2976
2705
|
class="pf-v5-c-button pf-m-plain"
|
|
2977
2706
|
type="button"
|
|
2978
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2707
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupremove-chip-three toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupchip-three"
|
|
2979
2708
|
aria-label="Remove"
|
|
2980
|
-
id="toolbar-attribute-value-checkbox-
|
|
2709
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupremove-chip-three"
|
|
2981
2710
|
>
|
|
2982
2711
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2983
2712
|
</button>
|
|
@@ -3205,10 +2934,10 @@ section: components
|
|
|
3205
2934
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group pf-m-show">
|
|
3206
2935
|
<div class="pf-v5-c-toolbar__toggle">
|
|
3207
2936
|
<button
|
|
3208
|
-
class="pf-v5-c-
|
|
2937
|
+
class="pf-v5-c-menu-toggle pf-m-plain"
|
|
3209
2938
|
type="button"
|
|
3210
|
-
aria-label="Show filters"
|
|
3211
2939
|
aria-expanded="false"
|
|
2940
|
+
aria-label="Show filters"
|
|
3212
2941
|
aria-controls="toolbar-pagination-management-example-toolbar-expandable-content"
|
|
3213
2942
|
>
|
|
3214
2943
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
@@ -3221,75 +2950,22 @@ section: components
|
|
|
3221
2950
|
role="group"
|
|
3222
2951
|
>
|
|
3223
2952
|
<div class="pf-v5-c-input-group__item">
|
|
3224
|
-
<
|
|
3225
|
-
|
|
3226
|
-
|
|
3227
|
-
|
|
3228
|
-
|
|
3229
|
-
|
|
3230
|
-
<
|
|
3231
|
-
class="
|
|
3232
|
-
|
|
3233
|
-
|
|
3234
|
-
|
|
3235
|
-
|
|
3236
|
-
aria-labelledby="toolbar-pagination-management-example-toolbar-select-name-label toolbar-pagination-management-example-toolbar-select-name-toggle"
|
|
3237
|
-
>
|
|
3238
|
-
<div class="pf-v5-c-select__toggle-wrapper">
|
|
3239
|
-
<span class="pf-v5-c-select__toggle-icon">
|
|
3240
|
-
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
3241
|
-
</span>
|
|
3242
|
-
<span class="pf-v5-c-select__toggle-text">Name</span>
|
|
3243
|
-
</div>
|
|
3244
|
-
<span class="pf-v5-c-select__toggle-arrow">
|
|
2953
|
+
<button
|
|
2954
|
+
class="pf-v5-c-menu-toggle"
|
|
2955
|
+
type="button"
|
|
2956
|
+
aria-expanded="false"
|
|
2957
|
+
id="toolbar-pagination-management-example-toolbar-search-filter-menu"
|
|
2958
|
+
>
|
|
2959
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
2960
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2961
|
+
</span>
|
|
2962
|
+
<span class="pf-v5-c-menu-toggle__text">Name</span>
|
|
2963
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
2964
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
3245
2965
|
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
3246
2966
|
</span>
|
|
3247
|
-
</
|
|
3248
|
-
|
|
3249
|
-
<ul
|
|
3250
|
-
class="pf-v5-c-select__menu"
|
|
3251
|
-
role="listbox"
|
|
3252
|
-
aria-labelledby="toolbar-pagination-management-example-toolbar-select-name-label"
|
|
3253
|
-
hidden
|
|
3254
|
-
>
|
|
3255
|
-
<li role="presentation">
|
|
3256
|
-
<button
|
|
3257
|
-
class="pf-v5-c-select__menu-item"
|
|
3258
|
-
role="option"
|
|
3259
|
-
>Running</button>
|
|
3260
|
-
</li>
|
|
3261
|
-
<li role="presentation">
|
|
3262
|
-
<button
|
|
3263
|
-
class="pf-v5-c-select__menu-item pf-m-selected"
|
|
3264
|
-
role="option"
|
|
3265
|
-
aria-selected="true"
|
|
3266
|
-
>
|
|
3267
|
-
Stopped
|
|
3268
|
-
<span class="pf-v5-c-select__menu-item-icon">
|
|
3269
|
-
<i class="fas fa-check" aria-hidden="true"></i>
|
|
3270
|
-
</span>
|
|
3271
|
-
</button>
|
|
3272
|
-
</li>
|
|
3273
|
-
<li role="presentation">
|
|
3274
|
-
<button
|
|
3275
|
-
class="pf-v5-c-select__menu-item"
|
|
3276
|
-
role="option"
|
|
3277
|
-
>Down</button>
|
|
3278
|
-
</li>
|
|
3279
|
-
<li role="presentation">
|
|
3280
|
-
<button
|
|
3281
|
-
class="pf-v5-c-select__menu-item"
|
|
3282
|
-
role="option"
|
|
3283
|
-
>Degraded</button>
|
|
3284
|
-
</li>
|
|
3285
|
-
<li role="presentation">
|
|
3286
|
-
<button
|
|
3287
|
-
class="pf-v5-c-select__menu-item"
|
|
3288
|
-
role="option"
|
|
3289
|
-
>Needs maintenance</button>
|
|
3290
|
-
</li>
|
|
3291
|
-
</ul>
|
|
3292
|
-
</div>
|
|
2967
|
+
</span>
|
|
2968
|
+
</button>
|
|
3293
2969
|
</div>
|
|
3294
2970
|
<div class="pf-v5-c-input-group__item pf-m-fill">
|
|
3295
2971
|
<div class="pf-v5-c-text-input-group">
|