's'
This commit is contained in:
@@ -1,48 +1,43 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { motion } from "framer-motion";
|
||||
import { ThemeToggle } from "@/components/theme-toggle";
|
||||
import { Search, Sparkles } from "lucide-react";
|
||||
import { Search } from "lucide-react";
|
||||
import { HiddenEasterEggTrigger } from "@/components/hidden-easter-egg-trigger";
|
||||
import { useAuth } from "@/components/auth-provider";
|
||||
|
||||
export function Navbar() {
|
||||
const { session, loginAs, logout } = useAuth();
|
||||
return (
|
||||
<motion.header
|
||||
initial={{ y: -24, opacity: 0 }}
|
||||
animate={{ y: 0, opacity: 1 }}
|
||||
className="sticky top-0 z-40 border-b border-white/10 bg-slate-950/70 backdrop-blur-xl"
|
||||
>
|
||||
<div className="mx-auto flex h-16 max-w-7xl items-center justify-between px-4 md:px-6">
|
||||
<div className="flex items-center gap-6">
|
||||
<header className="sticky top-0 z-40 border-b border-white/10 bg-slate-950/70 backdrop-blur-2xl">
|
||||
<div className="mx-auto flex h-16 max-w-7xl items-center justify-between px-4 md:h-18 md:px-6">
|
||||
<div className="flex min-w-0 items-center gap-4 md:gap-8">
|
||||
<HiddenEasterEggTrigger>
|
||||
<Link href="/" className="flex items-center gap-2 text-sm font-semibold">
|
||||
<Sparkles className="text-cyan-400" size={18} />
|
||||
Download Nova
|
||||
<Link href="/" className="flex items-center gap-2.5">
|
||||
<span className="grid h-8 w-8 place-items-center rounded-xl border border-cyan-300/40 bg-cyan-400/10 text-sm">D</span>
|
||||
<span className="text-sm font-semibold tracking-wide md:text-base">Download Nova</span>
|
||||
</Link>
|
||||
</HiddenEasterEggTrigger>
|
||||
<nav className="hidden items-center gap-4 text-sm text-slate-300 md:flex">
|
||||
<Link href="/apps">资源库</Link>
|
||||
<Link href="/insights">数据洞察</Link>
|
||||
<Link href="/unlock">解锁中心</Link>
|
||||
<Link href="/pricing">会员套餐</Link>
|
||||
<nav className="hidden items-center gap-5 text-sm text-slate-300 lg:flex">
|
||||
<Link href="/apps" className="transition hover:text-cyan-200">资源库</Link>
|
||||
<Link href="/insights" className="transition hover:text-cyan-200">数据洞察</Link>
|
||||
<Link href="/unlock" className="transition hover:text-cyan-200">解锁中心</Link>
|
||||
<Link href="/pricing" className="transition hover:text-cyan-200">会员套餐</Link>
|
||||
</nav>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="flex shrink-0 items-center gap-2.5">
|
||||
<button className="pill hidden md:inline-flex" onClick={session.isLoggedIn ? logout : () => loginAs()}>
|
||||
{session.isLoggedIn ? `${session.userName ?? "用户"} · ${session.accessLevel}` : "未登录"}
|
||||
</button>
|
||||
<Link href="/apps" className="rounded-full border border-white/20 p-2">
|
||||
<Link href="/apps" className="rounded-full border border-white/20 p-2 transition hover:border-cyan-300/40 hover:bg-cyan-400/10">
|
||||
<Search size={16} />
|
||||
</Link>
|
||||
<ThemeToggle />
|
||||
<Link href="/pricing" className="rounded-full bg-cyan-400/90 px-4 py-1.5 text-xs font-semibold text-slate-900 shadow-[0_0_20px_rgba(34,211,238,0.45)]">
|
||||
<Link href="/pricing" className="cta-main rounded-full px-4 py-1.5 text-xs shadow-none md:text-sm">
|
||||
登录 / 会员
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</motion.header>
|
||||
</header>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user