From f283dedcbca99c7895fb7d0cf4ac5b7a2b5b6760 Mon Sep 17 00:00:00 2001
From: hobby <binbinzhaili@qq.com>
Date: Wed, 26 Feb 2025 09:23:52 +0800
Subject: [PATCH] fix chat ui for mobile

---
 src/components/ChatUI.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/ChatUI.tsx b/src/components/ChatUI.tsx
index 51757a2..5da1ee8 100644
--- a/src/components/ChatUI.tsx
+++ b/src/components/ChatUI.tsx
@@ -380,8 +380,8 @@ const ChatUI = () => {
   return (
     <>
       <KaTeXStyle />
-      <div className="min-h-screen bg-gradient-to-br from-blue-50 via-indigo-50 to-purple-50 flex items-start md:items-center justify-center">
-        <div className="h-screen flex flex-col bg-white w-full mx-auto relative shadow-xl md:max-w-3xl md:h-[95dvh] md:my-auto md:rounded-lg">
+      <div className="fixed inset-0 bg-gradient-to-br from-blue-50 via-indigo-50 to-purple-50 flex items-start md:items-center justify-center overflow-hidden">
+        <div className="h-full flex flex-col bg-white w-full mx-auto relative shadow-xl md:max-w-3xl md:h-[95dvh] md:my-auto md:rounded-lg">
           {/* Header */}
           <header className="bg-white shadow flex-none md:rounded-t-lg">
             <div className="flex items-center justify-between px-4 py-3">
@@ -552,8 +552,8 @@ const ChatUI = () => {
           </div>
 
           {/* Input Area */}
-          <div className="bg-white border-t pb-[calc(0.75rem+env(safe-area-inset-bottom))] pt-3 px-4 md:rounded-b-lg">
-            <div className="flex gap-1">
+          <div className="bg-white border-t pb-3 pt-3 px-4 md:rounded-b-lg">
+            <div className="flex gap-1 pb-[env(safe-area-inset-bottom)]">
               {messages.length > 0 && (
                 <TooltipProvider>
                   <Tooltip>