fix: add scrollbars to provider dialogs and simplify theme toggle

## Changes

### Add scrollbars to provider dialogs
- **AddProviderDialog.tsx**: Add max-h-[90vh], flex flex-col layout, and scrollable content wrapper
- **EditProviderDialog.tsx**: Add max-h-[90vh], flex flex-col layout, and scrollable content wrapper
- Both dialogs now follow the same scrolling pattern as other dialogs in the app
- Wrap ProviderForm in `<div className="flex-1 overflow-y-auto -mx-6 px-6">` for proper scrolling

### Simplify theme toggle
- **mode-toggle.tsx**: Change from dropdown menu to direct toggle button
- Remove DropdownMenu and related imports
- Click now directly toggles between light and dark mode
- Simpler UX: one click to switch themes instead of opening a menu
- Remove "system" theme option from quick toggle (still available in settings if needed)

## Benefits
- **Consistent scrolling**: All dialogs now have proper scroll behavior when content exceeds viewport height
- **Better UX**: Theme toggle is faster and more intuitive with direct click
- **Code simplification**: Removed unnecessary dropdown menu complexity from theme toggle

All TypeScript type checks and Prettier formatting checks pass.

src/components/mode-toggle.tsx

@@ -1,55 +1,29 @@
 import { Moon, Sun } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import { Button } from "@/components/ui/button";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuLabel,
-  DropdownMenuRadioGroup,
-  DropdownMenuRadioItem,
-  DropdownMenuSeparator,
-  DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
 import { useTheme } from "@/components/theme-provider";
 
 export function ModeToggle() {
   const { theme, setTheme } = useTheme();
   const { t } = useTranslation();
 
-  const handleChange = (value: string) => {
+  const toggleTheme = () => {
-    if (value === "light" || value === "dark" || value === "system") {
+    // 如果当前是 dark 或 system（且系统是暗色），切换到 light
-      setTheme(value);
+    // 否则切换到 dark
+    if (theme === "dark") {
+      setTheme("light");
+    } else {
+      setTheme("dark");
     }
   };
 
   return (
-    <DropdownMenu>
+    <Button variant="outline" size="icon" onClick={toggleTheme}>
-      <DropdownMenuTrigger asChild>
+      <Sun className="h-4 w-4 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
-        <Button variant="outline" size="icon">
+      <Moon className="absolute h-4 w-4 rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
-          <Sun className="h-4 w-4 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
+      <span className="sr-only">
-          <Moon className="absolute h-4 w-4 rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
+        {t("common.toggleTheme", { defaultValue: "切换主题" })}
-          <span className="sr-only">
+      </span>
-            {t("common.toggleTheme", { defaultValue: "切换主题" })}
+    </Button>
-          </span>
-        </Button>
-      </DropdownMenuTrigger>
-      <DropdownMenuContent align="end">
-        <DropdownMenuLabel>
-          {t("common.theme", { defaultValue: "主题" })}
-        </DropdownMenuLabel>
-        <DropdownMenuSeparator />
-        <DropdownMenuRadioGroup value={theme} onValueChange={handleChange}>
-          <DropdownMenuRadioItem value="light">
-            {t("common.lightMode", { defaultValue: "浅色" })}
-          </DropdownMenuRadioItem>
-          <DropdownMenuRadioItem value="dark">
-            {t("common.darkMode", { defaultValue: "深色" })}
-          </DropdownMenuRadioItem>
-          <DropdownMenuRadioItem value="system">
-            {t("common.systemMode", { defaultValue: "跟随系统" })}
-          </DropdownMenuRadioItem>
-        </DropdownMenuRadioGroup>
-      </DropdownMenuContent>
-    </DropdownMenu>
   );
 }

src/components/providers/AddProviderDialog.tsx

@@ -56,7 +56,7 @@ export function AddProviderDialog({
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-w-2xl">
+      <DialogContent className="max-w-2xl max-h-[90vh] flex flex-col">
         <DialogHeader>
           <DialogTitle>{submitLabel}</DialogTitle>
           <DialogDescription>
@@ -66,12 +66,14 @@ export function AddProviderDialog({
           </DialogDescription>
         </DialogHeader>
 
-        <ProviderForm
+        <div className="flex-1 overflow-y-auto -mx-6 px-6">
-          appType={appType}
+          <ProviderForm
-          submitLabel={t("common.add", { defaultValue: "添加" })}
+            appType={appType}
-          onSubmit={handleSubmit}
+            submitLabel={t("common.add", { defaultValue: "添加" })}
-          onCancel={() => onOpenChange(false)}
+            onSubmit={handleSubmit}
-        />
+            onCancel={() => onOpenChange(false)}
+          />
+        </div>
       </DialogContent>
     </Dialog>
   );

src/components/providers/EditProviderDialog.tsx

@@ -60,7 +60,7 @@ export function EditProviderDialog({
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-w-2xl">
+      <DialogContent className="max-w-2xl max-h-[90vh] flex flex-col">
         <DialogHeader>
           <DialogTitle>
             {t("provider.editProvider", { defaultValue: "编辑供应商" })}
@@ -72,17 +72,19 @@ export function EditProviderDialog({
           </DialogDescription>
         </DialogHeader>
 
-        <ProviderForm
+        <div className="flex-1 overflow-y-auto -mx-6 px-6">
-          appType={appType}
+          <ProviderForm
-          submitLabel={t("common.save", { defaultValue: "保存" })}
+            appType={appType}
-          onSubmit={handleSubmit}
+            submitLabel={t("common.save", { defaultValue: "保存" })}
-          onCancel={() => onOpenChange(false)}
+            onSubmit={handleSubmit}
-          initialData={{
+            onCancel={() => onOpenChange(false)}
-            name: provider.name,
+            initialData={{
-            websiteUrl: provider.websiteUrl,
+              name: provider.name,
-            settingsConfig: provider.settingsConfig,
+              websiteUrl: provider.websiteUrl,
-          }}
+              settingsConfig: provider.settingsConfig,
-        />
+            }}
+          />
+        </div>
       </DialogContent>
     </Dialog>
   );