Ling0925
/
buster
mirror of https://github.com/buster-so/buster.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix dropdown on metric title

This commit is contained in:
Nate Kelley 2025-08-07 15:26:52 -06:00
parent 358e74149a
commit 991dd172f6
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
2 changed files with 11 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
apps/web/src/components/ui/metric/MetricCardThreeMenuContainer.tsx
View File

@ -22,16 +22,14 @@ export const MetricCardThreeMenuContainer = React.memo(
}}
className={cn(
// Use opacity and pointer-events instead of display:none to maintain positioning context
'w-8.5 rounded transition-opacity duration-75',
'pointer-events-none opacity-0 group-hover:pointer-events-auto group-hover:opacity-100',
className,
isOpen && 'pointer-events-auto opacity-100'
'-mr-2 hidden group-hover:block',
'group-hover:pointer-events-auto',
isOpen && 'pointer-events-auto block',
className
)}>
<div className="absolute top-3 right-1.5">
<Dropdown items={dropdownItems} side="top" align="end" onOpenChange={setIsOpen}>
{children}
</Dropdown>
</div>
<Dropdown items={dropdownItems} side="top" align="end" onOpenChange={setIsOpen}>
{children}
</Dropdown>
</div>
);
}

8
apps/web/src/components/ui/metric/MetricTitle.tsx
View File

@ -37,8 +37,8 @@ export const MetricTitle: React.FC<{
});
return (
<>
<div className={'flex h-full cursor-pointer flex-col space-y-0.5 overflow-hidden'}>
<div className="group flex h-full min-h-0 w-full flex-1 flex-nowrap space-x-0.5">
<div className={'flex h-full flex-1 cursor-pointer flex-col space-y-0.5 overflow-hidden'}>
<div className="flex w-full justify-between space-x-0.5 overflow-hidden">
<Title
as="h4"
@ -66,10 +66,10 @@ export const MetricTitle: React.FC<{
{isDragOverlay || readOnly ? null : (
<MetricCardThreeMenuContainer dropdownItems={threeDotMenuItems}>
<Button variant="ghost" className="bg-item-hover!" prefix={<DotsVertical />} />
<Button variant="ghost" className="hover:bg-item-active" prefix={<DotsVertical />} />
</MetricCardThreeMenuContainer>
)}
</>
</div>
);
}
);