freedak/chinese-family-tree-2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

0.7.0.0

Browse Source
This commit is contained in:
freedakgmail
2025-12-10 15:21:27 +08:00
parent e7167f4340
commit 1ae59960e8
148 changed files with 681 additions and 477 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/site-header.tsx
+20 -18
View File
@@ -258,21 +258,21 @@ export function SiteHeader() {
return (
<>
<header className="sticky top-0 z-50 w-full border-b border-border/40 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60 flex-shrink-0">
<div className="container mx-auto flex h-16 items-center px-4 gap-4">
<div className="container mx-auto flex h-14 md:h-16 items-center px-2 md:px-4 gap-2 md:gap-4">
{/* Logo */}
<div className="flex items-center gap-2">
<Link href={getUrlWithTreeId("/")} className="flex items-center gap-2 hover:opacity-80 transition-opacity">
<div className="flex h-9 w-9 items-center justify-center rounded-lg bg-gradient-to-br from-primary to-primary/80 text-primary-foreground shadow-sm">
<BookOpen className="h-5 w-5" />
<div className="flex items-center gap-1.5 md:gap-2 flex-shrink-0">
<Link href={getUrlWithTreeId("/")} className="flex items-center gap-1.5 md:gap-2 hover:opacity-80 transition-opacity">
<div className="flex h-8 w-8 md:h-9 md:w-9 items-center justify-center rounded-lg bg-gradient-to-br from-primary to-primary/80 text-primary-foreground shadow-sm flex-shrink-0">
<BookOpen className="h-4 w-4 md:h-5 md:w-5" />
</div>
<span className="text-xl font-serif font-bold tracking-tight bg-gradient-to-r from-foreground to-foreground/70 bg-clip-text">
<span className="text-base md:text-xl font-serif font-bold tracking-tight whitespace-nowrap">
华夏家谱
</span>
</Link>
</div>
{/* Desktop Navigation */}
<nav className="hidden md:flex items-center gap-1 ml-6" onClick={() => setTreeDropdownOpen(false)}>
<nav className="hidden md:flex items-center gap-1 ml-6 flex-shrink-0" onClick={() => setTreeDropdownOpen(false)}>
{navItems.map((item) => {
const Icon = item.icon
const active = isActive(item.href)
@@ -281,15 +281,15 @@ export function SiteHeader() {
key={item.href}
href={getUrlWithTreeId(item.href)}
className={`
relative px-4 py-2 rounded-lg font-serif text-sm font-medium
transition-all duration-200 flex items-center gap-2
relative px-3 lg:px-4 py-2 rounded-lg font-serif text-sm font-medium
transition-all duration-200 flex items-center gap-1.5 lg:gap-2 whitespace-nowrap
${active
? 'text-primary bg-primary/10'
: 'text-muted-foreground hover:text-foreground hover:bg-muted'
}
`}
>
<Icon className="h-4 w-4" />
<Icon className="h-4 w-4 flex-shrink-0" />
<span>{item.label}</span>
{active && (
<div className="absolute bottom-0 left-1/2 -translate-x-1/2 w-12 h-0.5 bg-primary rounded-full" />
@@ -395,12 +395,12 @@ export function SiteHeader() {
{/* 家族树选择器 */}
{session && familyTrees.length > 0 && (
<div className="ml-4 flex-shrink-0">
<div className="ml-2 md:ml-4 flex-shrink min-w-0">
<DropdownMenu open={treeDropdownOpen} onOpenChange={setTreeDropdownOpen} modal={false}>
<DropdownMenuTrigger asChild>
<Button variant="outline" className="gap-2 w-[180px] font-serif">
<span className="flex-1 truncate text-left">{currentTree?.name || '选择家族树'}</span>
<ChevronDown className="h-4 w-4 flex-shrink-0" />
<Button variant="outline" className="gap-1 md:gap-2 w-auto max-w-[120px] md:max-w-[180px] font-serif text-xs md:text-sm h-8 md:h-9 px-2 md:px-3">
<span className="flex-1 truncate text-left">{currentTree?.name || '选择'}</span>
<ChevronDown className="h-3 w-3 md:h-4 md:w-4 flex-shrink-0" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent
@@ -549,15 +549,16 @@ export function SiteHeader() {
</div>
{/* User Menu */}
<div className="flex-shrink-0">
{status === "loading" ? (
<div className="h-9 w-9 rounded-full bg-muted animate-pulse" />
<div className="h-8 w-8 md:h-9 md:w-9 rounded-full bg-muted animate-pulse" />
) : session ? (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="ghost" className="relative h-9 w-9 rounded-full hover:bg-muted">
<Avatar className="h-9 w-9 border-2 border-border">
<Button variant="ghost" className="relative h-8 w-8 md:h-9 md:w-9 rounded-full hover:bg-muted p-0">
<Avatar className="h-8 w-8 md:h-9 md:w-9 border-2 border-border">
<AvatarImage src={undefined} alt={session.user?.name || "User"} />
<AvatarFallback className="bg-primary/10 text-primary font-serif">
<AvatarFallback className="bg-primary/10 text-primary font-serif text-sm md:text-base">
{getUserInitial()}
</AvatarFallback>
</Avatar>
@@ -599,6 +600,7 @@ export function SiteHeader() {
</Button>
</Link>
)}
</div>
</div>
</div>
</header>