35 lines
689 B
TypeScript
35 lines
689 B
TypeScript
|
import { JSX } from "preact";
|
||
|
|
|
||
|
|
const NAV_ITEMS = {
|
||
|
|
"/note": "Notes",
|
||
|
|
"/register": "Register",
|
||
|
|
"/login": "Login",
|
||
|
|
};
|
||
|
|
|
||
|
|
const navItem = ([url, text]: [string, string]) => {
|
||
|
|
return (
|
||
|
|
<a class="px-4 py-2 text-blue-500 hover:bg-gray-900" href={url}>{text}</a>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export function Page(props: JSX.HTMLAttributes<HTMLDivElement>) {
|
||
|
|
return (
|
||
|
|
<div>
|
||
|
|
<header>
|
||
|
|
<h1>
|
||
|
|
<a href="/">LyricScreen</a>
|
||
|
|
</h1>
|
||
|
|
<nav class="flex">
|
||
|
|
{Object.entries(NAV_ITEMS).map(navItem)}
|
||
|
|
</nav>
|
||
|
|
</header>
|
||
|
|
<main>
|
||
|
|
{props.children}
|
||
|
|
</main>
|
||
|
|
<footer>
|
||
|
|
"It's a bit much, really..."
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|