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
/** @jsxImportSource https://esm.sh/react */
const tabs = { "/home": "Home", "/browse": "Browse", "/faq": "FAQ" };
export default function({ activeTab, children }) {
return (
<html>
<head>
<title>Date Me Directory</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://cdn.tailwindcss.com" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/quicklink/2.3.0/quicklink.umd.js"></script>
<script
dangerouslySetInnerHTML={{
__html: `window.addEventListener('load', () => {
quicklink.listen();
});`,
}}
>
</script>
</head>
<body>
<div className="p-4 space-x-4 flex">
<div className="font-bold">Date Me Directory</div>
{Object.entries(tabs).map(([link, title]) => (
<a
href={link}
key={link}
className={`${activeTab === link ? "" : "text-gray-400 hover:text-gray-500"}`}
>
{title}
</a>
))}
</div>
{children}
</body>
</html>
);
}
Val Town is a social website to write and deploy JavaScript.
Build APIs and schedule functions from your browser.
Comments
Nobody has commented on this val yet: be the first!
February 27, 2024