feat(prompt): 确保页面背景色、文字色、按钮色等UI元素在不同主题下均有良好对比度和可读性

AGENTS.md

@@ -14,6 +14,7 @@
 - 基于响应式设计的单页应用（SPA）
 - 专为移动端优化，**采用单一入口点架构**，所有功能模块通过组件化方式在同一页面内动态加载和切换，确保用户体验的连贯性和加载性能的优化
 - **主题适配**: 确保组件支持亮色/暗色主题
+  - 确保页面背景色、文字色、按钮色等UI元素在不同主题下均有良好对比度和可读性
 - **错误展示**：前端页面需要有统一的错误展示，用于显示API请求失败或其他操作错误的信息
 - 不需要实现登录页，默认访问应用的用户都是已登录状态
 - 所有请求统一使用 `/src/api/index` 中的 `api` 方法进行调用，因为已经内置了必要的请求头封装

packages/client/src/App.tsx

@@ -2,15 +2,31 @@ import "./App.css";
 import React, { useEffect } from "react";
 import { Routes } from "react-router-dom";
 import {handleAuthTokenAndGroupIdFromUrl} from "./utils/auth";
+import { useTheme } from "@/components/theme-provider";
 
 const App: React.FC = () => {
+  const { setTheme } = useTheme();
+
   useEffect(() => {
-    // 在组件挂载时处理URL中的authToken 和 groupId
+    // 在组件挂载时先处理URL中的authToken 和 groupId
     handleAuthTokenAndGroupIdFromUrl();
-  }, []);
+
+    // 读取并处理URL中的 theme（'light'|'dark'）参数
+    const params = new URLSearchParams(window.location.search);
+    const themeParam = params.get('theme');
+    if (themeParam === 'light' || themeParam === 'dark') {
+      // 使用 ThemeProvider 的 setTheme 应用主题，并存入本地（storageKey: egret-ui-theme）
+      setTheme(themeParam);
+
+      // 从URL中移除 theme 参数，保持地址整洁
+      const url = new URL(window.location.href);
+      url.searchParams.delete('theme');
+      window.history.replaceState(null, '', url.toString());
+    }
+  }, [setTheme]);
 
   return (
-    <div className="w-full h-full bg-gray-50">
+    <div className="w-full min-h-dvh bg-background text-foreground">
       <main>
         <Routes></Routes>
       </main>