💄 style: 优化暗色主题表现

arvinxx · arvinxx · commit 47004c5ca8b1 · 2023-09-03T18:17:08.000+08:00
diff --git a/next.config.mjs b/next.config.mjs
@@ -1,7 +1,7 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
-  crossOrigin: 'anonymous',
+  transpilePackages: ['@lobehub/ui'],
   async headers() {
     return [
       {
diff --git a/package.json b/package.json
@@ -38,18 +38,18 @@
     "@lobehub/chat-plugin-sdk": "^1.15.1",
     "@lobehub/chat-plugins-gateway": "^1",
     "@lobehub/ui": "latest",
-    "@types/react": "18.2.21",
-    "@types/react-dom": "18.2.7",
     "antd": "^5",
     "antd-style": "^3",
     "dayjs": "^1",
-    "next": "^13.4.19",
+    "next": "13.4.7",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-layout-kit": "^1"
   },
   "devDependencies": {
     "@lobehub/lint": "latest",
+    "@types/react": "18.2.21",
+    "@types/react-dom": "18.2.7",
     "@vercel/node": "^2",
     "@vitest/coverage-v8": "latest",
     "commitlint": "^17",
diff --git a/public/manifest-dev.json b/public/manifest-dev.json
@@ -14,7 +14,7 @@
           "gender": {
             "type": "string",
             "enum": ["man", "woman"],
-            "description": "用户的性别"
+            "description": "对话用户的性别，需要询问用户后才知道这个信息"
           }
         },
         "required": ["mood", "gender"],
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
@@ -0,0 +1,12 @@
+import { ThemeProvider } from '@lobehub/ui';
+import type { AppProps } from 'next/app';
+
+import './global.css';
+
+export default function App({ Component, pageProps }: AppProps) {
+  return (
+    <ThemeProvider themeMode={'auto'}>
+      <Component {...pageProps} />
+    </ThemeProvider>
+  );
+}
diff --git a/src/pages/global.css b/src/pages/global.css
@@ -0,0 +1,6 @@
+html,
+body {
+  background: transparent !important;
+  /*使用 iframe 嵌入时，如果在暗色模式下仍需要保持透明背景，需要强制设定 color-scheme 为 light  */
+  color-scheme: light !important;
+}
diff --git a/src/type.ts b/src/type.ts
@@ -2,13 +2,15 @@ export interface ClothesItem {
   description: string;
   name: string;
 }
+type Mood = 'happy' | 'sad' | 'anger' | 'fear' | 'surprise' | 'disgust';
+
 export interface ResponseData {
   clothes: ClothesItem[];
-  mood: string;
+  mood: Mood;
   today: number;
 }
 
 export interface RequestData {
   gender: 'man' | 'woman';
-  mood: string;
+  mood: Mood;
 }

Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`/** @type {import('next').NextConfig} */`
`2`	`2`	`const nextConfig = {`
`3`	`3`	`reactStrictMode: true,`
`4`		`- crossOrigin: 'anonymous',`
	`4`	`+ transpilePackages: ['@lobehub/ui'],`
`5`	`5`	`async headers() {`
`6`	`6`	`return [`
`7`	`7`	`{`
Original file line number	Diff line number	Diff line change
`@@ -14,7 +14,7 @@`
`14`	`14`	`"gender": {`
`15`	`15`	`"type": "string",`
`16`	`16`	`"enum": ["man", "woman"],`
`17`		`- "description": "用户的性别"`
	`17`	`+ "description": "对话用户的性别，需要询问用户后才知道这个信息"`
`18`	`18`	`}`
`19`	`19`	`},`
`20`	`20`	`"required": ["mood", "gender"],`
Original file line number	Diff line number	Diff line change
`@@ -2,13 +2,15 @@ export interface ClothesItem {`
`2`	`2`	`description: string;`
`3`	`3`	`name: string;`
`4`	`4`	`}`
	`5`	`+type Mood = 'happy' \| 'sad' \| 'anger' \| 'fear' \| 'surprise' \| 'disgust';`
	`6`	`+`
`5`	`7`	`export interface ResponseData {`
`6`	`8`	`clothes: ClothesItem[];`
`7`		`- mood: string;`
	`9`	`+ mood: Mood;`
`8`	`10`	`today: number;`
`9`	`11`	`}`
`10`	`12`
`11`	`13`	`export interface RequestData {`
`12`	`14`	`gender: 'man' \| 'woman';`
`13`		`- mood: string;`
	`15`	`+ mood: Mood;`
`14`	`16`	`}`