mirror of
https://github.com/Nezumi-2711/9router.git
synced 2026-09-22 20:00:47 +00:00
- Updated global CSS to implement a new brand color palette and improve light/dark theme consistency. - Enhanced the MitmServerCard component to provide clearer user feedback regarding admin privileges. - Filtered LLM combos in the CombosPage to ensure only relevant data is displayed. - Improved APIPageClient layout for better usability and visual consistency. - Added functionality to save and load DNS tool states in the MITM manager. - Updated OAuth configuration URLs for Qwen to reflect the new endpoint structure. - Refined tunnel management logic to improve reliability and user experience.
43 lines
1.2 KiB
JavaScript
43 lines
1.2 KiB
JavaScript
"use client";
|
|
|
|
import { useTheme } from "@/shared/hooks/useTheme";
|
|
import { cn } from "@/shared/utils/cn";
|
|
|
|
export default function ThemeToggle({ className, variant = "default" }) {
|
|
const { isDark, toggleTheme } = useTheme();
|
|
|
|
const variants = {
|
|
default: cn(
|
|
"flex items-center justify-center size-10 rounded-full",
|
|
"text-text-muted hover:text-text-main",
|
|
"hover:bg-surface-2 transition-colors"
|
|
),
|
|
card: cn(
|
|
"flex items-center justify-center size-11 rounded-full",
|
|
"bg-surface/60 hover:bg-surface",
|
|
"border border-border",
|
|
"backdrop-blur-md shadow-sm hover:shadow-[var(--shadow-warm)]",
|
|
"text-text-muted hover:text-brand-500",
|
|
"transition-all group"
|
|
),
|
|
};
|
|
|
|
return (
|
|
<button
|
|
onClick={toggleTheme}
|
|
className={cn(variants[variant], className)}
|
|
aria-label={`Switch to ${isDark ? "light" : "dark"} mode`}
|
|
title={`Switch to ${isDark ? "light" : "dark"} mode`}
|
|
>
|
|
<span
|
|
className={cn(
|
|
"material-symbols-outlined text-[22px]",
|
|
variant === "card" && "transition-transform duration-300 group-hover:rotate-12"
|
|
)}
|
|
>
|
|
{isDark ? "light_mode" : "dark_mode"}
|
|
</span>
|
|
</button>
|
|
);
|
|
}
|