fix: fixed height based on the user agent for fullchat and zoomed ful…

…l body layouts

src/components/layouts/FullPage.tsx

@@ -20,12 +20,15 @@ const FullPageLayout: React.FC<LayoutProps> = ({
   showInstruct = false,
   loading = false,
   poweredBy,
-}) => (
-  <>
+}) => {
+  const isChrome = navigator.userAgent.includes('Chrome');
+
+  return (
+    <>
     {integrationStyle}
     {integrationBackground}
 
-    <Spin className="memori-full-body--container" spinning={loading}>
+    <Spin className={`memori-full-body--container  ${isChrome ? 'memori-full-body--container--chrome' : 'memori-full-body--container--safari'}`} spinning={loading}>
       {showInstruct && ChangeMode && changeModeProps && (
         <ChangeMode {...changeModeProps} />
       )}
@@ -52,6 +55,7 @@ const FullPageLayout: React.FC<LayoutProps> = ({
       </div>
     </Spin>
   </>
-);
+  );
+};
 
 export default FullPageLayout;

src/components/layouts/ZoomedFullBody.tsx

@@ -70,12 +70,14 @@ const ZoomedFullBodyLayout: React.FC<LayoutProps> = ({
     };
   }, []); // Empty dependency array since we only want this to run once on mount
 
+  const isChrome = navigator.userAgent.includes('Chrome');
+
   return (
     <>
       {integrationStyle}
       {integrationBackground}
 
-      <Spin className="memori-full-body--container" spinning={loading}>
+      <Spin className={`memori-full-body--container  ${isChrome ? 'memori-full-body--container--chrome' : 'memori-full-body--container--safari'}`} spinning={loading}>
         {showInstruct && ChangeMode && changeModeProps && (
           <ChangeMode {...changeModeProps} />
         )}

src/components/layouts/zoomed-full-body.css

@@ -40,20 +40,25 @@
     scroll-behavior: smooth;
 }
 
-.memori-chat--history {
-    max-height: calc(100% - 180px);
-}
 
 /* Mobile styles */
 @media (max-width: 870px) {
     /* Layout */
     .memori-full-body--container {
         display: flex;
-        height: 85vh !important;
         flex-direction: column;
         overscroll-behavior-y: none;
     }
 
+    .memori-full-body--container--chrome{
+        height: 90vh !important;
+    }
+
+    .memori-full-body--container--safari{
+        height: 85vh !important;
+    }
+
+
     .memori--powered-by-custom {
         top: 30px;
         bottom: auto;
@@ -224,6 +229,10 @@
         height: calc(100% - 1rem);
     }
 
+    .memori--grid-column-right{
+        overflow-y: auto;
+    }
+
     .memori-full-body-layout--controls .memori-chat--bubble,
     .memori-full-body-layout--controls .memori-chat--bubble.memori-chat--user-bubble {
         position: relative;