feat: add register page and logout button

src/components/LogoutButton.tsx

@@ -0,0 +1,36 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+'use client';
+
+import { LogOut } from 'lucide-react';
+import { useRouter } from 'next/navigation';
+
+/**
+ * 退出登录按钮
+ *
+ * 功能：
+ * 1. 清除 localStorage 中保存的 username 和 password
+ * 2. 跳转到 /login 页面
+ */
+export function LogoutButton() {
+  const router = useRouter();
+
+  const handleLogout = () => {
+    if (typeof window !== 'undefined') {
+      localStorage.removeItem('username');
+      localStorage.removeItem('password');
+    }
+    // 使用 replace，避免用户返回上一页时仍然处于已登录状态
+    router.replace('/login');
+  };
+
+  return (
+    <button
+      onClick={handleLogout}
+      className='w-10 h-10 p-2 rounded-full flex items-center justify-center text-gray-600 hover:bg-gray-200/50 dark:text-gray-300 dark:hover:bg-gray-700/50 transition-colors'
+      aria-label='Logout'
+    >
+      <LogOut className='w-full h-full' />
+    </button>
+  );
+}

src/components/MobileHeader.tsx

@@ -2,6 +2,7 @@
 
 import Link from 'next/link';
 
+import { LogoutButton } from './LogoutButton';
 import { useSite } from './SiteProvider';
 import { ThemeToggle } from './ThemeToggle';
 
@@ -17,7 +18,8 @@ const MobileHeader = () => {
           {siteName}
         </Link>
       </div>
-      <div className='absolute top-1/2 right-4 -translate-y-1/2'>
+      <div className='absolute top-1/2 right-4 -translate-y-1/2 flex items-center gap-2'>
+        <LogoutButton />
         <ThemeToggle />
       </div>
     </header>

src/components/PageLayout.tsx

@@ -1,3 +1,4 @@
+import { LogoutButton } from './LogoutButton';
 import MobileBottomNav from './MobileBottomNav';
 import MobileHeader from './MobileHeader';
 import { useSidebar } from './Sidebar';
@@ -22,7 +23,8 @@ const PageLayout = ({ children, activePath = '/' }: PageLayoutProps) => {
             isCollapsed ? 'col-start-2' : 'col-start-2'
           }`}
         >
-          <div className='absolute top-2 right-4 z-20 hidden md:block'>
+          <div className='absolute top-2 right-4 z-20 hidden md:flex items-center gap-2'>
+            <LogoutButton />
             <ThemeToggle />
           </div>
           {children}