diff --git a/web/src/assets/styles/blocks.scss b/web/src/assets/styles/blocks.scss index 73872defe9..0777d103cb 100644 --- a/web/src/assets/styles/blocks.scss +++ b/web/src/assets/styles/blocks.scss @@ -295,14 +295,6 @@ span.notification-mark[data-variant="sidebar"] { } } -.device-selector { - @extend .device-list; - - [role="option"] { - cursor: pointer; - } -} - // compact lists in popover .pf-c-popover li + li { margin: 0; diff --git a/web/src/assets/styles/patternfly-overrides.scss b/web/src/assets/styles/patternfly-overrides.scss index 758bb3c6b3..6b8c3c904a 100644 --- a/web/src/assets/styles/patternfly-overrides.scss +++ b/web/src/assets/styles/patternfly-overrides.scss @@ -170,3 +170,8 @@ table td > .pf-c-empty-state { .password-toggler span.pf-c-button__icon { display: flex; } + +.pf-c-toggle-group__button.pf-m-selected { + --pf-c-toggle-group__button--m-selected--BackgroundColor: var(--color-primary); + --pf-c-toggle-group__button--Color: var(--color-gray-light); +} diff --git a/web/src/assets/styles/utilities.scss b/web/src/assets/styles/utilities.scss index 81a8ec0db6..5af45860fb 100644 --- a/web/src/assets/styles/utilities.scss +++ b/web/src/assets/styles/utilities.scss @@ -151,3 +151,7 @@ inline-size: 95dvw; max-inline-size: calc(var(--ui-max-inline-size) + var(--spacer-large)) } + +.cursor-pointer { + cursor: pointer; +} diff --git a/web/src/components/storage/ProposalSettingsSection.jsx b/web/src/components/storage/ProposalSettingsSection.jsx index 89a59a3e78..e2ed3620aa 100644 --- a/web/src/components/storage/ProposalSettingsSection.jsx +++ b/web/src/components/storage/ProposalSettingsSection.jsx @@ -208,7 +208,7 @@ const LVMSettingsForm = ({ return (
- {_("Devices in which to create the volume group")} + {_("Devices for creating the volume group")} { return ( diff --git a/web/src/components/storage/device-utils.jsx b/web/src/components/storage/device-utils.jsx index 26f14485cc..25276616a1 100644 --- a/web/src/components/storage/device-utils.jsx +++ b/web/src/components/storage/device-utils.jsx @@ -34,8 +34,7 @@ import { deviceSize } from "~/components/storage/utils"; const ListBox = ({ children, ...props }) =>
    {children}
; -const ListBoxItem = ({ isSelected, children, onClick }) => { - const props = {}; +const ListBoxItem = ({ isSelected, children, onClick, ...props }) => { if (isSelected) props['aria-selected'] = true; return ( @@ -259,12 +258,13 @@ const DeviceSelector = ({ selected, devices = [], isMultiple = false, onChange = }; return ( - + { devices.map(device => ( onOptionClick(device.name)} isSelected={isSelected(device.name)} + className="cursor-pointer" >