@patternfly/patternfly 6.0.0-alpha.3 → 6.0.0-alpha.30
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/README.md +13 -3
- package/assets/icons/iconUnicodes.json +1 -0
- package/assets/images/PF-Backdrop.svg +1 -0
- package/assets/images/PF-IconLogo-Reverse.svg +14 -0
- package/assets/images/PF-IconLogo.svg +17 -0
- 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/assets/pficon/pf-v5-pficon.woff2 +0 -0
- package/assets/pficon/pficon.scss +6 -129
- package/base/_common.scss +29 -4
- package/base/_globals.scss +5 -9
- package/base/_variables.scss +8 -6
- package/base/patternfly-common.css +24 -6
- package/base/patternfly-globals.css +5 -5
- package/base/patternfly-icons.css +5 -1
- package/base/patternfly-pf-icons.css +5 -1
- package/base/patternfly-variables.css +886 -771
- package/base/tokens/_tokens-dark.scss +322 -265
- package/base/tokens/_tokens-default.scss +426 -306
- package/base/tokens/_tokens-font.scss +59 -35
- package/base/tokens/_tokens-palette.scss +69 -71
- package/base/tokens/_workspace-overrides.scss +7 -0
- package/components/AboutModalBox/about-modal-box.css +80 -108
- package/components/AboutModalBox/about-modal-box.scss +64 -78
- package/components/Accordion/accordion.css +96 -175
- package/components/Accordion/accordion.scss +106 -193
- package/components/ActionList/action-list.css +2 -2
- package/components/ActionList/action-list.scss +2 -2
- package/components/Alert/alert-group.css +27 -20
- package/components/Alert/alert-group.scss +27 -20
- package/components/Alert/alert.css +74 -95
- package/components/Alert/alert.scss +76 -89
- package/components/AppLauncher/app-launcher.css +32 -23
- package/components/AppLauncher/app-launcher.scss +32 -23
- package/components/BackToTop/back-to-top.css +17 -15
- package/components/BackToTop/back-to-top.scss +14 -13
- package/components/Backdrop/backdrop.css +2 -2
- package/components/Backdrop/backdrop.scss +2 -2
- package/components/BackgroundImage/background-image.css +6 -3
- package/components/BackgroundImage/background-image.scss +8 -3
- package/components/Badge/badge.css +25 -17
- package/components/Badge/badge.scss +27 -19
- package/components/Banner/banner.css +91 -69
- package/components/Banner/banner.scss +95 -34
- package/components/Breadcrumb/breadcrumb.css +28 -19
- package/components/Breadcrumb/breadcrumb.scss +26 -19
- package/components/Button/button.css +35 -23
- package/components/Button/button.scss +36 -26
- package/components/Button/themes/dark/button.scss +1 -1
- package/components/CalendarMonth/calendar-month.css +25 -15
- package/components/CalendarMonth/calendar-month.scss +23 -15
- package/components/Card/card.css +25 -17
- package/components/Card/card.scss +24 -17
- package/components/Check/check.css +12 -10
- package/components/Check/check.scss +17 -12
- package/components/Chip/chip-group.css +6 -6
- package/components/Chip/chip-group.scss +6 -6
- package/components/Chip/chip.css +16 -9
- package/components/Chip/chip.scss +17 -9
- package/components/ClipboardCopy/clipboard-copy.css +19 -10
- package/components/ClipboardCopy/clipboard-copy.scss +16 -8
- package/components/ClipboardCopy/themes/dark/clipboard-copy.scss +2 -2
- package/components/CodeBlock/code-block.css +6 -3
- package/components/CodeBlock/code-block.scss +6 -3
- package/components/CodeEditor/code-editor.css +31 -22
- package/components/CodeEditor/code-editor.scss +30 -21
- package/components/CodeEditor/themes/dark/code-editor.scss +1 -1
- package/components/Content/content.css +100 -97
- package/components/Content/content.scss +101 -98
- package/components/ContextSelector/context-selector.css +41 -26
- package/components/ContextSelector/context-selector.scss +40 -25
- package/components/ContextSelector/themes/dark/context-selector.scss +1 -1
- package/components/DataList/data-list-grid.css +21 -21
- package/components/DataList/data-list-grid.scss +3 -3
- package/components/DataList/data-list.css +69 -56
- package/components/DataList/data-list.scss +47 -35
- package/components/DatePicker/date-picker.css +8 -8
- package/components/DatePicker/date-picker.scss +8 -8
- package/components/DescriptionList/description-list.css +8 -5
- package/components/DescriptionList/description-list.scss +8 -5
- package/components/DragDrop/drag-drop.css +8 -8
- package/components/DragDrop/drag-drop.scss +8 -8
- package/components/Drawer/drawer.css +120 -62
- package/components/Drawer/drawer.scss +94 -44
- package/components/Dropdown/dropdown.css +76 -69
- package/components/Dropdown/dropdown.scss +67 -62
- package/components/DualListSelector/dual-list-selector.css +29 -15
- package/components/DualListSelector/dual-list-selector.scss +30 -15
- package/components/EmptyState/empty-state.css +7 -4
- package/components/EmptyState/empty-state.scss +7 -4
- package/components/ExpandableSection/expandable-section.css +75 -59
- package/components/ExpandableSection/expandable-section.scss +81 -72
- package/components/FileUpload/file-upload.css +9 -15
- package/components/FileUpload/file-upload.scss +9 -15
- package/components/Form/form.css +53 -50
- package/components/Form/form.scss +46 -44
- package/components/FormControl/form-control.css +18 -9
- package/components/FormControl/form-control.scss +18 -9
- package/components/HelperText/helper-text.css +1 -1
- package/components/HelperText/helper-text.scss +1 -1
- package/components/Hint/hint.css +37 -27
- package/components/Hint/hint.scss +37 -30
- package/components/Icon/icon.css +1 -1
- package/components/Icon/icon.scss +1 -1
- package/components/InlineEdit/inline-edit.css +9 -9
- package/components/InlineEdit/inline-edit.scss +9 -9
- package/components/InputGroup/input-group.css +12 -6
- package/components/InputGroup/input-group.scss +11 -5
- package/components/InputGroup/themes/dark/input-group.scss +1 -1
- package/components/JumpLinks/jump-links.css +27 -24
- package/components/JumpLinks/jump-links.scss +26 -24
- package/components/Label/label-group.css +13 -10
- package/components/Label/label-group.scss +13 -10
- package/components/Label/label.css +9 -9
- package/components/Label/label.scss +9 -9
- package/components/List/list.css +25 -25
- package/components/List/list.scss +26 -26
- package/components/LogViewer/log-viewer.css +14 -14
- package/components/LogViewer/log-viewer.scss +14 -14
- package/components/Login/login.css +104 -122
- package/components/Login/login.scss +92 -91
- package/components/Masthead/masthead.css +68 -125
- package/components/Masthead/masthead.scss +123 -153
- package/components/Menu/menu.css +82 -65
- package/components/Menu/menu.scss +85 -69
- package/components/MenuToggle/menu-toggle.css +89 -100
- package/components/MenuToggle/menu-toggle.scss +92 -112
- package/components/ModalBox/modal-box.css +76 -69
- package/components/ModalBox/modal-box.scss +74 -70
- package/components/MultipleFileUpload/multiple-file-upload.css +11 -8
- package/components/MultipleFileUpload/multiple-file-upload.scss +11 -8
- package/components/Nav/nav.css +162 -133
- package/components/Nav/nav.scss +162 -135
- package/components/Nav/themes/dark/nav.scss +2 -2
- package/components/NotificationBadge/notification-badge.css +66 -85
- package/components/NotificationBadge/notification-badge.scss +72 -103
- package/components/NotificationDrawer/notification-drawer.css +32 -19
- package/components/NotificationDrawer/notification-drawer.scss +30 -19
- package/components/NumberInput/number-input.css +2 -2
- package/components/NumberInput/number-input.scss +2 -2
- package/components/OptionsMenu/options-menu.css +43 -31
- package/components/OptionsMenu/options-menu.scss +43 -31
- package/components/OverflowMenu/overflow-menu.css +2 -2
- package/components/OverflowMenu/overflow-menu.scss +2 -2
- package/components/Page/page.css +232 -271
- package/components/Page/page.scss +180 -231
- package/components/Pagination/pagination.css +27 -17
- package/components/Pagination/pagination.scss +25 -17
- package/components/Panel/panel.css +13 -7
- package/components/Panel/panel.scss +13 -7
- package/components/Popover/popover.css +110 -87
- package/components/Popover/popover.scss +120 -109
- package/components/Progress/progress.css +9 -7
- package/components/Progress/progress.scss +12 -7
- package/components/ProgressStepper/progress-stepper.css +26 -20
- package/components/ProgressStepper/progress-stepper.scss +25 -19
- package/components/Radio/radio.css +16 -13
- package/components/Radio/radio.scss +20 -14
- package/components/Select/select.css +56 -47
- package/components/Select/select.scss +56 -47
- package/components/Sidebar/sidebar.css +11 -5
- package/components/Sidebar/sidebar.scss +11 -5
- package/components/SimpleList/simple-list.css +10 -4
- package/components/SimpleList/simple-list.scss +10 -4
- package/components/Skeleton/skeleton.css +6 -5
- package/components/Skeleton/skeleton.scss +4 -5
- package/components/SkipToContent/skip-to-content.css +9 -6
- package/components/SkipToContent/skip-to-content.scss +8 -6
- package/components/Slider/slider.css +47 -26
- package/components/Slider/slider.scss +56 -28
- package/components/Switch/switch.css +10 -6
- package/components/Switch/switch.scss +11 -7
- package/components/TabContent/tab-content.css +4 -1
- package/components/TabContent/tab-content.scss +4 -1
- package/components/Table/table-grid.css +264 -203
- package/components/Table/table-grid.scss +61 -47
- package/components/Table/table-scrollable.css +4 -4
- package/components/Table/table-scrollable.scss +6 -4
- package/components/Table/table-tree-view.css +112 -105
- package/components/Table/table-tree-view.scss +38 -33
- package/components/Table/table.css +176 -159
- package/components/Table/table.scss +177 -165
- package/components/Tabs/tabs.css +76 -48
- package/components/Tabs/tabs.scss +74 -48
- package/components/TextInputGroup/text-input-group.css +15 -15
- package/components/TextInputGroup/text-input-group.scss +15 -15
- package/components/Tile/tile.css +10 -10
- package/components/Tile/tile.scss +10 -10
- package/components/Title/title.css +70 -19
- package/components/Title/title.scss +90 -20
- package/components/ToggleGroup/toggle-group.css +14 -11
- package/components/ToggleGroup/toggle-group.scss +14 -11
- package/components/Toolbar/toolbar.css +57 -44
- package/components/Toolbar/toolbar.scss +45 -26
- package/components/Tooltip/tooltip.css +76 -44
- package/components/Tooltip/tooltip.scss +93 -77
- package/components/TreeView/tree-view.css +48 -27
- package/components/TreeView/tree-view.scss +50 -28
- package/components/Truncate/truncate.css +9 -0
- package/components/Truncate/truncate.scss +16 -3
- package/components/Wizard/wizard.css +57 -36
- package/components/Wizard/wizard.scss +57 -36
- package/docs/components/AboutModalBox/examples/AboutModalBox.md +2 -2
- package/docs/components/Accordion/examples/Accordion.md +614 -416
- package/docs/components/Alert/examples/Alert.md +1 -1
- package/docs/components/Badge/examples/Badge.md +21 -0
- package/docs/components/Banner/examples/Banner.md +48 -25
- package/docs/components/Brand/examples/Brand.css +12 -0
- package/docs/components/Brand/examples/Brand.md +75 -32
- package/docs/components/Button/examples/Button.css +2 -2
- package/docs/components/Button/examples/Button.md +15 -3
- package/docs/components/Card/examples/Card.md +125 -17
- package/docs/components/Check/examples/Check.md +71 -59
- package/docs/components/Chip/examples/Chip.md +1 -1
- package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +106 -0
- package/docs/components/CodeEditor/examples/CodeEditor.md +3 -3
- package/docs/components/DragDrop/examples/DragDrop.css +2 -2
- package/docs/components/Dropdown/deprecated/Dropdown.css +1 -1
- package/docs/components/DualListSelector/examples/DualListSelector.md +64 -16
- package/docs/components/ExpandableSection/examples/ExpandableSection.md +47 -24
- package/docs/components/Label/examples/Label.md +1 -1
- package/docs/components/LogViewer/examples/LogViewer.css +2 -2
- package/docs/components/LogViewer/examples/LogViewer.md +250 -160
- package/docs/components/Login/examples/Login.md +5 -0
- package/docs/components/Masthead/examples/masthead.md +7 -54
- package/docs/components/Menu/examples/Menu.css +8 -0
- package/docs/components/Menu/examples/Menu.md +594 -543
- package/docs/components/MenuToggle/examples/MenuToggle.md +151 -138
- package/docs/components/ModalBox/examples/ModalBox.css +3 -8
- package/docs/components/Nav/examples/Navigation.css +3 -25
- package/docs/components/Nav/examples/Navigation.md +239 -113
- package/docs/components/NotificationBadge/examples/NotificationBadge.md +5 -7
- package/docs/components/OptionsMenu/deprecated/options-menu.md +12 -3
- package/docs/components/Page/examples/Page.css +0 -8
- package/docs/components/Page/examples/Page.md +22 -21
- package/docs/components/Popover/examples/Popover.css +4 -9
- package/docs/components/Popover/examples/Popover.md +1 -1
- package/docs/components/Radio/examples/Radio.md +63 -55
- package/docs/components/Select/deprecated/Select.md +184 -177
- package/docs/components/Table/examples/Table.css +2 -2
- package/docs/components/Table/examples/Table.md +2 -2
- package/docs/components/TextInputGroup/examples/TextInputGroup.css +1 -1
- package/docs/components/TextInputGroup/examples/TextInputGroup.md +9 -9
- package/docs/components/Tile/examples/Tile.css +1 -1
- package/docs/components/Title/examples/Title.md +18 -0
- package/docs/components/Toolbar/examples/Toolbar.md +570 -2803
- package/docs/components/Tooltip/examples/Tooltip.css +4 -0
- package/docs/components/Tooltip/examples/Tooltip.md +3 -1
- package/docs/components/Truncate/examples/Truncate.md +2 -2
- package/docs/demos/AboutModal/examples/AboutModal.md +85 -10
- package/docs/demos/Alert/examples/Alert.md +249 -24
- package/docs/demos/BackToTop/examples/BackToTop.md +83 -8
- package/docs/demos/Banner/examples/Banner.md +168 -16
- package/docs/demos/Card/examples/Card.css +3 -3
- package/docs/demos/Card/examples/Card.md +28 -12
- package/docs/demos/CardView/examples/CardView.md +139 -79
- package/docs/demos/ContextSelector/examples/ContextSelector.md +332 -32
- package/docs/demos/Dashboard/examples/Dashboard.md +86 -11
- package/docs/demos/DataList/examples/DataList.md +524 -354
- package/docs/demos/DescriptionList/examples/DescriptionList.md +249 -24
- package/docs/demos/Drawer/examples/Drawer.md +415 -40
- package/docs/demos/JumpLinks/examples/JumpLinks.md +498 -48
- package/docs/demos/Masthead/examples/Masthead.md +793 -277
- package/docs/demos/Modal/examples/Modal.md +498 -48
- package/docs/demos/Nav/examples/Nav.md +664 -64
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +420 -40
- package/docs/demos/Page/examples/Page.md +747 -72
- package/docs/demos/Page/examples/Penta.md +746 -0
- package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +2 -1
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +824 -451
- package/docs/demos/Skeleton/examples/Skeleton.md +90 -43
- package/docs/demos/Table/examples/Table.md +2313 -1887
- package/docs/demos/Tabs/examples/Tabs.md +528 -71
- package/docs/demos/Toolbar/examples/Toolbar.css +15 -0
- package/docs/demos/Toolbar/examples/Toolbar.md +870 -1044
- package/docs/demos/Wizard/examples/Wizard.md +747 -72
- package/docs/layouts/Flex/examples/Flex.md +5 -5
- package/docs/utilities/BoxShadow/examples/box-shadow.css +5 -5
- package/icons/pficons.mjs +1 -0
- package/layouts/Flex/flex.css +115 -43
- package/layouts/Flex/flex.scss +20 -8
- package/package.json +9 -5
- package/patternfly-addons.css +732 -972
- package/patternfly-base-no-globals-theme-dark-unversioned.css +921 -784
- package/patternfly-base-no-globals.css +921 -784
- package/patternfly-base-theme-dark-unversioned.css +926 -789
- package/patternfly-base.css +926 -789
- package/patternfly-no-globals.css +4816 -4221
- package/patternfly-theme-dark-unversioned.css +4821 -4226
- package/patternfly.css +4821 -4226
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
- package/sass-utilities/functions.scss +6 -0
- package/sass-utilities/mixins.scss +62 -2
- package/sass-utilities/scss-variables.scss +8 -8
- package/sass-utilities/themes/dark/mixins.scss +3 -1
- package/utilities/Accessibility/accessibility.css +12 -12
- package/utilities/Spacing/spacing.css +720 -960
- package/utilities/Spacing/spacing.scss +4 -8
- package/base/themes/dark/_variables.scss +0 -102
- package/components/AboutModalBox/themes/dark/about-modal-box.scss +0 -7
- package/components/Accordion/themes/dark/accordion.scss +0 -9
- package/components/Alert/themes/dark/alert.scss +0 -17
- package/components/Badge/themes/dark/badge.scss +0 -9
- package/components/Banner/themes/dark/banner.scss +0 -14
- package/components/Hint/themes/dark/hint.scss +0 -8
- package/components/Login/themes/dark/login.scss +0 -12
- package/components/Masthead/themes/dark/masthead.scss +0 -14
- package/components/ModalBox/themes/dark/modal-box.scss +0 -7
- package/components/NotificationBadge/themes/dark/notification-badge.scss +0 -10
- package/components/Page/themes/dark/page.scss +0 -69
- package/components/Popover/themes/dark/popover.scss +0 -11
- package/components/Tooltip/themes/dark/tooltip.scss +0 -8
- package/docs/components/NotificationBadge/examples/NotificationBadge.css +0 -3
|
@@ -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
|
-
|
|
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">
|
|
57
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
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">
|
|
48
|
+
<i class="fas fa-angle-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">
|
|
@@ -287,13 +237,88 @@ section: components
|
|
|
287
237
|
</button>
|
|
288
238
|
</span>
|
|
289
239
|
<div class="pf-v5-c-masthead__main">
|
|
290
|
-
<a
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
240
|
+
<a
|
|
241
|
+
class="pf-v5-c-masthead__brand"
|
|
242
|
+
href="#"
|
|
243
|
+
style="--pf-v5-c-brand--Height: 36px;"
|
|
244
|
+
>
|
|
245
|
+
<svg height="36px" viewBox="0 0 679 158" role="img">
|
|
246
|
+
<title>Patternfly logo</title>
|
|
247
|
+
<defs>
|
|
248
|
+
<linearGradient
|
|
249
|
+
x1="68%"
|
|
250
|
+
y1="2.25860997e-13%"
|
|
251
|
+
x2="32%"
|
|
252
|
+
y2="100%"
|
|
253
|
+
id="linearGradient-1"
|
|
254
|
+
>
|
|
255
|
+
<stop stop-color="#2B9AF3" offset="0%" />
|
|
256
|
+
<stop
|
|
257
|
+
stop-color="#73BCF7"
|
|
258
|
+
stop-opacity="0.502212631"
|
|
259
|
+
offset="100%"
|
|
260
|
+
/>
|
|
261
|
+
</linearGradient>
|
|
262
|
+
</defs>
|
|
263
|
+
<g
|
|
264
|
+
id="PF-HorizontalLogo-Color"
|
|
265
|
+
stroke="none"
|
|
266
|
+
stroke-width="1"
|
|
267
|
+
fill="none"
|
|
268
|
+
fill-rule="evenodd"
|
|
269
|
+
>
|
|
270
|
+
<g
|
|
271
|
+
transform="translate(206.000000, 45.750000)"
|
|
272
|
+
fill="var(--pf-t--global--text--color--regular)"
|
|
273
|
+
fill-rule="nonzero"
|
|
274
|
+
>
|
|
275
|
+
<path
|
|
276
|
+
d="M0,65.25 L0,2.25 L33.21,2.25 C37.35,2.25 41.025,3.135 44.235,4.905 C47.445,6.675 49.98,9.09 51.84,12.15 C53.7,15.21 54.63,18.72 54.63,22.68 C54.63,26.46 53.7,29.865 51.84,32.895 C49.98,35.925 47.43,38.31 44.19,40.05 C40.95,41.79 37.29,42.66 33.21,42.66 L15.48,42.66 L15.48,65.25 L0,65.25 Z M15.48,29.88 L31.41,29.88 C33.69,29.88 35.52,29.22 36.9,27.9 C38.28,26.58 38.97,24.87 38.97,22.77 C38.97,20.61 38.28,18.855 36.9,17.505 C35.52,16.155 33.69,15.48 31.41,15.48 L15.48,15.48 L15.48,29.88 Z"
|
|
277
|
+
/>
|
|
278
|
+
<path
|
|
279
|
+
d="M77.04,66.06 C73.68,66.06 70.695,65.43 68.085,64.17 C65.475,62.91 63.435,61.17 61.965,58.95 C60.495,56.73 59.76,54.18 59.76,51.3 C59.76,46.74 61.485,43.215 64.935,40.725 C68.385,38.235 73.2,36.99 79.38,36.99 C83.1,36.99 86.7,37.44 90.18,38.34 L90.18,36 C90.18,31.26 87.15,28.89 81.09,28.89 C77.49,28.89 72.69,30.15 66.69,32.67 L61.47,21.96 C69.15,18.48 76.56,16.74 83.7,16.74 C90.3,16.74 95.43,18.315 99.09,21.465 C102.75,24.615 104.58,29.04 104.58,34.74 L104.58,65.25 L90.18,65.25 L90.18,62.37 C88.26,63.69 86.235,64.635 84.105,65.205 C81.975,65.775 79.62,66.06 77.04,66.06 Z M73.62,51.03 C73.62,52.53 74.28,53.7 75.6,54.54 C76.92,55.38 78.75,55.8 81.09,55.8 C84.69,55.8 87.72,55.05 90.18,53.55 L90.18,47.43 C87.42,46.71 84.54,46.35 81.54,46.35 C79.02,46.35 77.07,46.755 75.69,47.565 C74.31,48.375 73.62,49.53 73.62,51.03 Z"
|
|
280
|
+
/>
|
|
281
|
+
<path
|
|
282
|
+
d="M137.25,65.88 C125.73,65.88 119.97,60.84 119.97,50.76 L119.97,29.79 L110.34,29.79 L110.34,17.64 L119.97,17.64 L119.97,5.4 L134.55,2.25 L134.55,17.64 L147.87,17.64 L147.87,29.79 L134.55,29.79 L134.55,47.88 C134.55,49.98 135.015,51.465 135.945,52.335 C136.875,53.205 138.51,53.64 140.85,53.64 C143.01,53.64 145.2,53.31 147.42,52.65 L147.42,64.44 C146.1,64.86 144.42,65.205 142.38,65.475 C140.34,65.745 138.63,65.88 137.25,65.88 Z"
|
|
283
|
+
/>
|
|
284
|
+
<path
|
|
285
|
+
d="M177.57,65.88 C166.05,65.88 160.29,60.84 160.29,50.76 L160.29,29.79 L150.66,29.79 L150.66,17.64 L160.29,17.64 L160.29,5.4 L174.87,2.25 L174.87,17.64 L188.19,17.64 L188.19,29.79 L174.87,29.79 L174.87,47.88 C174.87,49.98 175.335,51.465 176.265,52.335 C177.195,53.205 178.83,53.64 181.17,53.64 C183.33,53.64 185.52,53.31 187.74,52.65 L187.74,64.44 C186.42,64.86 184.74,65.205 182.7,65.475 C180.66,65.745 178.95,65.88 177.57,65.88 Z"
|
|
286
|
+
/>
|
|
287
|
+
<path
|
|
288
|
+
d="M217.62,66.15 C212.76,66.15 208.365,65.055 204.435,62.865 C200.505,60.675 197.4,57.72 195.12,54 C192.84,50.28 191.7,46.11 191.7,41.49 C191.7,36.87 192.795,32.7 194.985,28.98 C197.175,25.26 200.16,22.305 203.94,20.115 C207.72,17.925 211.92,16.83 216.54,16.83 C221.22,16.83 225.36,17.955 228.96,20.205 C232.56,22.455 235.395,25.53 237.465,29.43 C239.535,33.33 240.57,37.8 240.57,42.84 L240.57,46.44 L206.64,46.44 C207.6,48.66 209.1,50.475 211.14,51.885 C213.18,53.295 215.58,54 218.34,54 C222.42,54 225.6,52.8 227.88,50.4 L237.51,58.95 C234.51,61.47 231.435,63.3 228.285,64.44 C225.135,65.58 221.58,66.15 217.62,66.15 Z M206.37,36.27 L226.26,36.27 C225.48,33.99 224.205,32.16 222.435,30.78 C220.665,29.4 218.61,28.71 216.27,28.71 C213.87,28.71 211.8,29.37 210.06,30.69 C208.32,32.01 207.09,33.87 206.37,36.27 Z"
|
|
289
|
+
/>
|
|
290
|
+
<path
|
|
291
|
+
d="M247.41,65.25 L247.41,17.64 L261.99,17.64 L261.99,22.41 C265.23,18.51 269.4,16.56 274.5,16.56 C277.08,16.62 278.91,17.01 279.99,17.73 L279.99,30.42 C277.95,29.46 275.64,28.98 273.06,28.98 C270.78,28.98 268.665,29.505 266.715,30.555 C264.765,31.605 263.19,33.09 261.99,35.01 L261.99,65.25 L247.41,65.25 Z"
|
|
292
|
+
/>
|
|
293
|
+
<path
|
|
294
|
+
d="M286.29,65.25 L286.29,17.64 L300.87,17.64 L300.87,20.88 C304.47,18.12 308.73,16.74 313.65,16.74 C317.37,16.74 320.655,17.55 323.505,19.17 C326.355,20.79 328.59,23.04 330.21,25.92 C331.83,28.8 332.64,32.13 332.64,35.91 L332.64,65.25 L318.06,65.25 L318.06,37.89 C318.06,35.25 317.28,33.15 315.72,31.59 C314.16,30.03 312.06,29.25 309.42,29.25 C305.76,29.25 302.91,30.51 300.87,33.03 L300.87,65.25 L286.29,65.25 Z"
|
|
295
|
+
/>
|
|
296
|
+
<polygon
|
|
297
|
+
points="342 65.25 342 2.25 392.04 2.25 392.04 15.66 357.48 15.66 357.48 27.45 380.52 27.45 380.52 40.41 357.48 40.41 357.48 65.25"
|
|
298
|
+
/>
|
|
299
|
+
<polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
|
|
300
|
+
<path
|
|
301
|
+
d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
|
|
302
|
+
/>
|
|
303
|
+
</g>
|
|
304
|
+
<g id="Logo" transform="translate(0.000000, 0.000000)">
|
|
305
|
+
<path
|
|
306
|
+
d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
|
|
307
|
+
id="Rectangle-Copy-17"
|
|
308
|
+
fill="var(--pf-t--global--color--brand--200)"
|
|
309
|
+
/>
|
|
310
|
+
<path
|
|
311
|
+
d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
|
|
312
|
+
fill="url(#linearGradient-1)"
|
|
313
|
+
/>
|
|
314
|
+
<path
|
|
315
|
+
d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
|
|
316
|
+
fill="url(#linearGradient-1)"
|
|
317
|
+
transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
|
|
318
|
+
/>
|
|
319
|
+
</g>
|
|
320
|
+
</g>
|
|
321
|
+
</svg>
|
|
297
322
|
</a>
|
|
298
323
|
</div>
|
|
299
324
|
<div class="pf-v5-c-masthead__content">
|
|
@@ -367,7 +392,7 @@ section: components
|
|
|
367
392
|
<span class="pf-v5-c-menu-toggle__text">Ned Username</span>
|
|
368
393
|
<span class="pf-v5-c-menu-toggle__controls">
|
|
369
394
|
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
370
|
-
<i class="fas fa-
|
|
395
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
371
396
|
</span>
|
|
372
397
|
</span>
|
|
373
398
|
</button>
|
|
@@ -466,10 +491,10 @@ section: components
|
|
|
466
491
|
>
|
|
467
492
|
<div class="pf-v5-c-toolbar__toggle">
|
|
468
493
|
<button
|
|
469
|
-
class="pf-v5-c-
|
|
494
|
+
class="pf-v5-c-menu-toggle pf-m-plain"
|
|
470
495
|
type="button"
|
|
471
|
-
aria-label="Show filters"
|
|
472
496
|
aria-expanded="false"
|
|
497
|
+
aria-label="Show filters"
|
|
473
498
|
aria-controls="toolbar-with-validation-example-expandable-content"
|
|
474
499
|
>
|
|
475
500
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
@@ -482,153 +507,106 @@ section: components
|
|
|
482
507
|
aria-label="search filter"
|
|
483
508
|
role="group"
|
|
484
509
|
>
|
|
485
|
-
<div class="pf-v5-c-
|
|
486
|
-
<span
|
|
487
|
-
id="toolbar-with-validation-example-select-month-label"
|
|
488
|
-
hidden
|
|
489
|
-
>Choose one</span>
|
|
490
|
-
|
|
510
|
+
<div class="pf-v5-c-input-group__item">
|
|
491
511
|
<button
|
|
492
|
-
class="pf-v5-c-
|
|
512
|
+
class="pf-v5-c-menu-toggle"
|
|
493
513
|
type="button"
|
|
494
|
-
id="toolbar-with-validation-example-select-month-toggle"
|
|
495
|
-
aria-haspopup="true"
|
|
496
514
|
aria-expanded="false"
|
|
497
|
-
|
|
515
|
+
id="toolbar-with-validation-example-month"
|
|
498
516
|
>
|
|
499
|
-
<
|
|
500
|
-
<
|
|
501
|
-
|
|
517
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
518
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
519
|
+
</span>
|
|
520
|
+
<span class="pf-v5-c-menu-toggle__text">Last month</span>
|
|
521
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
522
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
523
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
502
524
|
</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
525
|
</span>
|
|
508
526
|
</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
527
|
</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"
|
|
528
|
+
<div class="pf-v5-c-input-group__item">
|
|
529
|
+
<div class="pf-v5-c-date-picker">
|
|
530
|
+
<div class="pf-v5-c-date-picker__input">
|
|
531
|
+
<div
|
|
532
|
+
class="pf-v5-c-input-group"
|
|
533
|
+
aria-label="search filter"
|
|
534
|
+
role="group"
|
|
574
535
|
>
|
|
575
|
-
<
|
|
576
|
-
|
|
536
|
+
<span class="pf-v5-c-form-control">
|
|
537
|
+
<input
|
|
538
|
+
type="text"
|
|
539
|
+
value="2020-03-05"
|
|
540
|
+
id="toolbar-with-validation-example-helper-text-input"
|
|
541
|
+
name="toolbar-with-validation-example-helper-text-input"
|
|
542
|
+
aria-label="Date picker"
|
|
543
|
+
/>
|
|
544
|
+
</span>
|
|
545
|
+
<button
|
|
546
|
+
class="pf-v5-c-button pf-m-control"
|
|
547
|
+
type="button"
|
|
548
|
+
aria-label="Toggle date picker"
|
|
549
|
+
>
|
|
550
|
+
<i class="fas fa-calendar-alt" aria-hidden="true"></i>
|
|
551
|
+
</button>
|
|
552
|
+
</div>
|
|
577
553
|
</div>
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
554
|
+
<div class="pf-v5-c-date-picker__helper-text">
|
|
555
|
+
<div class="pf-v5-c-helper-text">
|
|
556
|
+
<div class="pf-v5-c-helper-text__item">
|
|
557
|
+
<span
|
|
558
|
+
class="pf-v5-c-helper-text__item-text"
|
|
559
|
+
>MM/DD/YYYY</span>
|
|
560
|
+
</div>
|
|
585
561
|
</div>
|
|
586
562
|
</div>
|
|
587
563
|
</div>
|
|
588
564
|
</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
|
-
|
|
565
|
+
<div class="pf-v5-c-input-group__item">
|
|
566
|
+
<div class="pf-v5-c-date-picker">
|
|
567
|
+
<div class="pf-v5-c-date-picker__input">
|
|
568
|
+
<div
|
|
569
|
+
class="pf-v5-c-input-group"
|
|
570
|
+
aria-label="search filter"
|
|
571
|
+
role="group"
|
|
572
|
+
>
|
|
573
|
+
<span class="pf-v5-c-form-control pf-m-error">
|
|
574
|
+
<input
|
|
575
|
+
aria-invalid="true"
|
|
576
|
+
type="text"
|
|
577
|
+
value="2020-03-05"
|
|
578
|
+
id="toolbar-with-validation-example-invalid-input"
|
|
579
|
+
name="toolbar-with-validation-example-invalid-input"
|
|
580
|
+
aria-label="Date picker"
|
|
581
|
+
/>
|
|
582
|
+
<span class="pf-v5-c-form-control__utilities">
|
|
583
|
+
<span
|
|
584
|
+
class="pf-v5-c-form-control__icon pf-m-status"
|
|
585
|
+
>
|
|
586
|
+
<i
|
|
587
|
+
class="fas fa-exclamation-circle"
|
|
588
|
+
aria-hidden="true"
|
|
589
|
+
></i>
|
|
590
|
+
</span>
|
|
613
591
|
</span>
|
|
614
592
|
</span>
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
</
|
|
593
|
+
<button
|
|
594
|
+
class="pf-v5-c-button pf-m-control"
|
|
595
|
+
type="button"
|
|
596
|
+
aria-label="Toggle date picker"
|
|
597
|
+
>
|
|
598
|
+
<i class="fas fa-calendar-alt" aria-hidden="true"></i>
|
|
599
|
+
</button>
|
|
600
|
+
</div>
|
|
601
|
+
<div class="pf-v5-c-date-picker__helper-text"></div>
|
|
623
602
|
</div>
|
|
624
|
-
<div class="pf-v5-c-date-picker__helper-text"
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
>Max: 08/10/2022</span>
|
|
603
|
+
<div class="pf-v5-c-date-picker__helper-text">
|
|
604
|
+
<div class="pf-v5-c-helper-text">
|
|
605
|
+
<div class="pf-v5-c-helper-text__item">
|
|
606
|
+
<span
|
|
607
|
+
class="pf-v5-c-helper-text__item-text"
|
|
608
|
+
>Max: 08/10/2022</span>
|
|
609
|
+
</div>
|
|
632
610
|
</div>
|
|
633
611
|
</div>
|
|
634
612
|
</div>
|
|
@@ -643,75 +621,22 @@ section: components
|
|
|
643
621
|
role="group"
|
|
644
622
|
>
|
|
645
623
|
<div class="pf-v5-c-input-group__item">
|
|
646
|
-
<
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
<
|
|
653
|
-
class="
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
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">
|
|
667
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
624
|
+
<button
|
|
625
|
+
class="pf-v5-c-menu-toggle"
|
|
626
|
+
type="button"
|
|
627
|
+
aria-expanded="false"
|
|
628
|
+
id="toolbar-with-validation-example-search-filter-menu"
|
|
629
|
+
>
|
|
630
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
631
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
632
|
+
</span>
|
|
633
|
+
<span class="pf-v5-c-menu-toggle__text">Description</span>
|
|
634
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
635
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
636
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
668
637
|
</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>
|
|
638
|
+
</span>
|
|
639
|
+
</button>
|
|
715
640
|
</div>
|
|
716
641
|
<div class="pf-v5-c-input-group__item pf-m-fill">
|
|
717
642
|
<div class="pf-v5-c-text-input-group">
|
|
@@ -723,7 +648,7 @@ section: components
|
|
|
723
648
|
<input
|
|
724
649
|
class="pf-v5-c-text-input-group__text-input"
|
|
725
650
|
type="text"
|
|
726
|
-
placeholder="
|
|
651
|
+
placeholder="Description"
|
|
727
652
|
value
|
|
728
653
|
aria-label="Search input"
|
|
729
654
|
/>
|
|
@@ -1347,12 +1272,12 @@ section: components
|
|
|
1347
1272
|
<div class="pf-v5-c-toolbar__content">
|
|
1348
1273
|
<div class="pf-v5-c-toolbar__content-section">
|
|
1349
1274
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group">
|
|
1350
|
-
<div class="pf-v5-c-toolbar__toggle
|
|
1275
|
+
<div class="pf-v5-c-toolbar__toggle">
|
|
1351
1276
|
<button
|
|
1352
|
-
class="pf-v5-c-
|
|
1277
|
+
class="pf-v5-c-menu-toggle pf-m-plain pf-m-expanded"
|
|
1353
1278
|
type="button"
|
|
1354
|
-
aria-label="Show filters"
|
|
1355
1279
|
aria-expanded="true"
|
|
1280
|
+
aria-label="Show filters"
|
|
1356
1281
|
aria-controls="toolbar-attribute-value-search-filter-mobile-example-expandable-content"
|
|
1357
1282
|
>
|
|
1358
1283
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
@@ -1497,72 +1422,22 @@ section: components
|
|
|
1497
1422
|
role="group"
|
|
1498
1423
|
>
|
|
1499
1424
|
<div class="pf-v5-c-input-group__item">
|
|
1500
|
-
<
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
<
|
|
1507
|
-
class="
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
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">
|
|
1521
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
1425
|
+
<button
|
|
1426
|
+
class="pf-v5-c-menu-toggle"
|
|
1427
|
+
type="button"
|
|
1428
|
+
aria-expanded="false"
|
|
1429
|
+
id="toolbar-attribute-value-search-filter-mobile-example-search-filter-menu"
|
|
1430
|
+
>
|
|
1431
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
1432
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1433
|
+
</span>
|
|
1434
|
+
<span class="pf-v5-c-menu-toggle__text">Name</span>
|
|
1435
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1436
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
1437
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
1522
1438
|
</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>
|
|
1439
|
+
</span>
|
|
1440
|
+
</button>
|
|
1566
1441
|
</div>
|
|
1567
1442
|
<div class="pf-v5-c-input-group__item pf-m-fill">
|
|
1568
1443
|
<div class="pf-v5-c-text-input-group">
|
|
@@ -1595,155 +1470,116 @@ section: components
|
|
|
1595
1470
|
```html
|
|
1596
1471
|
<div
|
|
1597
1472
|
class="pf-v5-c-toolbar"
|
|
1598
|
-
id="toolbar-attribute-value-single-
|
|
1473
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example"
|
|
1599
1474
|
>
|
|
1600
1475
|
<div class="pf-v5-c-toolbar__content">
|
|
1601
1476
|
<div class="pf-v5-c-toolbar__content-section">
|
|
1602
1477
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group pf-m-show">
|
|
1603
1478
|
<div class="pf-v5-c-toolbar__toggle">
|
|
1604
1479
|
<button
|
|
1605
|
-
class="pf-v5-c-
|
|
1480
|
+
class="pf-v5-c-menu-toggle pf-m-plain"
|
|
1606
1481
|
type="button"
|
|
1607
|
-
aria-label="Show filters"
|
|
1608
1482
|
aria-expanded="false"
|
|
1609
|
-
aria-
|
|
1483
|
+
aria-label="Show filters"
|
|
1484
|
+
aria-controls="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-expandable-content"
|
|
1610
1485
|
>
|
|
1611
1486
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1612
1487
|
</button>
|
|
1613
1488
|
</div>
|
|
1614
1489
|
<div class="pf-v5-c-toolbar__group pf-m-filter-group">
|
|
1615
1490
|
<div class="pf-v5-c-toolbar__item">
|
|
1616
|
-
<
|
|
1617
|
-
|
|
1618
|
-
|
|
1619
|
-
|
|
1620
|
-
|
|
1621
|
-
|
|
1622
|
-
<
|
|
1623
|
-
class="
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
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">
|
|
1637
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
1491
|
+
<button
|
|
1492
|
+
class="pf-v5-c-menu-toggle"
|
|
1493
|
+
type="button"
|
|
1494
|
+
aria-expanded="false"
|
|
1495
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-menu-toggle-status"
|
|
1496
|
+
>
|
|
1497
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
1498
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1499
|
+
</span>
|
|
1500
|
+
<span class="pf-v5-c-menu-toggle__text">Status</span>
|
|
1501
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1502
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
1503
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
1638
1504
|
</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>
|
|
1505
|
+
</span>
|
|
1506
|
+
</button>
|
|
1683
1507
|
</div>
|
|
1684
1508
|
<div class="pf-v5-c-toolbar__item">
|
|
1685
|
-
<
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
<
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
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">
|
|
1703
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
1509
|
+
<button
|
|
1510
|
+
class="pf-v5-c-menu-toggle pf-m-expanded"
|
|
1511
|
+
type="button"
|
|
1512
|
+
aria-expanded="true"
|
|
1513
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-menu-toggle-stopped"
|
|
1514
|
+
>
|
|
1515
|
+
<span class="pf-v5-c-menu-toggle__text">Stopped</span>
|
|
1516
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1517
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
1518
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
1704
1519
|
</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
|
-
|
|
1520
|
+
</span>
|
|
1521
|
+
</button>
|
|
1522
|
+
<div class="pf-v5-c-panel">
|
|
1523
|
+
<div class="pf-v5-c-menu" width="175px">
|
|
1524
|
+
<div class="pf-v5-c-menu__content">
|
|
1525
|
+
<section class="pf-v5-c-menu__group">
|
|
1526
|
+
<ul class="pf-v5-c-menu__list" role="menu">
|
|
1527
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1528
|
+
<button
|
|
1529
|
+
class="pf-v5-c-menu__item"
|
|
1530
|
+
type="button"
|
|
1531
|
+
role="menuitem"
|
|
1532
|
+
>
|
|
1533
|
+
<span class="pf-v5-c-menu__item-text">Running</span>
|
|
1534
|
+
</button>
|
|
1535
|
+
</li>
|
|
1536
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1537
|
+
<button
|
|
1538
|
+
class="pf-v5-c-menu__item pf-m-selected"
|
|
1539
|
+
type="button"
|
|
1540
|
+
role="menuitem"
|
|
1541
|
+
>
|
|
1542
|
+
<span class="pf-v5-c-menu__item-main">
|
|
1543
|
+
<span class="pf-v5-c-menu__item-text">Stopped</span>
|
|
1544
|
+
<span class="pf-v5-c-menu__item-select-icon">
|
|
1545
|
+
<i class="fas fa-check" aria-hidden="true"></i>
|
|
1546
|
+
</span>
|
|
1547
|
+
</span>
|
|
1548
|
+
</button>
|
|
1549
|
+
</li>
|
|
1550
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1551
|
+
<button
|
|
1552
|
+
class="pf-v5-c-menu__item"
|
|
1553
|
+
type="button"
|
|
1554
|
+
role="menuitem"
|
|
1555
|
+
>
|
|
1556
|
+
<span class="pf-v5-c-menu__item-text">Down</span>
|
|
1557
|
+
</button>
|
|
1558
|
+
</li>
|
|
1559
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1560
|
+
<button
|
|
1561
|
+
class="pf-v5-c-menu__item"
|
|
1562
|
+
type="button"
|
|
1563
|
+
role="menuitem"
|
|
1564
|
+
>
|
|
1565
|
+
<span class="pf-v5-c-menu__item-text">Degraded</span>
|
|
1566
|
+
</button>
|
|
1567
|
+
</li>
|
|
1568
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1569
|
+
<button
|
|
1570
|
+
class="pf-v5-c-menu__item"
|
|
1571
|
+
type="button"
|
|
1572
|
+
role="menuitem"
|
|
1573
|
+
>
|
|
1574
|
+
<span
|
|
1575
|
+
class="pf-v5-c-menu__item-text"
|
|
1576
|
+
>Needs maintenance</span>
|
|
1577
|
+
</button>
|
|
1578
|
+
</li>
|
|
1579
|
+
</ul>
|
|
1580
|
+
</section>
|
|
1581
|
+
</div>
|
|
1582
|
+
</div>
|
|
1747
1583
|
</div>
|
|
1748
1584
|
</div>
|
|
1749
1585
|
</div>
|
|
@@ -1751,7 +1587,7 @@ section: components
|
|
|
1751
1587
|
<div class="pf-v5-c-toolbar__item pf-m-overflow-menu">
|
|
1752
1588
|
<div
|
|
1753
1589
|
class="pf-v5-c-overflow-menu"
|
|
1754
|
-
id="toolbar-attribute-value-single-
|
|
1590
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-overflow-menu"
|
|
1755
1591
|
>
|
|
1756
1592
|
<div class="pf-v5-c-overflow-menu__content">
|
|
1757
1593
|
<div class="pf-v5-c-overflow-menu__group pf-m-button-group">
|
|
@@ -1775,7 +1611,7 @@ section: components
|
|
|
1775
1611
|
<button
|
|
1776
1612
|
class="pf-v5-c-button pf-v5-c-dropdown__toggle pf-m-plain"
|
|
1777
1613
|
type="button"
|
|
1778
|
-
id="toolbar-attribute-value-single-
|
|
1614
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-overflow-menu-dropdown-toggle"
|
|
1779
1615
|
aria-label="Overflow menu"
|
|
1780
1616
|
aria-expanded="false"
|
|
1781
1617
|
>
|
|
@@ -1784,7 +1620,7 @@ section: components
|
|
|
1784
1620
|
<ul
|
|
1785
1621
|
class="pf-v5-c-dropdown__menu"
|
|
1786
1622
|
role="menu"
|
|
1787
|
-
aria-labelledby="toolbar-attribute-value-single-
|
|
1623
|
+
aria-labelledby="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-overflow-menu-dropdown-toggle"
|
|
1788
1624
|
hidden
|
|
1789
1625
|
>
|
|
1790
1626
|
<li role="none">
|
|
@@ -1809,7 +1645,7 @@ section: components
|
|
|
1809
1645
|
<button
|
|
1810
1646
|
class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
|
|
1811
1647
|
type="button"
|
|
1812
|
-
id="toolbar-attribute-value-single-
|
|
1648
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-pagination-options-menu-toggle"
|
|
1813
1649
|
aria-haspopup="listbox"
|
|
1814
1650
|
aria-expanded="false"
|
|
1815
1651
|
>
|
|
@@ -1824,7 +1660,7 @@ section: components
|
|
|
1824
1660
|
<ul
|
|
1825
1661
|
class="pf-v5-c-options-menu__menu"
|
|
1826
1662
|
role="menu"
|
|
1827
|
-
aria-labelledby="toolbar-attribute-value-single-
|
|
1663
|
+
aria-labelledby="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-pagination-options-menu-toggle"
|
|
1828
1664
|
hidden
|
|
1829
1665
|
>
|
|
1830
1666
|
<li role="none">
|
|
@@ -1882,7 +1718,7 @@ section: components
|
|
|
1882
1718
|
</div>
|
|
1883
1719
|
<div
|
|
1884
1720
|
class="pf-v5-c-toolbar__expandable-content pf-m-hidden"
|
|
1885
|
-
id="toolbar-attribute-value-single-
|
|
1721
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-desktop-example-expandable-content"
|
|
1886
1722
|
hidden
|
|
1887
1723
|
></div>
|
|
1888
1724
|
</div>
|
|
@@ -1895,18 +1731,18 @@ section: components
|
|
|
1895
1731
|
```html
|
|
1896
1732
|
<div
|
|
1897
1733
|
class="pf-v5-c-toolbar"
|
|
1898
|
-
id="toolbar-attribute-value-single-
|
|
1734
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example"
|
|
1899
1735
|
>
|
|
1900
1736
|
<div class="pf-v5-c-toolbar__content">
|
|
1901
1737
|
<div class="pf-v5-c-toolbar__content-section">
|
|
1902
1738
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group">
|
|
1903
|
-
<div class="pf-v5-c-toolbar__toggle
|
|
1739
|
+
<div class="pf-v5-c-toolbar__toggle">
|
|
1904
1740
|
<button
|
|
1905
|
-
class="pf-v5-c-
|
|
1741
|
+
class="pf-v5-c-menu-toggle pf-m-plain pf-m-expanded"
|
|
1906
1742
|
type="button"
|
|
1907
|
-
aria-label="Show filters"
|
|
1908
1743
|
aria-expanded="true"
|
|
1909
|
-
aria-
|
|
1744
|
+
aria-label="Show filters"
|
|
1745
|
+
aria-controls="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-expandable-content"
|
|
1910
1746
|
>
|
|
1911
1747
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1912
1748
|
</button>
|
|
@@ -1915,14 +1751,14 @@ section: components
|
|
|
1915
1751
|
<div class="pf-v5-c-toolbar__item pf-m-overflow-menu">
|
|
1916
1752
|
<div
|
|
1917
1753
|
class="pf-v5-c-overflow-menu"
|
|
1918
|
-
id="toolbar-attribute-value-single-
|
|
1754
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-overflow-menu"
|
|
1919
1755
|
>
|
|
1920
1756
|
<div class="pf-v5-c-overflow-menu__control">
|
|
1921
1757
|
<div class="pf-v5-c-dropdown">
|
|
1922
1758
|
<button
|
|
1923
1759
|
class="pf-v5-c-button pf-v5-c-dropdown__toggle pf-m-plain"
|
|
1924
1760
|
type="button"
|
|
1925
|
-
id="toolbar-attribute-value-single-
|
|
1761
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-overflow-menu-dropdown-toggle"
|
|
1926
1762
|
aria-label="Overflow menu"
|
|
1927
1763
|
aria-expanded="false"
|
|
1928
1764
|
>
|
|
@@ -1931,7 +1767,7 @@ section: components
|
|
|
1931
1767
|
<ul
|
|
1932
1768
|
class="pf-v5-c-dropdown__menu"
|
|
1933
1769
|
role="menu"
|
|
1934
|
-
aria-labelledby="toolbar-attribute-value-single-
|
|
1770
|
+
aria-labelledby="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-overflow-menu-dropdown-toggle"
|
|
1935
1771
|
hidden
|
|
1936
1772
|
>
|
|
1937
1773
|
<li role="none">
|
|
@@ -1968,7 +1804,7 @@ section: components
|
|
|
1968
1804
|
<button
|
|
1969
1805
|
class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
|
|
1970
1806
|
type="button"
|
|
1971
|
-
id="toolbar-attribute-value-single-
|
|
1807
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-pagination-options-menu-toggle"
|
|
1972
1808
|
aria-haspopup="listbox"
|
|
1973
1809
|
aria-expanded="false"
|
|
1974
1810
|
>
|
|
@@ -1983,7 +1819,7 @@ section: components
|
|
|
1983
1819
|
<ul
|
|
1984
1820
|
class="pf-v5-c-options-menu__menu"
|
|
1985
1821
|
role="menu"
|
|
1986
|
-
aria-labelledby="toolbar-attribute-value-single-
|
|
1822
|
+
aria-labelledby="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-pagination-options-menu-toggle"
|
|
1987
1823
|
hidden
|
|
1988
1824
|
>
|
|
1989
1825
|
<li role="none">
|
|
@@ -2041,127 +1877,100 @@ section: components
|
|
|
2041
1877
|
</div>
|
|
2042
1878
|
<div
|
|
2043
1879
|
class="pf-v5-c-toolbar__expandable-content pf-m-expanded"
|
|
2044
|
-
id="toolbar-attribute-value-single-
|
|
1880
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-expandable-content"
|
|
2045
1881
|
>
|
|
2046
1882
|
<div class="pf-v5-c-toolbar__group pf-m-filter-group">
|
|
2047
1883
|
<div class="pf-v5-c-toolbar__item">
|
|
2048
|
-
<
|
|
2049
|
-
|
|
2050
|
-
|
|
2051
|
-
|
|
2052
|
-
|
|
2053
|
-
|
|
2054
|
-
<
|
|
2055
|
-
class="
|
|
2056
|
-
|
|
2057
|
-
|
|
2058
|
-
|
|
2059
|
-
|
|
2060
|
-
|
|
2061
|
-
|
|
2062
|
-
|
|
2063
|
-
|
|
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">
|
|
2069
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2070
|
-
</span>
|
|
2071
|
-
</button>
|
|
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>
|
|
1884
|
+
<button
|
|
1885
|
+
class="pf-v5-c-menu-toggle"
|
|
1886
|
+
type="button"
|
|
1887
|
+
aria-expanded="false"
|
|
1888
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-menu-toggle-status"
|
|
1889
|
+
>
|
|
1890
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
1891
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
1892
|
+
</span>
|
|
1893
|
+
<span class="pf-v5-c-menu-toggle__text">Status</span>
|
|
1894
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1895
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
1896
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
1897
|
+
</span>
|
|
1898
|
+
</span>
|
|
1899
|
+
</button>
|
|
2108
1900
|
</div>
|
|
2109
1901
|
<div class="pf-v5-c-toolbar__item">
|
|
2110
|
-
<
|
|
2111
|
-
|
|
2112
|
-
|
|
2113
|
-
|
|
2114
|
-
|
|
2115
|
-
|
|
2116
|
-
<
|
|
2117
|
-
|
|
2118
|
-
|
|
2119
|
-
|
|
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">
|
|
2128
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
1902
|
+
<button
|
|
1903
|
+
class="pf-v5-c-menu-toggle pf-m-expanded"
|
|
1904
|
+
type="button"
|
|
1905
|
+
aria-expanded="true"
|
|
1906
|
+
id="toolbar-attribute-value-single-menu-toggle-filter-mobile-example-menu-toggle-stopped"
|
|
1907
|
+
>
|
|
1908
|
+
<span class="pf-v5-c-menu-toggle__text">Stopped</span>
|
|
1909
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
1910
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
1911
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
2129
1912
|
</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
|
-
|
|
1913
|
+
</span>
|
|
1914
|
+
</button>
|
|
1915
|
+
<div class="pf-v5-c-panel">
|
|
1916
|
+
<div class="pf-v5-c-menu" width="175px">
|
|
1917
|
+
<div class="pf-v5-c-menu__content">
|
|
1918
|
+
<section class="pf-v5-c-menu__group">
|
|
1919
|
+
<ul class="pf-v5-c-menu__list" role="menu">
|
|
1920
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1921
|
+
<button
|
|
1922
|
+
class="pf-v5-c-menu__item"
|
|
1923
|
+
type="button"
|
|
1924
|
+
role="menuitem"
|
|
1925
|
+
>
|
|
1926
|
+
<span class="pf-v5-c-menu__item-text">Running</span>
|
|
1927
|
+
</button>
|
|
1928
|
+
</li>
|
|
1929
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1930
|
+
<button
|
|
1931
|
+
class="pf-v5-c-menu__item pf-m-selected"
|
|
1932
|
+
type="button"
|
|
1933
|
+
role="menuitem"
|
|
1934
|
+
>
|
|
1935
|
+
<span class="pf-v5-c-menu__item-main">
|
|
1936
|
+
<span class="pf-v5-c-menu__item-text">Stopped</span>
|
|
1937
|
+
<span class="pf-v5-c-menu__item-select-icon">
|
|
1938
|
+
<i class="fas fa-check" aria-hidden="true"></i>
|
|
1939
|
+
</span>
|
|
1940
|
+
</span>
|
|
1941
|
+
</button>
|
|
1942
|
+
</li>
|
|
1943
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1944
|
+
<button
|
|
1945
|
+
class="pf-v5-c-menu__item"
|
|
1946
|
+
type="button"
|
|
1947
|
+
role="menuitem"
|
|
1948
|
+
>
|
|
1949
|
+
<span class="pf-v5-c-menu__item-text">Down</span>
|
|
1950
|
+
</button>
|
|
1951
|
+
</li>
|
|
1952
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1953
|
+
<button
|
|
1954
|
+
class="pf-v5-c-menu__item"
|
|
1955
|
+
type="button"
|
|
1956
|
+
role="menuitem"
|
|
1957
|
+
>
|
|
1958
|
+
<span class="pf-v5-c-menu__item-text">Degraded</span>
|
|
1959
|
+
</button>
|
|
1960
|
+
</li>
|
|
1961
|
+
<li class="pf-v5-c-menu__list-item" role="group">
|
|
1962
|
+
<button
|
|
1963
|
+
class="pf-v5-c-menu__item"
|
|
1964
|
+
type="button"
|
|
1965
|
+
role="menuitem"
|
|
1966
|
+
>
|
|
1967
|
+
<span class="pf-v5-c-menu__item-text">Needs maintenance</span>
|
|
1968
|
+
</button>
|
|
1969
|
+
</li>
|
|
1970
|
+
</ul>
|
|
1971
|
+
</section>
|
|
1972
|
+
</div>
|
|
1973
|
+
</div>
|
|
2165
1974
|
</div>
|
|
2166
1975
|
</div>
|
|
2167
1976
|
</div>
|
|
@@ -2171,194 +1980,188 @@ section: components
|
|
|
2171
1980
|
|
|
2172
1981
|
```
|
|
2173
1982
|
|
|
2174
|
-
### Toolbar attribute value checkbox
|
|
1983
|
+
### Toolbar attribute value checkbox menu toggle filter on desktop
|
|
2175
1984
|
|
|
2176
1985
|
```html
|
|
2177
1986
|
<div
|
|
2178
1987
|
class="pf-v5-c-toolbar"
|
|
2179
|
-
id="toolbar-attribute-value-checkbox-
|
|
1988
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example"
|
|
2180
1989
|
>
|
|
2181
1990
|
<div class="pf-v5-c-toolbar__content">
|
|
2182
1991
|
<div class="pf-v5-c-toolbar__content-section">
|
|
2183
1992
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group pf-m-show">
|
|
2184
1993
|
<div class="pf-v5-c-toolbar__toggle">
|
|
2185
1994
|
<button
|
|
2186
|
-
class="pf-v5-c-
|
|
1995
|
+
class="pf-v5-c-menu-toggle pf-m-plain"
|
|
2187
1996
|
type="button"
|
|
2188
|
-
aria-label="Show filters"
|
|
2189
1997
|
aria-expanded="false"
|
|
2190
|
-
aria-
|
|
1998
|
+
aria-label="Show filters"
|
|
1999
|
+
aria-controls="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-expandable-content"
|
|
2191
2000
|
>
|
|
2192
2001
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2193
2002
|
</button>
|
|
2194
2003
|
</div>
|
|
2195
2004
|
<div class="pf-v5-c-toolbar__group pf-m-filter-group">
|
|
2196
2005
|
<div class="pf-v5-c-toolbar__item">
|
|
2197
|
-
<
|
|
2198
|
-
|
|
2199
|
-
|
|
2200
|
-
|
|
2201
|
-
|
|
2202
|
-
|
|
2203
|
-
<
|
|
2204
|
-
class="
|
|
2205
|
-
|
|
2206
|
-
|
|
2207
|
-
|
|
2208
|
-
|
|
2209
|
-
|
|
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">
|
|
2218
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2006
|
+
<button
|
|
2007
|
+
class="pf-v5-c-menu-toggle"
|
|
2008
|
+
type="button"
|
|
2009
|
+
aria-expanded="false"
|
|
2010
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-menu-toggle-status"
|
|
2011
|
+
>
|
|
2012
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
2013
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2014
|
+
</span>
|
|
2015
|
+
<span class="pf-v5-c-menu-toggle__text">Status</span>
|
|
2016
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
2017
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
2018
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
2219
2019
|
</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>
|
|
2020
|
+
</span>
|
|
2021
|
+
</button>
|
|
2264
2022
|
</div>
|
|
2265
2023
|
<div class="pf-v5-c-toolbar__item">
|
|
2266
|
-
<
|
|
2267
|
-
|
|
2268
|
-
|
|
2269
|
-
|
|
2270
|
-
|
|
2271
|
-
|
|
2272
|
-
<
|
|
2273
|
-
|
|
2274
|
-
|
|
2275
|
-
|
|
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">
|
|
2284
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2024
|
+
<button
|
|
2025
|
+
class="pf-v5-c-menu-toggle pf-m-expanded"
|
|
2026
|
+
type="button"
|
|
2027
|
+
aria-expanded="true"
|
|
2028
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-menu-toggle-filter-by-status"
|
|
2029
|
+
>
|
|
2030
|
+
<span class="pf-v5-c-menu-toggle__text">Filter by status</span>
|
|
2031
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
2032
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
2033
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
2285
2034
|
</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
|
-
|
|
2035
|
+
</span>
|
|
2036
|
+
</button>
|
|
2037
|
+
<div class="pf-v5-c-panel">
|
|
2038
|
+
<div class="pf-v5-c-menu">
|
|
2039
|
+
<div class="pf-v5-c-menu__content">
|
|
2040
|
+
<ul class="pf-v5-c-menu__list" role="menu">
|
|
2041
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2042
|
+
<label
|
|
2043
|
+
class="pf-v5-c-menu__item"
|
|
2044
|
+
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"
|
|
2045
|
+
>
|
|
2046
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2047
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2048
|
+
<div
|
|
2049
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2050
|
+
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"
|
|
2051
|
+
>
|
|
2052
|
+
<input
|
|
2053
|
+
class="pf-v5-c-check__input"
|
|
2054
|
+
type="checkbox"
|
|
2055
|
+
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"
|
|
2056
|
+
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"
|
|
2057
|
+
aria-label="Standalone check"
|
|
2058
|
+
/>
|
|
2059
|
+
</div>
|
|
2060
|
+
</span>
|
|
2061
|
+
<span class="pf-v5-c-menu__item-text">Active</span>
|
|
2062
|
+
</span>
|
|
2063
|
+
</label>
|
|
2064
|
+
</li>
|
|
2065
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2066
|
+
<label
|
|
2067
|
+
class="pf-v5-c-menu__item"
|
|
2068
|
+
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"
|
|
2069
|
+
>
|
|
2070
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2071
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2072
|
+
<div
|
|
2073
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2074
|
+
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"
|
|
2075
|
+
>
|
|
2076
|
+
<input
|
|
2077
|
+
class="pf-v5-c-check__input"
|
|
2078
|
+
type="checkbox"
|
|
2079
|
+
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"
|
|
2080
|
+
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"
|
|
2081
|
+
aria-label="Standalone check"
|
|
2082
|
+
checked
|
|
2083
|
+
/>
|
|
2084
|
+
</div>
|
|
2085
|
+
</span>
|
|
2086
|
+
<span class="pf-v5-c-menu__item-text">Cancelled</span>
|
|
2087
|
+
</span>
|
|
2088
|
+
</label>
|
|
2089
|
+
</li>
|
|
2090
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2091
|
+
<label
|
|
2092
|
+
class="pf-v5-c-menu__item"
|
|
2093
|
+
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"
|
|
2094
|
+
>
|
|
2095
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2096
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2097
|
+
<div
|
|
2098
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2099
|
+
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"
|
|
2100
|
+
>
|
|
2101
|
+
<input
|
|
2102
|
+
class="pf-v5-c-check__input"
|
|
2103
|
+
type="checkbox"
|
|
2104
|
+
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"
|
|
2105
|
+
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"
|
|
2106
|
+
aria-label="Standalone check"
|
|
2107
|
+
checked
|
|
2108
|
+
/>
|
|
2109
|
+
</div>
|
|
2110
|
+
</span>
|
|
2111
|
+
<span class="pf-v5-c-menu__item-text">Paused</span>
|
|
2112
|
+
</span>
|
|
2113
|
+
</label>
|
|
2114
|
+
</li>
|
|
2115
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2116
|
+
<label
|
|
2117
|
+
class="pf-v5-c-menu__item"
|
|
2118
|
+
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"
|
|
2119
|
+
>
|
|
2120
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2121
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2122
|
+
<div
|
|
2123
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2124
|
+
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"
|
|
2125
|
+
>
|
|
2126
|
+
<input
|
|
2127
|
+
class="pf-v5-c-check__input"
|
|
2128
|
+
type="checkbox"
|
|
2129
|
+
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"
|
|
2130
|
+
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"
|
|
2131
|
+
aria-label="Standalone check"
|
|
2132
|
+
/>
|
|
2133
|
+
</div>
|
|
2134
|
+
</span>
|
|
2135
|
+
<span class="pf-v5-c-menu__item-text">Warning</span>
|
|
2136
|
+
</span>
|
|
2137
|
+
</label>
|
|
2138
|
+
</li>
|
|
2139
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2140
|
+
<label
|
|
2141
|
+
class="pf-v5-c-menu__item"
|
|
2142
|
+
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"
|
|
2143
|
+
>
|
|
2144
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2145
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2146
|
+
<div
|
|
2147
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2148
|
+
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"
|
|
2149
|
+
>
|
|
2150
|
+
<input
|
|
2151
|
+
class="pf-v5-c-check__input"
|
|
2152
|
+
type="checkbox"
|
|
2153
|
+
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"
|
|
2154
|
+
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"
|
|
2155
|
+
aria-label="Standalone check"
|
|
2156
|
+
/>
|
|
2157
|
+
</div>
|
|
2158
|
+
</span>
|
|
2159
|
+
<span class="pf-v5-c-menu__item-text">Restarted</span>
|
|
2160
|
+
</span>
|
|
2161
|
+
</label>
|
|
2162
|
+
</li>
|
|
2163
|
+
</ul>
|
|
2164
|
+
</div>
|
|
2362
2165
|
</div>
|
|
2363
2166
|
</div>
|
|
2364
2167
|
</div>
|
|
@@ -2367,7 +2170,7 @@ section: components
|
|
|
2367
2170
|
<div class="pf-v5-c-toolbar__item pf-m-overflow-menu">
|
|
2368
2171
|
<div
|
|
2369
2172
|
class="pf-v5-c-overflow-menu"
|
|
2370
|
-
id="toolbar-attribute-value-checkbox-
|
|
2173
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-overflow-menu"
|
|
2371
2174
|
>
|
|
2372
2175
|
<div class="pf-v5-c-overflow-menu__content">
|
|
2373
2176
|
<div class="pf-v5-c-overflow-menu__group pf-m-button-group">
|
|
@@ -2391,7 +2194,7 @@ section: components
|
|
|
2391
2194
|
<button
|
|
2392
2195
|
class="pf-v5-c-button pf-v5-c-dropdown__toggle pf-m-plain"
|
|
2393
2196
|
type="button"
|
|
2394
|
-
id="toolbar-attribute-value-checkbox-
|
|
2197
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-overflow-menu-dropdown-toggle"
|
|
2395
2198
|
aria-label="Overflow menu"
|
|
2396
2199
|
aria-expanded="false"
|
|
2397
2200
|
>
|
|
@@ -2400,7 +2203,7 @@ section: components
|
|
|
2400
2203
|
<ul
|
|
2401
2204
|
class="pf-v5-c-dropdown__menu"
|
|
2402
2205
|
role="menu"
|
|
2403
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2206
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-overflow-menu-dropdown-toggle"
|
|
2404
2207
|
hidden
|
|
2405
2208
|
>
|
|
2406
2209
|
<li role="none">
|
|
@@ -2425,7 +2228,7 @@ section: components
|
|
|
2425
2228
|
<button
|
|
2426
2229
|
class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
|
|
2427
2230
|
type="button"
|
|
2428
|
-
id="toolbar-attribute-value-checkbox-
|
|
2231
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-pagination-options-menu-toggle"
|
|
2429
2232
|
aria-haspopup="listbox"
|
|
2430
2233
|
aria-expanded="false"
|
|
2431
2234
|
>
|
|
@@ -2440,7 +2243,7 @@ section: components
|
|
|
2440
2243
|
<ul
|
|
2441
2244
|
class="pf-v5-c-options-menu__menu"
|
|
2442
2245
|
role="menu"
|
|
2443
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2246
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-pagination-options-menu-toggle"
|
|
2444
2247
|
hidden
|
|
2445
2248
|
>
|
|
2446
2249
|
<li role="none">
|
|
@@ -2498,7 +2301,7 @@ section: components
|
|
|
2498
2301
|
</div>
|
|
2499
2302
|
<div
|
|
2500
2303
|
class="pf-v5-c-toolbar__expandable-content pf-m-hidden"
|
|
2501
|
-
id="toolbar-attribute-value-checkbox-
|
|
2304
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-expandable-content"
|
|
2502
2305
|
hidden
|
|
2503
2306
|
></div>
|
|
2504
2307
|
</div>
|
|
@@ -2508,28 +2311,28 @@ section: components
|
|
|
2508
2311
|
<div class="pf-v5-c-chip-group__main">
|
|
2509
2312
|
<span
|
|
2510
2313
|
class="pf-v5-c-chip-group__label"
|
|
2511
|
-
id="toolbar-attribute-value-checkbox-
|
|
2314
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-group-chip-group-label"
|
|
2512
2315
|
>Status</span>
|
|
2513
2316
|
<ul
|
|
2514
2317
|
class="pf-v5-c-chip-group__list"
|
|
2515
2318
|
role="list"
|
|
2516
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2319
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-group-chip-group-label"
|
|
2517
2320
|
>
|
|
2518
2321
|
<li class="pf-v5-c-chip-group__list-item">
|
|
2519
2322
|
<div class="pf-v5-c-chip">
|
|
2520
2323
|
<span class="pf-v5-c-chip__content">
|
|
2521
2324
|
<span
|
|
2522
2325
|
class="pf-v5-c-chip__text"
|
|
2523
|
-
id="toolbar-attribute-value-checkbox-
|
|
2326
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-group-chip-one"
|
|
2524
2327
|
>Canceled</span>
|
|
2525
2328
|
</span>
|
|
2526
2329
|
<span class="pf-v5-c-chip__actions">
|
|
2527
2330
|
<button
|
|
2528
2331
|
class="pf-v5-c-button pf-m-plain"
|
|
2529
2332
|
type="button"
|
|
2530
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2333
|
+
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
2334
|
aria-label="Remove"
|
|
2532
|
-
id="toolbar-attribute-value-checkbox-
|
|
2335
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupremove-chip-one"
|
|
2533
2336
|
>
|
|
2534
2337
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2535
2338
|
</button>
|
|
@@ -2541,16 +2344,16 @@ section: components
|
|
|
2541
2344
|
<span class="pf-v5-c-chip__content">
|
|
2542
2345
|
<span
|
|
2543
2346
|
class="pf-v5-c-chip__text"
|
|
2544
|
-
id="toolbar-attribute-value-checkbox-
|
|
2347
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupchip-two"
|
|
2545
2348
|
>Paused</span>
|
|
2546
2349
|
</span>
|
|
2547
2350
|
<span class="pf-v5-c-chip__actions">
|
|
2548
2351
|
<button
|
|
2549
2352
|
class="pf-v5-c-button pf-m-plain"
|
|
2550
2353
|
type="button"
|
|
2551
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2354
|
+
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
2355
|
aria-label="Remove"
|
|
2553
|
-
id="toolbar-attribute-value-checkbox-
|
|
2356
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupremove-chip-two"
|
|
2554
2357
|
>
|
|
2555
2358
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2556
2359
|
</button>
|
|
@@ -2562,16 +2365,16 @@ section: components
|
|
|
2562
2365
|
<span class="pf-v5-c-chip__content">
|
|
2563
2366
|
<span
|
|
2564
2367
|
class="pf-v5-c-chip__text"
|
|
2565
|
-
id="toolbar-attribute-value-checkbox-
|
|
2368
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupchip-three"
|
|
2566
2369
|
>Restarted</span>
|
|
2567
2370
|
</span>
|
|
2568
2371
|
<span class="pf-v5-c-chip__actions">
|
|
2569
2372
|
<button
|
|
2570
2373
|
class="pf-v5-c-button pf-m-plain"
|
|
2571
2374
|
type="button"
|
|
2572
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2375
|
+
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
2376
|
aria-label="Remove"
|
|
2574
|
-
id="toolbar-attribute-value-checkbox-
|
|
2377
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-chip-groupremove-chip-three"
|
|
2575
2378
|
>
|
|
2576
2379
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2577
2380
|
</button>
|
|
@@ -2593,23 +2396,23 @@ section: components
|
|
|
2593
2396
|
|
|
2594
2397
|
```
|
|
2595
2398
|
|
|
2596
|
-
### Toolbar attribute value checkbox
|
|
2399
|
+
### Toolbar attribute value checkbox menu toggle filter on mobile
|
|
2597
2400
|
|
|
2598
2401
|
```html
|
|
2599
2402
|
<div
|
|
2600
2403
|
class="pf-v5-c-toolbar"
|
|
2601
|
-
id="toolbar-attribute-value-checkbox-
|
|
2404
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example"
|
|
2602
2405
|
>
|
|
2603
2406
|
<div class="pf-v5-c-toolbar__content">
|
|
2604
2407
|
<div class="pf-v5-c-toolbar__content-section">
|
|
2605
2408
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group">
|
|
2606
|
-
<div class="pf-v5-c-toolbar__toggle
|
|
2409
|
+
<div class="pf-v5-c-toolbar__toggle">
|
|
2607
2410
|
<button
|
|
2608
|
-
class="pf-v5-c-
|
|
2411
|
+
class="pf-v5-c-menu-toggle pf-m-plain pf-m-expanded"
|
|
2609
2412
|
type="button"
|
|
2610
|
-
aria-label="Show filters"
|
|
2611
2413
|
aria-expanded="true"
|
|
2612
|
-
aria-
|
|
2414
|
+
aria-label="Show filters"
|
|
2415
|
+
aria-controls="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-expandable-content"
|
|
2613
2416
|
>
|
|
2614
2417
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2615
2418
|
</button>
|
|
@@ -2618,14 +2421,14 @@ section: components
|
|
|
2618
2421
|
<div class="pf-v5-c-toolbar__item pf-m-overflow-menu">
|
|
2619
2422
|
<div
|
|
2620
2423
|
class="pf-v5-c-overflow-menu"
|
|
2621
|
-
id="toolbar-attribute-value-checkbox-
|
|
2424
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-overflow-menu"
|
|
2622
2425
|
>
|
|
2623
2426
|
<div class="pf-v5-c-overflow-menu__control">
|
|
2624
2427
|
<div class="pf-v5-c-dropdown">
|
|
2625
2428
|
<button
|
|
2626
2429
|
class="pf-v5-c-button pf-v5-c-dropdown__toggle pf-m-plain"
|
|
2627
2430
|
type="button"
|
|
2628
|
-
id="toolbar-attribute-value-checkbox-
|
|
2431
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-overflow-menu-dropdown-toggle"
|
|
2629
2432
|
aria-label="Overflow menu"
|
|
2630
2433
|
aria-expanded="false"
|
|
2631
2434
|
>
|
|
@@ -2634,7 +2437,7 @@ section: components
|
|
|
2634
2437
|
<ul
|
|
2635
2438
|
class="pf-v5-c-dropdown__menu"
|
|
2636
2439
|
role="menu"
|
|
2637
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2440
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-overflow-menu-dropdown-toggle"
|
|
2638
2441
|
hidden
|
|
2639
2442
|
>
|
|
2640
2443
|
<li role="none">
|
|
@@ -2671,7 +2474,7 @@ section: components
|
|
|
2671
2474
|
<button
|
|
2672
2475
|
class="pf-v5-c-options-menu__toggle pf-m-text pf-m-plain"
|
|
2673
2476
|
type="button"
|
|
2674
|
-
id="toolbar-attribute-value-checkbox-
|
|
2477
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-pagination-options-menu-toggle"
|
|
2675
2478
|
aria-haspopup="listbox"
|
|
2676
2479
|
aria-expanded="false"
|
|
2677
2480
|
>
|
|
@@ -2686,7 +2489,7 @@ section: components
|
|
|
2686
2489
|
<ul
|
|
2687
2490
|
class="pf-v5-c-options-menu__menu"
|
|
2688
2491
|
role="menu"
|
|
2689
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2492
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-pagination-options-menu-toggle"
|
|
2690
2493
|
hidden
|
|
2691
2494
|
>
|
|
2692
2495
|
<li role="none">
|
|
@@ -2744,168 +2547,169 @@ section: components
|
|
|
2744
2547
|
</div>
|
|
2745
2548
|
<div
|
|
2746
2549
|
class="pf-v5-c-toolbar__expandable-content pf-m-expanded"
|
|
2747
|
-
id="toolbar-attribute-value-checkbox-
|
|
2550
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-expandable-content"
|
|
2748
2551
|
>
|
|
2749
2552
|
<div class="pf-v5-c-toolbar__group pf-m-filter-group">
|
|
2750
2553
|
<div class="pf-v5-c-toolbar__item">
|
|
2751
|
-
<
|
|
2752
|
-
|
|
2753
|
-
|
|
2754
|
-
|
|
2755
|
-
|
|
2756
|
-
|
|
2757
|
-
<
|
|
2758
|
-
class="
|
|
2759
|
-
|
|
2760
|
-
|
|
2761
|
-
|
|
2762
|
-
|
|
2763
|
-
|
|
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">
|
|
2772
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2554
|
+
<button
|
|
2555
|
+
class="pf-v5-c-menu-toggle"
|
|
2556
|
+
type="button"
|
|
2557
|
+
aria-expanded="false"
|
|
2558
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-menu-toggle-status"
|
|
2559
|
+
>
|
|
2560
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
2561
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
2562
|
+
</span>
|
|
2563
|
+
<span class="pf-v5-c-menu-toggle__text">Status</span>
|
|
2564
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
2565
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
2566
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
2773
2567
|
</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>
|
|
2568
|
+
</span>
|
|
2569
|
+
</button>
|
|
2811
2570
|
</div>
|
|
2812
2571
|
<div class="pf-v5-c-toolbar__item">
|
|
2813
|
-
<
|
|
2814
|
-
|
|
2815
|
-
|
|
2816
|
-
|
|
2817
|
-
|
|
2818
|
-
|
|
2819
|
-
<
|
|
2820
|
-
|
|
2821
|
-
|
|
2822
|
-
|
|
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">
|
|
2831
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
2572
|
+
<button
|
|
2573
|
+
class="pf-v5-c-menu-toggle pf-m-expanded"
|
|
2574
|
+
type="button"
|
|
2575
|
+
aria-expanded="true"
|
|
2576
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-menu-toggle-filter-by-status"
|
|
2577
|
+
>
|
|
2578
|
+
<span class="pf-v5-c-menu-toggle__text">Filter by status</span>
|
|
2579
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
2580
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
2581
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
2832
2582
|
</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
|
-
|
|
2583
|
+
</span>
|
|
2584
|
+
</button>
|
|
2585
|
+
<div class="pf-v5-c-panel">
|
|
2586
|
+
<div class="pf-v5-c-menu">
|
|
2587
|
+
<div class="pf-v5-c-menu__content">
|
|
2588
|
+
<ul class="pf-v5-c-menu__list" role="menu">
|
|
2589
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2590
|
+
<label
|
|
2591
|
+
class="pf-v5-c-menu__item"
|
|
2592
|
+
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"
|
|
2593
|
+
>
|
|
2594
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2595
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2596
|
+
<div
|
|
2597
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2598
|
+
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"
|
|
2599
|
+
>
|
|
2600
|
+
<input
|
|
2601
|
+
class="pf-v5-c-check__input"
|
|
2602
|
+
type="checkbox"
|
|
2603
|
+
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"
|
|
2604
|
+
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"
|
|
2605
|
+
aria-label="Standalone check"
|
|
2606
|
+
/>
|
|
2607
|
+
</div>
|
|
2608
|
+
</span>
|
|
2609
|
+
<span class="pf-v5-c-menu__item-text">Active</span>
|
|
2610
|
+
</span>
|
|
2611
|
+
</label>
|
|
2612
|
+
</li>
|
|
2613
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2614
|
+
<label
|
|
2615
|
+
class="pf-v5-c-menu__item"
|
|
2616
|
+
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"
|
|
2617
|
+
>
|
|
2618
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2619
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2620
|
+
<div
|
|
2621
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2622
|
+
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"
|
|
2623
|
+
>
|
|
2624
|
+
<input
|
|
2625
|
+
class="pf-v5-c-check__input"
|
|
2626
|
+
type="checkbox"
|
|
2627
|
+
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"
|
|
2628
|
+
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"
|
|
2629
|
+
aria-label="Standalone check"
|
|
2630
|
+
checked
|
|
2631
|
+
/>
|
|
2632
|
+
</div>
|
|
2633
|
+
</span>
|
|
2634
|
+
<span class="pf-v5-c-menu__item-text">Cancelled</span>
|
|
2635
|
+
</span>
|
|
2636
|
+
</label>
|
|
2637
|
+
</li>
|
|
2638
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2639
|
+
<label
|
|
2640
|
+
class="pf-v5-c-menu__item"
|
|
2641
|
+
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"
|
|
2642
|
+
>
|
|
2643
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2644
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2645
|
+
<div
|
|
2646
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2647
|
+
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"
|
|
2648
|
+
>
|
|
2649
|
+
<input
|
|
2650
|
+
class="pf-v5-c-check__input"
|
|
2651
|
+
type="checkbox"
|
|
2652
|
+
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"
|
|
2653
|
+
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"
|
|
2654
|
+
aria-label="Standalone check"
|
|
2655
|
+
checked
|
|
2656
|
+
/>
|
|
2657
|
+
</div>
|
|
2658
|
+
</span>
|
|
2659
|
+
<span class="pf-v5-c-menu__item-text">Paused</span>
|
|
2660
|
+
</span>
|
|
2661
|
+
</label>
|
|
2662
|
+
</li>
|
|
2663
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2664
|
+
<label
|
|
2665
|
+
class="pf-v5-c-menu__item"
|
|
2666
|
+
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"
|
|
2667
|
+
>
|
|
2668
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2669
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2670
|
+
<div
|
|
2671
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2672
|
+
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"
|
|
2673
|
+
>
|
|
2674
|
+
<input
|
|
2675
|
+
class="pf-v5-c-check__input"
|
|
2676
|
+
type="checkbox"
|
|
2677
|
+
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"
|
|
2678
|
+
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"
|
|
2679
|
+
aria-label="Standalone check"
|
|
2680
|
+
/>
|
|
2681
|
+
</div>
|
|
2682
|
+
</span>
|
|
2683
|
+
<span class="pf-v5-c-menu__item-text">Warning</span>
|
|
2684
|
+
</span>
|
|
2685
|
+
</label>
|
|
2686
|
+
</li>
|
|
2687
|
+
<li class="pf-v5-c-menu__list-item" role="menuitem">
|
|
2688
|
+
<label
|
|
2689
|
+
class="pf-v5-c-menu__item"
|
|
2690
|
+
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"
|
|
2691
|
+
>
|
|
2692
|
+
<span class="pf-v5-c-menu__item-main">
|
|
2693
|
+
<span class="pf-v5-c-menu__item-check">
|
|
2694
|
+
<div
|
|
2695
|
+
class="pf-v5-c-check pf-m-standalone"
|
|
2696
|
+
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"
|
|
2697
|
+
>
|
|
2698
|
+
<input
|
|
2699
|
+
class="pf-v5-c-check__input"
|
|
2700
|
+
type="checkbox"
|
|
2701
|
+
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"
|
|
2702
|
+
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"
|
|
2703
|
+
aria-label="Standalone check"
|
|
2704
|
+
/>
|
|
2705
|
+
</div>
|
|
2706
|
+
</span>
|
|
2707
|
+
<span class="pf-v5-c-menu__item-text">Restarted</span>
|
|
2708
|
+
</span>
|
|
2709
|
+
</label>
|
|
2710
|
+
</li>
|
|
2711
|
+
</ul>
|
|
2712
|
+
</div>
|
|
2909
2713
|
</div>
|
|
2910
2714
|
</div>
|
|
2911
2715
|
</div>
|
|
@@ -2914,28 +2718,28 @@ section: components
|
|
|
2914
2718
|
<div class="pf-v5-c-chip-group__main">
|
|
2915
2719
|
<span
|
|
2916
2720
|
class="pf-v5-c-chip-group__label"
|
|
2917
|
-
id="toolbar-attribute-value-checkbox-
|
|
2721
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-group-chip-group-label"
|
|
2918
2722
|
>Status</span>
|
|
2919
2723
|
<ul
|
|
2920
2724
|
class="pf-v5-c-chip-group__list"
|
|
2921
2725
|
role="list"
|
|
2922
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2726
|
+
aria-labelledby="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-group-chip-group-label"
|
|
2923
2727
|
>
|
|
2924
2728
|
<li class="pf-v5-c-chip-group__list-item">
|
|
2925
2729
|
<div class="pf-v5-c-chip">
|
|
2926
2730
|
<span class="pf-v5-c-chip__content">
|
|
2927
2731
|
<span
|
|
2928
2732
|
class="pf-v5-c-chip__text"
|
|
2929
|
-
id="toolbar-attribute-value-checkbox-
|
|
2733
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupchip-one"
|
|
2930
2734
|
>Canceled</span>
|
|
2931
2735
|
</span>
|
|
2932
2736
|
<span class="pf-v5-c-chip__actions">
|
|
2933
2737
|
<button
|
|
2934
2738
|
class="pf-v5-c-button pf-m-plain"
|
|
2935
2739
|
type="button"
|
|
2936
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2740
|
+
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
2741
|
aria-label="Remove"
|
|
2938
|
-
id="toolbar-attribute-value-checkbox-
|
|
2742
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupremove-chip-one"
|
|
2939
2743
|
>
|
|
2940
2744
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2941
2745
|
</button>
|
|
@@ -2947,16 +2751,16 @@ section: components
|
|
|
2947
2751
|
<span class="pf-v5-c-chip__content">
|
|
2948
2752
|
<span
|
|
2949
2753
|
class="pf-v5-c-chip__text"
|
|
2950
|
-
id="toolbar-attribute-value-checkbox-
|
|
2754
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupchip-two"
|
|
2951
2755
|
>Paused</span>
|
|
2952
2756
|
</span>
|
|
2953
2757
|
<span class="pf-v5-c-chip__actions">
|
|
2954
2758
|
<button
|
|
2955
2759
|
class="pf-v5-c-button pf-m-plain"
|
|
2956
2760
|
type="button"
|
|
2957
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2761
|
+
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
2762
|
aria-label="Remove"
|
|
2959
|
-
id="toolbar-attribute-value-checkbox-
|
|
2763
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupremove-chip-two"
|
|
2960
2764
|
>
|
|
2961
2765
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2962
2766
|
</button>
|
|
@@ -2968,16 +2772,16 @@ section: components
|
|
|
2968
2772
|
<span class="pf-v5-c-chip__content">
|
|
2969
2773
|
<span
|
|
2970
2774
|
class="pf-v5-c-chip__text"
|
|
2971
|
-
id="toolbar-attribute-value-checkbox-
|
|
2775
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupchip-three"
|
|
2972
2776
|
>Restarted</span>
|
|
2973
2777
|
</span>
|
|
2974
2778
|
<span class="pf-v5-c-chip__actions">
|
|
2975
2779
|
<button
|
|
2976
2780
|
class="pf-v5-c-button pf-m-plain"
|
|
2977
2781
|
type="button"
|
|
2978
|
-
aria-labelledby="toolbar-attribute-value-checkbox-
|
|
2782
|
+
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
2783
|
aria-label="Remove"
|
|
2980
|
-
id="toolbar-attribute-value-checkbox-
|
|
2784
|
+
id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-chip-groupremove-chip-three"
|
|
2981
2785
|
>
|
|
2982
2786
|
<i class="fas fa-times" aria-hidden="true"></i>
|
|
2983
2787
|
</button>
|
|
@@ -3025,13 +2829,88 @@ section: components
|
|
|
3025
2829
|
</button>
|
|
3026
2830
|
</span>
|
|
3027
2831
|
<div class="pf-v5-c-masthead__main">
|
|
3028
|
-
<a
|
|
3029
|
-
|
|
3030
|
-
|
|
3031
|
-
|
|
3032
|
-
|
|
3033
|
-
|
|
3034
|
-
|
|
2832
|
+
<a
|
|
2833
|
+
class="pf-v5-c-masthead__brand"
|
|
2834
|
+
href="#"
|
|
2835
|
+
style="--pf-v5-c-brand--Height: 36px;"
|
|
2836
|
+
>
|
|
2837
|
+
<svg height="36px" viewBox="0 0 679 158" role="img">
|
|
2838
|
+
<title>Patternfly logo</title>
|
|
2839
|
+
<defs>
|
|
2840
|
+
<linearGradient
|
|
2841
|
+
x1="68%"
|
|
2842
|
+
y1="2.25860997e-13%"
|
|
2843
|
+
x2="32%"
|
|
2844
|
+
y2="100%"
|
|
2845
|
+
id="linearGradient-1"
|
|
2846
|
+
>
|
|
2847
|
+
<stop stop-color="#2B9AF3" offset="0%" />
|
|
2848
|
+
<stop
|
|
2849
|
+
stop-color="#73BCF7"
|
|
2850
|
+
stop-opacity="0.502212631"
|
|
2851
|
+
offset="100%"
|
|
2852
|
+
/>
|
|
2853
|
+
</linearGradient>
|
|
2854
|
+
</defs>
|
|
2855
|
+
<g
|
|
2856
|
+
id="PF-HorizontalLogo-Color"
|
|
2857
|
+
stroke="none"
|
|
2858
|
+
stroke-width="1"
|
|
2859
|
+
fill="none"
|
|
2860
|
+
fill-rule="evenodd"
|
|
2861
|
+
>
|
|
2862
|
+
<g
|
|
2863
|
+
transform="translate(206.000000, 45.750000)"
|
|
2864
|
+
fill="var(--pf-t--global--text--color--regular)"
|
|
2865
|
+
fill-rule="nonzero"
|
|
2866
|
+
>
|
|
2867
|
+
<path
|
|
2868
|
+
d="M0,65.25 L0,2.25 L33.21,2.25 C37.35,2.25 41.025,3.135 44.235,4.905 C47.445,6.675 49.98,9.09 51.84,12.15 C53.7,15.21 54.63,18.72 54.63,22.68 C54.63,26.46 53.7,29.865 51.84,32.895 C49.98,35.925 47.43,38.31 44.19,40.05 C40.95,41.79 37.29,42.66 33.21,42.66 L15.48,42.66 L15.48,65.25 L0,65.25 Z M15.48,29.88 L31.41,29.88 C33.69,29.88 35.52,29.22 36.9,27.9 C38.28,26.58 38.97,24.87 38.97,22.77 C38.97,20.61 38.28,18.855 36.9,17.505 C35.52,16.155 33.69,15.48 31.41,15.48 L15.48,15.48 L15.48,29.88 Z"
|
|
2869
|
+
/>
|
|
2870
|
+
<path
|
|
2871
|
+
d="M77.04,66.06 C73.68,66.06 70.695,65.43 68.085,64.17 C65.475,62.91 63.435,61.17 61.965,58.95 C60.495,56.73 59.76,54.18 59.76,51.3 C59.76,46.74 61.485,43.215 64.935,40.725 C68.385,38.235 73.2,36.99 79.38,36.99 C83.1,36.99 86.7,37.44 90.18,38.34 L90.18,36 C90.18,31.26 87.15,28.89 81.09,28.89 C77.49,28.89 72.69,30.15 66.69,32.67 L61.47,21.96 C69.15,18.48 76.56,16.74 83.7,16.74 C90.3,16.74 95.43,18.315 99.09,21.465 C102.75,24.615 104.58,29.04 104.58,34.74 L104.58,65.25 L90.18,65.25 L90.18,62.37 C88.26,63.69 86.235,64.635 84.105,65.205 C81.975,65.775 79.62,66.06 77.04,66.06 Z M73.62,51.03 C73.62,52.53 74.28,53.7 75.6,54.54 C76.92,55.38 78.75,55.8 81.09,55.8 C84.69,55.8 87.72,55.05 90.18,53.55 L90.18,47.43 C87.42,46.71 84.54,46.35 81.54,46.35 C79.02,46.35 77.07,46.755 75.69,47.565 C74.31,48.375 73.62,49.53 73.62,51.03 Z"
|
|
2872
|
+
/>
|
|
2873
|
+
<path
|
|
2874
|
+
d="M137.25,65.88 C125.73,65.88 119.97,60.84 119.97,50.76 L119.97,29.79 L110.34,29.79 L110.34,17.64 L119.97,17.64 L119.97,5.4 L134.55,2.25 L134.55,17.64 L147.87,17.64 L147.87,29.79 L134.55,29.79 L134.55,47.88 C134.55,49.98 135.015,51.465 135.945,52.335 C136.875,53.205 138.51,53.64 140.85,53.64 C143.01,53.64 145.2,53.31 147.42,52.65 L147.42,64.44 C146.1,64.86 144.42,65.205 142.38,65.475 C140.34,65.745 138.63,65.88 137.25,65.88 Z"
|
|
2875
|
+
/>
|
|
2876
|
+
<path
|
|
2877
|
+
d="M177.57,65.88 C166.05,65.88 160.29,60.84 160.29,50.76 L160.29,29.79 L150.66,29.79 L150.66,17.64 L160.29,17.64 L160.29,5.4 L174.87,2.25 L174.87,17.64 L188.19,17.64 L188.19,29.79 L174.87,29.79 L174.87,47.88 C174.87,49.98 175.335,51.465 176.265,52.335 C177.195,53.205 178.83,53.64 181.17,53.64 C183.33,53.64 185.52,53.31 187.74,52.65 L187.74,64.44 C186.42,64.86 184.74,65.205 182.7,65.475 C180.66,65.745 178.95,65.88 177.57,65.88 Z"
|
|
2878
|
+
/>
|
|
2879
|
+
<path
|
|
2880
|
+
d="M217.62,66.15 C212.76,66.15 208.365,65.055 204.435,62.865 C200.505,60.675 197.4,57.72 195.12,54 C192.84,50.28 191.7,46.11 191.7,41.49 C191.7,36.87 192.795,32.7 194.985,28.98 C197.175,25.26 200.16,22.305 203.94,20.115 C207.72,17.925 211.92,16.83 216.54,16.83 C221.22,16.83 225.36,17.955 228.96,20.205 C232.56,22.455 235.395,25.53 237.465,29.43 C239.535,33.33 240.57,37.8 240.57,42.84 L240.57,46.44 L206.64,46.44 C207.6,48.66 209.1,50.475 211.14,51.885 C213.18,53.295 215.58,54 218.34,54 C222.42,54 225.6,52.8 227.88,50.4 L237.51,58.95 C234.51,61.47 231.435,63.3 228.285,64.44 C225.135,65.58 221.58,66.15 217.62,66.15 Z M206.37,36.27 L226.26,36.27 C225.48,33.99 224.205,32.16 222.435,30.78 C220.665,29.4 218.61,28.71 216.27,28.71 C213.87,28.71 211.8,29.37 210.06,30.69 C208.32,32.01 207.09,33.87 206.37,36.27 Z"
|
|
2881
|
+
/>
|
|
2882
|
+
<path
|
|
2883
|
+
d="M247.41,65.25 L247.41,17.64 L261.99,17.64 L261.99,22.41 C265.23,18.51 269.4,16.56 274.5,16.56 C277.08,16.62 278.91,17.01 279.99,17.73 L279.99,30.42 C277.95,29.46 275.64,28.98 273.06,28.98 C270.78,28.98 268.665,29.505 266.715,30.555 C264.765,31.605 263.19,33.09 261.99,35.01 L261.99,65.25 L247.41,65.25 Z"
|
|
2884
|
+
/>
|
|
2885
|
+
<path
|
|
2886
|
+
d="M286.29,65.25 L286.29,17.64 L300.87,17.64 L300.87,20.88 C304.47,18.12 308.73,16.74 313.65,16.74 C317.37,16.74 320.655,17.55 323.505,19.17 C326.355,20.79 328.59,23.04 330.21,25.92 C331.83,28.8 332.64,32.13 332.64,35.91 L332.64,65.25 L318.06,65.25 L318.06,37.89 C318.06,35.25 317.28,33.15 315.72,31.59 C314.16,30.03 312.06,29.25 309.42,29.25 C305.76,29.25 302.91,30.51 300.87,33.03 L300.87,65.25 L286.29,65.25 Z"
|
|
2887
|
+
/>
|
|
2888
|
+
<polygon
|
|
2889
|
+
points="342 65.25 342 2.25 392.04 2.25 392.04 15.66 357.48 15.66 357.48 27.45 380.52 27.45 380.52 40.41 357.48 40.41 357.48 65.25"
|
|
2890
|
+
/>
|
|
2891
|
+
<polygon points="399.96 65.25 399.96 2.25 414.54 0 414.54 65.25" />
|
|
2892
|
+
<path
|
|
2893
|
+
d="M429.21,84.69 C428.07,84.69 426.96,84.645 425.88,84.555 C424.8,84.465 423.9,84.33 423.18,84.15 L423.18,71.73 C424.38,71.97 425.88,72.09 427.68,72.09 C432.36,72.09 435.51,70.05 437.13,65.97 L437.13,65.88 L418.86,17.64 L434.97,17.64 L445.5,47.61 L457.74,17.64 L473.49,17.64 L452.16,67.68 C450.42,71.82 448.5,75.135 446.4,77.625 C444.3,80.115 441.87,81.915 439.11,83.025 C436.35,84.135 433.05,84.69 429.21,84.69 Z"
|
|
2894
|
+
/>
|
|
2895
|
+
</g>
|
|
2896
|
+
<g id="Logo" transform="translate(0.000000, 0.000000)">
|
|
2897
|
+
<path
|
|
2898
|
+
d="M61.826087,0 L158,0 L158,96.173913 L147.695652,96.173913 C100.271201,96.173913 61.826087,57.7287992 61.826087,10.3043478 L61.826087,0 L61.826087,0 Z"
|
|
2899
|
+
id="Rectangle-Copy-17"
|
|
2900
|
+
fill="var(--pf-t--global--color--brand--200)"
|
|
2901
|
+
/>
|
|
2902
|
+
<path
|
|
2903
|
+
d="M158,3.43478261 L65.2608696,158 L138,158 C149.045695,158 158,149.045695 158,138 L158,3.43478261 L158,3.43478261 Z"
|
|
2904
|
+
fill="url(#linearGradient-1)"
|
|
2905
|
+
/>
|
|
2906
|
+
<path
|
|
2907
|
+
d="M123.652174,-30.9130435 L30.9130435,123.652174 L103.652174,123.652174 C114.697869,123.652174 123.652174,114.697869 123.652174,103.652174 L123.652174,-30.9130435 L123.652174,-30.9130435 Z"
|
|
2908
|
+
fill="url(#linearGradient-1)"
|
|
2909
|
+
transform="translate(77.282609, 46.369565) scale(1, -1) rotate(90.000000) translate(-77.282609, -46.369565) "
|
|
2910
|
+
/>
|
|
2911
|
+
</g>
|
|
2912
|
+
</g>
|
|
2913
|
+
</svg>
|
|
3035
2914
|
</a>
|
|
3036
2915
|
</div>
|
|
3037
2916
|
<div class="pf-v5-c-masthead__content">
|
|
@@ -3105,7 +2984,7 @@ section: components
|
|
|
3105
2984
|
<span class="pf-v5-c-menu-toggle__text">Ned Username</span>
|
|
3106
2985
|
<span class="pf-v5-c-menu-toggle__controls">
|
|
3107
2986
|
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
3108
|
-
<i class="fas fa-
|
|
2987
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
3109
2988
|
</span>
|
|
3110
2989
|
</span>
|
|
3111
2990
|
</button>
|
|
@@ -3205,10 +3084,10 @@ section: components
|
|
|
3205
3084
|
<div class="pf-v5-c-toolbar__group pf-m-toggle-group pf-m-show">
|
|
3206
3085
|
<div class="pf-v5-c-toolbar__toggle">
|
|
3207
3086
|
<button
|
|
3208
|
-
class="pf-v5-c-
|
|
3087
|
+
class="pf-v5-c-menu-toggle pf-m-plain"
|
|
3209
3088
|
type="button"
|
|
3210
|
-
aria-label="Show filters"
|
|
3211
3089
|
aria-expanded="false"
|
|
3090
|
+
aria-label="Show filters"
|
|
3212
3091
|
aria-controls="toolbar-pagination-management-example-toolbar-expandable-content"
|
|
3213
3092
|
>
|
|
3214
3093
|
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
@@ -3221,75 +3100,22 @@ section: components
|
|
|
3221
3100
|
role="group"
|
|
3222
3101
|
>
|
|
3223
3102
|
<div class="pf-v5-c-input-group__item">
|
|
3224
|
-
<
|
|
3225
|
-
|
|
3226
|
-
|
|
3227
|
-
|
|
3228
|
-
|
|
3229
|
-
|
|
3230
|
-
<
|
|
3231
|
-
class="
|
|
3232
|
-
|
|
3233
|
-
|
|
3234
|
-
|
|
3235
|
-
|
|
3236
|
-
|
|
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">
|
|
3245
|
-
<i class="fas fa-caret-down" aria-hidden="true"></i>
|
|
3103
|
+
<button
|
|
3104
|
+
class="pf-v5-c-menu-toggle"
|
|
3105
|
+
type="button"
|
|
3106
|
+
aria-expanded="false"
|
|
3107
|
+
id="toolbar-pagination-management-example-toolbar-search-filter-menu"
|
|
3108
|
+
>
|
|
3109
|
+
<span class="pf-v5-c-menu-toggle__icon">
|
|
3110
|
+
<i class="fas fa-filter" aria-hidden="true"></i>
|
|
3111
|
+
</span>
|
|
3112
|
+
<span class="pf-v5-c-menu-toggle__text">Name</span>
|
|
3113
|
+
<span class="pf-v5-c-menu-toggle__controls">
|
|
3114
|
+
<span class="pf-v5-c-menu-toggle__toggle-icon">
|
|
3115
|
+
<i class="fas fa-angle-down" aria-hidden="true"></i>
|
|
3246
3116
|
</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>
|
|
3117
|
+
</span>
|
|
3118
|
+
</button>
|
|
3293
3119
|
</div>
|
|
3294
3120
|
<div class="pf-v5-c-input-group__item pf-m-fill">
|
|
3295
3121
|
<div class="pf-v5-c-text-input-group">
|