fix: Fixed modal overflow issue
This commit is contained in:
@@ -207,12 +207,20 @@ export function Modal({
|
||||
<div
|
||||
ref={panelRef}
|
||||
tabIndex={-1}
|
||||
className={`relative z-10 w-full ${wide ? "sm:max-w-2xl" : "sm:max-w-md"} max-h-[85dvh] overflow-auto rounded rounded-b-none border border-b-0 border-border bg-surface shadow-panel focus:outline-none sm:rounded sm:border-b`}
|
||||
/*
|
||||
* A column with only the body scrolling. Scrolling the whole
|
||||
* panel let a tall body (the workflow editor, with its schedule
|
||||
* section) paint past the panel's bottom edge, and it scrolled
|
||||
* the title and close button away with it. The vh cap is the
|
||||
* fallback for browsers without dvh, which would otherwise drop
|
||||
* the cap entirely and grow the panel off screen.
|
||||
*/
|
||||
className={`relative z-10 flex w-full flex-col ${wide ? "sm:max-w-2xl" : "sm:max-w-md"} max-h-[85vh] overflow-hidden rounded rounded-b-none border border-b-0 border-border bg-surface shadow-panel focus:outline-none supports-[height:100dvh]:max-h-[85dvh] sm:rounded sm:border-b`}
|
||||
role="dialog"
|
||||
aria-modal="true"
|
||||
aria-labelledby={titleId}
|
||||
>
|
||||
<div className="flex items-center justify-between border-b border-border px-5 py-3">
|
||||
<div className="flex shrink-0 items-center justify-between border-b border-border px-5 py-3">
|
||||
<h2 id={titleId} className="text-sm font-bold text-text-primary">
|
||||
{title}
|
||||
</h2>
|
||||
@@ -227,7 +235,7 @@ export function Modal({
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div ref={bodyRef} className="p-5">
|
||||
<div ref={bodyRef} className="min-h-0 flex-1 overflow-y-auto overscroll-contain p-5">
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user