Refactor: Remove summary cards from various pages and update UI components

- Removed summary cards from Managed Domains, Nodes, Proxy Routes, TLS Certificates, Users pages to streamline UI.
- Updated Nodes and Proxy Routes pages to enhance action buttons and descriptions.
- Added new runtime configuration options for rate limiting in Settings page, allowing for dynamic updates.
- Updated documentation to reflect new runtime configurations and their effects.
- Enhanced unit tests for DashboardOverview to include mock data for comprehensive coverage.

atsf_server/web/components/ui/theme-toggle.tsx

@@ -1,55 +1,74 @@
-'use client';
-
-import { cn } from '@/lib/utils/cn';
-import type { ThemeMode } from '@/lib/theme/theme';
-import { useTheme } from '@/components/providers/theme-provider';
-
-const themeOptions: Array<{ value: ThemeMode; label: string }> = [
-  { value: 'light', label: '浅色' },
-  { value: 'system', label: '跟随系统' },
-  { value: 'dark', label: '深色' },
-];
-
-interface ThemeToggleProps {
-  className?: string;
-}
-
-export function ThemeToggle({ className }: ThemeToggleProps) {
-  const { themeMode, resolvedTheme, setThemeMode } = useTheme();
-
-  return (
-    <div
-      className={cn(
-        'inline-flex items-center gap-1 rounded-full border border-[var(--border-default)] bg-[var(--control-background)] p-1 text-xs text-[var(--foreground-secondary)]',
-        className,
-      )}
-      aria-label='主题切换'
-    >
-      {themeOptions.map((option) => {
-        const active = themeMode === option.value;
-
-        return (
-          <button
-            key={option.value}
-            type='button'
-            onClick={() => setThemeMode(option.value)}
-            className={cn(
-              'rounded-full px-3 py-1.5 transition-colors',
-              active
-                ? 'bg-[var(--accent-soft)] text-[var(--foreground-primary)]'
-                : 'hover:bg-[var(--control-background-hover)] hover:text-[var(--foreground-primary)]',
-            )}
-            aria-pressed={active}
-            title={
-              option.value === 'system'
-                ? `当前跟随系统（${resolvedTheme === 'dark' ? '深色' : '浅色'}）`
-                : `切换到${option.label}`
-            }
-          >
-            {option.label}
-          </button>
-        );
-      })}
-    </div>
-  );
-}
+'use client';
+
+import { cn } from '@/lib/utils/cn';
+import { themeModes, type ThemeMode } from '@/lib/theme/theme';
+import { useTheme } from '@/components/providers/theme-provider';
+
+interface ThemeToggleProps {
+  className?: string;
+}
+
+export function ThemeToggle({ className }: ThemeToggleProps) {
+  const { themeMode, resolvedTheme, setThemeMode } = useTheme();
+  const currentIndex = themeModes.indexOf(themeMode);
+  const nextTheme = themeModes[(currentIndex + 1) % themeModes.length] as ThemeMode;
+
+  const icon =
+    themeMode === 'light' ? (
+      <svg
+        className='h-5 w-5'
+        viewBox='0 0 24 24'
+        fill='none'
+        stroke='currentColor'
+        strokeWidth='1.8'
+        strokeLinecap='round'
+        strokeLinejoin='round'
+      >
+        <circle cx='12' cy='12' r='4' />
+        <path d='M12 2.5v2.2M12 19.3v2.2M21.5 12h-2.2M4.7 12H2.5M18.7 5.3l-1.6 1.6M6.9 17.1l-1.6 1.6M18.7 18.7l-1.6-1.6M6.9 6.9 5.3 5.3' />
+      </svg>
+    ) : themeMode === 'dark' ? (
+      <svg
+        className='h-5 w-5'
+        viewBox='0 0 24 24'
+        fill='none'
+        stroke='currentColor'
+        strokeWidth='1.8'
+        strokeLinecap='round'
+        strokeLinejoin='round'
+      >
+        <path d='M20 15.2A7.8 7.8 0 1 1 8.8 4 6.4 6.4 0 0 0 20 15.2Z' />
+      </svg>
+    ) : (
+      <svg
+        className='h-5 w-5'
+        viewBox='0 0 24 24'
+        fill='none'
+        stroke='currentColor'
+        strokeWidth='1.8'
+        strokeLinecap='round'
+        strokeLinejoin='round'
+      >
+        <rect x='3.5' y='4' width='17' height='12' rx='2.5' />
+        <path d='M8 20h8M12 16v4' />
+      </svg>
+    );
+
+  const label =
+    themeMode === 'light' ? '浅色模式' : themeMode === 'dark' ? '深色模式' : '跟随系统';
+
+  return (
+    <button
+      type='button'
+      onClick={() => setThemeMode(nextTheme)}
+      className={cn(
+        'inline-flex h-11 w-11 items-center justify-center rounded-2xl border border-[var(--border-default)] bg-[var(--control-background)] text-[var(--foreground-primary)] transition hover:bg-[var(--control-background-hover)]',
+        className,
+      )}
+      aria-label={`当前${label}，点击切换到${nextTheme === 'light' ? '浅色模式' : nextTheme === 'dark' ? '深色模式' : '跟随系统'}`}
+      title={`${label}（当前生效：${resolvedTheme === 'dark' ? '深色' : '浅色'}），点击切换到${nextTheme === 'light' ? '浅色模式' : nextTheme === 'dark' ? '深色模式' : '跟随系统'}`}
+    >
+      {icon}
+    </button>
+  );
+}