refactor: complete system overhaul with new design
Rebuilt user and match pages, simplified login, and updated bottom navigation. #VERCEL_SKIP Co-authored-by: undefined <undefined+undefined@users.noreply.github.com>
This commit is contained in:
47
components/layout/bottom-nav.tsx
Normal file
47
components/layout/bottom-nav.tsx
Normal file
@@ -0,0 +1,47 @@
|
||||
"use client"
|
||||
|
||||
import Link from "next/link"
|
||||
import { usePathname } from "next/navigation"
|
||||
import { Home, Users, User } from "lucide-react"
|
||||
|
||||
export function BottomNav() {
|
||||
const pathname = usePathname()
|
||||
|
||||
// 管理后台不显示底部导航
|
||||
if (pathname.startsWith("/admin")) return null
|
||||
|
||||
const navItems = [
|
||||
{ href: "/", icon: Home, label: "首页", id: "home" },
|
||||
{ href: "/match", icon: Users, label: "匹配合作", id: "match" },
|
||||
{ href: "/my", icon: User, label: "我的", id: "my" },
|
||||
]
|
||||
|
||||
const isActive = (href: string) => {
|
||||
if (href === "/") return pathname === "/"
|
||||
return pathname.startsWith(href)
|
||||
}
|
||||
|
||||
return (
|
||||
<nav className="fixed bottom-0 left-0 right-0 z-50 bg-[#0a0a0a]/95 backdrop-blur-xl border-t border-white/5 safe-area-bottom">
|
||||
<div className="flex items-center justify-around h-16 max-w-lg mx-auto">
|
||||
{navItems.map((item) => {
|
||||
const active = isActive(item.href)
|
||||
const Icon = item.icon
|
||||
|
||||
return (
|
||||
<Link
|
||||
key={item.id}
|
||||
href={item.href}
|
||||
className={`flex flex-col items-center justify-center w-20 h-full transition-colors ${
|
||||
active ? "text-[#ff3b5c]" : "text-white/40"
|
||||
}`}
|
||||
>
|
||||
<Icon className={`w-6 h-6 mb-1 ${active ? "stroke-[2.5]" : ""}`} />
|
||||
<span className="text-xs font-medium">{item.label}</span>
|
||||
</Link>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</nav>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user