Back
Version 3
8/13/2024
/** @jsxImportSource npm:hono@3/jsx */
import { PropsWithChildren } from "npm:hono/jsx";
const tabs = { "/": "Home", "/browse": "Browse", "/faq": "FAQ" };
export default function({ activeTab, children }: PropsWithChildren<{ activeTab: string }>) {
return (
<html>
<head>
<title>Who's Hiring</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://cdn.tailwindcss.com" />
</head>
<body>
<div class="p-4 gap-x-4 flex items-center">
{Object.entries(tabs).map(([link, title]) => (
<a
href={link}
key={link}
class={`${activeTab === link ? "" : "text-gray-400 hover:text-gray-500"}`}
>
{title === "Home" ? <div class="font-bold text-black">I'm Looking for a Man In Finance</div> : title}
</a>
))}
{activeTab === "/submit" ? null : (
<a
href="/submit"
class="px-2 py-1 border-blue-500 text-blue-500 border border-2 hover:bg-blue-100 rounded-md font-bold rounded ml-4"
>
I am a Man In Finance!
</a>
)}
</div>
{children}
</body>
</html>
Updated: August 19, 2024