feat: implement responsive dashboard shell with integrated sidebar and user profile management

This commit is contained in:
Poyraz Avsever
2026-05-08 11:52:32 +03:00
parent 0233122b6d
commit a08042bf83
+19 -18
View File
@@ -121,18 +121,13 @@ function SidebarPanel({
return ( return (
<aside className="flex h-full flex-col overflow-hidden"> <aside className="flex h-full flex-col overflow-hidden">
{/* Header / Logo */} {/* Header / Logo */}
<div className="pt-8 pb-4 flex justify-center"> <Link
<Link href="/" className="relative flex items-center justify-center" onClick={onNavigate}> href="/"
<Image className="relative font-bold text-xl text-left py-4 pl-6 text-foreground"
src="/logo/logo.png" onClick={onNavigate}
alt="Cognis Logo" >
width={48} Hoş Geldin
height={48} </Link>
className="object-contain transition-transform hover:scale-105"
priority
/>
</Link>
</div>
{/* Main Navigation Links */} {/* Main Navigation Links */}
<nav className="flex-1 space-y-4 px-3 overflow-y-auto tiny-scrollbar mt-4 pb-4"> <nav className="flex-1 space-y-4 px-3 overflow-y-auto tiny-scrollbar mt-4 pb-4">
@@ -147,8 +142,9 @@ function SidebarPanel({
route.href === "/" route.href === "/"
? pathname === "/" ? pathname === "/"
: route.href : route.href
? pathname === route.href || pathname.startsWith(route.href + "/") ? pathname === route.href ||
: false; pathname.startsWith(route.href + "/")
: false;
return ( return (
<Link <Link
@@ -169,7 +165,9 @@ function SidebarPanel({
<route.icon <route.icon
className={cn( className={cn(
"h-[18px] w-[18px] shrink-0 transition-colors", "h-[18px] w-[18px] shrink-0 transition-colors",
isActive ? "text-primary-foreground" : "text-muted-foreground/70", isActive
? "text-primary-foreground"
: "text-muted-foreground/70",
)} )}
strokeWidth={isActive ? 2.5 : 2} strokeWidth={isActive ? 2.5 : 2}
/> />
@@ -194,17 +192,20 @@ function SidebarPanel({
"flex items-center gap-3 rounded-lg px-3 py-2.5 transition-all duration-300 w-full", "flex items-center gap-3 rounded-lg px-3 py-2.5 transition-all duration-300 w-full",
pathname.startsWith("/settings") pathname.startsWith("/settings")
? "bg-primary/20 border border-primary/30 shadow-[0_0_15px_rgba(108,91,176,0.15)] text-foreground font-medium" ? "bg-primary/20 border border-primary/30 shadow-[0_0_15px_rgba(108,91,176,0.15)] text-foreground font-medium"
: "text-muted-foreground hover:text-foreground hover:bg-white/5 border border-transparent" : "text-muted-foreground hover:text-foreground hover:bg-white/5 border border-transparent",
)} )}
> >
<Settings2 className="h-[18px] w-[18px] shrink-0" strokeWidth={pathname.startsWith("/settings") ? 2.5 : 2} /> <Settings2
className="h-[18px] w-[18px] shrink-0"
strokeWidth={pathname.startsWith("/settings") ? 2.5 : 2}
/>
<span className="text-[14px]">Ayarlar</span> <span className="text-[14px]">Ayarlar</span>
</Link> </Link>
</div> </div>
{/* Separator */} {/* Separator */}
<div className="h-[1px] w-full bg-white/5 mb-3" /> <div className="h-[1px] w-full bg-white/5 mb-3" />
<DropdownMenu> <DropdownMenu>
<DropdownMenuTrigger asChild> <DropdownMenuTrigger asChild>
<button <button