github/infisical
1
0
Fork 0
mirror of https://github.com/Infisical/infisical.git synced 2026-01-10 07:58:15 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix nav

Browse Source
This commit is contained in:
Daniel Hougaard
2025-02-25 18:03:13 +09:00
parent 87d383a9c4
commit c121bd930b
2 changed files with 51 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/v2/Dropdown/Dropdown.tsx
View File

@@ -20,7 +20,7 @@ export const DropdownMenuContent = forwardRef<HTMLDivElement, DropdownMenuConten
return (
<DropdownMenuPrimitive.Portal>
<DropdownMenuPrimitive.Content
sideOffset={10}
sideOffset={-8}
{...props}
ref={forwardedRef}
className={twMerge(

67
frontend/src/layouts/OrganizationLayout/components/MinimizedOrgSidebar/MinimizedOrgSidebar.tsx
View File

@@ -166,8 +166,12 @@ export const MinimizedOrgSidebar = () => {
<div>
<div className="flex items-center hover:bg-mineshaft-700">
<DropdownMenu open={openOrg} onOpenChange={setOpenOrg} modal>
<DropdownMenuTrigger onMouseEnter={() => setOpenOrg(true)} onMouseLeave={() => setOpenOrg(false)} asChild>
<div className="flex w-full items-center justify-center rounded-md border border-none border-mineshaft-600 p-3 pt-6 pb-5 transition-all">
<DropdownMenuTrigger
onMouseEnter={() => setOpenOrg(true)}
onMouseLeave={() => setOpenOrg(false)}
asChild
>
<div className="flex w-full items-center justify-center rounded-md border border-none border-mineshaft-600 p-3 pb-5 pt-6 transition-all">
<div className="flex h-8 w-8 items-center justify-center rounded-md bg-primary">
{currentOrg?.name.charAt(0)}
</div>
@@ -178,11 +182,11 @@ export const MinimizedOrgSidebar = () => {
onMouseLeave={() => setOpenOrg(false)}
align="start"
side="right"
className="p-1 shadow-mineshaft-600 drop-shadow-md cursor-default mt-6"
className="mt-6 cursor-default p-1 shadow-mineshaft-600 drop-shadow-md"
style={{ minWidth: "220px" }}
>
<div className="px-0.5 py-1">
<div className="flex w-full items-center justify-center rounded-md border border-mineshaft-600 p-1 transition-all duration-300 bg-gradient-to-tr from-primary-500/5 to-mineshaft-800">
<div className="flex w-full items-center justify-center rounded-md border border-mineshaft-600 bg-gradient-to-tr from-primary-500/5 to-mineshaft-800 p-1 transition-all duration-300">
<div className="mr-2 flex h-8 w-8 items-center justify-center rounded-md bg-primary text-black">
{currentOrg?.name.charAt(0)}
</div>
@@ -315,7 +319,11 @@ export const MinimizedOrgSidebar = () => {
</Link>
<div className="my-1 w-full bg-mineshaft-500" style={{ height: "1px" }} />
<DropdownMenu open={open} onOpenChange={setOpen}>
<DropdownMenuTrigger onMouseEnter={() => setOpen(true)} onMouseLeave={() => setOpen(false)} asChild>
<DropdownMenuTrigger
onMouseEnter={() => setOpen(true)}
onMouseLeave={() => setOpen(false)}
asChild
>
<div className="w-full">
<MenuIconButton
lottieIconMode="reverse"
@@ -326,7 +334,13 @@ export const MinimizedOrgSidebar = () => {
</MenuIconButton>
</div>
</DropdownMenuTrigger>
<DropdownMenuContent onMouseEnter={() => setOpen(true)} onMouseLeave={() => setOpen(false)} align="start" side="right" className="p-1">
<DropdownMenuContent
onMouseEnter={() => setOpen(true)}
onMouseLeave={() => setOpen(false)}
align="start"
side="right"
className="p-1"
>
<DropdownMenuLabel>Organization Options</DropdownMenuLabel>
<Link to="/organization/access-management">
<DropdownMenuItem icon={<FontAwesomeIcon className="w-3" icon={faUsers} />}>
@@ -371,13 +385,23 @@ export const MinimizedOrgSidebar = () => {
} flex w-full cursor-default flex-col items-center px-1 text-sm text-mineshaft-400`}
>
<DropdownMenu open={openSupport} onOpenChange={setOpenSupport}>
<DropdownMenuTrigger onMouseEnter={() => setOpenSupport(true)} onMouseLeave={() => setOpenSupport(false)} className="w-full">
<DropdownMenuTrigger
onMouseEnter={() => setOpenSupport(true)}
onMouseLeave={() => setOpenSupport(false)}
className="w-full"
>
<MenuIconButton>
<FontAwesomeIcon icon={faInfoCircle} className="mb-3 text-lg" />
Support
</MenuIconButton>
</DropdownMenuTrigger>
<DropdownMenuContent onMouseEnter={() => setOpenSupport(true)} onMouseLeave={() => setOpenSupport(false)} align="end" side="right" className="p-1">
<DropdownMenuContent
onMouseEnter={() => setOpenSupport(true)}
onMouseLeave={() => setOpenSupport(false)}
align="end"
side="right"
className="p-1"
>
{INFISICAL_SUPPORT_OPTIONS.map(([icon, text, url]) => (
<DropdownMenuItem key={url as string}>
<a
@@ -426,16 +450,27 @@ export const MinimizedOrgSidebar = () => {
</Tooltip>
)}
<DropdownMenu open={openUser} onOpenChange={setOpenUser}>
<DropdownMenuTrigger onMouseEnter={() => setOpenUser(true)} onMouseLeave={() => setOpenUser(false)} className="w-full" asChild>
<DropdownMenuTrigger
onMouseEnter={() => setOpenUser(true)}
onMouseLeave={() => setOpenUser(false)}
className="w-full"
asChild
>
<div>
<MenuIconButton icon="user">User</MenuIconButton>
</div>
</DropdownMenuTrigger>
<DropdownMenuContent onMouseEnter={() => setOpenUser(true)} onMouseLeave={() => setOpenUser(false)} side="right" align="end" className="p-1">
<div className="px-1 py-1 cursor-default">
<div className="flex w-full items-center justify-center rounded-md border border-mineshaft-600 p-1 px-2 transition-all duration-150 bg-gradient-to-tr from-primary-500/10 to-mineshaft-800">
<DropdownMenuContent
onMouseEnter={() => setOpenUser(true)}
onMouseLeave={() => setOpenUser(false)}
side="right"
align="end"
className="p-1"
>
<div className="cursor-default px-1 py-1">
<div className="flex w-full items-center justify-center rounded-md border border-mineshaft-600 bg-gradient-to-tr from-primary-500/10 to-mineshaft-800 p-1 px-2 transition-all duration-150">
<div className="p-1 pr-3">
<FontAwesomeIcon icon={faUser} className="text-mineshaft-400 text-xl" />
<FontAwesomeIcon icon={faUser} className="text-xl text-mineshaft-400" />
</div>
<div className="flex flex-grow flex-col text-white">
<div className="max-w-36 truncate text-ellipsis text-sm font-medium capitalize">
@@ -483,11 +518,9 @@ export const MinimizedOrgSidebar = () => {
</DropdownMenuItem>
</Link>
)}
<div className="pt-1 mt-1 border-t border-mineshaft-600">
<div className="mt-1 border-t border-mineshaft-600 pt-1">
<Link to="/organization/admin">
<DropdownMenuItem>
Organization Admin Console
</DropdownMenuItem>
<DropdownMenuItem>Organization Admin Console</DropdownMenuItem>
</Link>
</div>
<div className="mt-1 h-1 border-t border-mineshaft-600" />