-5

web/src/components/navigation/Sidebar.tsx

reviewed

··· 49 49 return () => document.removeEventListener("astro:page-load", handler); 50 50 }, []); 51 51 52 52 - const handleNav = (href: string) => () => { 53 53 - setCurrentPath(href); 54 54 - }; 55 55 - 56 52 useEffect(() => { 57 53 if (!user) return; 58 54 ··· 126 122 key={item.href} 127 123 href={item.href} 128 124 title={item.label} 129 129 - onClick={handleNav(item.href)} 130 125 data-astro-prefetch="viewport" 131 126 className={`flex items-center justify-center lg:justify-start gap-3 px-0 lg:px-3 py-2.5 rounded-lg transition-all duration-150 text-[14px] group ${ 132 127 isActive

+4

web/src/store/auth.ts

reviewed

··· 1 1 import { atom } from "nanostores"; 2 2 import { checkSession } from "../api/client"; 3 3 + import { loadPreferences } from "./preferences"; 3 4 import type { UserProfile } from "../types"; 4 5 5 6 export const $user = atom<UserProfile | null>(null); ··· 10 11 const session = await checkSession(); 11 12 $user.set(session); 12 13 $isLoading.set(false); 14 14 + if (session) { 15 15 + loadPreferences(); 16 16 + } 13 17 } 14 18 15 19 export function logout() {

+10 -11

web/src/views/About.tsx

reviewed

··· 140 140 141 141 return ( 142 142 <div className="min-h-screen bg-surface-100 dark:bg-surface-900"> 143 143 - <nav 144 144 - className={`sticky top-0 z-50 transition-all duration-300 ${ 145 145 - isScrolled 146 146 - ? "bg-white/80 dark:bg-surface-950/80 backdrop-blur-xl border-b border-surface-200/40 dark:border-surface-800/40" 147 147 - : "bg-transparent border-b border-transparent" 148 148 - }`} 149 149 - > 143 143 + <nav className="sticky top-0 z-50 pt-3 pb-1 px-4 sm:px-6 mx-auto max-w-5xl"> 150 144 <div 151 151 - className={`max-w-5xl mx-auto px-4 sm:px-6 flex items-center justify-between transition-all duration-300 ${ 152 152 - isScrolled ? "h-14" : "h-16" 145 145 + className={`relative flex items-center justify-between rounded-2xl px-4 sm:px-5 transition-all duration-300 ease-out ${ 146 146 + isScrolled ? "h-12" : "h-14" 153 147 }`} 154 148 > 155 155 - <div className="flex items-center gap-6"> 149 149 + <div 150 150 + className={`absolute inset-0 rounded-2xl bg-white/75 dark:bg-surface-900/75 backdrop-blur-lg border border-surface-200/40 dark:border-surface-700/40 shadow-sm transition-opacity duration-300 ease-out ${ 151 151 + isScrolled ? "opacity-100" : "opacity-0" 152 152 + }`} 153 153 + /> 154 154 + <div className="relative flex items-center gap-6"> 156 155 <a 157 156 href="/" 158 157 className="flex items-center gap-2.5 hover:opacity-80 transition-opacity" ··· 177 176 </a> 178 177 </div> 179 178 </div> 180 180 - <div className="flex items-center gap-2"> 179 179 + <div className="relative flex items-center gap-2"> 181 180 {!user && ( 182 181 <a 183 182 href="/login"