chore(web): move site under packages

2026-05-18 16:44:02 +09:00
parent 5e9a26c1c5
commit bf96794599
82 changed files with 27 additions and 27 deletions
@@ -0,0 +1,118 @@
+"use client"
+
+import { useState } from "react"
+import { useTranslations } from "next-intl"
+import { Github, Menu, X } from "lucide-react"
+import { Badge } from "@/components/ui/badge"
+import { Button } from "@/components/ui/button"
+import { Link } from "@/i18n/routing"
+
+export function NavHeader() {
+  const t = useTranslations("nav")
+  const [isOpen, setIsOpen] = useState(false)
+
+  return (
+    <header className="sticky top-0 z-50 w-full border-b border-white/10 bg-black/50 backdrop-blur-xl">
+      <div className="container mx-auto flex h-16 items-center justify-between px-4 md:px-6">
+        <div className="flex items-center gap-6">
+          <Link href="/" className="flex items-center gap-2">
+            <span className="text-lg font-bold tracking-tight text-white">{t("brand")}</span>
+          </Link>
+          <nav className="hidden items-center gap-6 text-sm font-medium text-zinc-400 md:flex">
+            <Link href="/#features" className="transition-colors hover:text-cyan-400">
+              {t("features")}
+            </Link>
+            <Link href="/#agents" className="transition-colors hover:text-cyan-400">
+              {t("agents")}
+            </Link>
+            <Link href="/docs" className="transition-colors hover:text-cyan-400">
+              {t("docs")}
+            </Link>
+            <Link href="/manifesto" className="transition-colors hover:text-cyan-400">
+              {t("manifesto")}
+            </Link>
+          </nav>
+        </div>
+        <div className="flex items-center gap-4">
+          <a
+            href="https://github.com/code-yeongyu/oh-my-openagent"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="hidden sm:flex"
+          >
+            <Badge
+              variant="secondary"
+              className="gap-1 border-zinc-700 bg-zinc-800 text-zinc-300 hover:bg-zinc-700"
+            >
+              <Github className="h-3 w-3" />
+              <span>{t("starOnGitHub")}</span>
+            </Badge>
+          </a>
+          <Button
+            variant="ghost"
+            size="icon"
+            className="text-zinc-400 hover:bg-zinc-800 hover:text-white md:hidden"
+            onClick={() => setIsOpen(!isOpen)}
+            aria-label={isOpen ? "Close menu" : "Open menu"}
+            aria-expanded={isOpen}
+            aria-controls="mobile-nav"
+          >
+            {isOpen ? <X className="h-5 w-5" /> : <Menu className="h-5 w-5" />}
+          </Button>
+        </div>
+      </div>
+
+      <div
+        id="mobile-nav"
+        className={
+          `overflow-hidden bg-black/95 backdrop-blur-xl transition-[max-height,opacity] duration-200 ease-in-out md:hidden ` +
+          (isOpen
+            ? "max-h-[420px] border-b border-white/10 opacity-100"
+            : "pointer-events-none max-h-0 opacity-0")
+        }
+        aria-hidden={!isOpen}
+      >
+        <nav className="flex flex-col gap-4 p-4 text-sm font-medium text-zinc-400">
+          <Link
+            href="/#features"
+            className="transition-colors hover:text-cyan-400"
+            onClick={() => setIsOpen(false)}
+          >
+            {t("features")}
+          </Link>
+          <Link
+            href="/#agents"
+            className="transition-colors hover:text-cyan-400"
+            onClick={() => setIsOpen(false)}
+          >
+            {t("agents")}
+          </Link>
+          <Link
+            href="/docs"
+            className="transition-colors hover:text-cyan-400"
+            onClick={() => setIsOpen(false)}
+          >
+            {t("docs")}
+          </Link>
+          <Link
+            href="/manifesto"
+            className="transition-colors hover:text-cyan-400"
+            onClick={() => setIsOpen(false)}
+          >
+            {t("manifesto")}
+          </Link>
+          <a
+            href="https://github.com/code-yeongyu/oh-my-openagent"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="flex items-center gap-2 transition-colors hover:text-cyan-400 sm:hidden"
+            onClick={() => setIsOpen(false)}
+          >
+            <Github className="h-4 w-4" />
+            <span>{t("starOnGitHub")}</span>
+          </a>
+        </nav>
+      </div>
+    </header>
+  )
+}