refactor: transition logo size

This commit is contained in:
João Gabriel
2025-01-13 09:20:02 -03:00
parent 94ee5391fb
commit c5eb8b087d

View File

@@ -352,19 +352,24 @@ function SidebarLogo() {
> >
<div <div
className={cn( className={cn(
"flex aspect-square items-center justify-center rounded-lg ", "flex aspect-square items-center justify-center rounded-lg transition-all",
state === "collapsed" ? "size-6" : "size-10", state === "collapsed" ? "size-6" : "size-10",
)} )}
> >
<Logo className={state === "collapsed" ? "size-6" : "size-10"} /> <Logo
className={cn(
"transition-all",
state === "collapsed" ? "size-6" : "size-10",
)}
/>
</div> </div>
{state === "expanded" && ( <div className="text-left text-sm leading-tight group-data-[state=open]/collapsible:rotate-90">
<div className="flex flex-col gap-1 text-left text-sm leading-tight group-data-[state=open]/collapsible:rotate-90"> <p className="truncate font-semibold">Dokploy</p>
<span className="truncate font-semibold">Dokploy</span> <p className="truncate text-xs text-muted-foreground">
<span className="truncate text-xs">{dokployVersion}</span> {dokployVersion}
</p>
</div> </div>
)}
</Link> </Link>
); );
} }
@@ -451,11 +456,12 @@ export default function Page({ children }: Props) {
> >
<Sidebar collapsible="icon" variant="floating"> <Sidebar collapsible="icon" variant="floating">
<SidebarHeader> <SidebarHeader>
<SidebarMenu> <SidebarMenuButton
<SidebarMenuItem> className="group-data-[collapsible=icon]:!p-0"
size="lg"
>
<LogoWrapper /> <LogoWrapper />
</SidebarMenuItem> </SidebarMenuButton>
</SidebarMenu>
</SidebarHeader> </SidebarHeader>
<SidebarContent> <SidebarContent>
<SidebarGroup> <SidebarGroup>