Arnab-Afk/nextplacement
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feat: Refactored the whole ui

Browse Source
This commit is contained in:
Anushlinux
2025-07-03 01:21:40 +05:30
parent ef98f8e1ba
commit 57e25f663b
3 changed files with 73 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
apps/admin/app/(main)/layout.tsx
View File

@@ -1,72 +1,36 @@
import {
NavigationMenu,
NavigationMenuContent,
NavigationMenuItem,
NavigationMenuLink,
NavigationMenuList,
NavigationMenuTrigger,
navigationMenuTriggerStyle,
} from '@workspace/ui/components/navigation-menu';
import Link from 'next/link';
const navLinks = [
{ href: '/', label: 'Home', icon: '🏠' },
{ href: '/students', label: 'Students', icon: '🎓' },
{ href: '/jobs', label: 'Jobs', icon: '💼' },
{ href: '/', label: 'Dashboard' },
{ href: '/students', label: 'Students' },
{ href: '/jobs', label: 'Jobs' },
];
export default function MainLayout({ children }: { children: React.ReactNode }) {
// Helper to check active link (client-side only)
const isActive = (href: string) => {
if (typeof window === 'undefined') return false;
if (href === '/') return window.location.pathname === '/';
return window.location.pathname.startsWith(href);
};
return (
<div className="flex min-h-screen bg-background text-foreground">
{/* Sidebar */}
<aside className="hidden md:flex flex-col w-64 p-6 gap-8">
<div className="sticky top-8">
<div className="flex flex-col gap-6 rounded-2xl shadow-xl bg-sidebar border border-sidebar-border p-6">
<div className="flex items-center gap-3 mb-6">
<img src="/favicon.ico" alt="Logo" className="w-10 h-10" />
<span className="font-extrabold text-xl tracking-tight text-sidebar-primary">Admin Portal</span>
</div>
<div className="text-xs uppercase font-semibold text-muted-foreground mb-2 tracking-widest pl-1">Navigation</div>
<nav className="flex flex-col gap-2">
{navLinks.map((link) => (
<Link
key={link.href}
href={link.href}
className="flex items-center gap-3 px-4 py-2 rounded-xl font-medium transition-colors text-sidebar-foreground hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 focus-visible:ring-sidebar-accent data-[active=true]:bg-primary data-[active=true]:text-primary-foreground"
data-active={typeof window !== 'undefined' && isActive(link.href)}
>
<span className="text-lg">{link.icon}</span>
{link.label}
</Link>
))}
</nav>
<div className="min-h-screen bg-[#f8fafc] font-sans">
{/* Sticky top navbar */}
<header className="sticky top-0 z-30 w-full bg-[#1e293b] shadow-lg">
<div className="max-w-7xl mx-auto flex items-center justify-between px-6 py-3">
<div className="flex items-center gap-3">
<img src="/favicon.ico" alt="Logo" className="w-9 h-9 rounded-lg shadow" />
<span className="font-extrabold text-2xl tracking-tight text-white">NextPlacement</span>
</div>
<nav className="flex gap-2 md:gap-6">
{navLinks.map((link) => (
<Link
key={link.href}
href={link.href}
className="px-4 py-2 rounded-lg font-medium text-white hover:underline hover:underline-offset-8 hover:decoration-4 hover:decoration-red-500 transition-colors focus-visible:ring-2 focus-visible:ring-blue-300"
prefetch={false}
>
{link.label}
</Link>
))}
</nav>
</div>
</aside>
{/* Main content */}
<div className="flex-1 flex flex-col min-h-screen">
<header className="md:hidden flex items-center justify-between h-16 border-b bg-background px-4">
<NavigationMenu>
<NavigationMenuList>
{navLinks.map((link) => (
<NavigationMenuItem key={link.href}>
<NavigationMenuLink asChild>
<Link href={link.href}>{link.label}</Link>
</NavigationMenuLink>
</NavigationMenuItem>
))}
</NavigationMenuList>
</NavigationMenu>
</header>
<main className="flex-1 bg-background text-foreground p-4 md:p-10">{children}</main>
</div>
</header>
<main className="max-w-7xl mx-auto px-4 py-8 md:py-12 bg-[#f8fafc] min-h-screen">{children}</main>
</div>
);
}