diff --git a/application/app.py b/application/app.py index bbfc060..95ac4a2 100644 --- a/application/app.py +++ b/application/app.py @@ -52,6 +52,7 @@ def api_answer(): result['answer'] = result['answer'].replace("\\n", "
") result['answer'] = result['answer'].replace("SOURCES:", "") + return result diff --git a/application/static/dist/css/output.css b/application/static/dist/css/output.css index a9afa82..47f390b 100644 --- a/application/static/dist/css/output.css +++ b/application/static/dist/css/output.css @@ -517,6 +517,34 @@ video { position: static; } +.fixed { + position: fixed; +} + +.bottom-0 { + bottom: 0px; +} + +.right-0 { + right: 0px; +} + +.left-0 { + left: 0px; +} + +.left-10 { + left: 2.5rem; +} + +.right-10 { + right: 2.5rem; +} + +.mt-2 { + margin-top: 0.5rem; +} + .mb-2 { margin-bottom: 0.5rem; } @@ -537,20 +565,20 @@ video { display: flex; } -.w-3\/4 { - width: 75%; +.h-5\/6 { + height: 83.333333%; } -.w-full { - width: 100%; +.max-h-screen { + max-height: 100vh; } -.w-\[46rem\] { - width: 46rem; +.min-h-screen { + min-height: 100vh; } -.w-1\/4 { - width: 25%; +.w-full { + width: 100%; } .flex-col { @@ -561,6 +589,10 @@ video { align-items: center; } +.items-stretch { + align-items: stretch; +} + .justify-between { justify-content: space-between; } @@ -573,6 +605,10 @@ video { align-self: flex-end; } +.justify-self-stretch { + justify-self: stretch; +} + .rounded-lg { border-radius: 0.5rem; } @@ -592,21 +628,6 @@ video { background-color: rgb(59 130 246 / var(--tw-bg-opacity)); } -.bg-blue-100 { - --tw-bg-opacity: 1; - background-color: rgb(219 234 254 / var(--tw-bg-opacity)); -} - -.bg-gray-200 { - --tw-bg-opacity: 1; - background-color: rgb(229 231 235 / var(--tw-bg-opacity)); -} - -.bg-gray-500 { - --tw-bg-opacity: 1; - background-color: rgb(107 114 128 / var(--tw-bg-opacity)); -} - .p-2 { padding: 0.5rem; } @@ -635,39 +656,18 @@ video { color: rgb(255 255 255 / var(--tw-text-opacity)); } -#chat-container { - height: 44rem; - background-color: white; - padding: 10px; - overflow: auto; -} - -.bg-gray-200 { - background-color: #edf2f7; -} - -.bg-gray-900 { - background-color: #1a202c; -} - -.rounded-lg { - border-radius: 0.5rem; -} - -.shadow { - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); -} - -.text-gray-700 { - color: #4a5568; -} - -.text-sm { - font-size: 0.875rem; -} +@media screen and (max-width: 1024px) { + .text-lg { + font-size: 3.125rem; + margin: 2rem; + line-height: inherit; + } -.p-4 { - padding: 1.5rem; + .text-sm { + font-size: 2.5rem; + margin: 1.5rem; + line-height: inherit; + } } .loader { @@ -696,4 +696,42 @@ video { color: rgb(30 64 175 / var(--tw-text-opacity)); } +@media (min-width: 640px) { + @media not all and (min-width: 1024px) { + .sm\:max-lg\:mb-12 { + margin-bottom: 3rem; + } + + .sm\:max-lg\:mb-\[12rem\] { + margin-bottom: 12rem; + } + + .sm\:max-lg\:hidden { + display: none; + } + + .sm\:max-lg\:p-5 { + padding: 1.25rem; + } + } +} + +@media (min-width: 1024px) { + .lg\:flex { + display: flex; + } + + .lg\:w-3\/4 { + width: 75%; + } + + .lg\:w-\[46rem\] { + width: 46rem; + } + + .lg\:w-1\/4 { + width: 25%; + } +} + diff --git a/application/static/src/chat.js b/application/static/src/chat.js index ee53617..df26216 100644 --- a/application/static/src/chat.js +++ b/application/static/src/chat.js @@ -8,7 +8,7 @@ if (el) { msg_html += message msg_html += '

' document.getElementById("messages").innerHTML += msg_html; - let chatWindow = document.getElementById("chat-container"); + let chatWindow = document.getElementById("messages-container"); chatWindow.scrollTop = chatWindow.scrollHeight; document.getElementById("message-input").value = ""; document.getElementById("button-submit").innerHTML = ' Thinking...'; @@ -28,7 +28,7 @@ if (el) { msg_html += data.answer msg_html += '' document.getElementById("messages").innerHTML += msg_html; - let chatWindow = document.getElementById("chat-container"); + let chatWindow = document.getElementById("messages-container"); chatWindow.scrollTop = chatWindow.scrollHeight; document.getElementById("button-submit").innerHTML = 'Send'; document.getElementById("button-submit").disabled = false; diff --git a/application/static/src/input.css b/application/static/src/input.css index 8d6c99b..a17532f 100644 --- a/application/static/src/input.css +++ b/application/static/src/input.css @@ -2,42 +2,22 @@ @tailwind components; @tailwind utilities; -#chat-container { - height: 44rem; - background-color: white; - padding: 10px; - overflow: auto; -} - - - -.bg-gray-200 { - background-color: #edf2f7; - } - - .bg-gray-900 { - background-color: #1a202c; - } - .rounded-lg { - border-radius: 0.5rem; - } - - .shadow { - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - } - .text-gray-700 { - color: #4a5568; +@media screen and (max-width: 1024px) { + .text-lg { + font-size: 3.125rem; + margin: 2rem; + line-height: inherit; } - .text-sm { - font-size: 0.875rem; + font-size: 2.5rem; + margin: 1.5rem; + line-height: inherit; } - .p-4 { - padding: 1.5rem; - } +} + .loader { border: 16px solid #f3f3f3; /* Light grey */ diff --git a/application/templates/index.html b/application/templates/index.html index 4ebd3c8..b336818 100644 --- a/application/templates/index.html +++ b/application/templates/index.html @@ -10,14 +10,14 @@

DocsGPT 🦖 Very early Preview

- About + About
-
-
+
+
-
+
-
+

Hello, ask me anything about this library. Im here to help

@@ -36,17 +36,17 @@ This will return a new DataFrame with all the columns from both tables, and only
-
-
- - +
+ + +
-
+

This is a chatbot that uses the GPT-3, Faiss and LangChain to answer questions


The source code is available on Github