changes done

Ans155 · Mar 5, 2024 · 69a7c31 · 69a7c31
1 parent 3f7cf47
commit 69a7c31
Show file tree

Hide file tree

Showing 6 changed files with 69 additions and 57 deletions.
diff --git a/Client/package-lock.json b/Client/package-lock.json
diff --git a/Client/package.json b/Client/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "clone-chatgpt-client",
+  "name": "StockBot",
   "version": "0.1.0",
   "private": true,
   "dependencies": {

diff --git a/Client/public/index.html b/Client/public/index.html
@@ -1,6 +1,9 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Anta&family=Poppins&display=swap" rel="stylesheet">
     <meta charset="utf-8" />
     <link rel="icon" href="%PUBLIC_URL%/logo.png" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />

diff --git a/Client/src/App.css b/Client/src/App.css
@@ -1,9 +1,12 @@
 :root {
   --text-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
     Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
-  --primary-bg-color: #ff6611; 
-  --secondary-bg-color: #ffffff;
-  --text-color: #282c34; 
+  --primary-bg-color: #ff8b4d; /* Orange background */
+  --secondary-bg-color: #ffffff; /* White background */
+  --text-color: #282c34; /* Dark text color */
+}
+.inputPrompttTextarea::placeholder {
+  font-family: Arial, sans-serif;
 }
 
 .App {
@@ -65,24 +68,20 @@ nav {
 .navPrompt {
   display: flex;
   align-items: center;
-  border:2px solid white;
   padding: 10px;
   column-gap: 20px;
   margin: 5px 0;
   text-align: left;
-  font-size: 19px;
 }
 
 .navPrompt a {
-  font-size: 19px;
   display: flex;
   align-items: center;
   column-gap: 20px;
   text-decoration: none;
 }
 
 .navPrompt p {
-  font-size: 19px;
   font-size: 14px;
   line-height: 20px;
   color: var(--secondary-bg-color); /* White text */
@@ -109,8 +108,6 @@ nav {
 
 pre {
   font-family: var(--text-font);
-  white-space: pre-line;
-  overflow:hidden;
 }
 
 @keyframes fadeInChar {
@@ -138,7 +135,7 @@ nav svg {
 }
 
 .sideMenuButton {
-  border: 3px solid white;
+  border: 1px solid hsl(0deg 0% 100% / 20%);
   border-radius: 5px;
   padding: 10px;
   text-align: left;
@@ -242,12 +239,13 @@ nav svg {
   text-align: left;
   display: flex;
   justify-content: left;
-  background-color: #fa884a;
+  background-color: #ff8b4d;
   border-radius: 10px;
   /* align-items: center; */
   column-gap: 10px;
   overflow-y: auto;
   overflow-x: hidden;
+  margin-top: 12px;
 }
 
 .botMessageWrapper {
@@ -341,6 +339,7 @@ nav svg {
   outline: none;
   border: 1px solid #000000; /* Black border */
   border-radius: 10px;
+
 }
 form button { 
   position: absolute;
@@ -433,9 +432,11 @@ form button {
   }
   .chatBox {
     position: static;
+    margin-top: 10px;
   }
   .chatPromptWrapper {
     padding: 12px;
+    margin-top: 10px;
   }
   .botMessageWrapper {
     padding: 12px;
@@ -482,11 +483,13 @@ form button {
 }
 .inputPromptWrapper {
   background-color: #ffffff; /* White background */
+  margin-top: 10px;
+
 }
 
 form button {
   background: #ffffff; /* White background */
-  border: 2px solid #ff6611; /* Orange border */
+
 }
 
 .navPrompt {
@@ -503,4 +506,11 @@ form button {
 
 .botMessageWrapper {
   background-color: #ffffff; /* White background */
-}
+  /* box-shadow: 10px 5px 5px #ff6611; */
+  padding: 20px;
+  box-shadow:
+    inset 0 -3em 3em rgba(191, 143, 12, 0.3),
+    0 0 0 2px white,
+    0.3em 0.3em 1em rgba(181, 104, 9, 0.6);
+    border-radius: 10px;
+}
diff --git a/Client/src/components/BotResponse.jsx b/Client/src/components/BotResponse.jsx
@@ -37,7 +37,7 @@ const BotResponse = ({ response, chatLogRef }) => {
 
   return (
     <>
-      <pre>
+     <pre style={{ whiteSpace: "pre-wrap" }}>
         {botResoponse}
         {botResoponse === response ? "" : "|"}
       </pre>

diff --git a/Client/src/components/IntroSection.jsx b/Client/src/components/IntroSection.jsx
@@ -8,48 +8,47 @@ import TwitterIcon from '@mui/icons-material/Twitter';
 const IntroSection = () => {
   return (
     <div id="introsection" className="intro-section">
-      <div className="section-box">
-        <h1 className="heading">
-          Introducing StockBot 
-          <BotResponse response=" - Your Social Investment Assistant" />
-        </h1>
-        <h2 className="subtitle">
-          Welcome to StockBot, your personal AI-powered investment assistant
-          brought to you by <span className="stockgro">Stockgro</span>. We believe in making investments social,
-          and StockBot is here to revolutionize the way you interact with
-          financial information.
-        </h2>
-        <h3>Features:</h3>
-        <ul>
-          <li>Instant answers to any investment-related question</li>
-          <li>Powered by cutting-edge deep learning technology</li>
-          <li>Continuously learning to provide better insights</li>
-          <li>User-friendly interface designed for investors</li>
-          <li>Available 24/7 to assist you with your investment queries</li>
-        </ul>
-        <p>
-          Say goodbye to complicated financial jargon and endless searches for
-          investment information. With StockBot, investing becomes social and
-          accessible to everyone. Try it now and experience the future of
-          investment assistance.
-        </p>
-        <h1>
-          Visit <a target="_blank" rel="noopener" href='https://www.stockgro.club/' alt='StockGro'>StockGro</a> for more information.
-        </h1>
-        <div className='header__socialhandles'>
-          <h2>Connect with us on social media:</h2>
-          <a target="_blank" rel="noopener" href='https://www.linkedin.com/company/stockgro/mycompany/' alt='LinkedIn'>
-            <LinkedInIcon style={{ fontSize: '2.8rem', color:'black', marginRight: '10px' }} />
-          </a>
-          <a target="_blank" rel="noopener" href='https://twitter.com/stockgro' alt='Twitter'>
-            <TwitterIcon style={{ fontSize: '2.8rem', color:'black', marginRight: '10px' }} />
-          </a>
-          <a target="_blank" rel="noopener" href='https://www.instagram.com/stock_gro?utm_source=ig_web_button_share_sheet&igsh=ZDNlZDc0MzIxNw==' alt='Instagram'>
-            <InstagramIcon style={{ fontSize: '2.8rem', color:'black' }} />
-          </a>
-        </div>
+      <h1 className="heading" style={{ fontFamily: 'Anta, sans-serif', fontSize: '2.5rem', fontWeight: 'bold', color: '#333' }}>
+        Introducing StockBot 
+        <BotResponse response=" - Your Social Investment Assistant" />
+      </h1>
+      <h2 className="subtitle" style={{ fontFamily: 'Anta, sans-serif', fontSize: '1.3rem', color: '#666' }}>
+        Welcome to StockBot, your personal AI-powered investment assistant
+        brought to you by <span className="stockgro">Stockgro</span>. We believe in making investments social,
+        and StockBot is here to revolutionize the way you interact with
+        financial information.
+      </h2>
+      <h3 style={{ fontFamily: 'Anta, sans-serif', fontSize: '1.5rem', fontWeight: 'bold', color: '#333' }}>Features:</h3>
+      <ul style={{ fontFamily: 'Anta, sans-serif', fontSize: '1.3rem', color: '#666' }}>
+        <li>Instant answers to any investment-related question</li>
+        <li>Powered by cutting-edge deep learning technology</li>
+        <li>Continuously learning to provide better insights</li>
+        <li>User-friendly interface designed for investors</li>
+        <li>Available 24/7 to assist you with your investment queries</li>
+      </ul>
+      <p style={{ fontFamily: 'Anta, sans-serif', fontSize: '1.3rem', color: '#666' }}>
+        Say goodbye to complicated financial jargon and endless searches for
+        investment information. With StockBot, investing becomes social and
+        accessible to everyone. Try it now and experience the future of
+        investment assistance.
+      </p>
+      <h1 style={{ fontFamily: 'Anta, sans-serif', fontSize: '2rem', color: '#333' }}>
+        Visit <a target="_blank" rel="noopener" href='https://www.stockgro.club/' alt='StockGro' style={{ textDecoration: 'none', color: '#007bff' }}>StockGro</a> for more information.
+      </h1>
+      <div className='header__socialhandles'>
+        <h2 style={{ fontFamily: 'Anta, sans-serif', fontSize: '1.2rem', fontWeight: 'bold', color: '#333' }}>Connect with us on social media:</h2>
+        <a target="_blank" rel="noopener" href='https://www.linkedin.com/company/stockgro/mycompany/' alt='LinkedIn'>
+          <LinkedInIcon style={{ fontSize: '2.8rem', color:'black', marginRight: '10px' }} />
+        </a>
+        <a target="_blank" rel="noopener" href='https://twitter.com/stockgro' alt='Twitter'>
+          <TwitterIcon style={{ fontSize: '2.8rem', color:'black', marginRight: '10px' }} />
+        </a>
+        <a target="_blank" rel="noopener" href='https://www.instagram.com/stock_gro?utm_source=ig_web_button_share_sheet&igsh=ZDNlZDc0MzIxNw==' alt='Instagram'>
+          <InstagramIcon style={{ fontSize: '2.8rem', color:'black' }} />
+        </a>
       </div>
     </div>
+
   );
 };