66 lines
1.6 KiB
TypeScript
66 lines
1.6 KiB
TypeScript
import "./style.css";
|
|
import "./tailwind.css";
|
|
|
|
import type { JSX } from "solid-js";
|
|
import logoUrl from "../assets/Nagai Title Horizontal.svg";
|
|
import { Link } from "../components/Link.js";
|
|
|
|
export default function LayoutDefault(props: { children?: JSX.Element }) {
|
|
return (
|
|
<div class={"flex flex-col max-w-5xl m-auto"}>
|
|
<Logo />
|
|
<Topbar>
|
|
<Link href="/">Home</Link>
|
|
<Separator />
|
|
<Link href="/events">Events</Link>
|
|
<Separator />
|
|
<Link href="/downloads">Downloads</Link>
|
|
<Separator />
|
|
<Link href="https://git.nagai.cc/nagai">Source Code</Link>
|
|
<Separator />
|
|
<Link href="/about">About</Link>
|
|
</Topbar>
|
|
<Content>{props.children}</Content>
|
|
<Footer/>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function Separator() {
|
|
return <p id="seperator" class={"text-white py-[2px] select-none"}>|</p>;
|
|
}
|
|
|
|
function Topbar(props: { children: JSX.Element }) {
|
|
return (
|
|
<div id="sidebar" class={"px-5 flex flex-row shrink-0 bg-black rounded-full justify-center items-center m-auto"}>
|
|
{props.children}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function Content(props: { children: JSX.Element }) {
|
|
return (
|
|
<div id="page-container">
|
|
<div id="page-content" class={"p-5 pb-8"}>
|
|
{props.children}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function Footer() {
|
|
const currentYear = new Date().getFullYear();
|
|
return (
|
|
<footer class="m-auto" id="footer">Copyright © {currentYear} Nagai Team and contributors. Some rights reserved.</footer>
|
|
);
|
|
}
|
|
|
|
function Logo() {
|
|
return (
|
|
<div class={"p-5 mb-4 m-auto"}>
|
|
<a href="/">
|
|
<img src={logoUrl} id="main-logo" alt="logo" />
|
|
</a>
|
|
</div>
|
|
);
|
|
}
|