@patternfly/patternfly 6.5.0-prerelease.8 → 6.5.0-prerelease.81
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 +2 -2
- package/assets/fontawesome/_variables.scss +2 -1
- package/assets/images/Felt-Bkg-Generic-Dark.svg +82 -0
- package/assets/images/Felt-Bkg-Generic-Light.svg +82 -0
- package/assets/images/PF-Bkg-Generic-Dark.svg +76 -0
- package/assets/images/PF-Bkg-Generic-Light.svg +74 -0
- package/assets/images/RHAiExperienceIcon.svg +27 -0
- package/assets/images/RHAutomationsLogo.svg +96 -0
- package/assets/images/RHServerStackIcon.svg +16 -0
- package/assets/images/compass--hero-bg.png +0 -0
- package/assets/images/compass--rh-wallpaper-dark.png +0 -0
- package/assets/images/compass--rh-wallpaper-light.png +0 -0
- package/assets/images/compass--wallpaper-dark.jpg +0 -0
- package/assets/images/compass--wallpaper-dark.png +0 -0
- package/assets/images/compass--wallpaper-light.jpg +0 -0
- package/assets/images/compass--wallpaper-light.png +0 -0
- package/assets/images/glass-brand-dark.jpg +0 -0
- package/assets/images/glass-brand-dark.png +0 -0
- package/assets/images/glass-brand-light.jpg +0 -0
- package/assets/images/glass-brand-light.png +0 -0
- package/base/normalize.scss +7 -0
- package/base/patternfly-common.css +50 -0
- package/base/patternfly-common.scss +59 -0
- package/base/patternfly-svg-icons.css +17 -0
- package/base/patternfly-svg-icons.scss +20 -0
- package/base/patternfly-variables.css +926 -513
- package/base/patternfly-variables.scss +46 -4
- package/base/tokens/tokens-dark.scss +56 -8
- package/base/tokens/tokens-default.scss +69 -14
- package/base/tokens/tokens-glass-dark.scss +26 -0
- package/base/tokens/tokens-glass.scss +22 -0
- package/base/tokens/tokens-local.scss +17 -0
- package/base/tokens/tokens-palette.scss +3 -1
- package/base/tokens/tokens-redhat-dark.scss +21 -0
- package/base/tokens/tokens-redhat-glass-dark.scss +40 -0
- package/base/tokens/tokens-redhat-glass.scss +30 -0
- package/base/tokens/tokens-redhat-highcontrast-dark.scss +50 -0
- package/base/tokens/tokens-redhat-highcontrast.scss +128 -0
- package/base/tokens/tokens-redhat.scss +15 -0
- package/components/AboutModalBox/about-modal-box.css +36 -26
- package/components/Accordion/accordion.css +26 -14
- package/components/Accordion/accordion.scss +12 -2
- package/components/ActionList/action-list.css +2 -0
- package/components/ActionList/action-list.scss +2 -0
- package/components/Alert/alert.css +7 -5
- package/components/Alert/alert.scss +2 -1
- package/components/Avatar/avatar.css +12 -4
- package/components/BackgroundImage/background-image.css +6 -3
- package/components/Banner/banner.css +12 -6
- package/components/Banner/banner.scss +7 -0
- package/components/Brand/brand.css +3 -1
- package/components/Breadcrumb/breadcrumb.css +10 -5
- package/components/Breadcrumb/breadcrumb.scss +6 -2
- package/components/Button/button.css +173 -71
- package/components/Button/button.scss +188 -72
- package/components/CalendarMonth/calendar-month.css +4 -3
- package/components/Card/card.css +51 -15
- package/components/Card/card.scss +65 -9
- package/components/ClipboardCopy/clipboard-copy.css +14 -7
- package/components/ClipboardCopy/clipboard-copy.scss +13 -4
- package/components/CodeEditor/code-editor.css +2 -2
- package/components/CodeEditor/code-editor.scss +2 -2
- package/components/Compass/compass.css +399 -0
- package/components/Compass/compass.scss +413 -0
- package/components/DataList/data-list.css +30 -23
- package/components/DataList/data-list.scss +3 -2
- package/components/DescriptionList/description-list-order.scss +5 -1
- package/components/DescriptionList/description-list.css +7 -5
- package/components/DescriptionList/description-list.scss +5 -1
- package/components/Divider/divider.css +7 -5
- package/components/Drawer/drawer.css +224 -75
- package/components/Drawer/drawer.scss +194 -27
- package/components/DualListSelector/dual-list-selector.css +18 -12
- package/components/DualListSelector/dual-list-selector.scss +1 -1
- package/components/ExpandableSection/expandable-section.css +21 -16
- package/components/ExpandableSection/expandable-section.scss +6 -3
- package/components/Form/form.css +2 -2
- package/components/Form/form.scss +2 -2
- package/components/FormControl/form-control.css +3 -3
- package/components/FormControl/form-control.scss +3 -3
- package/components/Hero/hero.css +74 -0
- package/components/Hero/hero.scss +86 -0
- package/components/JumpLinks/jump-links.css +16 -5
- package/components/JumpLinks/jump-links.scss +17 -3
- package/components/Label/label-group.css +2 -2
- package/components/Label/label-group.scss +2 -2
- package/components/Label/label.css +4 -3
- package/components/Login/login.css +58 -40
- package/components/Login/login.scss +7 -3
- package/components/Masthead/masthead.css +111 -16
- package/components/Masthead/masthead.scss +111 -1
- package/components/Menu/menu.css +49 -33
- package/components/Menu/menu.scss +26 -19
- package/components/MenuToggle/menu-toggle.css +35 -8
- package/components/MenuToggle/menu-toggle.scss +42 -8
- package/components/ModalBox/modal-box.css +9 -7
- package/components/ModalBox/modal-box.scss +2 -2
- package/components/Nav/nav.css +82 -11
- package/components/Nav/nav.scss +85 -5
- package/components/NotificationDrawer/notification-drawer.css +19 -9
- package/components/NotificationDrawer/notification-drawer.scss +14 -5
- package/components/OverflowMenu/overflow-menu.css +16 -0
- package/components/OverflowMenu/overflow-menu.scss +20 -1
- package/components/Page/page.css +421 -32
- package/components/Page/page.scss +397 -15
- package/components/Pagination/pagination.css +56 -4
- package/components/Pagination/pagination.scss +71 -6
- package/components/Panel/panel.css +41 -3
- package/components/Panel/panel.scss +56 -3
- package/components/Progress/progress.css +3 -1
- package/components/Progress/progress.scss +3 -1
- package/components/ProgressStepper/progress-stepper.scss +5 -1
- package/components/Sidebar/sidebar.css +1 -1
- package/components/Sidebar/sidebar.scss +7 -3
- package/components/Skeleton/skeleton.css +16 -15
- package/components/Slider/slider.css +32 -18
- package/components/Switch/switch.css +4 -2
- package/components/Switch/switch.scss +1 -1
- package/components/Table/table-grid.css +28 -36
- package/components/Table/table-grid.scss +4 -4
- package/components/Table/table-scrollable.css +1 -1
- package/components/Table/table-scrollable.scss +1 -1
- package/components/Table/table-tree-view.css +4 -2
- package/components/Table/table.css +104 -57
- package/components/Table/table.scss +92 -37
- package/components/Tabs/tabs.css +39 -33
- package/components/Tabs/tabs.scss +38 -26
- package/components/TextInputGroup/text-input-group.css +2 -2
- package/components/TextInputGroup/text-input-group.scss +2 -2
- package/components/ToggleGroup/toggle-group.css +44 -19
- package/components/ToggleGroup/toggle-group.scss +51 -22
- package/components/Toolbar/toolbar.css +195 -16
- package/components/Toolbar/toolbar.scss +89 -9
- package/components/TreeView/tree-view.css +45 -14
- package/components/TreeView/tree-view.scss +32 -1
- package/components/Wizard/wizard.css +41 -19
- package/components/Wizard/wizard.scss +26 -6
- package/components/_index.css +2740 -829
- package/components/_index.scss +3 -1
- package/docs/components/AboutModalBox/examples/AboutModalBox.md +13 -1
- package/docs/components/Accordion/examples/Accordion.md +392 -30
- package/docs/components/ActionList/examples/ActionList.md +143 -11
- package/docs/components/Alert/examples/Alert.md +678 -54
- package/docs/components/Avatar/examples/Avatar.md +4 -4
- package/docs/components/BackToTop/examples/BackToTop.md +13 -1
- package/docs/components/Banner/examples/Banner.md +196 -5
- package/docs/components/Brand/examples/Brand.md +2 -2
- package/docs/components/Breadcrumb/examples/Breadcrumb.md +313 -26
- package/docs/components/Button/examples/Button.md +2829 -333
- package/docs/components/CalendarMonth/examples/CalendarMonth.md +156 -12
- package/docs/components/Card/examples/Card.md +335 -12
- package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +293 -28
- package/docs/components/CodeBlock/examples/CodeBlock.md +104 -8
- package/docs/components/CodeEditor/examples/CodeEditor.md +234 -18
- package/docs/components/Compass/examples/Compass.css +8 -0
- package/docs/components/Compass/examples/Compass.md +109 -0
- package/docs/components/DataList/examples/DataList.md +468 -78
- package/docs/components/DatePicker/examples/DatePicker.md +78 -6
- package/docs/components/DescriptionList/examples/DescriptionList.md +327 -27
- package/docs/components/Divider/examples/Divider.md +2 -2
- package/docs/components/DragDrop/examples/DragDrop.css +1 -1
- package/docs/components/Drawer/examples/Drawer.md +415 -35
- package/docs/components/DualListSelector/examples/DualListSelector.md +1247 -161
- package/docs/components/EmptyState/examples/EmptyState.md +78 -6
- package/docs/components/ExpandableSection/examples/ExpandableSection.md +91 -7
- package/docs/components/Form/examples/Form.md +78 -6
- package/docs/components/Hero/examples/Hero.md +25 -0
- package/docs/components/Hint/examples/Hint.md +39 -3
- package/docs/components/Icon/examples/Icon.md +105 -9
- package/docs/components/InlineEdit/examples/InlineEdit.md +338 -26
- package/docs/components/InputGroup/examples/InputGroup.md +40 -4
- package/docs/components/JumpLinks/examples/JumpLinks.md +54 -6
- package/docs/components/Label/examples/Label.md +2834 -218
- package/docs/components/Login/examples/Login.md +39 -3
- package/docs/components/Masthead/examples/masthead.md +80 -1
- package/docs/components/Menu/examples/Menu.md +1679 -133
- package/docs/components/MenuToggle/examples/MenuToggle.md +1514 -118
- package/docs/components/ModalBox/examples/ModalBox.md +289 -25
- package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +156 -12
- package/docs/components/Nav/examples/Navigation.md +898 -62
- package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +1079 -83
- package/docs/components/OverflowMenu/examples/overflow-menu.css +6 -3
- package/docs/components/OverflowMenu/examples/overflow-menu.md +164 -11
- package/docs/components/Page/examples/Page.md +211 -25
- package/docs/components/Pagination/examples/Pagination.md +1291 -80
- package/docs/components/Panel/examples/Panel.css +3 -0
- package/docs/components/Panel/examples/Panel.md +71 -4
- package/docs/components/Popover/examples/Popover.md +286 -22
- package/docs/components/Progress/examples/Progress.md +91 -7
- package/docs/components/ProgressStepper/examples/ProgressStepper.md +275 -23
- package/docs/components/Sidebar/examples/Sidebar.md +1 -1
- package/docs/components/Slider/examples/Slider.md +52 -4
- package/docs/components/Table/examples/Table.css +2 -1
- package/docs/components/Table/examples/Table.md +7543 -653
- package/docs/components/Tabs/examples/Tabs.md +5734 -471
- package/docs/components/TextInputGroup/examples/TextInputGroup.md +600 -48
- package/docs/components/ToggleGroup/examples/toggle-group.md +261 -15
- package/docs/components/Toolbar/examples/Toolbar.css +1 -1
- package/docs/components/Toolbar/examples/Toolbar.md +1145 -88
- package/docs/components/TreeView/examples/TreeView.md +1390 -130
- package/docs/components/Wizard/examples/Wizard.md +828 -73
- package/docs/demos/AboutModal/examples/AboutModal.md +158 -53
- package/docs/demos/Alert/examples/Alert.md +539 -164
- package/docs/demos/BackToTop/examples/BackToTop.md +158 -53
- package/docs/demos/Banner/examples/Banner.md +290 -104
- package/docs/demos/Button/examples/Button.md +13 -1
- package/docs/demos/Card/examples/Card.md +1041 -134
- package/docs/demos/CardView/examples/CardView.md +570 -171
- package/docs/demos/Compass/examples/Compass.md +10005 -0
- package/docs/demos/Dashboard/examples/Dashboard.md +745 -177
- package/docs/demos/DataList/examples/DataList.md +1301 -292
- package/docs/demos/DescriptionList/examples/DescriptionList.md +472 -160
- package/docs/demos/Drawer/examples/Drawer.md +718 -262
- package/docs/demos/Form/examples/BasicForms.md +273 -21
- package/docs/demos/JumpLinks/examples/JumpLinks.md +862 -319
- package/docs/demos/Masthead/examples/Masthead.md +1119 -489
- package/docs/demos/Modal/examples/Modal.md +948 -321
- package/docs/demos/Nav/examples/Nav.md +3449 -499
- package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +2418 -405
- package/docs/demos/Page/examples/Page.md +2137 -773
- package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -1
- package/docs/demos/PasswordStrength/examples/PasswordStrength.md +52 -4
- package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +1913 -504
- package/docs/demos/Skeleton/examples/Skeleton.md +145 -52
- package/docs/demos/Table/examples/Table.md +11807 -2275
- package/docs/demos/Tabs/examples/Tabs.md +1117 -337
- package/docs/demos/Toolbar/examples/Toolbar.md +1818 -286
- package/docs/demos/Wizard/examples/Wizard.md +1705 -526
- package/docs/layouts/Bullseye/examples/Bullseye.css +2 -2
- package/docs/layouts/Bullseye/examples/Bullseye.md +2 -1
- package/docs/layouts/Flex/examples/Flex.css +3 -3
- package/docs/layouts/Flex/examples/Flex.md +3 -2
- package/docs/layouts/Gallery/examples/Gallery.css +2 -2
- package/docs/layouts/Gallery/examples/Gallery.md +4 -3
- package/docs/layouts/Grid/examples/Grid.css +1 -1
- package/docs/layouts/Grid/examples/Grid.md +6 -5
- package/docs/layouts/Level/examples/Level.css +3 -3
- package/docs/layouts/Level/examples/Level.md +2 -1
- package/docs/layouts/Split/examples/Split.css +1 -1
- package/docs/layouts/Split/examples/Split.md +2 -1
- package/docs/layouts/Stack/examples/Stack.css +3 -3
- package/docs/layouts/Stack/examples/Stack.md +2 -1
- package/docs/utilities/Accessibility/examples/Accessibility.md +3 -2
- package/docs/utilities/Alignment/examples/Alignment.css +4 -4
- package/docs/utilities/Alignment/examples/Alignment.md +3 -2
- package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +5 -4
- package/docs/utilities/BoxShadow/examples/box-shadow.css +2 -2
- package/docs/utilities/BoxShadow/examples/box-shadow.md +2 -1
- package/docs/utilities/Display/examples/Display.css +1 -1
- package/docs/utilities/Display/examples/Display.md +3 -2
- package/docs/utilities/Flex/examples/Flex.css +7 -7
- package/docs/utilities/Flex/examples/Flex.md +3 -2
- package/docs/utilities/Float/examples/Float.css +2 -2
- package/docs/utilities/Float/examples/Float.md +3 -2
- package/docs/utilities/Sizing/examples/Sizing.md +8 -7
- package/docs/utilities/Spacing/examples/Spacing.css +2 -2
- package/docs/utilities/Spacing/examples/Spacing.md +3 -2
- package/docs/utilities/Text/examples/Text.md +5 -4
- package/icons/PfIcons/add-circle-o.svg +4 -0
- package/icons/PfIcons/ansible-tower.svg +4 -0
- package/icons/PfIcons/applications.svg +4 -0
- package/icons/PfIcons/arrow.svg +4 -0
- package/icons/PfIcons/asleep.svg +4 -0
- package/icons/PfIcons/attention-bell.svg +4 -0
- package/icons/PfIcons/automation.svg +4 -0
- package/icons/PfIcons/bell.svg +4 -0
- package/icons/PfIcons/blueprint.svg +4 -0
- package/icons/PfIcons/build.svg +4 -0
- package/icons/PfIcons/builder-image.svg +4 -0
- package/icons/PfIcons/bundle.svg +4 -0
- package/icons/PfIcons/catalog.svg +4 -0
- package/icons/PfIcons/chat.svg +4 -0
- package/icons/PfIcons/close.svg +4 -0
- package/icons/PfIcons/cloud-security.svg +4 -0
- package/icons/PfIcons/cloud-tenant.svg +4 -0
- package/icons/PfIcons/cluster.svg +4 -0
- package/icons/PfIcons/connected.svg +4 -0
- package/icons/PfIcons/container-node.svg +4 -0
- package/icons/PfIcons/cpu.svg +4 -0
- package/icons/PfIcons/critical-risk.svg +4 -0
- package/icons/PfIcons/data-processor.svg +4 -0
- package/icons/PfIcons/data-sink.svg +4 -0
- package/icons/PfIcons/data-source.svg +4 -0
- package/icons/PfIcons/degraded.svg +4 -0
- package/icons/PfIcons/disconnected.svg +4 -0
- package/icons/PfIcons/domain.svg +4 -0
- package/icons/PfIcons/edit.svg +4 -0
- package/icons/PfIcons/enhancement.svg +4 -0
- package/icons/PfIcons/enterprise.svg +4 -0
- package/icons/PfIcons/equalizer.svg +4 -0
- package/icons/PfIcons/error-circle-o.svg +4 -0
- package/icons/PfIcons/export.svg +4 -0
- package/icons/PfIcons/filter.svg +4 -0
- package/icons/PfIcons/flavor.svg +4 -0
- package/icons/PfIcons/folder-close.svg +4 -0
- package/icons/PfIcons/folder-open.svg +4 -0
- package/icons/PfIcons/globe-route.svg +4 -0
- package/icons/PfIcons/help.svg +4 -0
- package/icons/PfIcons/history.svg +4 -0
- package/icons/PfIcons/home.svg +4 -0
- package/icons/PfIcons/import.svg +4 -0
- package/icons/PfIcons/in-progress.svg +4 -0
- package/icons/PfIcons/info.svg +4 -0
- package/icons/PfIcons/infrastructure.svg +4 -0
- package/icons/PfIcons/integration.svg +4 -0
- package/icons/PfIcons/key.svg +4 -0
- package/icons/PfIcons/locked.svg +4 -0
- package/icons/PfIcons/maintenance.svg +4 -0
- package/icons/PfIcons/memory.svg +4 -0
- package/icons/PfIcons/messages.svg +4 -0
- package/icons/PfIcons/middleware.svg +4 -0
- package/icons/PfIcons/migration.svg +4 -0
- package/icons/PfIcons/module.svg +4 -0
- package/icons/PfIcons/monitoring.svg +4 -0
- package/icons/PfIcons/multicluster.svg +4 -0
- package/icons/PfIcons/namespaces.svg +4 -0
- package/icons/PfIcons/network.svg +4 -0
- package/icons/PfIcons/new-process.svg +4 -0
- package/icons/PfIcons/not-started.svg +4 -0
- package/icons/PfIcons/off.svg +4 -0
- package/icons/PfIcons/ok.svg +4 -0
- package/icons/PfIcons/on-running.svg +4 -0
- package/icons/PfIcons/on.svg +4 -0
- package/icons/PfIcons/open-drawer-right.svg +4 -0
- package/icons/PfIcons/openshift.svg +4 -0
- package/icons/PfIcons/openstack.svg +4 -0
- package/icons/PfIcons/optimize.svg +4 -0
- package/icons/PfIcons/orders.svg +4 -0
- package/icons/PfIcons/os-image.svg +4 -0
- package/icons/PfIcons/package.svg +4 -0
- package/icons/PfIcons/panel-close.svg +4 -0
- package/icons/PfIcons/panel-open.svg +4 -0
- package/icons/PfIcons/paused.svg +4 -0
- package/icons/PfIcons/pending.svg +4 -0
- package/icons/PfIcons/pficon-dragdrop.svg +4 -0
- package/icons/PfIcons/pficon-history.svg +4 -0
- package/icons/PfIcons/pficon-network-range.svg +4 -0
- package/icons/PfIcons/pficon-satellite.svg +4 -0
- package/icons/PfIcons/pficon-sort-common-asc.svg +4 -0
- package/icons/PfIcons/pficon-sort-common-desc.svg +4 -0
- package/icons/PfIcons/pficon-template.svg +4 -0
- package/icons/PfIcons/pficon-vcenter.svg +4 -0
- package/icons/PfIcons/plugged.svg +4 -0
- package/icons/PfIcons/port.svg +4 -0
- package/icons/PfIcons/print.svg +4 -0
- package/icons/PfIcons/private.svg +4 -0
- package/icons/PfIcons/process-automation.svg +4 -0
- package/icons/PfIcons/project.svg +4 -0
- package/icons/PfIcons/rebalance.svg +4 -0
- package/icons/PfIcons/rebooting.svg +4 -0
- package/icons/PfIcons/regions.svg +4 -0
- package/icons/PfIcons/registry.svg +4 -0
- package/icons/PfIcons/remove2.svg +4 -0
- package/icons/PfIcons/replicator.svg +4 -0
- package/icons/PfIcons/repository.svg +4 -0
- package/icons/PfIcons/resource-pool.svg +4 -0
- package/icons/PfIcons/resources-almost-empty.svg +4 -0
- package/icons/PfIcons/resources-almost-full.svg +4 -0
- package/icons/PfIcons/resources-empty.svg +4 -0
- package/icons/PfIcons/resources-full.svg +4 -0
- package/icons/PfIcons/running.svg +4 -0
- package/icons/PfIcons/save.svg +4 -0
- package/icons/PfIcons/screen.svg +4 -0
- package/icons/PfIcons/security.svg +4 -0
- package/icons/PfIcons/server-group.svg +4 -0
- package/icons/PfIcons/server.svg +4 -0
- package/icons/PfIcons/service-catalog.svg +4 -0
- package/icons/PfIcons/service.svg +4 -0
- package/icons/PfIcons/services.svg +4 -0
- package/icons/PfIcons/severity-critical.svg +4 -0
- package/icons/PfIcons/severity-important.svg +4 -0
- package/icons/PfIcons/severity-minor.svg +4 -0
- package/icons/PfIcons/severity-moderate.svg +4 -0
- package/icons/PfIcons/severity-none.svg +4 -0
- package/icons/PfIcons/severity-undefined.svg +4 -0
- package/icons/PfIcons/spinner.svg +4 -0
- package/icons/PfIcons/spinner2.svg +4 -0
- package/icons/PfIcons/storage-domain.svg +4 -0
- package/icons/PfIcons/task.svg +4 -0
- package/icons/PfIcons/tenant.svg +4 -0
- package/icons/PfIcons/thumb-tack.svg +4 -0
- package/icons/PfIcons/topology.svg +4 -0
- package/icons/PfIcons/treeview.svg +4 -0
- package/icons/PfIcons/trend-down.svg +4 -0
- package/icons/PfIcons/trend-up.svg +4 -0
- package/icons/PfIcons/unknown.svg +4 -0
- package/icons/PfIcons/unlocked.svg +4 -0
- package/icons/PfIcons/unplugged.svg +4 -0
- package/icons/PfIcons/user.svg +4 -0
- package/icons/PfIcons/users.svg +4 -0
- package/icons/PfIcons/virtual-machine.svg +4 -0
- package/icons/PfIcons/volume.svg +4 -0
- package/icons/PfIcons/warning-triangle.svg +4 -0
- package/icons/PfIcons/zone.svg +4 -0
- package/layouts/Flex/flex.scss +83 -19
- package/layouts/Gallery/gallery.css +6 -2
- package/layouts/_index.css +6 -2
- package/package.json +55 -17
- package/patternfly-base-no-globals.css +969 -489
- package/patternfly-base.css +976 -489
- package/patternfly-charts.css +3 -3
- package/patternfly-no-globals.css +3623 -1194
- package/patternfly.css +3630 -1194
- package/patternfly.min.css +1 -1
- package/patternfly.min.css.map +1 -1
- package/patternfly.scss +48 -0
- package/sass-utilities/functions.scss +32 -25
- package/sass-utilities/mixins.scss +54 -23
- package/sass-utilities/namespaces-components.scss +6 -0
- package/sass-utilities/scss-variables.scss +3 -0
|
@@ -31,7 +31,19 @@ Inline edit **toggle** can be placed anywhere within `.pf-v6-c-inline-edit`. It
|
|
|
31
31
|
aria-labelledby="inline-edit-toggle-example-edit-button inline-edit-toggle-example-label"
|
|
32
32
|
>
|
|
33
33
|
<span class="pf-v6-c-button__icon">
|
|
34
|
-
<
|
|
34
|
+
<svg
|
|
35
|
+
class="pf-v6-svg"
|
|
36
|
+
viewBox="0 0 512 512"
|
|
37
|
+
fill="currentColor"
|
|
38
|
+
aria-hidden="true"
|
|
39
|
+
role="img"
|
|
40
|
+
width="1em"
|
|
41
|
+
height="1em"
|
|
42
|
+
>
|
|
43
|
+
<path
|
|
44
|
+
d="M497.9 142.1l-46.1 46.1c-4.7 4.7-12.3 4.7-17 0l-111-111c-4.7-4.7-4.7-12.3 0-17l46.1-46.1c18.7-18.7 49.1-18.7 67.9 0l60.1 60.1c18.8 18.7 18.8 49.1 0 67.9zM284.2 99.8L21.6 362.4.4 483.9c-2.9 16.4 11.4 30.6 27.8 27.8l121.5-21.3 262.6-262.6c4.7-4.7 4.7-12.3 0-17l-111-111c-4.8-4.7-12.4-4.7-17.1 0zM124.1 339.9c-5.5-5.5-5.5-14.3 0-19.8l154-154c5.5-5.5 14.3-5.5 19.8 0s5.5 14.3 0 19.8l-154 154c-5.5 5.5-14.3 5.5-19.8 0zM88 424h48v36.3l-64.5 11.3-31.1-31.1L51.7 376H88v48z"
|
|
45
|
+
/>
|
|
46
|
+
</svg>
|
|
35
47
|
</span>
|
|
36
48
|
</button>
|
|
37
49
|
</div>
|
|
@@ -90,7 +102,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
90
102
|
aria-label="Save edits"
|
|
91
103
|
>
|
|
92
104
|
<span class="pf-v6-c-button__icon">
|
|
93
|
-
<
|
|
105
|
+
<svg
|
|
106
|
+
class="pf-v6-svg"
|
|
107
|
+
viewBox="0 0 512 512"
|
|
108
|
+
fill="currentColor"
|
|
109
|
+
aria-hidden="true"
|
|
110
|
+
role="img"
|
|
111
|
+
width="1em"
|
|
112
|
+
height="1em"
|
|
113
|
+
>
|
|
114
|
+
<path
|
|
115
|
+
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
|
|
116
|
+
/>
|
|
117
|
+
</svg>
|
|
94
118
|
</span>
|
|
95
119
|
</button>
|
|
96
120
|
</div>
|
|
@@ -101,7 +125,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
101
125
|
aria-label="Cancel edits"
|
|
102
126
|
>
|
|
103
127
|
<span class="pf-v6-c-button__icon">
|
|
104
|
-
<
|
|
128
|
+
<svg
|
|
129
|
+
class="pf-v6-svg"
|
|
130
|
+
viewBox="0 0 20 20"
|
|
131
|
+
fill="currentColor"
|
|
132
|
+
aria-hidden="true"
|
|
133
|
+
role="img"
|
|
134
|
+
width="1em"
|
|
135
|
+
height="1em"
|
|
136
|
+
>
|
|
137
|
+
<path
|
|
138
|
+
d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
|
|
139
|
+
/>
|
|
140
|
+
</svg>
|
|
105
141
|
</span>
|
|
106
142
|
</button>
|
|
107
143
|
</div>
|
|
@@ -128,7 +164,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
128
164
|
aria-labelledby="single-inline-edit-example-edit-button single-inline-edit-example-label"
|
|
129
165
|
>
|
|
130
166
|
<span class="pf-v6-c-button__icon">
|
|
131
|
-
<
|
|
167
|
+
<svg
|
|
168
|
+
class="pf-v6-svg"
|
|
169
|
+
viewBox="0 0 512 512"
|
|
170
|
+
fill="currentColor"
|
|
171
|
+
aria-hidden="true"
|
|
172
|
+
role="img"
|
|
173
|
+
width="1em"
|
|
174
|
+
height="1em"
|
|
175
|
+
>
|
|
176
|
+
<path
|
|
177
|
+
d="M497.9 142.1l-46.1 46.1c-4.7 4.7-12.3 4.7-17 0l-111-111c-4.7-4.7-4.7-12.3 0-17l46.1-46.1c18.7-18.7 49.1-18.7 67.9 0l60.1 60.1c18.8 18.7 18.8 49.1 0 67.9zM284.2 99.8L21.6 362.4.4 483.9c-2.9 16.4 11.4 30.6 27.8 27.8l121.5-21.3 262.6-262.6c4.7-4.7 4.7-12.3 0-17l-111-111c-4.8-4.7-12.4-4.7-17.1 0zM124.1 339.9c-5.5-5.5-5.5-14.3 0-19.8l154-154c5.5-5.5 14.3-5.5 19.8 0s5.5 14.3 0 19.8l-154 154c-5.5 5.5-14.3 5.5-19.8 0zM88 424h48v36.3l-64.5 11.3-31.1-31.1L51.7 376H88v48z"
|
|
178
|
+
/>
|
|
179
|
+
</svg>
|
|
132
180
|
</span>
|
|
133
181
|
</button>
|
|
134
182
|
</div>
|
|
@@ -151,7 +199,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
151
199
|
aria-label="Save edits"
|
|
152
200
|
>
|
|
153
201
|
<span class="pf-v6-c-button__icon">
|
|
154
|
-
<
|
|
202
|
+
<svg
|
|
203
|
+
class="pf-v6-svg"
|
|
204
|
+
viewBox="0 0 512 512"
|
|
205
|
+
fill="currentColor"
|
|
206
|
+
aria-hidden="true"
|
|
207
|
+
role="img"
|
|
208
|
+
width="1em"
|
|
209
|
+
height="1em"
|
|
210
|
+
>
|
|
211
|
+
<path
|
|
212
|
+
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
|
|
213
|
+
/>
|
|
214
|
+
</svg>
|
|
155
215
|
</span>
|
|
156
216
|
</button>
|
|
157
217
|
</div>
|
|
@@ -162,7 +222,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
162
222
|
aria-label="Cancel edits"
|
|
163
223
|
>
|
|
164
224
|
<span class="pf-v6-c-button__icon">
|
|
165
|
-
<
|
|
225
|
+
<svg
|
|
226
|
+
class="pf-v6-svg"
|
|
227
|
+
viewBox="0 0 20 20"
|
|
228
|
+
fill="currentColor"
|
|
229
|
+
aria-hidden="true"
|
|
230
|
+
role="img"
|
|
231
|
+
width="1em"
|
|
232
|
+
height="1em"
|
|
233
|
+
>
|
|
234
|
+
<path
|
|
235
|
+
d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
|
|
236
|
+
/>
|
|
237
|
+
</svg>
|
|
166
238
|
</span>
|
|
167
239
|
</button>
|
|
168
240
|
</div>
|
|
@@ -193,7 +265,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
193
265
|
aria-labelledby="single-editable-example-edit-button single-editable-example-label"
|
|
194
266
|
>
|
|
195
267
|
<span class="pf-v6-c-button__icon">
|
|
196
|
-
<
|
|
268
|
+
<svg
|
|
269
|
+
class="pf-v6-svg"
|
|
270
|
+
viewBox="0 0 512 512"
|
|
271
|
+
fill="currentColor"
|
|
272
|
+
aria-hidden="true"
|
|
273
|
+
role="img"
|
|
274
|
+
width="1em"
|
|
275
|
+
height="1em"
|
|
276
|
+
>
|
|
277
|
+
<path
|
|
278
|
+
d="M497.9 142.1l-46.1 46.1c-4.7 4.7-12.3 4.7-17 0l-111-111c-4.7-4.7-4.7-12.3 0-17l46.1-46.1c18.7-18.7 49.1-18.7 67.9 0l60.1 60.1c18.8 18.7 18.8 49.1 0 67.9zM284.2 99.8L21.6 362.4.4 483.9c-2.9 16.4 11.4 30.6 27.8 27.8l121.5-21.3 262.6-262.6c4.7-4.7 4.7-12.3 0-17l-111-111c-4.8-4.7-12.4-4.7-17.1 0zM124.1 339.9c-5.5-5.5-5.5-14.3 0-19.8l154-154c5.5-5.5 14.3-5.5 19.8 0s5.5 14.3 0 19.8l-154 154c-5.5 5.5-14.3 5.5-19.8 0zM88 424h48v36.3l-64.5 11.3-31.1-31.1L51.7 376H88v48z"
|
|
279
|
+
/>
|
|
280
|
+
</svg>
|
|
197
281
|
</span>
|
|
198
282
|
</button>
|
|
199
283
|
</div>
|
|
@@ -216,7 +300,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
216
300
|
aria-label="Save edits"
|
|
217
301
|
>
|
|
218
302
|
<span class="pf-v6-c-button__icon">
|
|
219
|
-
<
|
|
303
|
+
<svg
|
|
304
|
+
class="pf-v6-svg"
|
|
305
|
+
viewBox="0 0 512 512"
|
|
306
|
+
fill="currentColor"
|
|
307
|
+
aria-hidden="true"
|
|
308
|
+
role="img"
|
|
309
|
+
width="1em"
|
|
310
|
+
height="1em"
|
|
311
|
+
>
|
|
312
|
+
<path
|
|
313
|
+
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
|
|
314
|
+
/>
|
|
315
|
+
</svg>
|
|
220
316
|
</span>
|
|
221
317
|
</button>
|
|
222
318
|
</div>
|
|
@@ -227,7 +323,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
227
323
|
aria-label="Cancel edits"
|
|
228
324
|
>
|
|
229
325
|
<span class="pf-v6-c-button__icon">
|
|
230
|
-
<
|
|
326
|
+
<svg
|
|
327
|
+
class="pf-v6-svg"
|
|
328
|
+
viewBox="0 0 20 20"
|
|
329
|
+
fill="currentColor"
|
|
330
|
+
aria-hidden="true"
|
|
331
|
+
role="img"
|
|
332
|
+
width="1em"
|
|
333
|
+
height="1em"
|
|
334
|
+
>
|
|
335
|
+
<path
|
|
336
|
+
d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
|
|
337
|
+
/>
|
|
338
|
+
</svg>
|
|
231
339
|
</span>
|
|
232
340
|
</button>
|
|
233
341
|
</div>
|
|
@@ -270,7 +378,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
270
378
|
aria-labelledby="single-inline-edit-with-label-example-label single-inline-edit-with-label-example-edit-button"
|
|
271
379
|
>
|
|
272
380
|
<span class="pf-v6-c-button__icon">
|
|
273
|
-
<
|
|
381
|
+
<svg
|
|
382
|
+
class="pf-v6-svg"
|
|
383
|
+
viewBox="0 0 512 512"
|
|
384
|
+
fill="currentColor"
|
|
385
|
+
aria-hidden="true"
|
|
386
|
+
role="img"
|
|
387
|
+
width="1em"
|
|
388
|
+
height="1em"
|
|
389
|
+
>
|
|
390
|
+
<path
|
|
391
|
+
d="M497.9 142.1l-46.1 46.1c-4.7 4.7-12.3 4.7-17 0l-111-111c-4.7-4.7-4.7-12.3 0-17l46.1-46.1c18.7-18.7 49.1-18.7 67.9 0l60.1 60.1c18.8 18.7 18.8 49.1 0 67.9zM284.2 99.8L21.6 362.4.4 483.9c-2.9 16.4 11.4 30.6 27.8 27.8l121.5-21.3 262.6-262.6c4.7-4.7 4.7-12.3 0-17l-111-111c-4.8-4.7-12.4-4.7-17.1 0zM124.1 339.9c-5.5-5.5-5.5-14.3 0-19.8l154-154c5.5-5.5 14.3-5.5 19.8 0s5.5 14.3 0 19.8l-154 154c-5.5 5.5-14.3 5.5-19.8 0zM88 424h48v36.3l-64.5 11.3-31.1-31.1L51.7 376H88v48z"
|
|
392
|
+
/>
|
|
393
|
+
</svg>
|
|
274
394
|
</span>
|
|
275
395
|
</button>
|
|
276
396
|
</div>
|
|
@@ -295,7 +415,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
295
415
|
aria-label="Save edits"
|
|
296
416
|
>
|
|
297
417
|
<span class="pf-v6-c-button__icon">
|
|
298
|
-
<
|
|
418
|
+
<svg
|
|
419
|
+
class="pf-v6-svg"
|
|
420
|
+
viewBox="0 0 512 512"
|
|
421
|
+
fill="currentColor"
|
|
422
|
+
aria-hidden="true"
|
|
423
|
+
role="img"
|
|
424
|
+
width="1em"
|
|
425
|
+
height="1em"
|
|
426
|
+
>
|
|
427
|
+
<path
|
|
428
|
+
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
|
|
429
|
+
/>
|
|
430
|
+
</svg>
|
|
299
431
|
</span>
|
|
300
432
|
</button>
|
|
301
433
|
</div>
|
|
@@ -306,7 +438,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
306
438
|
aria-label="Cancel edits"
|
|
307
439
|
>
|
|
308
440
|
<span class="pf-v6-c-button__icon">
|
|
309
|
-
<
|
|
441
|
+
<svg
|
|
442
|
+
class="pf-v6-svg"
|
|
443
|
+
viewBox="0 0 20 20"
|
|
444
|
+
fill="currentColor"
|
|
445
|
+
aria-hidden="true"
|
|
446
|
+
role="img"
|
|
447
|
+
width="1em"
|
|
448
|
+
height="1em"
|
|
449
|
+
>
|
|
450
|
+
<path
|
|
451
|
+
d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
|
|
452
|
+
/>
|
|
453
|
+
</svg>
|
|
310
454
|
</span>
|
|
311
455
|
</button>
|
|
312
456
|
</div>
|
|
@@ -338,7 +482,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
338
482
|
aria-labelledby="inline-edit-state-valid-label inline-edit-state-valid-edit-button"
|
|
339
483
|
>
|
|
340
484
|
<span class="pf-v6-c-button__icon">
|
|
341
|
-
<
|
|
485
|
+
<svg
|
|
486
|
+
class="pf-v6-svg"
|
|
487
|
+
viewBox="0 0 512 512"
|
|
488
|
+
fill="currentColor"
|
|
489
|
+
aria-hidden="true"
|
|
490
|
+
role="img"
|
|
491
|
+
width="1em"
|
|
492
|
+
height="1em"
|
|
493
|
+
>
|
|
494
|
+
<path
|
|
495
|
+
d="M497.9 142.1l-46.1 46.1c-4.7 4.7-12.3 4.7-17 0l-111-111c-4.7-4.7-4.7-12.3 0-17l46.1-46.1c18.7-18.7 49.1-18.7 67.9 0l60.1 60.1c18.8 18.7 18.8 49.1 0 67.9zM284.2 99.8L21.6 362.4.4 483.9c-2.9 16.4 11.4 30.6 27.8 27.8l121.5-21.3 262.6-262.6c4.7-4.7 4.7-12.3 0-17l-111-111c-4.8-4.7-12.4-4.7-17.1 0zM124.1 339.9c-5.5-5.5-5.5-14.3 0-19.8l154-154c5.5-5.5 14.3-5.5 19.8 0s5.5 14.3 0 19.8l-154 154c-5.5 5.5-14.3 5.5-19.8 0zM88 424h48v36.3l-64.5 11.3-31.1-31.1L51.7 376H88v48z"
|
|
496
|
+
/>
|
|
497
|
+
</svg>
|
|
342
498
|
</span>
|
|
343
499
|
</button>
|
|
344
500
|
</div>
|
|
@@ -362,7 +518,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
362
518
|
aria-label="Save edits"
|
|
363
519
|
>
|
|
364
520
|
<span class="pf-v6-c-button__icon">
|
|
365
|
-
<
|
|
521
|
+
<svg
|
|
522
|
+
class="pf-v6-svg"
|
|
523
|
+
viewBox="0 0 512 512"
|
|
524
|
+
fill="currentColor"
|
|
525
|
+
aria-hidden="true"
|
|
526
|
+
role="img"
|
|
527
|
+
width="1em"
|
|
528
|
+
height="1em"
|
|
529
|
+
>
|
|
530
|
+
<path
|
|
531
|
+
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
|
|
532
|
+
/>
|
|
533
|
+
</svg>
|
|
366
534
|
</span>
|
|
367
535
|
</button>
|
|
368
536
|
</div>
|
|
@@ -373,7 +541,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
373
541
|
aria-label="Cancel edits"
|
|
374
542
|
>
|
|
375
543
|
<span class="pf-v6-c-button__icon">
|
|
376
|
-
<
|
|
544
|
+
<svg
|
|
545
|
+
class="pf-v6-svg"
|
|
546
|
+
viewBox="0 0 20 20"
|
|
547
|
+
fill="currentColor"
|
|
548
|
+
aria-hidden="true"
|
|
549
|
+
role="img"
|
|
550
|
+
width="1em"
|
|
551
|
+
height="1em"
|
|
552
|
+
>
|
|
553
|
+
<path
|
|
554
|
+
d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
|
|
555
|
+
/>
|
|
556
|
+
</svg>
|
|
377
557
|
</span>
|
|
378
558
|
</button>
|
|
379
559
|
</div>
|
|
@@ -405,7 +585,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
405
585
|
aria-labelledby="inline-edit-state-invalid-label inline-edit-state-invalid-edit-button"
|
|
406
586
|
>
|
|
407
587
|
<span class="pf-v6-c-button__icon">
|
|
408
|
-
<
|
|
588
|
+
<svg
|
|
589
|
+
class="pf-v6-svg"
|
|
590
|
+
viewBox="0 0 512 512"
|
|
591
|
+
fill="currentColor"
|
|
592
|
+
aria-hidden="true"
|
|
593
|
+
role="img"
|
|
594
|
+
width="1em"
|
|
595
|
+
height="1em"
|
|
596
|
+
>
|
|
597
|
+
<path
|
|
598
|
+
d="M497.9 142.1l-46.1 46.1c-4.7 4.7-12.3 4.7-17 0l-111-111c-4.7-4.7-4.7-12.3 0-17l46.1-46.1c18.7-18.7 49.1-18.7 67.9 0l60.1 60.1c18.8 18.7 18.8 49.1 0 67.9zM284.2 99.8L21.6 362.4.4 483.9c-2.9 16.4 11.4 30.6 27.8 27.8l121.5-21.3 262.6-262.6c4.7-4.7 4.7-12.3 0-17l-111-111c-4.8-4.7-12.4-4.7-17.1 0zM124.1 339.9c-5.5-5.5-5.5-14.3 0-19.8l154-154c5.5-5.5 14.3-5.5 19.8 0s5.5 14.3 0 19.8l-154 154c-5.5 5.5-14.3 5.5-19.8 0zM88 424h48v36.3l-64.5 11.3-31.1-31.1L51.7 376H88v48z"
|
|
599
|
+
/>
|
|
600
|
+
</svg>
|
|
409
601
|
</span>
|
|
410
602
|
</button>
|
|
411
603
|
</div>
|
|
@@ -436,7 +628,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
436
628
|
aria-label="Save edits"
|
|
437
629
|
>
|
|
438
630
|
<span class="pf-v6-c-button__icon">
|
|
439
|
-
<
|
|
631
|
+
<svg
|
|
632
|
+
class="pf-v6-svg"
|
|
633
|
+
viewBox="0 0 512 512"
|
|
634
|
+
fill="currentColor"
|
|
635
|
+
aria-hidden="true"
|
|
636
|
+
role="img"
|
|
637
|
+
width="1em"
|
|
638
|
+
height="1em"
|
|
639
|
+
>
|
|
640
|
+
<path
|
|
641
|
+
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
|
|
642
|
+
/>
|
|
643
|
+
</svg>
|
|
440
644
|
</span>
|
|
441
645
|
</button>
|
|
442
646
|
</div>
|
|
@@ -447,7 +651,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
447
651
|
aria-label="Cancel edits"
|
|
448
652
|
>
|
|
449
653
|
<span class="pf-v6-c-button__icon">
|
|
450
|
-
<
|
|
654
|
+
<svg
|
|
655
|
+
class="pf-v6-svg"
|
|
656
|
+
viewBox="0 0 20 20"
|
|
657
|
+
fill="currentColor"
|
|
658
|
+
aria-hidden="true"
|
|
659
|
+
role="img"
|
|
660
|
+
width="1em"
|
|
661
|
+
height="1em"
|
|
662
|
+
>
|
|
663
|
+
<path
|
|
664
|
+
d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
|
|
665
|
+
/>
|
|
666
|
+
</svg>
|
|
451
667
|
</span>
|
|
452
668
|
</button>
|
|
453
669
|
</div>
|
|
@@ -644,7 +860,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
644
860
|
aria-label="Save edits"
|
|
645
861
|
>
|
|
646
862
|
<span class="pf-v6-c-button__icon">
|
|
647
|
-
<
|
|
863
|
+
<svg
|
|
864
|
+
class="pf-v6-svg"
|
|
865
|
+
viewBox="0 0 512 512"
|
|
866
|
+
fill="currentColor"
|
|
867
|
+
aria-hidden="true"
|
|
868
|
+
role="img"
|
|
869
|
+
width="1em"
|
|
870
|
+
height="1em"
|
|
871
|
+
>
|
|
872
|
+
<path
|
|
873
|
+
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
|
|
874
|
+
/>
|
|
875
|
+
</svg>
|
|
648
876
|
</span>
|
|
649
877
|
</button>
|
|
650
878
|
</div>
|
|
@@ -655,7 +883,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
655
883
|
aria-label="Cancel edits"
|
|
656
884
|
>
|
|
657
885
|
<span class="pf-v6-c-button__icon">
|
|
658
|
-
<
|
|
886
|
+
<svg
|
|
887
|
+
class="pf-v6-svg"
|
|
888
|
+
viewBox="0 0 20 20"
|
|
889
|
+
fill="currentColor"
|
|
890
|
+
aria-hidden="true"
|
|
891
|
+
role="img"
|
|
892
|
+
width="1em"
|
|
893
|
+
height="1em"
|
|
894
|
+
>
|
|
895
|
+
<path
|
|
896
|
+
d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
|
|
897
|
+
/>
|
|
898
|
+
</svg>
|
|
659
899
|
</span>
|
|
660
900
|
</button>
|
|
661
901
|
</div>
|
|
@@ -669,7 +909,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
669
909
|
aria-labelledby="bulk-edit-table-example-label bulk-edit-table-example-row-1-edit-button"
|
|
670
910
|
>
|
|
671
911
|
<span class="pf-v6-c-button__icon">
|
|
672
|
-
<
|
|
912
|
+
<svg
|
|
913
|
+
class="pf-v6-svg"
|
|
914
|
+
viewBox="0 0 512 512"
|
|
915
|
+
fill="currentColor"
|
|
916
|
+
aria-hidden="true"
|
|
917
|
+
role="img"
|
|
918
|
+
width="1em"
|
|
919
|
+
height="1em"
|
|
920
|
+
>
|
|
921
|
+
<path
|
|
922
|
+
d="M497.9 142.1l-46.1 46.1c-4.7 4.7-12.3 4.7-17 0l-111-111c-4.7-4.7-4.7-12.3 0-17l46.1-46.1c18.7-18.7 49.1-18.7 67.9 0l60.1 60.1c18.8 18.7 18.8 49.1 0 67.9zM284.2 99.8L21.6 362.4.4 483.9c-2.9 16.4 11.4 30.6 27.8 27.8l121.5-21.3 262.6-262.6c4.7-4.7 4.7-12.3 0-17l-111-111c-4.8-4.7-12.4-4.7-17.1 0zM124.1 339.9c-5.5-5.5-5.5-14.3 0-19.8l154-154c5.5-5.5 14.3-5.5 19.8 0s5.5 14.3 0 19.8l-154 154c-5.5 5.5-14.3 5.5-19.8 0zM88 424h48v36.3l-64.5 11.3-31.1-31.1L51.7 376H88v48z"
|
|
923
|
+
/>
|
|
924
|
+
</svg>
|
|
673
925
|
</span>
|
|
674
926
|
</button>
|
|
675
927
|
</div>
|
|
@@ -683,7 +935,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
683
935
|
aria-label="Table actions"
|
|
684
936
|
>
|
|
685
937
|
<span class="pf-v6-c-menu-toggle__icon">
|
|
686
|
-
<
|
|
938
|
+
<svg
|
|
939
|
+
class="pf-v6-svg"
|
|
940
|
+
viewBox="0 0 32 32"
|
|
941
|
+
fill="currentColor"
|
|
942
|
+
aria-hidden="true"
|
|
943
|
+
role="img"
|
|
944
|
+
width="1em"
|
|
945
|
+
height="1em"
|
|
946
|
+
>
|
|
947
|
+
<path
|
|
948
|
+
d="M12.25 5c0-2.068 1.683-3.75 3.75-3.75S19.75 2.932 19.75 5 18.067 8.75 16 8.75 12.25 7.068 12.25 5ZM16 12.25c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Zm0 11c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Z"
|
|
949
|
+
/>
|
|
950
|
+
</svg>
|
|
687
951
|
</span>
|
|
688
952
|
</button>
|
|
689
953
|
</td>
|
|
@@ -833,7 +1097,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
833
1097
|
aria-label="Save edits"
|
|
834
1098
|
>
|
|
835
1099
|
<span class="pf-v6-c-button__icon">
|
|
836
|
-
<
|
|
1100
|
+
<svg
|
|
1101
|
+
class="pf-v6-svg"
|
|
1102
|
+
viewBox="0 0 512 512"
|
|
1103
|
+
fill="currentColor"
|
|
1104
|
+
aria-hidden="true"
|
|
1105
|
+
role="img"
|
|
1106
|
+
width="1em"
|
|
1107
|
+
height="1em"
|
|
1108
|
+
>
|
|
1109
|
+
<path
|
|
1110
|
+
d="M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z"
|
|
1111
|
+
/>
|
|
1112
|
+
</svg>
|
|
837
1113
|
</span>
|
|
838
1114
|
</button>
|
|
839
1115
|
</div>
|
|
@@ -844,7 +1120,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
844
1120
|
aria-label="Cancel edits"
|
|
845
1121
|
>
|
|
846
1122
|
<span class="pf-v6-c-button__icon">
|
|
847
|
-
<
|
|
1123
|
+
<svg
|
|
1124
|
+
class="pf-v6-svg"
|
|
1125
|
+
viewBox="0 0 20 20"
|
|
1126
|
+
fill="currentColor"
|
|
1127
|
+
aria-hidden="true"
|
|
1128
|
+
role="img"
|
|
1129
|
+
width="1em"
|
|
1130
|
+
height="1em"
|
|
1131
|
+
>
|
|
1132
|
+
<path
|
|
1133
|
+
d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
|
|
1134
|
+
/>
|
|
1135
|
+
</svg>
|
|
848
1136
|
</span>
|
|
849
1137
|
</button>
|
|
850
1138
|
</div>
|
|
@@ -858,7 +1146,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
858
1146
|
aria-labelledby="bulk-edit-table-example-label bulk-edit-table-example-row-2-edit-button"
|
|
859
1147
|
>
|
|
860
1148
|
<span class="pf-v6-c-button__icon">
|
|
861
|
-
<
|
|
1149
|
+
<svg
|
|
1150
|
+
class="pf-v6-svg"
|
|
1151
|
+
viewBox="0 0 512 512"
|
|
1152
|
+
fill="currentColor"
|
|
1153
|
+
aria-hidden="true"
|
|
1154
|
+
role="img"
|
|
1155
|
+
width="1em"
|
|
1156
|
+
height="1em"
|
|
1157
|
+
>
|
|
1158
|
+
<path
|
|
1159
|
+
d="M497.9 142.1l-46.1 46.1c-4.7 4.7-12.3 4.7-17 0l-111-111c-4.7-4.7-4.7-12.3 0-17l46.1-46.1c18.7-18.7 49.1-18.7 67.9 0l60.1 60.1c18.8 18.7 18.8 49.1 0 67.9zM284.2 99.8L21.6 362.4.4 483.9c-2.9 16.4 11.4 30.6 27.8 27.8l121.5-21.3 262.6-262.6c4.7-4.7 4.7-12.3 0-17l-111-111c-4.8-4.7-12.4-4.7-17.1 0zM124.1 339.9c-5.5-5.5-5.5-14.3 0-19.8l154-154c5.5-5.5 14.3-5.5 19.8 0s5.5 14.3 0 19.8l-154 154c-5.5 5.5-14.3 5.5-19.8 0zM88 424h48v36.3l-64.5 11.3-31.1-31.1L51.7 376H88v48z"
|
|
1160
|
+
/>
|
|
1161
|
+
</svg>
|
|
862
1162
|
</span>
|
|
863
1163
|
</button>
|
|
864
1164
|
</div>
|
|
@@ -872,7 +1172,19 @@ Inline edit **action-group** contains save and cancel actions and is only visibl
|
|
|
872
1172
|
aria-label="Table actions"
|
|
873
1173
|
>
|
|
874
1174
|
<span class="pf-v6-c-menu-toggle__icon">
|
|
875
|
-
<
|
|
1175
|
+
<svg
|
|
1176
|
+
class="pf-v6-svg"
|
|
1177
|
+
viewBox="0 0 32 32"
|
|
1178
|
+
fill="currentColor"
|
|
1179
|
+
aria-hidden="true"
|
|
1180
|
+
role="img"
|
|
1181
|
+
width="1em"
|
|
1182
|
+
height="1em"
|
|
1183
|
+
>
|
|
1184
|
+
<path
|
|
1185
|
+
d="M12.25 5c0-2.068 1.683-3.75 3.75-3.75S19.75 2.932 19.75 5 18.067 8.75 16 8.75 12.25 7.068 12.25 5ZM16 12.25c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Zm0 11c-2.067 0-3.75 1.682-3.75 3.75s1.683 3.75 3.75 3.75 3.75-1.682 3.75-3.75-1.683-3.75-3.75-3.75Z"
|
|
1186
|
+
/>
|
|
1187
|
+
</svg>
|
|
876
1188
|
</span>
|
|
877
1189
|
</button>
|
|
878
1190
|
</td>
|
|
@@ -103,7 +103,19 @@ Use the input group to extend form controls by adding text, buttons, selects, et
|
|
|
103
103
|
<span class="pf-v6-c-menu-toggle__text">Select</span>
|
|
104
104
|
<span class="pf-v6-c-menu-toggle__controls">
|
|
105
105
|
<span class="pf-v6-c-menu-toggle__toggle-icon">
|
|
106
|
-
<
|
|
106
|
+
<svg
|
|
107
|
+
class="pf-v6-svg"
|
|
108
|
+
viewBox="0 0 20 20"
|
|
109
|
+
fill="currentColor"
|
|
110
|
+
aria-hidden="true"
|
|
111
|
+
role="img"
|
|
112
|
+
width="1em"
|
|
113
|
+
height="1em"
|
|
114
|
+
>
|
|
115
|
+
<path
|
|
116
|
+
d="M18.92 5.62C18.77 5.25 18.4 5 18 5H2a1.003 1.003 0 0 0-.71 1.71l7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65c.29-.29.37-.72.22-1.09Z"
|
|
117
|
+
/>
|
|
118
|
+
</svg>
|
|
107
119
|
</span>
|
|
108
120
|
</span>
|
|
109
121
|
</button>
|
|
@@ -211,7 +223,19 @@ Use the input group to extend form controls by adding text, buttons, selects, et
|
|
|
211
223
|
aria-label="Popover for input"
|
|
212
224
|
>
|
|
213
225
|
<span class="pf-v6-c-button__icon">
|
|
214
|
-
<
|
|
226
|
+
<svg
|
|
227
|
+
class="pf-v6-svg"
|
|
228
|
+
viewBox="0 0 512 512"
|
|
229
|
+
fill="currentColor"
|
|
230
|
+
aria-hidden="true"
|
|
231
|
+
role="img"
|
|
232
|
+
width="1em"
|
|
233
|
+
height="1em"
|
|
234
|
+
>
|
|
235
|
+
<path
|
|
236
|
+
d="M504 256c0 136.997-111.043 248-248 248S8 392.997 8 256C8 119.083 119.043 8 256 8s248 111.083 248 248zM262.655 90c-54.497 0-89.255 22.957-116.549 63.758-3.536 5.286-2.353 12.415 2.715 16.258l34.699 26.31c5.205 3.947 12.621 3.008 16.665-2.122 17.864-22.658 30.113-35.797 57.303-35.797 20.429 0 45.698 13.148 45.698 32.958 0 14.976-12.363 22.667-32.534 33.976C247.128 238.528 216 254.941 216 296v4c0 6.627 5.373 12 12 12h56c6.627 0 12-5.373 12-12v-1.333c0-28.462 83.186-29.647 83.186-106.667 0-58.002-60.165-102-116.531-102zM256 338c-25.365 0-46 20.635-46 46 0 25.364 20.635 46 46 46s46-20.636 46-46c0-25.365-20.635-46-46-46z"
|
|
237
|
+
/>
|
|
238
|
+
</svg>
|
|
215
239
|
</span>
|
|
216
240
|
</button>
|
|
217
241
|
</div>
|
|
@@ -235,7 +259,19 @@ Use the input group to extend form controls by adding text, buttons, selects, et
|
|
|
235
259
|
aria-label="Popover for input"
|
|
236
260
|
>
|
|
237
261
|
<span class="pf-v6-c-button__icon">
|
|
238
|
-
<
|
|
262
|
+
<svg
|
|
263
|
+
class="pf-v6-svg"
|
|
264
|
+
viewBox="0 0 512 512"
|
|
265
|
+
fill="currentColor"
|
|
266
|
+
aria-hidden="true"
|
|
267
|
+
role="img"
|
|
268
|
+
width="1em"
|
|
269
|
+
height="1em"
|
|
270
|
+
>
|
|
271
|
+
<path
|
|
272
|
+
d="M504 256c0 136.997-111.043 248-248 248S8 392.997 8 256C8 119.083 119.043 8 256 8s248 111.083 248 248zM262.655 90c-54.497 0-89.255 22.957-116.549 63.758-3.536 5.286-2.353 12.415 2.715 16.258l34.699 26.31c5.205 3.947 12.621 3.008 16.665-2.122 17.864-22.658 30.113-35.797 57.303-35.797 20.429 0 45.698 13.148 45.698 32.958 0 14.976-12.363 22.667-32.534 33.976C247.128 238.528 216 254.941 216 296v4c0 6.627 5.373 12 12 12h56c6.627 0 12-5.373 12-12v-1.333c0-28.462 83.186-29.647 83.186-106.667 0-58.002-60.165-102-116.531-102zM256 338c-25.365 0-46 20.635-46 46 0 25.364 20.635 46 46 46s46-20.636 46-46c0-25.365-20.635-46-46-46z"
|
|
273
|
+
/>
|
|
274
|
+
</svg>
|
|
239
275
|
</span>
|
|
240
276
|
</button>
|
|
241
277
|
</div>
|
|
@@ -263,7 +299,7 @@ Use the input group to extend form controls by adding text, buttons, selects, et
|
|
|
263
299
|
|
|
264
300
|
### Accessibility
|
|
265
301
|
|
|
266
|
-
When using the `.pf-v6-c-input-group` always ensure labels are used outside the input group with the `.pf-v6-screen-reader` class applied. You can also make use of the `aria-describedby`, `aria-label`, or `aria-labelledby` attributes. For more information on accessibility and forms see the [form component](/components/form).
|
|
302
|
+
When using the `.pf-v6-c-input-group` always ensure labels are used outside the input group with the `.pf-v6-screen-reader` class applied. You can also make use of the `aria-describedby`, `aria-label`, or `aria-labelledby` attributes. For more information on accessibility and forms see the [form component](/components/forms/form).
|
|
267
303
|
|
|
268
304
|
| Attribute | Applied to | Outcome |
|
|
269
305
|
| -- | -- | -- |
|