Change menu styles (#132)

* Change ProjectMenu placement

* Reduce UserMenu width
This commit is contained in:
arcticfly
2023-08-10 18:48:23 -07:00
committed by GitHub
parent 454ac9a0d3
commit 76c34d64e6
2 changed files with 4 additions and 3 deletions

View File

@@ -67,7 +67,7 @@ export default function ProjectMenu() {
> >
PROJECT PROJECT
</Text> </Text>
<Popover placement="right" isOpen={popover.isOpen} onClose={popover.onClose} closeOnBlur> <Popover placement="right-end" isOpen={popover.isOpen} onClose={popover.onClose} closeOnBlur>
<PopoverTrigger> <PopoverTrigger>
<NavSidebarOption> <NavSidebarOption>
<HStack w="full" onClick={popover.onToggle}> <HStack w="full" onClick={popover.onToggle}>
@@ -90,7 +90,7 @@ export default function ProjectMenu() {
</HStack> </HStack>
</NavSidebarOption> </NavSidebarOption>
</PopoverTrigger> </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}> <VStack alignItems="flex-start" spacing={2} py={4} px={2}>
<Text color="gray.500" fontSize="xs" fontWeight="bold" pb={1}> <Text color="gray.500" fontSize="xs" fontWeight="bold" pb={1}>
PROJECTS PROJECTS
@@ -149,6 +149,7 @@ const ProjectOption = ({
bgColor={isActive ? "gray.100" : "transparent"} bgColor={isActive ? "gray.100" : "transparent"}
_hover={gearHovered ? undefined : { bgColor: "gray.200", textDecoration: "none" }} _hover={gearHovered ? undefined : { bgColor: "gray.200", textDecoration: "none" }}
p={2} p={2}
borderRadius={4}
> >
<Text>{proj.name}</Text> <Text>{proj.name}</Text>
<IconButton <IconButton

View File

@@ -47,7 +47,7 @@ export default function UserMenu({ user, ...rest }: { user: Session } & StackPro
</HStack> </HStack>
</NavSidebarOption> </NavSidebarOption>
</PopoverTrigger> </PopoverTrigger>
<PopoverContent _focusVisible={{ outline: "unset" }} ml={-1}> <PopoverContent _focusVisible={{ outline: "unset" }} ml={-1} minW={48} w="full">
<VStack align="stretch" spacing={0}> <VStack align="stretch" spacing={0}>
{/* sign out */} {/* sign out */}
<HStack <HStack