From 2fa9d7041bea9fd04cb373378d1fe4790555855a Mon Sep 17 00:00:00 2001 From: dream_pep Date: Sat, 20 Jun 2026 03:49:58 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=B8=AA=E6=80=A7=E5=8C=96=E8=AE=BE?= =?UTF-8?q?=E7=BD=AE=E9=A1=B5=E9=9D=A2=E9=87=8D=E6=9E=84=E4=B8=8E=E8=BE=85?= =?UTF-8?q?=E5=8A=A9=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 重构主题与背景页面：一选项一卡片布局，深色模式可视化预览卡片 - 新增强内容模式：设置页面自动显示 80px 模糊背景遮罩，自适应亮/暗色 - 新增辅助功能：减少动画、减少透明度、高对比度三项开关 - 新增开发者选项：即时打开/关闭启动画面、强制关闭强内容模式 - 磨砂卡片样式：降低透明度提升可读性，圆角 16px - 启动画面显示时间调整为 4 秒 - CSS 新增 .glass-card、.content-blur-overlay、辅助功能类 - 新增 a11yStore、devStore、themeStore 状态管理 --- src-tauri/src/lib.rs | 2 +- src-tauri/tauri.conf.json | 10 +- src/components/background/BackgroundLayer.tsx | 6 + src/components/splash/Splash.tsx | 2 +- src/components/ui/badge.tsx | 52 +++++ src/components/ui/card.tsx | 103 +++++++++ src/components/ui/label.tsx | 20 ++ src/components/ui/radio-group.tsx | 38 ++++ src/components/ui/separator.tsx | 23 +++ src/components/ui/slider.tsx | 52 +++++ src/components/ui/switch.tsx | 30 +++ src/hooks/useTheme.ts | 21 +- src/index.css | 97 ++++++++- src/layouts/RootLayout.tsx | 13 +- src/pages/setting/game/advanced.tsx | 8 + src/pages/setting/game/game-account.tsx | 8 + src/pages/setting/game/game-dir.tsx | 8 + src/pages/setting/game/java-mem.tsx | 8 + src/pages/setting/general/about.tsx | 8 + src/pages/setting/general/account.tsx | 8 + src/pages/setting/general/copyright.tsx | 8 + src/pages/setting/general/home.tsx | 8 + src/pages/setting/index.tsx | 159 +++++++++++++- src/pages/setting/network/download.tsx | 8 + src/pages/setting/network/ether-online.tsx | 8 + src/pages/setting/network/security-id.tsx | 8 + src/pages/setting/network/tawa-online.tsx | 8 + src/pages/setting/other/developer.tsx | 122 +++++++++++ src/pages/setting/other/feedback.tsx | 8 + src/pages/setting/other/sponsor.tsx | 8 + src/pages/setting/personalization/a11y.tsx | 54 +++++ src/pages/setting/personalization/lang.tsx | 8 + .../setting/personalization/theme-bg.tsx | 195 ++++++++++++++++++ src/pages/setting/personalization/ui.tsx | 8 + src/stores/a11yStore.ts | 20 ++ src/stores/devStore.ts | 12 ++ src/stores/themeStore.ts | 30 +++ 37 files changed, 1160 insertions(+), 29 deletions(-) create mode 100644 src/components/ui/badge.tsx create mode 100644 src/components/ui/card.tsx create mode 100644 src/components/ui/label.tsx create mode 100644 src/components/ui/radio-group.tsx create mode 100644 src/components/ui/separator.tsx create mode 100644 src/components/ui/slider.tsx create mode 100644 src/components/ui/switch.tsx create mode 100644 src/pages/setting/game/advanced.tsx create mode 100644 src/pages/setting/game/game-account.tsx create mode 100644 src/pages/setting/game/game-dir.tsx create mode 100644 src/pages/setting/game/java-mem.tsx create mode 100644 src/pages/setting/general/about.tsx create mode 100644 src/pages/setting/general/account.tsx create mode 100644 src/pages/setting/general/copyright.tsx create mode 100644 src/pages/setting/general/home.tsx create mode 100644 src/pages/setting/network/download.tsx create mode 100644 src/pages/setting/network/ether-online.tsx create mode 100644 src/pages/setting/network/security-id.tsx create mode 100644 src/pages/setting/network/tawa-online.tsx create mode 100644 src/pages/setting/other/developer.tsx create mode 100644 src/pages/setting/other/feedback.tsx create mode 100644 src/pages/setting/other/sponsor.tsx create mode 100644 src/pages/setting/personalization/a11y.tsx create mode 100644 src/pages/setting/personalization/lang.tsx create mode 100644 src/pages/setting/personalization/theme-bg.tsx create mode 100644 src/pages/setting/personalization/ui.tsx create mode 100644 src/stores/a11yStore.ts create mode 100644 src/stores/devStore.ts create mode 100644 src/stores/themeStore.ts diff --git a/src-tauri/src/lib.rs b/src-tauri/src/lib.rs index 087f43e..33a95f8 100644 --- a/src-tauri/src/lib.rs +++ b/src-tauri/src/lib.rs @@ -32,7 +32,7 @@ pub fn run() { // After splash animation, close splash and show main let handle = app.handle().clone(); tauri::async_runtime::spawn(async move { - tokio::time::sleep(std::time::Duration::from_secs(8)).await; + tokio::time::sleep(std::time::Duration::from_secs(4)).await; // Close splash screen if let Some(splash) = handle.get_webview_window("splashscreen") { diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json index 7386c74..23061a3 100644 --- a/src-tauri/tauri.conf.json +++ b/src-tauri/tauri.conf.json @@ -13,7 +13,7 @@ "windows": [ { "label": "splashscreen", - "title": "正在启动", + "title": "Koring Launcher", "url": "/splash.html", "width": 480, "height": 320, @@ -30,10 +30,13 @@ { "label": "main", "title": "Koring Launcher", - "width": 800, + "width": 900, "height": 600, + "minWidth": 800, + "minHeight": 600, "decorations": false, "transparent": true, + "center": true, "visible": false } ], @@ -45,8 +48,7 @@ "active": true, "targets": "all", "icon": [ - "icons/icon.png", - "icons/icon.ico" + "icons/icon.png" ], "externalBin": [ "binaries/koring-sidecar" diff --git a/src/components/background/BackgroundLayer.tsx b/src/components/background/BackgroundLayer.tsx index 3d1ba0b..0d80e5b 100644 --- a/src/components/background/BackgroundLayer.tsx +++ b/src/components/background/BackgroundLayer.tsx @@ -1,10 +1,15 @@ import { useEffect } from "react"; import { useBackgroundStore } from "@/stores/backgroundStore"; +import { useRouteStore } from "@/stores/routeStore"; +import { useDevStore } from "@/stores/devStore"; const DEFAULT_BG = "/background.png"; export function BackgroundLayer() { const { type, image, color, blur, opacity, animationSpeed, fetchConfig } = useBackgroundStore(); + const route = useRouteStore((s) => s.current); + const forceDisableContentBlur = useDevStore((s) => s.forceDisableContentBlur); + const inSetting = route === "setting" || route === "debug"; useEffect(() => { fetchConfig(); @@ -77,6 +82,7 @@ export function BackgroundLayer() { } `}
+ {inSetting && !forceDisableContentBlur &&
}
); diff --git a/src/components/splash/Splash.tsx b/src/components/splash/Splash.tsx index 8cb1d9c..e254add 100644 --- a/src/components/splash/Splash.tsx +++ b/src/components/splash/Splash.tsx @@ -7,7 +7,7 @@ export default function Splash() { useEffect(() => { const t1 = setTimeout(() => setPhase("visible"), 50); - const t2 = setTimeout(() => setPhase("exit"), 7500); + const t2 = setTimeout(() => setPhase("exit"), 3500); return () => { clearTimeout(t1); clearTimeout(t2); }; }, []); diff --git a/src/components/ui/badge.tsx b/src/components/ui/badge.tsx new file mode 100644 index 0000000..b20959d --- /dev/null +++ b/src/components/ui/badge.tsx @@ -0,0 +1,52 @@ +import { mergeProps } from "@base-ui/react/merge-props" +import { useRender } from "@base-ui/react/use-render" +import { cva, type VariantProps } from "class-variance-authority" + +import { cn } from "@/lib/utils" + +const badgeVariants = cva( + "group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!", + { + variants: { + variant: { + default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80", + secondary: + "bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80", + destructive: + "bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20", + outline: + "border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground", + ghost: + "hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50", + link: "text-primary underline-offset-4 hover:underline", + }, + }, + defaultVariants: { + variant: "default", + }, + } +) + +function Badge({ + className, + variant = "default", + render, + ...props +}: useRender.ComponentProps<"span"> & VariantProps) { + return useRender({ + defaultTagName: "span", + props: mergeProps<"span">( + { + className: cn(badgeVariants({ variant }), className), + }, + props + ), + render, + state: { + slot: "badge", + variant, + }, + }) +} + +export { Badge, badgeVariants } diff --git a/src/components/ui/card.tsx b/src/components/ui/card.tsx new file mode 100644 index 0000000..4458dae --- /dev/null +++ b/src/components/ui/card.tsx @@ -0,0 +1,103 @@ +import * as React from "react" + +import { cn } from "@/lib/utils" + +function Card({ + className, + size = "default", + ...props +}: React.ComponentProps<"div"> & { size?: "default" | "sm" }) { + return ( +
img:first-child]:pt-0 data-[size=sm]:[--card-spacing:--spacing(3)] data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl", + className + )} + {...props} + /> + ) +} + +function CardHeader({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} + +function CardTitle({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} + +function CardDescription({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} + +function CardAction({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} + +function CardContent({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} + +function CardFooter({ className, ...props }: React.ComponentProps<"div">) { + return ( +
+ ) +} + +export { + Card, + CardHeader, + CardFooter, + CardTitle, + CardAction, + CardDescription, + CardContent, +} diff --git a/src/components/ui/label.tsx b/src/components/ui/label.tsx new file mode 100644 index 0000000..74da65c --- /dev/null +++ b/src/components/ui/label.tsx @@ -0,0 +1,20 @@ +"use client" + +import * as React from "react" + +import { cn } from "@/lib/utils" + +function Label({ className, ...props }: React.ComponentProps<"label">) { + return ( +