minor design change

extensions/react-widget/package.json

@@ -1,6 +1,6 @@
 {
   "name": "docsgpt",
-  "version": "0.3.9",
+  "version": "0.4.0",
   "private": false,
   "description": "DocsGPT 🦖 is an innovative open-source tool designed to simplify the retrieval of information from project documentation using advanced GPT models 🤖.",
   "source": "./src/index.html",

extensions/react-widget/src/components/DocsGPTWidget.tsx

@@ -142,8 +142,8 @@ const Conversation = styled.div<{ size: string }>`
     @media only screen and (max-width: 768px) {
     width: 90vw !important;
     }
-    @media only screen and (min-width:768px ) and (max-width: 1023px) {
-    width:${props => props.size === 'medium' ? '400px' : '60vw'} !important;
+    @media only screen and (min-width:768px ) and (max-width: 1024px) {
+    width:${props => props.size === 'medium' ? '60vw' : '400px'} !important;
     }
     
 `;
@@ -160,7 +160,7 @@ const Message = styled.p<{ type: MESSAGE_TYPE }>`
     '#38383b'};
     color: #ffff;
     border: none;
-    max-width: 80%;
+    max-width: ${props => props.type === 'ANSWER' ? '100%' : '80'};
     overflow: auto;
     margin: 4px;
     display: block;

extensions/react-widget/src/main.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { createRoot } from 'react-dom/client';
 import { DocsGPTWidget } from './components/DocsGPTWidget';
 
+
 const renderWidget = (elementId: string, props = {}) => {
   const root = createRoot(document.getElementById(elementId) as HTMLElement);
   root.render(<DocsGPTWidget {...props} />);