feat(public): render responsive character guides

2026-08-28 19:21:57 +00:00
parent 139a9081ed
commit 6c9152eebd
15 changed files with 1429 additions and 61 deletions
@@ -0,0 +1,31 @@
+import Link from "next/link";
+import { BookOpenIcon, SettingsIcon } from "lucide-react";
+
+import { Button } from "@/components/ui/button";
+
+export function SiteHeader() {
+  return (
+    <header className="border-b bg-background/95 supports-backdrop-filter:backdrop-blur">
+      <div className="mx-auto flex h-16 w-full max-w-7xl items-center justify-between px-4 sm:px-6">
+        <Link
+          href="/"
+          className="flex min-h-11 items-center gap-3 rounded-lg font-heading text-base font-semibold focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+        >
+          <span className="grid size-9 place-items-center rounded-lg bg-primary text-primary-foreground">
+            <BookOpenIcon aria-hidden="true" className="size-5" />
+          </span>
+          <span>
+            Buzz Sheet
+            <span className="ml-2 hidden font-normal text-muted-foreground sm:inline">
+              คู่มือที่อ่านง่าย
+            </span>
+          </span>
+        </Link>
+        <Button variant="ghost" size="sm" render={<Link href="/admin" />}>
+          <SettingsIcon aria-hidden="true" />
+          จัดการเนื้อหา
+        </Button>
+      </div>
+    </header>
+  );
+}