[feat] more fps test settings and csv export button

src/app/prepare/page.tsx

@@ -17,29 +17,39 @@ export default function Page() {
       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">CS工具箱</h1>
-      <p>准备环节</p>
+      <h1 className="text-4xl font-bold tracking-wide">CS 工具箱</h1>
+      <p className="text-sm text-zinc-500">配置页面</p>
 
-      <div className="flex flex-col w-full gap-2 p-5 border rounded-lg bg-white/40">
-        <p>Steam所在文件夹</p>
-        <input
-          className="px-2 py-1 mb-2 rounded-lg"
-          value={steamDir}
-          onChange={(e) => {
-            setSteamDir(e.target.value)
-            steam.setDir(e.target.value)
-          }}
-        />
-        <p>CS2所在文件夹</p>
-        <input
-          className="px-2 py-1 mb-2 rounded-lg"
-          value={cs2Dir}
-          onChange={(e) => {
-            setCs2Dir(e.target.value)
-            steam.setCsDir(e.target.value)
-          }}
-        />
-        <p>当前用户64位SteamID：{steam.currentUser()?.steam_id64}</p>
+      <div className="flex flex-col w-full max-w-2xl gap-4 p-5 border rounded-lg bg-white/40 dark:bg-zinc-800/40">
+        <div className="space-y-2">
+          <p className="text-sm font-semibold">Steam 安装目录</p>
+          <input
+            className="w-full px-3 py-2 rounded-lg bg-white dark:bg-zinc-700 border border-zinc-300 dark:border-zinc-600"
+            placeholder="请输入 Steam 安装路径"
+            value={steamDir}
+            onChange={(e) => {
+              setSteamDir(e.target.value)
+              steam.setDir(e.target.value)
+            }}
+          />
+        </div>
+        <div className="space-y-2">
+          <p className="text-sm font-semibold">CS2 安装目录</p>
+          <input
+            className="w-full px-3 py-2 rounded-lg bg-white dark:bg-zinc-700 border border-zinc-300 dark:border-zinc-600"
+            placeholder="请输入 CS2 安装路径"
+            value={cs2Dir}
+            onChange={(e) => {
+              setCs2Dir(e.target.value)
+              steam.setCsDir(e.target.value)
+            }}
+          />
+        </div>
+        {steam.currentUser()?.steam_id64 && (
+          <p className="text-xs text-zinc-500">
+            当前用户 64 位 Steam ID：{steam.currentUser()?.steam_id64}
+          </p>
+        )}
       </div>
     </div>
   )

src/app/test/page.tsx

@@ -6,7 +6,7 @@ import { useCallback, useState } from "react"
 
 export default function Page() {
   const [buttonDesc, setButtonDesc] = useState<string>(
-    "Waiting to be clicked. This calls 'on_button_clicked' from Rust.",
+    "等待点击。这将调用 Rust 中的 'on_button_clicked' 命令。",
   )
   const onButtonClick = () => {
     invoke<string>("on_button_clicked")
@@ -14,7 +14,7 @@ export default function Page() {
         setButtonDesc(value)
       })
       .catch(() => {
-        setButtonDesc("Failed to invoke Rust command 'on_button_clicked'")
+        setButtonDesc("调用 Rust 命令 'on_button_clicked' 失败")
       })
   }
 
@@ -27,7 +27,7 @@ export default function Page() {
     <div className="flex flex-col">
       <main className="flex flex-col items-center justify-center flex-1 py-8">
         <h1 className="m-0 text-6xl text-center">
-          Welcome to{" "}
+          欢迎使用{" "}
           <a
             href="https://nextjs.org"
             target="_blank"
@@ -39,7 +39,7 @@ export default function Page() {
         </h1>
 
         <p className="my-12 text-2xl leading-9 text-center">
-          Get started by editing{" "}
+          开始编辑{" "}
           <code className="p-2 font-mono text-xl bg-gray-200 rounded-md">
             src/pages/index.tsx
           </code>
@@ -48,7 +48,7 @@ export default function Page() {
         <div className="flex flex-wrap items-center justify-center max-w-3xl">
           <CardButton
             onClick={onButtonClick}
-            title="Tauri Invoke"
+            title="Tauri 调用"
             description={buttonDesc}
           />
         </div>