Merge pull request #326 from divyansh-2005/home-icon

home button added to all pages
SUGAM-ARORA · Jun 19, 2024 · c2baf0f · c2baf0f
2 parents a2bd22f + ece602c
commit c2baf0f
Show file tree

Hide file tree

Showing 12 changed files with 66 additions and 1 deletion.
diff --git a/src/Components/footer_section/BlogPage/BlogPage.css b/src/Components/footer_section/BlogPage/BlogPage.css
@@ -1,3 +1,11 @@
+.home-icon {
+    position: absolute;
+    top: 1.5rem;
+    left: 1.5rem;
+    width: 2.5rem;
+    cursor: pointer;
+}
+
 .blog-page {
     display: flex;
     flex-direction: column;

diff --git a/src/Components/footer_section/BlogPage/BlogPage.js b/src/Components/footer_section/BlogPage/BlogPage.js
@@ -1,5 +1,7 @@
 import React, { useState } from 'react';
 import './BlogPage.css';
+import { Link } from 'react-router-dom';
+import homeIcon from '../../../img/homeicon.png';
 
 const blogs = [
     {
@@ -48,6 +50,9 @@ const BlogPage = () => {
 
     return (
         <div className="blog-page">
+        <Link to="/">
+            <img src={homeIcon} alt="Home" className="home-icon" />
+        </Link>
             <div className="blogs">
                 {blogs.map((blog, index) => (
                     <div

diff --git a/src/Components/footer_section/ContactUs/contact_us.css b/src/Components/footer_section/ContactUs/contact_us.css
@@ -1,3 +1,11 @@
+.home-icon {
+    position: absolute;
+    top: 1rem;
+    left: 1rem;
+    width: 2.5rem;
+    cursor: pointer;
+}
+
 .containerContact {
     width: 95vw;
     margin: auto;

diff --git a/src/Components/footer_section/ContactUs/contact_us.js b/src/Components/footer_section/ContactUs/contact_us.js
@@ -1,9 +1,14 @@
 import './contact_us.css';
 import React from 'react';
+import { Link } from 'react-router-dom';
+import homeIcon from '../../../img/homeicon.png';
 
 function ContactUs() {
     return (
         <div className='box'>
+            <Link to="/">
+            <img src={homeIcon} alt="Home" className="home-icon" />
+            </Link>
             <div className='containerContact'>
                 <div className='general'>
                     <div className='box1'>

diff --git a/src/Components/footer_section/FAQPage/FAQPage.css b/src/Components/footer_section/FAQPage/FAQPage.css
@@ -1,3 +1,11 @@
+.home-icon {
+    position: absolute;
+    top: 1.5rem;
+    left: 1.5rem;
+    width: 2.5rem;
+    cursor: pointer;
+}
+
 .page-container {
     display: flex;
     flex-direction: column;

diff --git a/src/Components/footer_section/FAQPage/FAQPage.js b/src/Components/footer_section/FAQPage/FAQPage.js
@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import './FAQPage.css'; // Ensure the CSS file is created and imported
-
+import { Link } from 'react-router-dom';
+import homeIcon from '../../../img/homeicon.png';
 const faqs = [
     {
         question: "What is UniCollab?",
@@ -53,6 +54,9 @@ const FAQPage = () => {
 
     return (
         <div className="page-container">
+        <Link to="/">
+            <img src={homeIcon} alt="Home" className="home-icon" />
+        </Link>
             <h1>FAQs</h1>
             <div className="faqs">
                 {faqs.map((faq, index) => (

diff --git a/src/Components/footer_section/about_us/About_us.css b/src/Components/footer_section/about_us/About_us.css
@@ -1,3 +1,11 @@
+.home-icon {
+    position: absolute;
+    top: 1.5rem;
+    left: 1.5rem;
+    width: 2.5rem;
+    cursor: pointer;
+}
+
 .about-us {
     display: block;
     margin: auto;

diff --git a/src/Components/footer_section/about_us/About_us.jsx b/src/Components/footer_section/about_us/About_us.jsx
@@ -1,4 +1,5 @@
 import React, {useState} from 'react';
+import { Link } from 'react-router-dom';
 import "./About_us.css";
 import collaborate from '../../../img/collaboration.png';
 import collaboratehover from '../../../img/collaborationhover.png';
@@ -8,6 +9,8 @@ import project from '../../../img/project.png';
 import projecthover from '../../../img/projecthover.png';
 import event from '../../../img/event.png';
 import eventhover from '../../../img/eventhover.png';
+import homeIcon from '../../../img/homeicon.png';
+
 
 const AboutUs = () => {
     const [collaborateHover, setCollaborateHover] = useState(false);
@@ -17,6 +20,9 @@ const AboutUs = () => {
 
   return (
     <div id='about-us' style={{display: 'flex', flexDirection: 'column', gap: '1rem', marginBottom: '3rem'}}>
+    <Link to="/">
+    <img src={homeIcon} alt="Home" className="home-icon" />
+    </Link>
     <h1 className='about-us-heading'>About Us</h1>
     <div className='about-us-block'>
         <div className='about-us-community' onMouseOver={()=>setCollaborateHover(true)} onMouseLeave={()=>setCollaborateHover(false)}>

diff --git a/src/Components/footer_section/services/Services.css b/src/Components/footer_section/services/Services.css
@@ -1,3 +1,11 @@
+.home-icon {
+    position: absolute;
+    top: 1.5rem;
+    left: 1.5rem;
+    width: 2.5rem;
+    cursor: pointer;
+}
+
 .services {
     display: flex;
     flex-direction: column;

diff --git a/src/Components/footer_section/services/Services.js b/src/Components/footer_section/services/Services.js
@@ -1,5 +1,7 @@
 import React, { useState } from 'react';
 import './Services.css';
+import { Link } from 'react-router-dom';
+import homeIcon from '../../../img/homeicon.png';
 
 const service = [
     {
@@ -48,6 +50,9 @@ const Services = () => {
 
     return (
         <div className="services">
+        <Link to="/">
+            <img src={homeIcon} alt="Home" className="home-icon" />
+        </Link>
             <div className="service">
                 {service.map((service, index) => (
                     <div

diff --git a/src/img/homeicon.png b/src/img/homeicon.png
diff --git a/src/img/homeicon1.png b/src/img/homeicon1.png