From 76c34d64e6b8345324f1c7741ca1f7ce83bfec68 Mon Sep 17 00:00:00 2001
From: arcticfly <41524992+arcticfly@users.noreply.github.com>
Date: Thu, 10 Aug 2023 18:48:23 -0700
Subject: [PATCH] Change menu styles (#132)

* Change ProjectMenu placement

* Reduce UserMenu width
---
 app/src/components/nav/ProjectMenu.tsx | 5 +++--
 app/src/components/nav/UserMenu.tsx    | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/app/src/components/nav/ProjectMenu.tsx b/app/src/components/nav/ProjectMenu.tsx
index f9a2db6..cc4a27b 100644
--- a/app/src/components/nav/ProjectMenu.tsx
+++ b/app/src/components/nav/ProjectMenu.tsx
@@ -67,7 +67,7 @@ export default function ProjectMenu() {
       >
         PROJECT
       </Text>
-      <Popover placement="right" isOpen={popover.isOpen} onClose={popover.onClose} closeOnBlur>
+      <Popover placement="right-end" isOpen={popover.isOpen} onClose={popover.onClose} closeOnBlur>
         <PopoverTrigger>
           <NavSidebarOption>
             <HStack w="full" onClick={popover.onToggle}>
@@ -90,7 +90,7 @@ export default function ProjectMenu() {
             </HStack>
           </NavSidebarOption>
         </PopoverTrigger>
-        <PopoverContent _focusVisible={{ outline: "unset" }} ml={-1}>
+        <PopoverContent _focusVisible={{ outline: "unset" }} ml={-1} minW={0} w="full">
           <VStack alignItems="flex-start" spacing={2} py={4} px={2}>
             <Text color="gray.500" fontSize="xs" fontWeight="bold" pb={1}>
               PROJECTS
@@ -149,6 +149,7 @@ const ProjectOption = ({
       bgColor={isActive ? "gray.100" : "transparent"}
       _hover={gearHovered ? undefined : { bgColor: "gray.200", textDecoration: "none" }}
       p={2}
+      borderRadius={4}
     >
       <Text>{proj.name}</Text>
       <IconButton
diff --git a/app/src/components/nav/UserMenu.tsx b/app/src/components/nav/UserMenu.tsx
index a8ca272..6fcf5a4 100644
--- a/app/src/components/nav/UserMenu.tsx
+++ b/app/src/components/nav/UserMenu.tsx
@@ -47,7 +47,7 @@ export default function UserMenu({ user, ...rest }: { user: Session } & StackPro
             </HStack>
           </NavSidebarOption>
         </PopoverTrigger>
-        <PopoverContent _focusVisible={{ outline: "unset" }} ml={-1}>
+        <PopoverContent _focusVisible={{ outline: "unset" }} ml={-1} minW={48} w="full">
           <VStack align="stretch" spacing={0}>
             {/* sign out */}
             <HStack