63 lines
1.9 KiB
TypeScript
63 lines
1.9 KiB
TypeScript
import type { Metadata } from "next";
|
|
import { Inter } from "next/font/google";
|
|
import "./globals.css";
|
|
import {
|
|
ClerkProvider,
|
|
SignedIn,
|
|
SignedOut,
|
|
SignInButton,
|
|
UserButton,
|
|
} from "@clerk/nextjs";
|
|
import { Sidebar } from "@/components/ui/Sidebar";
|
|
|
|
const inter = Inter({ subsets: ["latin"] });
|
|
|
|
export const metadata: Metadata = {
|
|
title: "FitAI Admin",
|
|
description: "Fitness management admin dashboard",
|
|
};
|
|
|
|
export default function RootLayout({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode;
|
|
}) {
|
|
return (
|
|
<ClerkProvider>
|
|
<html lang="en">
|
|
<body className={`${inter.className} bg-gradient-to-br from-slate-50 via-blue-50 to-slate-100 min-h-screen`}>
|
|
<div className="flex min-h-screen">
|
|
<Sidebar />
|
|
<main className="flex-1 ml-64">
|
|
<div className="sticky top-0 z-40 backdrop-blur-xl bg-white/75 border-b border-slate-200/50 shadow-sm">
|
|
<div className="px-8 py-4 flex items-center justify-between max-w-7xl mx-auto">
|
|
<div>
|
|
<h1 className="text-sm font-semibold text-gray-600 uppercase tracking-wide">FitAI Pro</h1>
|
|
</div>
|
|
<div className="flex items-center gap-4">
|
|
<SignedIn>
|
|
<UserButton
|
|
appearance={{
|
|
elements: {
|
|
avatarBox: "w-10 h-10 rounded-full ring-2 ring-blue-200"
|
|
}
|
|
}}
|
|
/>
|
|
</SignedIn>
|
|
<SignedOut>
|
|
<SignInButton mode="modal" />
|
|
</SignedOut>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="p-8">
|
|
{children}
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</body>
|
|
</html>
|
|
</ClerkProvider>
|
|
);
|
|
}
|