fix(web): constrain dialog overflow layouts (#36302)

This commit is contained in:
yyh
2026-05-18 14:11:58 +08:00
committed by GitHub
parent e2c52c9b0f
commit 28818f2e2a
13 changed files with 69 additions and 67 deletions

View File

@@ -167,12 +167,12 @@ const InstallFromGitHub: React.FC<InstallFromGitHubProps> = ({ updatePayload, on
foldAnimInto()
}}
>
<DialogContent className={cn('w-[560px] max-w-none! overflow-hidden! text-left align-middle', cn(modalClassName, `shadows-shadow-xl flex min-w-[560px] flex-col items-start rounded-2xl border-[0.5px]
<DialogContent className={cn('w-[560px] max-w-none! overflow-hidden! text-left align-middle', cn(modalClassName, `shadows-shadow-xl flex max-h-[calc(100dvh-48px)] min-w-[560px] flex-col items-start rounded-2xl border-[0.5px]
border-components-panel-border bg-components-panel-bg p-0`))}
>
<DialogCloseButton />
<div className="flex items-start gap-2 self-stretch pt-6 pr-14 pb-3 pl-6">
<div className="flex shrink-0 items-start gap-2 self-stretch pt-6 pr-14 pb-3 pl-6">
<div className="flex grow flex-col items-start gap-1">
<div className="self-stretch title-2xl-semi-bold text-text-primary">
{getTitle()}
@@ -192,7 +192,7 @@ const InstallFromGitHub: React.FC<InstallFromGitHubProps> = ({ updatePayload, on
/>
)
: (
<div className={`flex flex-col items-start justify-center self-stretch px-6 py-3 ${state.step === InstallStepFromGitHub.installed ? 'gap-2' : 'gap-4'}`}>
<div className={`flex min-h-0 flex-1 flex-col items-start justify-center self-stretch overflow-y-auto px-6 py-3 ${state.step === InstallStepFromGitHub.installed ? 'gap-2' : 'gap-4'}`}>
{state.step === InstallStepFromGitHub.setUrl && (
<SetURL
repoUrl={state.repoUrl}

View File

@@ -42,7 +42,7 @@ const SetURL: React.FC<SetURLProps> = ({ repoUrl, onChange, onNext, onCancel })
onChange={e => onChange(e.target.value)}
className="shadows-shadow-xs flex grow items-center gap-[2px] self-stretch
overflow-hidden rounded-lg border border-components-input-border-active bg-components-input-bg-active p-2
system-sm-regular text-ellipsis text-components-input-text-filled"
system-sm-regular text-ellipsis text-components-input-text-filled outline-hidden"
placeholder="Please enter GitHub repo URL"
/>
<div className="mt-4 flex items-center justify-end gap-2 self-stretch">