update: macos blurred window and radius setup

src/app/(main)/layout.tsx

@@ -1,6 +1,9 @@
+"use client"
 import Header from "@/components/window/Header";
 import Nav from "@/components/window/Nav";
 import SideBar from "@/components/window/SideBar";
+import clsx from "clsx";
+// import { platform } from "@tauri-apps/plugin-os"
 
 export default function BaseLayout({
   children,
@@ -8,18 +11,24 @@ export default function BaseLayout({
   children: React.ReactNode;
 }) {
   return (
-    <div className="bg-[#f1f0f2] h-full w-full">
+    <div className="w-full h-full bg-transparent">
+      {/* bg-[#f1f0f2]  */}
       <Nav />
 
       <div className="flex flex-col w-full h-full">
         <SideBar />
 
-        <main className="flex flex-col h-full pb-5 pr-5 ml-20 overflow-hidden ">
+        <main
+          className={clsx(
+            "flex flex-col h-full pb-5 pr-5 ml-20 overflow-hidden"
+            // platform() === "windows" ? "ml-20" : "ml-[4.25rem]"
+          )}
+        >
           <Header />
 
           {children}
         </main>
       </div>
     </div>
-  );
+  )
 }

src/app/globals.css

@@ -10,7 +10,9 @@ body {
   height: 100%;
   font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu,
     Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
-  background: transparent;
+  /* background: transparent; */
+  background: rgba(242, 241, 243, 0.3);
+  border-radius: 10px;
 }
 
 a {

src/app/page.tsx

@@ -6,7 +6,7 @@ const Home = () => {
   const router = useRouter();
   return (
     <main
-      className="bg-[#f1f0f2] h-screen w-full flex flex-col gap-6 items-center justify-center"
+      className="flex flex-col items-center justify-center w-full h-screen gap-6"
       data-tauri-drag-region
     >
       <h1 className="text-4xl font-bold tracking-wide text-zinc-800">CS 工具箱</h1>

src/app/prepare/layout.tsx

@@ -2,12 +2,12 @@ import Nav from "@/components/window/Nav"
 
 export default function BaseLayout({ children }: { children: React.ReactNode }) {
   return (
-    <div className="bg-[#f1f0f2] h-full w-full">
+    <div className="w-full h-full">
       <Nav />
 
       <div className="flex flex-col w-full h-full">
         <main
-          className="bg-[#f1f0f2] h-screen w-full flex flex-col gap-6 p-6 items-center justify-center"
+          className="flex flex-col items-center justify-center w-full h-screen gap-6 p-6"
           data-tauri-drag-region
         >
           {children}

src/app/prepare/page.tsx

@@ -5,7 +5,7 @@ export default function Page() {
   const { dir, updateDir, csDir, updateCsDir, currentUser } = useSteamStore()
   return (
     <div
-      className="bg-[#f1f0f2] h-screen w-full flex flex-col gap-6 items-center justify-center"
+      className="flex flex-col items-center justify-center w-full h-screen gap-6"
       data-tauri-drag-region
     >
       <h1 className="text-4xl font-bold tracking-wide text-zinc-800">CS工具箱</h1>