From 1326130345677e902b89906344bf071a17b69bc6 Mon Sep 17 00:00:00 2001
From: Ojas Arora <127867874+Ojas-Arora@users.noreply.github.com>
Date: Fri, 5 Jul 2024 00:56:23 +0530
Subject: [PATCH 1/2] Alignment issue

---
 src/Components/Footer.css                     |  7 ++--
 src/Components/Footer.js                      | 12 +++++++
 src/Components/FreeLancer/Freelancer.css      | 28 ++++++++++-----
 src/Components/Login.css                      | 13 +++++--
 src/Components/Login.js                       | 36 ++++++++++++-------
 .../footer_section/FAQPage/FAQPage.css        |  8 +++--
 6 files changed, 75 insertions(+), 29 deletions(-)

diff --git a/src/Components/Footer.css b/src/Components/Footer.css
index e3c376ed..e4b6a3bf 100644
--- a/src/Components/Footer.css
+++ b/src/Components/Footer.css
@@ -2,9 +2,12 @@
   background-color: #19162c;
   color: white;
   padding: 2.5rem 2.5rem 1rem 2.5rem;
-  z-index: 1000;
+  z-index: 900;
+  height: 55vh;;
+}
+.scrolltop{
+  size: 20px;
 }
-
 .footer-container {
   display: flex;
   z-index: 1000;
diff --git a/src/Components/Footer.js b/src/Components/Footer.js
index d9431c40..b06fe16f 100644
--- a/src/Components/Footer.js
+++ b/src/Components/Footer.js
@@ -2,6 +2,10 @@ import React from 'react';
 import './Footer.css';
 import logo from '../img/apple-touch-icon.png';
 
+const scrollToTop = () => {
+  window.scrollTo({ top: 0, behavior: 'smooth' });
+};
+
 const Footer = () => {
   return (
     <div className='footer'>
@@ -59,8 +63,16 @@ const Footer = () => {
           &copy; 2024 UniCollab. All rights reserved.
         </div>
       </div>
+      <div className='scrolltop'>
+      <div style={{ textAlign: 'center', padding: '20px'  }}>
+        <button onClick={scrollToTop} className="button btn">
+          To the Top
+        </button>
+      </div>
+    </div>
     </div>
   );
 }
 
 export default Footer;
+
diff --git a/src/Components/FreeLancer/Freelancer.css b/src/Components/FreeLancer/Freelancer.css
index 7aec613c..bbddc196 100644
--- a/src/Components/FreeLancer/Freelancer.css
+++ b/src/Components/FreeLancer/Freelancer.css
@@ -1,20 +1,29 @@
 .box1Freelancer {
     width: 100vw;
     height: 420px;
-    margin-bottom: 100px;
+    margin-bottom: 2px;
+}
+.home-icon {
+    position: absolute;
+    top: 1.8rem;
+    left: 1.5rem;
+    width: 2.5rem;
+    cursor: pointer;
 }
-
 .freelancer {
     margin: 50px 0px;
+    height: 4000px;
+}
+.footer{
+    margin-bottom: 0px;
 }
-
 .heading1freelancerbox1 {
     font-size: 80px;
     font-weight: 600;
     width: 1000px;
     margin: auto;
     text-align: center;
-    margin-bottom: 30px;
+    margin-bottom: 20px;
     color: #ff21bc;
     font-weight: bold;
 }
@@ -22,7 +31,7 @@
 .desc1freelancerbox1 {
     font-size: 27px;
     text-align: center;
-    margin-bottom: 65px;
+    margin-bottom: 45px;
 }
 
 .btnFreelancer {
@@ -32,6 +41,7 @@
     font-weight: 500;
     font-size: 22px;
     border-radius: 20px;
+    background-color: darkturquoise;
 }
 
 .box2Freelancer {
@@ -43,7 +53,7 @@
     margin: auto;
     justify-items: center;
     align-items: center;
-    margin-bottom: 200px;
+    margin-bottom: 100px;
 }
 
 .containerFreelancer {
@@ -104,7 +114,7 @@
     height: 620px;
     margin: auto;
     display: flex;
-    margin-bottom: 150px;
+    margin-bottom: 50px;
 }
 
 .firstBox3 {
@@ -128,7 +138,7 @@
 
 .desc1box3{
     font-size: 26px;
-    margin-bottom: 75px;
+    margin-bottom: 55px;
 }
 
 .desc2box3{
@@ -249,7 +259,7 @@
 }
 
 .locationContent{
-    color: green;
+    color: darkturquoise;
 }
 
 .locationofFreelancer{
diff --git a/src/Components/Login.css b/src/Components/Login.css
index 67ec2161..38e53fe6 100644
--- a/src/Components/Login.css
+++ b/src/Components/Login.css
@@ -1,11 +1,17 @@
 @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800&display=swap");
 
 * {
-  margin: 0;
+  margin: 100px;
   padding: 0;
   box-sizing: border-box;
 }
-
+.home-icon {
+  position: absolute;
+  top: 1.9rem;
+  left: 1.5rem;
+  width: 2.5rem;
+  cursor: pointer;
+}
 body,
 input {
   font-family: "Poppins", sans-serif;
@@ -157,6 +163,9 @@ form.sign-in-form {
   transform: scale(1.1); /* Slightly enlarges the icon */
   box-shadow: 0 4px 8px darkturquoise !important; /* Adds a shadow on hover */
 }
+.home-link.no-margin-right {
+  margin-right: 0px;
+}
 
 .btn {
   width: 150px;
diff --git a/src/Components/Login.js b/src/Components/Login.js
index 43e8454b..75a78c73 100644
--- a/src/Components/Login.js
+++ b/src/Components/Login.js
@@ -1,10 +1,10 @@
 import React, { useState } from 'react';
-import { Link } from 'react-router-dom';
+import { Link, useNavigate } from 'react-router-dom';
 import './Login.css';
 import '@fortawesome/fontawesome-free/css/all.min.css';
 import logImg from './Profile/log.svg';
 import registerImg from './Profile/register.svg';
-import { useNavigate } from 'react-router-dom';
+import homeIcon from './FreeLancer/homeicon.png'
 
 const LogIn = () => {
   const [email, setEmail] = useState('');
@@ -44,12 +44,12 @@ const LogIn = () => {
           console.log('Login successful', data);
           displayAlert('Logged in');
 
-        // Store the username and email in local storage
-        localStorage.setItem('username', data.user.username);
-        localStorage.setItem('email', data.user.email);
+          // Store the username and email in local storage
+          localStorage.setItem('username', data.user.username);
+          localStorage.setItem('email', data.user.email);
 
           setTimeout(() => {
-            navigate('/'); 
+            navigate('/');
           }, 1000);
 
           // Handle successful login
@@ -95,7 +95,7 @@ const LogIn = () => {
         const data = await response.json();
         if (response.ok) {
           console.log('Signup successful', data);
-          displayAlert('signed-in. Now login')
+          displayAlert('Signed up. Now login');
           // Handle successful signup
         } else {
           displayAlert(data.message || 'Signup failed');
@@ -128,10 +128,15 @@ const LogIn = () => {
 
   return (
     <div className={`container1 ${isSignUpMode ? 'sign-up-mode' : ''}`}>
+      {/* Home Link */}
       <div className="forms-container">
         <div className="signin-signup">
-          <form className="sign-in-form" onSubmit={handleNextClick} action="/https://uni-collab.vercel.app/" method="post">
+          <form className="sign-in-form" onSubmit={handleNextClick}>
+          <Link to="/" className="home-link">
+                <img src={homeIcon} alt="Home" className="home-icon" />
+            </Link>
             <h2 className="title">Step into UniCollab! Log In</h2>
+            
             <div className="input-field">
               <i className="fas fa-user"></i>
               <input
@@ -173,8 +178,12 @@ const LogIn = () => {
             </div>
           </form>
 
-          <form className="sign-up-form" onSubmit={handleSignUpClick} action="/https://uni-collab.vercel.app/" method="post">
+          <form className="sign-up-form" onSubmit={handleSignUpClick}>
+            
             <h2 className="title">Start Journey with UniCollab</h2>
+            <Link to="/" className="home-link">
+                <img src={homeIcon} alt="Home" className="home-icon" />
+            </Link>
             <div className="input-field">
               <i className="fas fa-user"></i>
               <input
@@ -235,9 +244,10 @@ const LogIn = () => {
               Explore our platform and unlock a realm of personalized experiences.
             </p>
             <br />
-            <button className="btn transparent" onClick={toggleSignUpMode} style={{ display: 'block', margin: 'auto' }}>
-              Become a Member
-            </button>
+            <button className="btn transparent" onClick={toggleSignUpMode} style={{ display: 'block', margin: '0 auto' }}>
+  Become a Member
+</button>
+
           </div>
           <img src={logImg} className="image" alt="Login illustration" />
         </div>
@@ -248,7 +258,7 @@ const LogIn = () => {
               Embark on a journey through UniCollab for personalized experiences.
             </p>
             <br />
-            <button className="btn transparent" onClick={toggleSignUpMode} style={{ display: 'block', margin: 'auto' }}>
+            <button className="btn transparent" onClick={toggleSignUpMode} style={{ display: 'block', margin: '0 auto' }}>
               ENTER YOUR REALM
             </button>
           </div>
diff --git a/src/Components/footer_section/FAQPage/FAQPage.css b/src/Components/footer_section/FAQPage/FAQPage.css
index 654fc3f2..90ab7d0d 100644
--- a/src/Components/footer_section/FAQPage/FAQPage.css
+++ b/src/Components/footer_section/FAQPage/FAQPage.css
@@ -15,9 +15,9 @@
     padding: 20px;
     max-width: 800px;
     margin: 0 auto;
-    margin-top: 50px;
+    margin-top: 30px;
     border-radius: 10px;
-    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
+    
 }
 
 .page-container h1 {
@@ -31,6 +31,7 @@
     flex-direction: column;
     gap: 20px;
     max-width: 800px;
+
 }
 
 .faq-item {
@@ -42,7 +43,7 @@
     width: 100%;
     position: relative;
     overflow: hidden;
-    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+    box-shadow: 7px 7px 32px 0 #6052ff;
 }
 
 .faq-item::before {
@@ -56,6 +57,7 @@
     z-index: 1;
     opacity: 0;
     transition: opacity 0.3s;
+    
 }
 
 .faq-item:hover::before {

From 7085ff7a44673ced1fe0edbe8d45acc47f68a18f Mon Sep 17 00:00:00 2001
From: Ojas Arora <127867874+Ojas-Arora@users.noreply.github.com>
Date: Fri, 5 Jul 2024 01:11:57 +0530
Subject: [PATCH 2/2] Alignment Issue

---
 src/Components/FreeLancer/Freelancer.css | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Components/FreeLancer/Freelancer.css b/src/Components/FreeLancer/Freelancer.css
index cb92b3f4..0f29fd1c 100644
--- a/src/Components/FreeLancer/Freelancer.css
+++ b/src/Components/FreeLancer/Freelancer.css
@@ -12,7 +12,7 @@
 }
 .freelancer {
     margin: 50px 0px;
-    height: 4000px;
+    height: 3300px;
 }
 .footer{
     margin-bottom: 0px;
@@ -56,7 +56,7 @@
     justify-items: center;
     justify-content: center;
     align-items: center;
-    margin-bottom: 175px;
+    margin-bottom: 200px;
     gap: 1vw;
 }