diff --git a/packages/web/components/elements/DropdownElements.tsx b/packages/web/components/elements/DropdownElements.tsx index a9657642e..2c6400684 100644 --- a/packages/web/components/elements/DropdownElements.tsx +++ b/packages/web/components/elements/DropdownElements.tsx @@ -16,13 +16,12 @@ const StyledItem = styled(Item, { fontWeight: '400', py: '10px', px: '15px', - borderRadius: 3, cursor: 'default', color: '$utilityTextDefault', '&:focus': { outline: 'none', - backgroundColor: '$grayBgHover', + backgroundColor: '$thLeftMenuBackground', }, }) @@ -32,7 +31,7 @@ const DropdownTrigger = styled(Trigger, { padding: 0, backgroundColor: 'transparent', '&:hover': { - opacity: 0.7, + opacity: 1.0, }, '&:focus': { outline: 'none', @@ -129,7 +128,7 @@ type DropdownProps = { export const DropdownSeparator = styled(Separator, { height: '1px', margin: 0, - backgroundColor: '$grayBorder', + backgroundColor: '$homeDivider', }) type DropdownOptionProps = { diff --git a/packages/web/components/templates/PrimaryDropdown.tsx b/packages/web/components/templates/PrimaryDropdown.tsx index 2785f8a57..659df484f 100644 --- a/packages/web/components/templates/PrimaryDropdown.tsx +++ b/packages/web/components/templates/PrimaryDropdown.tsx @@ -53,9 +53,10 @@ const TriggerButton = (props: TriggerButtonProps): JSX.Element => { alignItems: 'center', borderRadius: '5px', height: '32px', - padding: '5px', + px: '10px', + py: '20px', '&:hover': { - bg: '$thLibraryMenuFooterHover', + bg: '$thLeftMenuBackground', opacity: '0.7px', }, }} @@ -130,7 +131,7 @@ export function PrimaryDropdown(props: PrimaryDropdownProps): JSX.Element { triggerElement={ props.children ?? } - css={{ width: '240px', ml: '15px' }} + css={{ width: '240px', ml: '15px', bg: '$thNavMenuFooter' }} >