tabletop-commander/app/layout.tsx

52 lines
1.5 KiB
TypeScript

import type { Metadata } from "next";
import { Inter } from "next/font/google";
import "./globals.css";
import {
BookOpenIcon,
CircleStackIcon,
Cog8ToothIcon,
PuzzlePieceIcon,
} from "@heroicons/react/24/solid";
const inter = Inter({ subsets: ["latin"] });
export const metadata: Metadata = {
title: "Create Next App",
description: "Generated by create next app",
};
export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
return (
<html lang="en">
<body className={inter.className + " flex min-h-[100vh]"}>
<nav className="h-[100vh] p-8 rounded-r-3xl bg-mixed-300 w-max shadow-2xl">
<h1 className="text-lg font-bold pb-6 border-b border-dark-500">
Tabletop Commander
</h1>
<ul className="my-6 flex flex-col gap-6">
<li className="flex items-center gap-2">
<CircleStackIcon className="w-6 h-6" />Schemas
</li>
<li className="flex items-center gap-2">
<PuzzlePieceIcon className="w-6 h-6" />Game Systems
</li>
<li className="flex items-center gap-2">
<BookOpenIcon className="w-6 h-6" />Publications
</li>
<li className="flex items-center gap-2">
<Cog8ToothIcon className="w-6 h-6" />Settings
</li>
</ul>
</nav>
<main className="p-8 w-full">
{children}
</main>
</body>
</html>
);
}