From 751ce7878b4149a4a14fee03be723461766a7ea6 Mon Sep 17 00:00:00 2001 From: Snowykami Date: Thu, 25 Sep 2025 19:18:09 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E6=96=B0=E7=9A=84?= =?UTF-8?q?=E9=A2=9C=E8=89=B2=E6=A0=B7=E5=BC=8F=EF=BC=8C=E6=9B=B4=E6=96=B0?= =?UTF-8?q?=E5=85=A8=E5=B1=80=E6=A0=B7=E5=BC=8F=E5=92=8C=E7=BB=84=E4=BB=B6?= =?UTF-8?q?=E4=BB=A5=E6=94=AF=E6=8C=81=E6=9B=B4=E5=A4=9A=E7=94=A8=E6=88=B7?= =?UTF-8?q?=E9=A2=9C=E8=89=B2=E9=80=89=E9=A1=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/src/app/globals.css | 7 ++++++ web/src/app/layout.tsx | 5 +++- web/src/app/styles/blue.css | 4 +-- web/src/app/styles/green.css | 4 +-- web/src/app/styles/orange.css | 4 +-- web/src/app/styles/red.css | 4 +-- web/src/app/styles/rose.css | 4 +-- web/src/app/styles/violet.css | 4 +-- web/src/app/styles/yellow.css | 4 +-- .../layout/nav/avatar-with-dropdown-menu.tsx | 25 +++++++++++-------- web/src/types/css.d.ts | 7 ++++++ 11 files changed, 46 insertions(+), 26 deletions(-) create mode 100644 web/src/types/css.d.ts diff --git a/web/src/app/globals.css b/web/src/app/globals.css index 26ff857..81b1c2f 100644 --- a/web/src/app/globals.css +++ b/web/src/app/globals.css @@ -1,6 +1,13 @@ @import "tailwindcss"; @import "tw-animate-css"; +@import "./styles/blue.css"; +@import "./styles/green.css"; +@import "./styles/orange.css"; +@import "./styles/red.css"; +@import "./styles/rose.css"; @import "./styles/violet.css"; +@import "./styles/yellow.css"; + @custom-variant dark (&:is(.dark *)); diff --git a/web/src/app/layout.tsx b/web/src/app/layout.tsx index 17aace4..60b6e00 100644 --- a/web/src/app/layout.tsx +++ b/web/src/app/layout.tsx @@ -10,6 +10,8 @@ import { Toaster } from "@/components/ui/sonner" import { getLoginUser } from "@/api/user"; import { NuqsAdapter } from 'nuqs/adapters/next/app' import "./globals.css"; + + const geistSans = Geist({ variable: "--font-geist-sans", subsets: ["latin"], @@ -30,12 +32,13 @@ export default async function RootLayout({ }: Readonly<{ children: React.ReactNode; }>) { + const token = (await cookies()).get("token")?.value || ""; const refreshToken = (await cookies()).get("refresh_token")?.value || ""; const user = await getLoginUser({ token, refreshToken }).then(res => res.data).catch(() => null); return ( - + diff --git a/web/src/app/styles/blue.css b/web/src/app/styles/blue.css index 85e9237..a1a9954 100644 --- a/web/src/app/styles/blue.css +++ b/web/src/app/styles/blue.css @@ -1,4 +1,4 @@ -:root { +:root[user-color="blue"] { --radius: 0.65rem; --background: oklch(1 0 0); --foreground: oklch(0.141 0.005 285.823); @@ -33,7 +33,7 @@ --sidebar-ring: oklch(0.623 0.214 259.815); } -.dark { +.dark[user-color="blue"] { --background: oklch(0.141 0.005 285.823); --foreground: oklch(0.985 0 0); --card: oklch(0.21 0.006 285.885); diff --git a/web/src/app/styles/green.css b/web/src/app/styles/green.css index 50a48a8..25f4f2f 100644 --- a/web/src/app/styles/green.css +++ b/web/src/app/styles/green.css @@ -1,4 +1,4 @@ -:root { +:root[user-color="green"] { --radius: 0.65rem; --background: oklch(1 0 0); --foreground: oklch(0.141 0.005 285.823); @@ -33,7 +33,7 @@ --sidebar-ring: oklch(0.723 0.219 149.579); } -.dark { +.dark[user-color="green"] { --background: oklch(0.141 0.005 285.823); --foreground: oklch(0.985 0 0); --card: oklch(0.21 0.006 285.885); diff --git a/web/src/app/styles/orange.css b/web/src/app/styles/orange.css index 2953a38..d98efce 100644 --- a/web/src/app/styles/orange.css +++ b/web/src/app/styles/orange.css @@ -1,4 +1,4 @@ -:root { +:root[user-color="orange"] { --radius: 0.65rem; --background: oklch(1 0 0); --foreground: oklch(0.141 0.005 285.823); @@ -33,7 +33,7 @@ --sidebar-ring: oklch(0.705 0.213 47.604); } -.dark { +.dark[user-color="orange"] { --background: oklch(0.141 0.005 285.823); --foreground: oklch(0.985 0 0); --card: oklch(0.21 0.006 285.885); diff --git a/web/src/app/styles/red.css b/web/src/app/styles/red.css index 2ca606b..a87d519 100644 --- a/web/src/app/styles/red.css +++ b/web/src/app/styles/red.css @@ -1,4 +1,4 @@ -:root { +:root[user-color="red"] { --radius: 0.65rem; --background: oklch(1 0 0); --foreground: oklch(0.141 0.005 285.823); @@ -33,7 +33,7 @@ --sidebar-ring: oklch(0.637 0.237 25.331); } -.dark { +.dark[user-color="red"] { --background: oklch(0.141 0.005 285.823); --foreground: oklch(0.985 0 0); --card: oklch(0.21 0.006 285.885); diff --git a/web/src/app/styles/rose.css b/web/src/app/styles/rose.css index 04b3f87..3d16b53 100644 --- a/web/src/app/styles/rose.css +++ b/web/src/app/styles/rose.css @@ -1,4 +1,4 @@ -:root { +:root[user-color="rose"] { --radius: 0.65rem; --background: oklch(1 0 0); --foreground: oklch(0.141 0.005 285.823); @@ -33,7 +33,7 @@ --sidebar-ring: oklch(0.645 0.246 16.439); } -.dark { +.dark[user-color="rose"] { --background: oklch(0.141 0.005 285.823); --foreground: oklch(0.985 0 0); --card: oklch(0.21 0.006 285.885); diff --git a/web/src/app/styles/violet.css b/web/src/app/styles/violet.css index 471c981..6e25c35 100644 --- a/web/src/app/styles/violet.css +++ b/web/src/app/styles/violet.css @@ -1,4 +1,4 @@ -:root { +:root[user-color="violet"] { --radius: 0.65rem; --background: oklch(1 0 0); --foreground: oklch(0.141 0.005 285.823); @@ -33,7 +33,7 @@ --sidebar-ring: oklch(0.606 0.25 292.717); } -.dark { +.dark[user-color="violet"] { --background: oklch(0.141 0.005 285.823); --foreground: oklch(0.985 0 0); --card: oklch(0.21 0.006 285.885); diff --git a/web/src/app/styles/yellow.css b/web/src/app/styles/yellow.css index dec73b8..6c89599 100644 --- a/web/src/app/styles/yellow.css +++ b/web/src/app/styles/yellow.css @@ -1,4 +1,4 @@ -:root { +:root[user-color="violet"] { --radius: 0.65rem; --background: oklch(1 0 0); --foreground: oklch(0.141 0.005 285.823); @@ -33,7 +33,7 @@ --sidebar-ring: oklch(0.795 0.184 86.047); } -.dark { +.dark[user-color="violet"] { --background: oklch(0.141 0.005 285.823); --foreground: oklch(0.985 0 0); --card: oklch(0.21 0.006 285.885); diff --git a/web/src/components/layout/nav/avatar-with-dropdown-menu.tsx b/web/src/components/layout/nav/avatar-with-dropdown-menu.tsx index c24b226..99a712d 100644 --- a/web/src/components/layout/nav/avatar-with-dropdown-menu.tsx +++ b/web/src/components/layout/nav/avatar-with-dropdown-menu.tsx @@ -37,20 +37,23 @@ export function AvatarWithDropdownMenu() { - {user && -
-
- {formatDisplayName(user)} - - {user.email} - -
-
- } + {user && + <> + +
+
+ {formatDisplayName(user)} + + {user.email} + +
+
+ + } {user && <> - + Profile diff --git a/web/src/types/css.d.ts b/web/src/types/css.d.ts new file mode 100644 index 0000000..a7af9f6 --- /dev/null +++ b/web/src/types/css.d.ts @@ -0,0 +1,7 @@ +declare module "*.css"; +declare module "*.scss"; +declare module "*.sass"; +declare module "*.less"; +declare module "*.styl"; +declare module "*.module.css"; +declare module "*.module.scss"; \ No newline at end of file