diff --git a/frontend/public/lock-dark.svg b/frontend/public/lock-dark.svg new file mode 100644 index 00000000..40a6b516 --- /dev/null +++ b/frontend/public/lock-dark.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/frontend/public/message-programming-dark.svg b/frontend/public/message-programming-dark.svg new file mode 100644 index 00000000..fec336ad --- /dev/null +++ b/frontend/public/message-programming-dark.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/frontend/public/message-programming.svg b/frontend/public/message-programming.svg index f017810a..4432ad2b 100644 --- a/frontend/public/message-programming.svg +++ b/frontend/public/message-programming.svg @@ -1,6 +1,10 @@ - - - - + + + + + + + + diff --git a/frontend/public/message-text-dark.svg b/frontend/public/message-text-dark.svg new file mode 100644 index 00000000..cca376ba --- /dev/null +++ b/frontend/public/message-text-dark.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/frontend/src/Hero.tsx b/frontend/src/Hero.tsx index 3a0517d7..f66b79a1 100644 --- a/frontend/src/Hero.tsx +++ b/frontend/src/Hero.tsx @@ -4,14 +4,15 @@ import DocsGPT3 from './assets/cute_docsgpt3.svg'; export default function Hero({ className = '' }: { className?: string }) { // const isMobile = window.innerWidth <= 768; const { isMobile } = useMediaQuery(); + const isDarkTheme = localStorage.getItem('selectedTheme') === 'Dark'; return ( -
+

DocsGPT

DocsGPT
{isMobile ? ( -

+

Welcome to DocsGPT, your technical documentation assistant! Start by entering your query in the input field below, and we'll provide you with the most relevant @@ -19,37 +20,35 @@ export default function Hero({ className = '' }: { className?: string }) {

) : ( <> -

+

Welcome to DocsGPT, your technical documentation assistant!

-

+

Enter a query related to the information in the documentation you selected to receive
and we will provide you with the most relevant answers.

-

+

Start by entering your query in the input field below and we will do the rest!

)}
{/* first */} -
+
{/* Add Mobile check here */} {isMobile ? (
lock @@ -60,7 +59,7 @@ export default function Hero({ className = '' }: { className?: string }) { ) : ( <> lock @@ -72,8 +71,8 @@ export default function Hero({ className = '' }: { className?: string }) {

DocsGPT will use your data to answer questions. Whether its @@ -84,23 +83,22 @@ export default function Hero({ className = '' }: { className?: string }) {

{/* second */} -
+
{/* Add Mobile check here */} {isMobile ? ( -
- lock +
+ lock

Secure Data Storage

) : ( <> - lock + lock

Secure Data Storage

@@ -109,8 +107,8 @@ export default function Hero({ className = '' }: { className?: string }) {

The security of your data is our top priority. DocsGPT ensures the @@ -121,17 +119,16 @@ export default function Hero({ className = '' }: { className?: string }) {

{/* third */} -
+
{/* Add Mobile check here */} {isMobile ? (
lock @@ -142,7 +139,7 @@ export default function Hero({ className = '' }: { className?: string }) { ) : ( <> lock @@ -154,8 +151,8 @@ export default function Hero({ className = '' }: { className?: string }) {

DocsGPT is built on open source principles, promoting transparency diff --git a/frontend/src/Setting.tsx b/frontend/src/Setting.tsx index 5bf1fb9c..90e50f39 100644 --- a/frontend/src/Setting.tsx +++ b/frontend/src/Setting.tsx @@ -588,28 +588,28 @@ const Documents: React.FC = ({

{/*

Documents

*/} -
+
- - - - + + + + {documents && documents.map((document, index) => ( - - - + + -
Document NameVector DateTypeDocument NameVector DateType
{document.name}{document.date} + {document.name}{document.date} {document.location === 'remote' ? 'Pre-loaded' : 'Private'} + {document.location !== 'remote' && ( + + diff --git a/frontend/src/conversation/Conversation.tsx b/frontend/src/conversation/Conversation.tsx index fcef2400..e4cfed37 100644 --- a/frontend/src/conversation/Conversation.tsx +++ b/frontend/src/conversation/Conversation.tsx @@ -11,6 +11,7 @@ import { updateQuery, } from './conversationSlice'; import Send from './../assets/send.svg'; +import SendDark from './../assets/send_dark.svg' import Spinner from './../assets/spinner.svg'; import { FEEDBACK, Query } from './conversationModels'; import { sendFeedback } from './conversationApi'; @@ -152,7 +153,7 @@ export default function Conversation() { {queries.length === 0 && ( )} -
+
{ if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); @@ -180,19 +181,19 @@ export default function Conversation() { ) : (
{ if (inputRef.current?.textContent) { handleQuestion(inputRef.current.textContent); inputRef.current.textContent = ''; } }} - src={Send} + src={localStorage.getItem('selectedTheme') === 'Dark' ? SendDark : Send} >
)}
-

+

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

diff --git a/frontend/src/upload/Upload.tsx b/frontend/src/upload/Upload.tsx index e1dcc1e1..f0735bc9 100644 --- a/frontend/src/upload/Upload.tsx +++ b/frontend/src/upload/Upload.tsx @@ -175,33 +175,33 @@ export default function Upload({ } else { view = ( <> -

Upload New Documentation

+

Upload New Documentation

Please upload .pdf, .txt, .rst, .docx, .md, .zip limited to 25mb

setDocName(e.target.value)} >
- Name + Name
- + Choose Files
-

Uploaded Files

+

Uploaded Files

{files.map((file) => (

{file.name}

))} - {files.length === 0 &&

None

} + {files.length === 0 &&

None

}
@@ -236,7 +236,7 @@ export default function Upload({ modalState === 'ACTIVE' ? 'visible' : 'hidden' } absolute z-30 h-screen w-screen bg-gray-alpha`} > -
+
{view}
diff --git a/frontend/tailwind.config.cjs b/frontend/tailwind.config.cjs index 843153ee..1d6a16a3 100644 --- a/frontend/tailwind.config.cjs +++ b/frontend/tailwind.config.cjs @@ -35,12 +35,13 @@ module.exports = { 'just-black':"#00000", 'purple-taupe':'#464152', 'dove-gray': '#6c6c6c', - silver: '#c4c4c4', + 'silver': '#c4c4c4', 'rainy-gray': '#a4a4a4', 'dark-bg':'#222327', 'chinese-black':'#161616', 'dark-charcoal':'#2F3036', - 'bright-gray':'#ECECF1' + 'bright-gray':'#ECECF1', + 'outer-space':'#444654' }, }, },