From 4ca906a51808628885f8760386699e7886db43ef Mon Sep 17 00:00:00 2001
From: Vaibhav91one <vtking03@gmail.com>
Date: Mon, 9 Oct 2023 10:44:14 +0530
Subject: [PATCH] bug(front): The text seems to go out of screen when the
 result is too big, needed some tailwind

---
 frontend/src/conversation/ConversationBubble.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/conversation/ConversationBubble.tsx b/frontend/src/conversation/ConversationBubble.tsx
index b74c65f..e872d87 100644
--- a/frontend/src/conversation/ConversationBubble.tsx
+++ b/frontend/src/conversation/ConversationBubble.tsx
@@ -60,7 +60,7 @@ const ConversationBubble = forwardRef<
         <div className="flex self-start">
           <Avatar className="mt-2 text-2xl" avatar="🦖"></Avatar>
           <div
-            className={`ml-2 mr-5 flex flex-col items-center rounded-3xl bg-gray-1000 p-3.5 ${
+            className={`ml-2 mr-5 flex flex-col items-center rounded-3xl bg-gray-1000  p-3.5 ${
               type === 'ERROR'
                 ? ' rounded-lg border border-red-2000 bg-red-1000 p-2 text-red-3000'
                 : ''
@@ -70,7 +70,7 @@ const ConversationBubble = forwardRef<
               <img src={Alert} alt="alert" className="mr-2 inline" />
             )}
             <ReactMarkdown
-              className="whitespace-pre-wrap break-words"
+              className="max-w-screen-md whitespace-pre-wrap break-words"
               components={{
                 code({ node, inline, className, children, ...props }) {
                   const match = /language-(\w+)/.exec(className || '');