From 0a2a4e2e3252325eb2a80ecdde09b0dbe53857e8 Mon Sep 17 00:00:00 2001
From: Michael Han <107991372+shimmyshimmer@users.noreply.github.com>
Date: Sat, 25 Jul 2026 22:46:53 -0700
Subject: [PATCH] Settings: widen dialog to 960px and raise height to 680px
 (#7456)

Also caps the height at the viewport instead of pinning it, so short
viewports no longer get a clipped dialog.
---
 studio/frontend/src/features/settings/settings-dialog.tsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/studio/frontend/src/features/settings/settings-dialog.tsx b/studio/frontend/src/features/settings/settings-dialog.tsx
index 7a3a3c58f7..e3ef476470 100644
--- a/studio/frontend/src/features/settings/settings-dialog.tsx
+++ b/studio/frontend/src/features/settings/settings-dialog.tsx
@@ -249,9 +249,10 @@ export function SettingsDialog() {
             }
           }}
           className={cn(
-            // Cap at 880px but shrink to the viewport so it doesn't clip on
-            // iPad-portrait widths where a fixed width overflows.
-            "settings-surface !max-w-[min(880px,calc(100vw-2rem))] h-[560px] w-[min(880px,calc(100vw-2rem))] p-0 overflow-hidden",
+            // Cap at 960px but shrink to the viewport so it doesn't clip on
+            // iPad-portrait widths where a fixed width overflows. Height caps
+            // the same way so short viewports don't get a clipped dialog.
+            "settings-surface !max-w-[min(960px,calc(100vw-2rem))] h-[min(680px,calc(100dvh-2rem))] w-[min(960px,calc(100vw-2rem))] p-0 overflow-hidden",
             // Soft shadow, no outline ring. Pin --radius to the light value so
             // corner rounding matches in dark mode.
             "shadow-border rounded-xl ring-0 [--radius:1.1rem]",