4366-feat(front): Clickable Ascending/Descending menu (#4389)

* feat: clickable menu

* Remove unused hover

---------

Co-authored-by: Thomas Trompette <thomast@twenty.com>
This commit is contained in:
Anchit Sinha 2024-03-11 21:48:41 +05:30 committed by GitHub
parent 4704ef829e
commit d73b1d1a8a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -7,6 +7,7 @@ import { LightIconButton } from '@/ui/input/button/components/LightIconButton';
const StyledHeader = styled.li`
align-items: center;
color: ${({ theme }) => theme.font.color.primary};
cursor: pointer;
display: flex;
font-size: ${({ theme }) => theme.font.size.sm};
font-weight: ${({ theme }) => theme.font.weight.medium};
@ -14,6 +15,10 @@ const StyledHeader = styled.li`
padding: ${({ theme }) => theme.spacing(1)};
user-select: none;
&:hover {
background: ${({ theme }) => theme.background.transparent.light};
}
`;
const StyledChildrenWrapper = styled.span`
@ -41,12 +46,11 @@ export const DropdownMenuHeader = ({
testId,
}: DropdownMenuHeaderProps) => {
return (
<StyledHeader data-testid={testId}>
<StyledHeader data-testid={testId} onClick={onClick}>
{StartIcon && (
<LightIconButton
testId="dropdown-menu-header-end-icon"
Icon={StartIcon}
onClick={onClick}
accent="tertiary"
size="small"
/>
@ -56,7 +60,6 @@ export const DropdownMenuHeader = ({
<StyledLightIconButton
testId="dropdown-menu-header-end-icon"
Icon={EndIcon}
onClick={onClick}
accent="tertiary"
size="small"
/>