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.
This commit is contained in:
Jason
2025-10-16 16:39:03 +08:00
parent cfefe6b52a
commit 31f56f7c86
3 changed files with 37 additions and 59 deletions

View File

@@ -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
appType={appType}
submitLabel={t("common.add", { defaultValue: "添加" })}
onSubmit={handleSubmit}
onCancel={() => onOpenChange(false)}
/>
<div className="flex-1 overflow-y-auto -mx-6 px-6">
<ProviderForm
appType={appType}
submitLabel={t("common.add", { defaultValue: "添加" })}
onSubmit={handleSubmit}
onCancel={() => onOpenChange(false)}
/>
</div>
</DialogContent>
</Dialog>
);