Add scroll area to widget settings modal
Some checks failed
Build Frontend / build (push) Failing after 6s

Wrapped the widget settings modal content in a ScrollArea to improve usability when there are many settings, preventing overflow and keeping the modal compact.
This commit is contained in:
g
2026-01-12 10:41:52 +00:00
parent 318927cd0c
commit 9acd18955e

View File

@@ -22,6 +22,7 @@ import {
} from "@/components/ui/select" } from "@/components/ui/select"
import { WidgetConfig } from "@/hooks/useWidgetLayout" import { WidgetConfig } from "@/hooks/useWidgetLayout"
import { Settings2 } from "lucide-react" import { Settings2 } from "lucide-react"
import { ScrollArea } from "@/components/ui/scroll-area"
interface WidgetSettingsModalProps { interface WidgetSettingsModalProps {
widget: WidgetConfig | null widget: WidgetConfig | null
@@ -69,6 +70,7 @@ export function WidgetSettingsModal({ widget, open, onOpenChange, onSave }: Widg
</DialogDescription> </DialogDescription>
</DialogHeader> </DialogHeader>
<ScrollArea className="max-h-[60vh] -mr-4 pr-4">
<div className="space-y-6 py-4"> <div className="space-y-6 py-4">
{/* Resize Selection */} {/* Resize Selection */}
<div className="space-y-3 pb-6 border-b border-border/40"> <div className="space-y-3 pb-6 border-b border-border/40">
@@ -276,6 +278,7 @@ export function WidgetSettingsModal({ widget, open, onOpenChange, onSave }: Widg
)} )}
</div> </div>
</div> </div>
</ScrollArea>
<DialogFooter> <DialogFooter>
<Button variant="outline" onClick={() => onOpenChange(false)}> <Button variant="outline" onClick={() => onOpenChange(false)}>