diff --git a/app/lib/auth-context.tsx b/app/lib/auth-context.tsx
index 6564f4f..29fc605 100644
--- a/app/lib/auth-context.tsx
+++ b/app/lib/auth-context.tsx
@@ -39,9 +39,10 @@ export function AuthProvider({ children }: { children: ReactNode }) {
 
   const checkAuthRequired = async () => {
     try {
+      const auth = localStorage.getItem('auth');
       const response = await fetch('/api/basic', {
         headers: {
-          'Authorization': 'Basic dGVzdDp0ZXN0' // 使用测试凭据
+          'Authorization': `Basic ${auth}` // 使用测试凭据
         }
       });
       // 如果返回401，说明需要认证
diff --git a/app/lib/auth-guard.tsx b/app/lib/auth-guard.tsx
index 2a9cec8..5b38300 100644
--- a/app/lib/auth-guard.tsx
+++ b/app/lib/auth-guard.tsx
@@ -14,9 +14,10 @@ export function AuthGuard({ children }: { children: React.ReactNode }) {
     // 如果用户未认证，则检查是否需要认证
     if (!isAuthenticated) {
       // 检查是否需要认证
+      const auth = localStorage.getItem('auth');
       fetch('/api/basic', {
         headers: {
-          'Authorization': 'Basic dGVzdDp0ZXN0' // 使用测试凭据
+          'Authorization': `Basic ${auth}` // 使用测试凭据
         }
       }).then(response => {
         if (response.status !== 401) {
diff --git a/app/lib/protected-layout.tsx b/app/lib/protected-layout.tsx
index 2dcc41f..5d6def9 100644
--- a/app/lib/protected-layout.tsx
+++ b/app/lib/protected-layout.tsx
@@ -279,6 +279,18 @@ export default function ProtectedLayout({ children }: { children: React.ReactNod
           </Nav.Header>
           <Nav.Footer collapseButton={false}>
             <ThemeButton mode={mode} setMode={setMode} systemTheme={systemTheme} />
+            {typeof window !== 'undefined' && localStorage.getItem('auth') && (
+              <Button
+                onClick={() => {
+                  localStorage.removeItem('auth');
+                  window.location.href = '/login';
+                }}
+                type="danger"
+                style={{ marginTop: '10px', width: '100%' }}
+              >
+                退出登录
+              </Button>
+            )}
           </Nav.Footer>
         </Nav>
       </Sider>
diff --git a/app/login/page.tsx b/app/login/page.tsx
index e9b2e30..3f12a7d 100644
--- a/app/login/page.tsx
+++ b/app/login/page.tsx
@@ -13,9 +13,10 @@ export default function LoginPage() {
   
   useEffect(() => {
     // 检查是否需要认证
+    const auth = localStorage.getItem('auth');
     fetch('/api/basic', {
       headers: {
-        'Authorization': 'Basic dGVzdDp0ZXN0' // 使用测试凭据
+        'Authorization': `Basic ${auth}` // 使用测试凭据
       }
     }).then(response => {
       if (response.status !== 401) {
@@ -53,6 +54,9 @@ export default function LoginPage() {
       height: '100vh',
       background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
       backgroundSize: 'cover',
+      ['--semi-color-text-0' as any]: 'rgba(0, 0, 0, 1)', 
+      ['--semi-color-text-1' as any]: 'rgba(0, 0, 0, 0.3)',
+      ['--semi-color-text-2' as any]: 'rgba(0, 0, 0, 0.3)',
     }}>
       <Card 
         shadows='always'