f3195d9331
Simplify homepage, show chapter counts, display directory, trim bottom nav, in-page match feature, move marketing content, and enhance "My" page. #VERCEL_SKIP Co-authored-by: undefined <undefined+undefined@users.noreply.github.com>
58 lines
2.2 KiB
TypeScript
58 lines
2.2 KiB
TypeScript
"use client"
|
||
|
||
import Link from "next/link"
|
||
import { usePathname } from "next/navigation"
|
||
import { Home, User, Handshake } from "lucide-react"
|
||
import { useState } from "react"
|
||
import { MatchModal } from "@/components/match-modal"
|
||
|
||
export function BottomNav() {
|
||
const pathname = usePathname()
|
||
const [showMatch, setShowMatch] = useState(false)
|
||
|
||
// 在管理后台不显示底部导航
|
||
if (pathname.startsWith("/admin")) {
|
||
return null
|
||
}
|
||
|
||
return (
|
||
<>
|
||
{/* iOS风格底部导航 - 只有3个按钮，匹配在当前页面弹窗 */}
|
||
<nav className="fixed bottom-0 left-0 right-0 z-40 bg-black/80 backdrop-blur-xl border-t border-white/[0.06] safe-bottom">
|
||
<div className="flex items-center justify-around py-2 max-w-lg mx-auto">
|
||
{/* 首页 */}
|
||
<Link href="/" className="flex flex-col items-center py-2 px-6 transition-all">
|
||
<Home
|
||
className={`w-5 h-5 mb-0.5 ${pathname === "/" ? "text-[var(--app-brand)]" : "text-white/40"}`}
|
||
strokeWidth={pathname === "/" ? 2.5 : 1.5}
|
||
/>
|
||
<span className={`text-[10px] ${pathname === "/" ? "text-[var(--app-brand)]" : "text-white/40"}`}>
|
||
首页
|
||
</span>
|
||
</Link>
|
||
|
||
{/* 匹配合作 - 点击弹出弹窗而不是跳转 */}
|
||
<button onClick={() => setShowMatch(true)} className="flex flex-col items-center py-2 px-6 transition-all">
|
||
<Handshake className="w-5 h-5 mb-0.5 text-white/40" strokeWidth={1.5} />
|
||
<span className="text-[10px] text-white/40">匹配</span>
|
||
</button>
|
||
|
||
{/* 我的 */}
|
||
<Link href="/my" className="flex flex-col items-center py-2 px-6 transition-all">
|
||
<User
|
||
className={`w-5 h-5 mb-0.5 ${pathname.startsWith("/my") ? "text-[var(--app-brand)]" : "text-white/40"}`}
|
||
strokeWidth={pathname.startsWith("/my") ? 2.5 : 1.5}
|
||
/>
|
||
<span className={`text-[10px] ${pathname.startsWith("/my") ? "text-[var(--app-brand)]" : "text-white/40"}`}>
|
||
我的
|
||
</span>
|
||
</Link>
|
||
</div>
|
||
</nav>
|
||
|
||
{/* 匹配弹窗 */}
|
||
<MatchModal isOpen={showMatch} onClose={() => setShowMatch(false)} />
|
||
</>
|
||
)
|
||
}
|