From a16e83200ae403f65f481d614623cc6f58bb8bd9 Mon Sep 17 00:00:00 2001
From: utin-francis-peter <utinfrancis.dev@gmail.com>
Date: Fri, 28 Jun 2024 15:16:55 +0100
Subject: [PATCH] style fix: gap between conversations wrapper and prompts
 input wrapper

---
 frontend/src/conversation/Conversation.tsx       | 6 +++---
 frontend/src/conversation/ConversationBubble.tsx | 2 +-
 frontend/src/index.css                           | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/frontend/src/conversation/Conversation.tsx b/frontend/src/conversation/Conversation.tsx
index 4fb34186..d9088153 100644
--- a/frontend/src/conversation/Conversation.tsx
+++ b/frontend/src/conversation/Conversation.tsx
@@ -191,11 +191,11 @@ export default function Conversation() {
   };
 
   return (
-    <div className="flex h-screen flex-col gap-1">
+    <div className="flex h-screen flex-col gap-7">
       <div
         onWheel={handleUserInterruption}
         onTouchMove={handleUserInterruption}
-        className="flex h-[90%] w-full justify-center overflow-y-auto p-4 md:h-[83vh]"
+        className="flex h-[90%] w-full flex-1 justify-center overflow-y-auto p-4 md:h-[83vh]"
       >
         {queries.length > 0 && !hasScrolledToLast && (
           <button
@@ -234,7 +234,7 @@ export default function Conversation() {
         {queries.length === 0 && <Hero handleQuestion={handleQuestion} />}
       </div>
 
-      <div className="bottom-safe fixed flex w-11/12 flex-col items-end self-center rounded-2xl bg-opacity-0 pb-1 sm:w-6/12">
+      <div className="flex w-11/12 flex-col items-end self-center rounded-2xl bg-opacity-0 pb-1 sm:w-6/12">
         <div className="flex h-full w-full items-center rounded-full border border-silver bg-white dark:bg-raisin-black">
           <div
             id="inputbox"
diff --git a/frontend/src/conversation/ConversationBubble.tsx b/frontend/src/conversation/ConversationBubble.tsx
index c82b5e69..32f55a62 100644
--- a/frontend/src/conversation/ConversationBubble.tsx
+++ b/frontend/src/conversation/ConversationBubble.tsx
@@ -68,7 +68,7 @@ const ConversationBubble = forwardRef<
           />
 
           <div
-            className={`ml-2 mr-5 flex max-w-[90vw] rounded-[28px] border-2 border-red-600 bg-gray-1000 py-[14px] px-7 dark:bg-gun-metal md:max-w-[70vw] lg:max-w-[50vw] ${
+            className={`ml-2 mr-5 flex max-w-[90vw] rounded-[28px] bg-gray-1000 py-[14px] px-7 dark:bg-gun-metal md:max-w-[70vw] lg:max-w-[50vw] ${
               type === 'ERROR'
                 ? 'relative flex-row items-center rounded-full border border-transparent bg-[#FFE7E7] p-2 py-5 text-sm font-normal text-red-3000  dark:border-red-2000 dark:text-white'
                 : 'flex-col rounded-3xl'
diff --git a/frontend/src/index.css b/frontend/src/index.css
index 519b5f74..c1d80714 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -409,9 +409,9 @@ template {
   width: 0;
 }
 
-.bottom-safe {
+/* .bottom-safe {
   bottom: env(safe-area-inset-bottom, 0);
-}
+} */
 
 .inputbox-style[contenteditable] {
   padding-left: 36px;