44 lines
1.1 KiB
TypeScript
44 lines
1.1 KiB
TypeScript
import { IconGitHub, IconRss } from "@/components/icons.tsx";
|
|
import Logo from "./Logo.tsx";
|
|
import { ComponentChildren } from "preact";
|
|
|
|
function Item(
|
|
{ href, children }: { href: string; children: ComponentChildren },
|
|
) {
|
|
return (
|
|
<a
|
|
href={href}
|
|
class="p-2 flex items-center justify-center rounded-full bg-white shadow-sm hover:shadow-lg"
|
|
>
|
|
{children}
|
|
</a>
|
|
);
|
|
}
|
|
|
|
export default function Header() {
|
|
return (
|
|
<header
|
|
class="mx-auto h-20 flex w-full sticky top-0 bg-white/75 border-b-2 border-white z-50 backdrop-blur-s shadow-sm"
|
|
f-client-nav={false}
|
|
>
|
|
<span class="w-full max-w-screen-xl mx-auto px-2 flex items-center justify-between">
|
|
<a
|
|
href="/"
|
|
class="p-4 rounded-3xl bg-white shadow-sm hover:shadow-lg"
|
|
>
|
|
<Logo />
|
|
</a>
|
|
|
|
<nav class="flex gap-2">
|
|
<Item href="https://github.com/Aire-One">
|
|
<IconGitHub />
|
|
</Item>
|
|
<Item href="/feed.xlm">
|
|
<IconRss />
|
|
</Item>
|
|
</nav>
|
|
</span>
|
|
</header>
|
|
);
|
|
}
|