Forked from stevekrouse/dateme_layout
Public
Script
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
/** @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>I'm Looking for a Man In Finance</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>
)}
<audio
controls
src="https://vawogbemi-public-bucket.s3.us-west-2.amazonaws.com/Girl+On+Couch+x+Billented+-+Man+In+Finance.mp3"
>
</audio>
</div>
{children}
</body>
</html>
);
}
June 21, 2024