things and stuff

2026-08-11 11:42:03 +00:00 · 2025-01-16 14:16:24 -06:00
parent 4aeddfa1f3
commit ded5ec1137
7 changed files with 526 additions and 12 deletions
@@ -0,0 +1,42 @@
+import { useState } from 'react';
+import { Burger, Container, Group } from '@mantine/core';
+import { useDisclosure } from '@mantine/hooks';
+import classes from './BarkHeader.module.css';
+
+const links = [
+    { link: '/', label: 'Home' },
+    { link: '/inventory', label: 'Inventory' },
+];
+
+export function BarkHeader() {
+    const [opened, { toggle }] = useDisclosure(false);
+    const [active, setActive] = useState(links[0].link);
+
+    const items = links.map((link) => (
+        <a
+            key={link.label}
+            href={link.link}
+            className={classes.link}
+            data-active={active === link.link || undefined}
+            onClick={(event) => {
+                event.preventDefault();
+                setActive(link.link);
+            }}
+        >
+            {link.label}
+        </a>
+    ));
+
+    return (
+        <header className={classes.header}>
+            <Container size="md" className={classes.inner}>
+
+                <Group gap={5} visibleFrom="xs">
+                    {items}
+                </Group>
+
+                <Burger opened={opened} onClick={toggle} hiddenFrom="xs" size="sm" />
+            </Container>
+        </header>
+    );
+}