From 4ab9fd114f384602ba25f5abe2d1d9668cf52f4d Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Fri, 7 Nov 2025 07:09:12 -0600
Subject: [PATCH] Use a column layout for MobilePageContent in
 PlatformAwareSheet

 This is so the header is outside the scrolling area and the content can grow/scroll independently. This now matches the way it's done in classification
---
 web/src/components/overlay/dialog/PlatformAwareDialog.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/web/src/components/overlay/dialog/PlatformAwareDialog.tsx b/web/src/components/overlay/dialog/PlatformAwareDialog.tsx
index ad03ba7eb..62ee4b1f9 100644
--- a/web/src/components/overlay/dialog/PlatformAwareDialog.tsx
+++ b/web/src/components/overlay/dialog/PlatformAwareDialog.tsx
@@ -20,6 +20,7 @@ import {
   SheetTitle,
   SheetTrigger,
 } from "@/components/ui/sheet";
+import { cn } from "@/lib/utils";
 import { isMobile } from "react-device-detect";
 
 type PlatformAwareDialogProps = {
@@ -86,14 +87,16 @@ export function PlatformAwareSheet({
           {trigger}
         </MobilePageTrigger>
         <MobilePagePortal>
-          <MobilePageContent className="h-full overflow-hidden">
+          <MobilePageContent className="flex h-full flex-col">
             <MobilePageHeader
               className="mx-2"
               onClose={() => onOpenChange(false)}
             >
               <MobilePageTitle>{title}</MobilePageTitle>
             </MobilePageHeader>
-            <div className={contentClassName}>{content}</div>
+            <div className={cn("flex-1 overflow-y-auto", contentClassName)}>
+              {content}
+            </div>
           </MobilePageContent>
         </MobilePagePortal>
       </MobilePage>