fix: theme background blur

apps/desktop/electron/main.ts

@@ -29,7 +29,7 @@ process.env.VITE_PUBLIC = VITE_DEV_SERVER_URL
 let win: BrowserWindow | null;
 let tray: Tray | null = null;
 let pythonManager: PythonManager | null;
-const theme: "dark" | "light" = "light";
+const theme: "dark" | "light" = "dark";
 
 const themeTitleBarStyles = {
   dark: { color: "rgb(32,32,32)", symbolColor: "#fff" },

apps/desktop/src/pages/Layout.tsx

@@ -25,7 +25,7 @@ const LayoutMain = () => {
             <LeftDocker />
           </div>
           <div className="relative w-[calc(100%-80px)]">
-            <div className="bg-card rounded-l-lg h-full">
+            <div className="rounded-tl-lg h-full">
               <Outlet />
             </div>
           </div>

apps/desktop/src/pages/LeftDocker.tsx

@@ -6,11 +6,11 @@ import {
   IoLayersOutline,
   IoListOutline,
   IoPlayOutline,
-  IoSettingsOutline
+  IoSettingsOutline,
 } from "react-icons/io5";
-import './LeftDocker.css'
+import "./LeftDocker.css";
 
-import { ReactNode } from 'react';
+import { ReactNode } from "react";
 
 type MenuItem = {
   to: string;
@@ -18,7 +18,6 @@ type MenuItem = {
   icon: ReactNode;
 };
 
-
 const menuItems: MenuItem[] = [
   { to: "/", name: "一键启动", icon: <IoPlayOutline size={24} /> },
   { to: "/datasource", name: "数据列表", icon: <IoListOutline size={24} /> },
@@ -40,11 +39,17 @@ export const LeftDocker = () => {
       {menuItems.map((item) => (
         <li
           key={item.name}
-          className={`w-full flex flex-col items-center justify-center ${location.pathname === item.to ? "active text-teal-500" : ""
+          className={`w-full flex flex-col items-center justify-center ${
-            }`}
+            location.pathname === item.to
+              ? "active text-primary bg-primary/10 rounded-r"
+              : ""
+          }`}
           onClick={() => handleClick(item)}
         >
-          <Link to={item.to} className="w-[60px] h-[60px] flex items-center justify-center flex-col gap-2">
+          <Link
+            to={item.to}
+            className="w-[60px] h-[60px] flex items-center justify-center flex-col gap-2"
+          >
             {item.icon}
             <span className="text-xs">{item.name}</span>
           </Link>

apps/desktop/src/style/global.css

@@ -10,16 +10,18 @@ body,
   overflow: hidden;
 }
 
+
+
 @layer base {
   :root {
-    --background: 0 0% 94.12%;
+    --background: 0 0% 100%;
     --foreground: 240 10% 3.9%;
     --card: 0 0% 100%;
     --card-foreground: 240 10% 3.9%;
     --popover: 0 0% 100%;
     --popover-foreground: 240 10% 3.9%;
-    --primary: 240 5.9% 10%;
+    --primary: 142.1 76.2% 36.3%;
-    --primary-foreground: 0 0% 98%;
+    --primary-foreground: 355.7 100% 97.3%;
     --secondary: 240 4.8% 95.9%;
     --secondary-foreground: 240 5.9% 10%;
     --muted: 240 4.8% 95.9%;
@@ -30,7 +32,7 @@ body,
     --destructive-foreground: 0 0% 98%;
     --border: 240 5.9% 90%;
     --input: 240 5.9% 90%;
-    --ring: 240 10% 3.9%;
+    --ring: 142.1 76.2% 36.3%;
     --radius: 0.5rem;
     --chart-1: 12 76% 61%;
     --chart-2: 173 58% 39%;
@@ -40,25 +42,25 @@ body,
   }
 
   .dark {
-    --background: 0deg 0% 12.55%;
+    --background: 20 14.3% 4.1%;
-    --foreground: 0 0% 100%;
+    --foreground: 0 0% 95%;
-    --card: 0 0% 14.9%;
+    --card: 24 9.8% 10%;
-    --card-foreground: 0 0% 98%;
+    --card-foreground: 0 0% 95%;
-    --popover: 240 10% 3.9%;
+    --popover: 0 0% 9%;
-    --popover-foreground: 0 0% 98%;
+    --popover-foreground: 0 0% 95%;
-    --primary: 0 0% 98%;
+    --primary: 142.1 70.6% 45.3%;
-    --primary-foreground: 240 5.9% 10%;
+    --primary-foreground: 144.9 80.4% 10%;
     --secondary: 240 3.7% 15.9%;
     --secondary-foreground: 0 0% 98%;
-    --muted: 240 3.7% 15.9%;
+    --muted: 0 0% 15%;
     --muted-foreground: 240 5% 64.9%;
-    --accent: 240 3.7% 15.9%;
+    --accent: 12 6.5% 15.1%;
     --accent-foreground: 0 0% 98%;
     --destructive: 0 62.8% 30.6%;
-    --destructive-foreground: 0 0% 98%;
+    --destructive-foreground: 0 85.7% 97.3%;
     --border: 240 3.7% 15.9%;
     --input: 240 3.7% 15.9%;
-    --ring: 240 4.9% 83.9%;
+    --ring: 142.4 71.8% 29.2%;
     --chart-1: 220 70% 50%;
     --chart-2: 160 60% 45%;
     --chart-3: 30 80% 55%;
@@ -67,6 +69,7 @@ body,
   }
 }
 
+
 @layer base {
   * {
     @apply border-border;