From ee19cdb8fe40d2356c4ac90339ccaf24dce87122 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alejandro=20G=C3=B3mez?= <alejandrogomez@bitrefill.com>
Date: Wed, 28 Jan 2026 12:28:12 +0100
Subject: [PATCH] fix: use dynamic viewport sizes

---
 src/components/ErrorBoundary.tsx        | 2 +-
 src/components/layouts/AppShell.tsx     | 2 +-
 src/components/pages/RunCommandPage.tsx | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/ErrorBoundary.tsx b/src/components/ErrorBoundary.tsx
index e4bfecc..7f37911 100644
--- a/src/components/ErrorBoundary.tsx
+++ b/src/components/ErrorBoundary.tsx
@@ -73,7 +73,7 @@ export class ErrorBoundary extends Component<Props, State> {
       // App-level error: full screen error
       if (level === "app") {
         return (
-          <div className="h-screen w-screen flex items-center justify-center bg-background p-8">
+          <div className="h-dvh w-screen flex items-center justify-center bg-background p-8">
             <div className="max-w-2xl w-full border border-destructive bg-card p-8 space-y-6">
               <div className="flex items-center gap-3 text-destructive">
                 <AlertTriangle className="h-8 w-8" />
diff --git a/src/components/layouts/AppShell.tsx b/src/components/layouts/AppShell.tsx
index 3f82958..6e30102 100644
--- a/src/components/layouts/AppShell.tsx
+++ b/src/components/layouts/AppShell.tsx
@@ -61,7 +61,7 @@ export function AppShell({ children, hideBottomBar = false }: AppShellProps) {
         onOpenChange={setCommandLauncherOpen}
       />
       <GlobalAuthPrompt />
-      <main className="h-screen w-screen flex flex-col bg-background text-foreground">
+      <main className="h-dvh w-screen flex flex-col bg-background text-foreground">
         <header className="flex flex-row items-center justify-between px-1 border-b border-border">
           <button
             onClick={() => setCommandLauncherOpen(true)}
diff --git a/src/components/pages/RunCommandPage.tsx b/src/components/pages/RunCommandPage.tsx
index 94d228b..2553ce2 100644
--- a/src/components/pages/RunCommandPage.tsx
+++ b/src/components/pages/RunCommandPage.tsx
@@ -60,7 +60,7 @@ export default function RunCommandPage() {
 
   if (loading) {
     return (
-      <div className="flex h-screen items-center justify-center bg-background">
+      <div className="flex h-dvh items-center justify-center bg-background">
         <div className="text-muted-foreground">Loading command...</div>
       </div>
     );
@@ -68,7 +68,7 @@ export default function RunCommandPage() {
 
   if (!parsed || parsed.error || !parsed.command || !parsed.props) {
     return (
-      <div className="flex h-screen items-center justify-center bg-background">
+      <div className="flex h-dvh items-center justify-center bg-background">
         <div className="max-w-md rounded-lg border border-border bg-card p-6">
           <h2 className="mb-2 text-lg font-semibold text-destructive">
             Command Error