From e9c99a2ed481346a7a06a0c4881ce370f931beb9 Mon Sep 17 00:00:00 2001
From: pooranjoyb <pooranjoyb2016@gmail.com>
Date: Tue, 24 Oct 2023 21:43:18 +0530
Subject: [PATCH] Updated Components & added Nav+Footer for /projects

---
 src/Components copy/Blog.jsx      |  68 ----
 src/Components copy/BlogPage.jsx  |   8 -
 src/Components copy/Blogs.jsx     | 101 ------
 src/Components copy/Contact.jsx   | 166 ---------
 src/Components copy/Footer.jsx    | 108 ------
 src/Components copy/Home.jsx      | 111 ------
 src/Components copy/Loader.jsx    |   9 -
 src/Components copy/MobileApp.jsx |  21 --
 src/Components copy/Navbar.jsx    |  62 ----
 src/Components copy/Projects.jsx  |  74 ----
 src/Components copy/Team.jsx      | 565 ------------------------------
 src/Components copy/Vision.jsx    |  87 -----
 src/Components copy/gototop.jsx   |  43 ---
 src/Components/Projects.jsx       |  15 +-
 14 files changed, 10 insertions(+), 1428 deletions(-)
 delete mode 100644 src/Components copy/Blog.jsx
 delete mode 100644 src/Components copy/BlogPage.jsx
 delete mode 100644 src/Components copy/Blogs.jsx
 delete mode 100644 src/Components copy/Contact.jsx
 delete mode 100644 src/Components copy/Footer.jsx
 delete mode 100644 src/Components copy/Home.jsx
 delete mode 100644 src/Components copy/Loader.jsx
 delete mode 100644 src/Components copy/MobileApp.jsx
 delete mode 100644 src/Components copy/Navbar.jsx
 delete mode 100644 src/Components copy/Projects.jsx
 delete mode 100644 src/Components copy/Team.jsx
 delete mode 100644 src/Components copy/Vision.jsx
 delete mode 100644 src/Components copy/gototop.jsx

diff --git a/src/Components copy/Blog.jsx b/src/Components copy/Blog.jsx
deleted file mode 100644
index c1ac055..0000000
--- a/src/Components copy/Blog.jsx	
+++ /dev/null
@@ -1,68 +0,0 @@
-import { useEffect, useState } from "react";
-import Navbar from "./Navbar";
-import axios from "axios";
-import { useParams } from "react-router-dom";
-import moment from "moment";
-import Footer from "./Footer";
-import { Loader } from "./Loader";
-
-export default function Blog() {
-  const [blog, setBlog] = useState(null);
-  const params = useParams();
-  useEffect(() => {
-    const fetchBlog = async () => {
-      await axios
-        .get(
-          `https://www.googleapis.com/blogger/v3/blogs/3771334625318012412/posts/${
-            params.id
-          }?key=${import.meta.env.VITE_API_KEY}`
-        )
-        .then((res) => setBlog(res.data))
-        .catch((err) => err);
-    };
-    fetchBlog();
-  }, []);
-  return (
-    <>
-      <Navbar />
-      {blog === null ? (
-        <Loader />
-      ) : (
-        <div className="w-100">
-          <div className="col-md-6 offset-md-3 p-3 mt-5 mb-5">
-            <h1 className="mb-4" style={{ fontWeight: 600 }}>
-              {blog.title}
-            </h1>
-            <a
-              className="w-100 d-flex mb-4"
-              target="_blank"
-              href={`${blog.author.url}`}
-              style={{ textDecoration: "none", color: "#000" }}
-            >
-              <h3
-                className="rounded-circle bg-warning d-flex justify-content-center align-items-center me-3"
-                style={{ height: "70px", width: "70px" }}
-              >
-                {blog.author.displayName[0]}
-              </h3>
-              <div className="d-flex flex-column text-start">
-                <span className="mb-2">
-                  Written By <b>{blog.author.displayName}</b>
-                </span>
-                <small>
-                  {moment(blog.published).startOf("hour").fromNow()}
-                </small>
-              </div>
-            </a>
-            <hr />
-            <p
-              className="text-muted"
-              dangerouslySetInnerHTML={{ __html: blog.content }}
-            />
-          </div>
-        </div>
-      )}
-      <Footer />
-    </>
-  );
-}
diff --git a/src/Components copy/BlogPage.jsx b/src/Components copy/BlogPage.jsx
deleted file mode 100644
index c247915..0000000
--- a/src/Components copy/BlogPage.jsx	
+++ /dev/null
@@ -1,8 +0,0 @@
-import Blogs from "./Blogs";
-export default function BlogPage() {
-  return (
-    <>
-		  <Blogs />
-    </>
-  );
-}
diff --git a/src/Components copy/Blogs.jsx b/src/Components copy/Blogs.jsx
deleted file mode 100644
index a56903b..0000000
--- a/src/Components copy/Blogs.jsx	
+++ /dev/null
@@ -1,101 +0,0 @@
-import React, { useState, useEffect } from "react";
-import axios from "axios";
-import Navbar from "./Navbar";
-import Footer from "./Footer";
-import moment from "moment";
-import { useNavigate } from "react-router-dom";
-import { Loader } from "./Loader";
-
-export default function Blogs() {
-  const [blogs, setBlogs] = useState([]);
-  const navigate = useNavigate();
-
-  useEffect(() => {
-    const blogsUrl = `https://www.googleapis.com/blogger/v3/blogs/3771334625318012412/posts?key=${
-      import.meta.env.VITE_API_KEY
-    }`;
-
-    axios
-      .get(blogsUrl)
-      .then((response) => {
-        const blogsData = response.data.items;
-        setBlogs(blogsData);
-      })
-      .catch((error) => {
-        console.error("Error fetching Blogger blogs:", error);
-      });
-  }, []);
-
-  return (
-    <>
-      <Navbar />
-      {blogs.length === 0 ? (
-        <Loader />
-      ) : (
-        <div className="blogPage">
-          <div
-            id="endcontain"
-            className="container-fluid text-center mt-5"
-            style={{
-              backgroundColor: "white",
-              position: "sticky",
-              marginBottom: "5rem",
-            }}
-          >
-            <strong>
-              <font size="7">
-                <font color="#4285F4">Explore. </font>
-                <font color="#EA4335">Inspire. </font>
-                <font color="#34A853"> Discover. </font>
-              </font>
-            </strong>
-          </div>
-          <div className="my-5">
-            {blogs.map((blog) => (
-              <div
-                key={blog.id}
-                className="card text-center shadow mx-auto p-4"
-                style={{ width: "35rem", marginBottom: "3rem" }}
-              >
-                <div className="w-100 d-flex mb-4">
-                  <h3
-                    className="rounded-circle bg-warning d-flex justify-content-center align-items-center me-3"
-                    style={{ width: "50px", height: "50px" }}
-                  >
-                    {blog.author.displayName[0]}
-                  </h3>
-                  <div className="d-flex flex-column text-start">
-                    <span className="mb-2">
-                      Written By <b>{blog.author.displayName}</b>
-                    </span>
-                    <small>
-                      {moment(blog.published).startOf("hour").fromNow()}
-                    </small>
-                  </div>
-                </div>
-                <hr />
-                <div className="card-body text-start">
-                  <h5 className="card-title mb-3">
-                    <b>{blog.title}</b>
-                  </h5>
-                  <p
-                    className="blog-content card-text"
-                    dangerouslySetInnerHTML={{ __html: blog.content }}
-                  />
-                  <b
-                    className="text-primary"
-                    onClick={() => navigate(`/blogs/${blog.id}`)}
-                    style={{ cursor: "pointer" }}
-                  >
-                    READ MORE
-                  </b>
-                </div>
-              </div>
-            ))}
-          </div>
-        </div>
-      )}
-      <Footer className="blogFooter" />
-    </>
-  );
-}
diff --git a/src/Components copy/Contact.jsx b/src/Components copy/Contact.jsx
deleted file mode 100644
index 0d49893..0000000
--- a/src/Components copy/Contact.jsx	
+++ /dev/null
@@ -1,166 +0,0 @@
-import React, { useState, useEffect } from "react";
-import Navbar from "./Navbar";
-import Footer from "./Footer";
-import { database } from "../firebaseConfig";
-import { Loader } from "./Loader";
-
-export default function Contact() {
-  const [loading, setLoading] = useState(true);
-  const [name, setName] = useState("");
-  const [email, setEmail] = useState("");
-  const [message, setMessage] = useState("");
-  const [showModal, setShowModal] = useState(false);
-
-  const handleSubmit = (e) => {
-    e.preventDefault();
-    console.log(name, email, message);
-
-    database
-      .ref("Responses")
-      .push({
-        name: name,
-        email: email,
-        message: message,
-      })
-      .catch((error) => console.error("error submitting data :", error));
-
-    setShowModal(true);
-  };
-
-  useEffect(() => {
-    setTimeout(() => {
-      setLoading(false);
-    }, 500);
-  }, []);
-
-  return (
-    <>
-      {loading ? (
-        <Loader />
-      ) : (
-        <>
-          <Navbar />
-          <div
-            style={{
-              width: "100%",
-              display: "flex",
-              justifyContent: "center",
-              alignItems: "center",
-              flexDirection: "column",
-            }}
-          >
-            <div className="col-md-4 mb-5 mt-4 contact_logo">
-              <img src="./img/logo.png" className="img-fluid" alt="..." />
-            </div>
-
-            <div
-              className="row card shadow d-flex align-items-center flex-row p-5 mb-3"
-              style={{ width: "80%", height: "auto" }}
-            >
-              <div className="col-md-6 p-5 img-box">
-                <img
-                  className="img-fluid"
-                  src="https://img.freepik.com/free-vector/flat-design-illustration-customer-support_23-2148887720.jpg?w=740&t=st=1697360648~exp=1697361248~hmac=c1048c6b6eabd19c22ce4b952e7408ee9bed89a1ee6505893c371e26c3849053"
-                  alt=""
-                />
-              </div>
-              <div className="col-md-6 col-sm-12 card p-4">
-                <p className="align-self-center h3 fw-bold text-primary mb-4">
-                  Contact Us
-                </p>
-                <form onSubmit={handleSubmit}>
-                  <div className="form-outline input-group mb-4 ">
-                    <span className="input-group-text" id="basic-addon1">
-                      <i className="fa-solid fa-user text-primary"></i>
-                    </span>
-                    <input
-                      type="text"
-                      id="form4Example1"
-                      className="form-control"
-                      placeholder="Name"
-                      value={name}
-                      onChange={(event) => {
-                        setName(event.target.value);
-                      }}
-                    />
-                  </div>
-
-                  <div className="form-outline input-group mb-4 ">
-                    <span className="input-group-text" id="basic-addon1">
-                      <i className="fa-solid fa-envelope text-primary"></i>
-                    </span>
-                    <input
-                      type="email"
-                      id="form4Example2"
-                      className="form-control"
-                      placeholder="Email"
-                      value={email}
-                      onChange={(event) => {
-                        setEmail(event.target.value);
-                      }}
-                    />
-                  </div>
-
-                  <div className="form-outline mb-4">
-                    <textarea
-                      className="form-control"
-                      id="form4Example3"
-                      rows="4"
-                      value={message}
-                      placeholder="Type your message here..."
-                      onChange={(event) => {
-                        setMessage(event.target.value);
-                      }}
-                    ></textarea>
-                  </div>
-
-                  <div className="d-flex justify-content-center">
-                    <button
-                      type="submit"
-                      className="btn btn-primary w-100 mb-4"
-                    >
-                      Send
-                    </button>
-                  </div>
-                </form>
-              </div>
-            </div>
-          </div>
-          <Footer />
-        </>
-      )}
-      {showModal && (
-            <div className="modal fade show" style={{ display: "block" }}>
-              <div
-                className={`modal-dialog modal-dialog-centered ${
-                  window.innerWidth < 768 ? "modal-sm" : "modal-md"
-                } fade-in`}
-              >
-                <div className="modal-content">
-                  <div className="modal-header">
-                    <h5 className="modal-title">Message Sent Successfully</h5>
-                    <button
-                      type="button"
-                      className="btn-close"
-                      data-bs-dismiss="modal"
-                      aria-label="Close"
-                      onClick={() => setShowModal(false)}
-                    ></button>
-                  </div>
-                  <div className="modal-footer">
-                    <button
-                      type="button"
-                      className="btn btn-secondary"
-                      data-bs-dismiss="modal"
-                      onClick={() => setShowModal(false)}
-                    >
-                      Close
-                    </button>
-                  </div>
-                </div>
-              </div>
-            </div>
-          )}
-    </>
-  );
-}
diff --git a/src/Components copy/Footer.jsx b/src/Components copy/Footer.jsx
deleted file mode 100644
index 2978c03..0000000
--- a/src/Components copy/Footer.jsx	
+++ /dev/null
@@ -1,108 +0,0 @@
-import React from "react";
-import { styled } from "@mui/material";
-import {Link} from "react-router-dom"
-import { FaGithub } from "react-icons/fa";
-import { BsInstagram } from "react-icons/bs";
-import { FaLinkedin } from "react-icons/fa";
-
-const Component = styled("div")`
-  padding: 10px;
-  width: 60px;
-  height: 60px;
-  text-align: center;
-  background-color: #f0f0f0;
-  line-height: 100px;
-  border-radius: 100px;
-  line-height: 100px;
-
-  font-size: 30px;
-  overflow: hidden;
-  transition: all 0.3s ease-out;
-  &:hover {
-    width: 180px;
-    display: flex;
-    align-items: center;
-    justify-content: space-evenly;
-    cursor: pointer;
-  }
-`;
-
-const Instagram = styled(Component)`
-  &:hover {
-    background-color: #d62976;
-  }
-`;
-
-const Github = styled(Component)`
-  &:hover {
-    background-color: black;
-  }
-`;
-
-const LinkedIn = styled(Component)`
-  &:hover {
-    background-color: #0a66c2;
-  }
-`;
-
-const Footer = () => {
-  return (
-    <footer
-      className="d-flex justify-content-around fw-bold align-items-center my-4" >
-      <div>
-        <Link to='/'>
-          <img
-            className="my-3"
-            src="/img/logo.png"
-            style={{ width: "15rem", height: "38px", cursor: "pointer" }}
-          />
-        </Link>
-      </div>
-
-      <div className="text-center" style={{ display: "flex", gap: "20px", position: "absolute" }}>
-        <Instagram className="text-center"
-          onClick={() => {
-            window.location = "https://www.instagram.com/gdscsmit/";
-          }}
-        >
-          <BsInstagram
-            style={{ color: "#d62976 ", marginBottom: "55px" }}
-          ></BsInstagram>
-          <span className="text-center" style={{ color: "white" }}>Instagram</span>
-        </Instagram>
-
-        <Github
-          onClick={() => {
-            window.location =
-              "https://github.com/gdscsmit/gdscsmit.github.io";
-          }}
-        >
-          <FaGithub className="text-center"
-            style={{ color: "black", marginBottom: "55px" }}
-          ></FaGithub>
-          <span className="text-center" style={{ color: "white" }}>GitHub</span>
-        </Github>
-
-        <LinkedIn
-          onClick={() => {
-            window.location =
-              " https://www.linkedin.com/company/gdscsmit/about/";
-          }}
-        >
-          <FaLinkedin className="text-center"
-            style={{ color: "#0A66C2", marginBottom: "55px" }}
-          ></FaLinkedin>
-          <span className="text-center" style={{ color: "white" }}>LinkedIn</span>
-        </LinkedIn>
-      </div>
-
-      <div className="text-center">
-        <p>© 2023 COPYRIGHT GDSC SMIT</p>
-      </div>
-
-    </footer>
-
-  );
-};
-
-export default Footer;
diff --git a/src/Components copy/Home.jsx b/src/Components copy/Home.jsx
deleted file mode 100644
index a5aca8d..0000000
--- a/src/Components copy/Home.jsx	
+++ /dev/null
@@ -1,111 +0,0 @@
-import React, { useEffect } from "react";
-import Footer from "./Footer";
-import Vision from "./Vision";
-import ScrollToTopButton from "./gototop";
-import AOS from "aos";
-import "aos/dist/aos.css";
-
-export default function Home() {
-
-  useEffect(() => {
-    AOS.init();
-  }, []);
-
-  return (
-    <>
-      <div className="container divone">
-        <div className="display-5 fw-bold mt-4">Welcome to GDSC SMIT </div>
-        <div className="row">
-          <div className="col-md-8">
-            <div className="my-5">
-              <div className="text-lg text-sm">
-                Google Developer Student Clubs are groups of students from
-                diverse undergraduate or graduate programs with an interest in
-                growing as a developer. As GDSC&apos;s chapter at Sikkim Manipal
-                Institute of Technology, we aim to help students connect with
-                like-minded developers, facilitate knowledge across several
-                domains, from industry leaders to students and build solutions
-                that will be the change we hope for.
-              </div>
-            </div>
-            <div className="butone">
-              <a href="https://gdsc.community.dev/accounts/login/?next=/sikkim-manipal-institute-of-technology-gangtok/">
-                <button type="button" id="becameButton" className="btn btn-primary mx-3">
-                  Become Member
-                </button>
-              </a>
-              <a href="https://developers.google.com/community/gdsc#:~:text=Google%20Developer%20Student%20Clubs%20(GDSC,as%20a%20developer%20are%20welcome.">
-                <button type="button" id="learnButton" className="btn btn-outline-dark">
-                  Learn More
-                </button>
-              </a>
-            </div>
-          </div>
-          <div className="col-md-4">
-            <img src="./img/gsc.png" className="img-fluid" alt="..." />
-          </div>
-        </div>
-      </div>
-
-      <div className="d-flex container overflow-hidden text-center ">
-        <div className="gy-5 rounded-4 d-flex flex-md-row flex-column text-center my-5 justify-content-center align-items-center">
-          <div className="my-3 mx-3">
-            <div className="p-3 rounded-4 border bg-light">
-              <h3><b>Why GDSC?</b></h3> 
-              <br />
-              By joining GDSC at SMIT, you gain access to numerous workshops,
-              information sessions, and student-community collaborative projects
-            </div>
-          </div>
-
-          <div className="my-3 rounded-4 mx-3">
-            <div className="p-3 rounded-4 border bg-light">
-              <h3><b>Concept of GDSC</b></h3> 
-              <br />
-              The purpose of GDSC is to inspire and empower students through
-              understanding technology and reflecting on it's impact
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <Vision />
-
-      <div
-      data-aos="fade-up"
-      className="bg embed-responsive-16by9 text-center my-5" id="Video">
-        <div className="container-fluid rounded-4 overflow-hidden shadow-lg " id="video">
-          <iframe 
-            className="rounded-4 embed-responsive-item yt_video"
-            width="560"
-            height="315"
-            src="https://www.youtube.com/embed/earTjC0iSjg"
-            title="YouTube video player"
-            frameborder="0"
-            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-            allowfullscreen
-          ></iframe>
-        </div>
-      </div>
-
-      <div id="endcontain" className="container-fluid text-center my-4">
-        <strong>
-          <font size="7">
-            <font color="#4285F4" data-aos="fade-up">
-              Connect.{" "}
-            </font>
-            <font color="#EA4335" data-aos="fade-up" data-aos-duration="3000">
-              Learn.{" "}
-            </font>
-            <font color="#34A853" data-aos="fade-up" data-aos-duration="3000">
-              Grow.{" "}
-            </font>
-          </font>
-        </strong>
-      </div>
-      <hr style={{margin:"0px",padding:"0px"}} ></hr>
-      <Footer />
-      <ScrollToTopButton />              
-    </>
-  );
-}
diff --git a/src/Components copy/Loader.jsx b/src/Components copy/Loader.jsx
deleted file mode 100644
index 46dc9c0..0000000
--- a/src/Components copy/Loader.jsx	
+++ /dev/null
@@ -1,9 +0,0 @@
-export const Loader = () => {
-    return (
-        <div className="loader">
-            <div className="loader-item">
-                <img src="./loader-unscreen.gif" alt="loader" />
-            </div>
-        </div>
-    )
-}
diff --git a/src/Components copy/MobileApp.jsx b/src/Components copy/MobileApp.jsx
deleted file mode 100644
index 34d48a0..0000000
--- a/src/Components copy/MobileApp.jsx	
+++ /dev/null
@@ -1,21 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { Loader } from './Loader';
-
-export default function MobileApp() {
-  const [loading, setLoading] = useState(true);
-
-  useEffect(() => {
-    const timeout = setTimeout(() => {
-      setLoading(false);
-      window.location.replace('https://play.google.com/store/apps/details?id=com.gdscsmit.gdsc');
-    }, 2000);
-
-    return () => clearTimeout(timeout);
-  }, []);
-
-  return (
-    <>
-      {loading && <Loader />}
-    </>
-  );
-}
diff --git a/src/Components copy/Navbar.jsx b/src/Components copy/Navbar.jsx
deleted file mode 100644
index 22ca166..0000000
--- a/src/Components copy/Navbar.jsx	
+++ /dev/null
@@ -1,62 +0,0 @@
-import React, { useState } from 'react';
-import { Link } from 'react-router-dom';
-
-export default function Navbar() {
-    const [isNavOpen, setIsNavOpen] = useState(false);
-
-    const toggleNav = () => {
-        setIsNavOpen(!isNavOpen);
-    };
-
-    const closeNavbar = () => {
-        setIsNavOpen(false);
-    };
-
-    const navbarStyle = {
-        transition: 'max-height 0.9s ease',
-        maxHeight: isNavOpen ? '350px' : '90px',
-        overflow: 'hidden',
-        padding:'1% 2%',
-    };
-
-    const navBrandStyle = {
-        width: '40%',
-        maxWidth: '300px',
-        overflow: 'hidden',
-    }
-
-    return (
-        <>
-            <div className="navbar sticky-top navbar-expand-lg navbar-light navcus frosted-glass" style={navbarStyle}>
-                <div className="container-fluid" >
-                    <Link to='/' className="navbar-brand" style={navBrandStyle}  >
-                        <img src="./img/logo.png" height='100%' width='100%' alt="" loading="lazy" style={{ backgroundColor: 'transparent' }} />
-                    </Link>
-                    <button className="navbar-toggler" type="button" onClick={toggleNav}>
-                        <span className="navbar-toggler-icon"></span>
-                    </button>
-                    <div className={`collapse navbar-collapse justify-content-end ${isNavOpen ? 'show' : ''}`} id="navbarNavAltMarkup" >
-                        <div className="navbar-nav" >
-                            <Link to='/' className="text-black fw-bold nav-link active link-home"
-                                aria-current="page" onClick={closeNavbar}>
-                                Home
-                            </Link>
-                            <Link to='/app' className="text-black fw-bold nav-link active link-App " aria-current="page" onClick={closeNavbar}>
-                                App
-                            </Link>
-                            <Link to='/blogs' className="text-black fw-bold nav-link active link-hover-effect link-Blogs" aria-current="page" onClick={closeNavbar}>
-                                Blogs
-                            </Link>
-                            <Link to='/team' className="text-black fw-bold nav-link active link-hover-effect link-Team" aria-current="page" onClick={closeNavbar}>
-                                Team
-                            </Link>
-                            <Link to='/contact' className="text-black fw-bold nav-link active link-hover-effect link-Contact" aria-current="page" onClick={closeNavbar}>
-                                Contact
-                            </Link>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </>
-    );
-}
diff --git a/src/Components copy/Projects.jsx b/src/Components copy/Projects.jsx
deleted file mode 100644
index 9e6a044..0000000
--- a/src/Components copy/Projects.jsx	
+++ /dev/null
@@ -1,74 +0,0 @@
-import React, { useEffect } from "react";
-
-import Box from "@mui/material/Box";
-import styled from 'styled-components';
-
-const BoxComponent=styled(Box)`
-border: 1px solid black;
-border-radius: 200px;
-  
-`
-const Projects = () => {
-  const projects = [
-    {
-      id: 1,
-      title: "Seminar",
-      image:
-        "https://medschool.vanderbilt.edu/wp-content/uploads/sites/35/public_files/13314405705_fa3a6e6850_k.jpg",
-      description: "Exploring Emerging Tech Trends Together.",
-      classes: "bg-red rounded",
-    },
-    {
-      id: 2,
-      title: "Projects",
-      image:
-        "https://www.thebvnewspaper.com/wp-content/uploads/2021/04/Group-Projects.jpg",
-      description: "Building Solutions, Empowering Communities.",
-      classes: "bg-green rounded",
-    },
-    {
-      id: 3,
-      title: "Workshop",
-      image:
-        "https://studio180theatre.com/wp-content/uploads/2023/08/Studio-180-Education-Workshop-68-1-1200x801.jpg",
-      description: "Hands-On Learning for Tech Enthusiasts",
-      classes: "bg-yellow rounded",
-    },
-  ];
-
-  return (
-    <Box
-      display="flex"
-      flexWrap="wrap"
-      justifyContent="center"
-      alignItems="center"
-      p={4} // Add padding as needed
-    >
-      {projects.map(({ id, title, description, classes, image }) => (
-        <Box
-          key={id}
-          
-          maxWidth="300px" // Set a maximum width as needed
-          m={2} // Add margin as needed
-        >
-          <BoxComponent className="vision-card">
-            <div className="mt-4 mx-4 d-flex flex-column">
-              <img
-                className="w-100 rounded"
-                src={image}
-                style={{ height: "155px" }}
-              />
-              <span
-                className={`vision-card-title fw-bold cursor-pointer text-white rounded p-2 w-75 my-4 px-3 ${classes} mx-auto`}
-              >
-                {title}
-              </span>
-            </div>
-            <p className="w-75 mx-auto mb-2">{description}</p>
-          </BoxComponent>
-        </Box>
-      ))}
-    </Box>
-  );
-};
-export default Projects;
diff --git a/src/Components copy/Team.jsx b/src/Components copy/Team.jsx
deleted file mode 100644
index 6522ab8..0000000
--- a/src/Components copy/Team.jsx	
+++ /dev/null
@@ -1,565 +0,0 @@
-import React, { useState, useEffect } from "react";
-import Navbar from "./Navbar";
-import Footer from "./Footer";
-import { fetchFiles } from '../constants/TeamImages';
-import { Loader } from "./Loader";
-
-let domainLeadsData = [];
-let CoreTeamData = [];
-let leadImg = '';
-
-const getRandomColor = () => {
-  const colors = ["blue", "red", "yellow", "green"];
-  const randomIndex = Math.floor(Math.random() * colors.length);
-  return colors[randomIndex];
-};
-
-const Card = ({ data }) => {
-  const randomBorderColor = getRandomColor();
-  const randomBgColor = getRandomColor();
-
-  return (
-    <div className="col-xl-3 col-sm-4 my-3">
-      <div
-        className={`bg-white rounded shadow-sm py-5 px-4 border border-4 border-${randomBorderColor}`}
-      >
-        <img
-          src={data.img}
-          alt=""
-          width="100"
-          className="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm"
-        />
-        <h5 className="mb-0 fs-4 fw-bold color-dark">{data.name}</h5>
-        <span className="small fw-light text-uppercase text-muted">
-          {data.domain}
-        </span>
-        <ul
-          className={`social mb-0 list-inline mt-2 mx-auto rounded rounded-5 p-1 bg-${randomBgColor}`}
-          style={{ width: "fit-content" }}
-        >
-          <li className="list-inline-item mx-2 ">
-            <a href={data.twitter} className="social-link">
-              <i className="fa-brands fa-x-twitter" style={{ color: "#fff" }}></i>
-            </a>
-          </li>
-          <li className="list-inline-item mx-2">
-            <a href={data.insta} className="social-link">
-              <i className="fa fa-instagram" style={{ color: "#fff" }}></i>
-            </a>
-          </li>
-          <li className="list-inline-item mx-2">
-            <a href={data.linkedin} className="social-link">
-              <i className="fa fa-linkedin" style={{ color: "#fff" }}></i>
-            </a>
-          </li>
-        </ul>
-      </div>
-    </div>
-  );
-};
-
-const CardList = ({ teamData }) => {
-  return (
-    <div className="row text-center justify-content-center my-5">
-      {teamData.map((data, index) => (
-        <Card key={index} data={data} />
-      ))}
-    </div>
-  );
-};
-
-export default function Team() {
-  const uniqueDomains = [
-    ...new Set(CoreTeamData.map((member) => member.domain)),
-  ];
-
-  const [activeDomain, setActiveDomain] = useState(uniqueDomains[0]);
-  const [loading, setLoading] = useState(true);
-
-  const handleTabClick = (domain) => {
-    setActiveDomain(domain);
-  };
-  function filterTeamMembers(data, domain) {
-    let mem = data.filter((member) => member.domain === domain);
-    return mem;
-  }
-
-
-  useEffect(() => {
-    let isMounted = true;
-
-    const fetchTeamData = async () => {
-      try {
-        const cachedData = localStorage.getItem('teamDatav1.0.1');
-
-        if (cachedData) {
-          const parsedData = JSON.parse(cachedData);
-
-          // Use the cached data
-          domainLeadsData = parsedData.domainLeadsData;
-          CoreTeamData = parsedData.CoreTeamData;
-          leadImg = parsedData.leadImg;
-          setLoading(false);
-        } else {
-
-          let files = await fetchFiles();
-          if (isMounted) {
-
-            domainLeadsData = [
-              {
-                img: `${files[2].url}`,
-                name: "Pooranjoy Bhattacharya",
-                domain: "Web Development",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[0].url}`,
-                name: "Abhijnyan Das",
-                domain: "Cloud Computing",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[25].url}`,
-                name: "Madhurjya Dasgupta",
-                domain: "Cybersecurity",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[26].url}`,
-                name: "Rishav Krishnan",
-                domain: "App Development",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[23].url}`,
-                name: "Shivam Sourav",
-                domain: "AI/ML",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[33].url}`,
-                name: "Ahana Sadh",
-                domain: "Editorial",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[28].url}`,
-                name: "Kuldeep Bora",
-                domain: "UI/UX Design",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[36].url}`,
-                name: "Namrata Parbat",
-                domain: "Event Management",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[5].url}`,
-                name: "Dhruv Bhutura",
-                domain: "Public Relations",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[20].url}`,
-                name: "Toshith Yadav",
-                domain: "Web Development CO-LEAD",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[9].url}`,
-                name: "Sneha Supriya",
-                domain: "AI/ML CO-LEAD",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[10].url}`,
-                name: "Manasvi Gupta",
-                domain: "Event Management CO LEAD",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[30].url}`,
-                name: "Ashmita Sen Roy",
-                domain: "Editorial CO LEAD",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[22].url}`,
-                name: "Sparsh Ranjan",
-                domain: "PR CO LEAD",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-            ];
-
-            CoreTeamData = [
-              {
-                img: `${files[13].url}`,
-                name: "Seedorf Rai",
-                domain: "Web Development",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[24].url}`,
-                name: "Girish Sharma",
-                domain: "Web Development",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[32].url}`,
-                name: "Madhurya Hait",
-                domain: "Web Development",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[4].url}`,
-                name: "Om Gupta",
-                domain: "AI/ML",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[1].url}`,
-                name: "Mayur K T",
-                domain: "AI/ML",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[19].url}`,
-                name: "Pratham Srivastava",
-                domain: "AI/ML",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[6].url}`,
-                name: "Neha Sultan",
-                domain: "AI/ML",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[34].url}`,
-                name: "Indraneel Das",
-                domain: "Cybersecurity",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[29].url}`,
-                name: "Shayan Vatsa",
-                domain: "Cybersecurity",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[17].url}`,
-                name: "Gunjan Chakrabartty",
-                domain: "Cybersecurity",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[12].url}`,
-                name: "Ishaan S. Oshima",
-                domain: "Cybersecurity",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[27].url}`,
-                name: "Manaswi Jha",
-                domain: "UI/UX Design",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[37].url}`,
-                name: "Peela Sharandeep",
-                domain: "UI/UX Design",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[31].url}`,
-                name: "Priyanjana Paul",
-                domain: "UI/UX Design",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[3].url}`,
-                name: "Sneha Seal",
-                domain: "Cloud Computing",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[15].url}`,
-                name: "Deepak Manda",
-                domain: "Cloud Computing",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[7].url}`,
-                name: "Prantor J. Bharadwaj",
-                domain: "Cloud Computing",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[14].url}`,
-                name: "Ritusree Das",
-                domain: "Editorial",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[8].url}`,
-                name: "Andre Antony Andrew",
-                domain: "Editorial",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[21].url}`,
-                name: "Torsha Guha",
-                domain: "Event Management",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[16].url}`,
-                name: "Adrija Chakrabarti",
-                domain: "Event Management",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[18].url}`,
-                name: "Aaryan Pradhan",
-                domain: "Event Management",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-              {
-                img: `${files[11].url}`,
-                name: "Ayush singh",
-                domain: "Event Management",
-                twitter: "https://john",
-                insta: "https://john",
-                linkedin: "https://john",
-              },
-            ];
-
-            leadImg = `${files[35].url}`;
-
-            // Cache the data in local storage
-            localStorage.setItem('teamDatav1.0.1', JSON.stringify({
-              domainLeadsData,
-              CoreTeamData,
-              leadImg
-            }));
-
-            setLoading(false);
-          }
-        }
-      } catch (error) {
-        console.error("Error fetching team data:", error);
-        if (isMounted) {
-          setLoading(false); // Set loading to false in case of an error
-        }
-      }
-    };
-
-    fetchTeamData();
-  }, []);
-
-  return (
-    <>
-      {
-        loading ? <Loader /> :
-          <>
-            <Navbar />
-
-            <div id="endcontain" className="container-fluid text-center my-3">
-            </div>
-
-            <div className="my-5 w-75 mx-auto">
-              <div className="d-flex flex-column justify-center">
-                <h1 className="text-center display-5 fw-bold font-italic gap-3">
-                  <font className="mx-2" color="#4285F4">Our</font>
-                  <font className="mx-2" color="#EA4335">Team</font>
-                  <font className="mx-2" color="F4B400">of</font>
-                  <font className="mx-2" color="#34A853">2023 </font>
-                </h1>
-                <p className="text-2xl text-center max-w-lg md:max-w-2xl">
-                  Meet the Driving Force Behind Innovation
-                </p>
-                <p className="text-2xl text-center max-w-lg md:max-w-2xl">
-                  Learning and innovation are at the core of everything we do. With our extraordinary team,
-                  we are dedicated to solving everyday challenges and pushing the boundaries of technology. Together, we are making it happen!
-                </p>
-              </div>
-            </div>
-
-            <div className="container ">
-              <div className="row text-center justify-content-center my-5">
-                <strong>
-                  <font className="fs-1 text-center display-5">
-                    <font color="#000">Lead</font>
-                  </font>
-                </strong>
-                <div className="col-xl-3 col-sm-4 my-3">
-                  <div className="bg-white rounded shadow-sm py-5 px-4 border border-4 border-blue">
-                    <img
-                      src={leadImg}
-                      alt=""
-                      width="100"
-                      className="img-fluid rounded-circle mb-3 img-thumbnail shadow-sm"
-                    />
-                    <h5 className="mb-0 fs-4 fw-bold color-dark">Aryan Lohia</h5>
-                    <span className="small fw-light text-uppercase text-muted">
-                      Lead
-                    </span>
-                    <ul
-                      className="social mb-0 list-inline mt-2 mx-auto rounded rounded-5 p-1 bg-blue"
-                      style={{ width: "fit-content" }}
-                    >
-                      <li className="list-inline-item mx-2 ">
-                        <a href="#" className="social-link">
-                          <i className="fa-brands fa-x-twitter" style={{ color: "#fff" }}></i>
-                        </a>
-                      </li>
-                      <li className="list-inline-item mx-2">
-                        <a href="#" className="social-link">
-                          <i
-                            className="fa fa-instagram"
-                            style={{ color: "#fff" }}
-                          ></i>
-                        </a>
-                      </li>
-                      <li className="list-inline-item mx-2">
-                        <a href="#" className="social-link">
-                          <i className="fa fa-linkedin" style={{ color: "#fff" }}></i>
-                        </a>
-                      </li>
-                    </ul>
-                  </div>
-                </div>
-              </div>
-              <div className="container-fluid text-center my-3">
-                <strong>
-                  <font className="fs-1 text-center display-5">
-                    <font color="#000">Domain Leads</font>
-                  </font>
-                </strong>
-              </div>
-              <div className="container my-5">
-                <CardList teamData={domainLeadsData} />
-              </div>
-
-              <div className="container-fluid text-center my-3">
-                <strong>
-                  <font className="fs-1 text-center display-5">
-                    <font color="#000">Core Team Members</font>
-                  </font>
-                </strong>
-              </div>
-              <div className="container my-5">
-                <ul className="nav nav-pills d-flex justify-content-center border border-dark p-3" id="domainTabs">
-                  {uniqueDomains.map((domain) => (
-                    <li className="nav-item mx-3" key={domain}>
-                      <a
-                        className={`nav-link ${domain === activeDomain ? 'active' : ''}`}
-                        onClick={() => handleTabClick(domain)}
-                        style={{
-                          fontWeight: "bold",
-                          color: "black"
-                        }}
-                      >
-                        {domain}
-                      </a>
-                    </li>
-                  ))}
-                </ul>
-                <style>
-                  {`
-              .nav-link:hover {
-                cursor: pointer;
-              }
-            `}
-                </style>
-                <div className="tab-content" id="domainTabsContent">
-                  {uniqueDomains.map((domain) => (
-                    <div
-                      key={domain}
-                      className={`tab-pane fade ${domain === activeDomain ? 'show active' : ''}`}
-                    >
-                      <CardList teamData={filterTeamMembers(CoreTeamData, domain)} />
-                    </div>
-                  ))}
-                </div>
-              </div>
-            </div>
-            <Footer />
-          </>
-      }
-    </>
-  );
-}
diff --git a/src/Components copy/Vision.jsx b/src/Components copy/Vision.jsx
deleted file mode 100644
index 1deef47..0000000
--- a/src/Components copy/Vision.jsx	
+++ /dev/null
@@ -1,87 +0,0 @@
-import React, { useEffect } from 'react';
-import AOS from 'aos';
-import 'aos/dist/aos.css';
-import { Link } from 'react-router-dom';
-
-const Vision = () => {
-  useEffect(() => {
-    AOS.init();
-  }, []);
-
-  const visions = [
-    {
-      id: 1,
-      title: "Seminar",
-      image: "https://medschool.vanderbilt.edu/wp-content/uploads/sites/35/public_files/13314405705_fa3a6e6850_k.jpg",
-      description: "Exploring Emerging Tech Trends Together.",
-      classes: "bg-red rounded",
-    },
-    {
-      id: 2,
-      title: "Projects",
-      image: "https://www.thebvnewspaper.com/wp-content/uploads/2021/04/Group-Projects.jpg",
-      description: "Building Solutions, Empowering Communities.",
-      classes: "bg-green rounded",
-    },
-    {
-      id: 3,
-      title: "Workshop",
-      image: "https://studio180theatre.com/wp-content/uploads/2023/08/Studio-180-Education-Workshop-68-1-1200x801.jpg",
-      description: "Hands-On Learning for Tech Enthusiasts",
-      classes: "bg-yellow rounded",
-    },
-    {
-      id: 4,
-      title: "Hackathons",
-      image: "https://www.coresponsibility.com/wp-content/uploads/2016/03/cr-students-hack.jpg",
-      description: "Innovate, Collaborate, Create, Win!",
-      classes: "bg-blue rounded",
-    },
-  ];
-
-  return (
-    <>
-      <div className="my-5 w-75 mx-auto">
-        <div className="d-flex flex-column justify-center">
-          <h1 className="vision text-center display-5 font-bold">Vision</h1>
-          <p className="text-2xl text-center max-w-lg md:max-w-2xl">
-            GDSC SMIT is inspired by the Google Developer&apos;s Family
-          </p>
-          <p className="text-2xl text-center max-w-lg md:max-w-2xl">
-            Our goal is to learn, explore, innovate and create <br /> And also,
-            having fun!
-          </p>
-        </div>
-        
-        <div className="d-flex flex-md-row flex-column text-center vh-25">
-          {visions.map(({ id, title, description, classes, image }) => (
-            id === 2 ? ( // Check if it's the "Projects" section
-              <Link to="/projects"   style={{color:"gray",textDecoration:"none"}}  key={id} className="vision_card rounded my-2 mx-2 w-100 border border-light-subtle " data-aos="fade-up" data-aos-duration='1000'>
-                <div className="mt-4 mx-4 d-flex flex-column">
-                  <img className='w-100 rounded' src={image} style={{ height: "155px" }} />
-                  <span className={`vision_card__title fw-bold cursor-pointer text-white rounded p-2 w-75 my-4 px-3 ${classes} mx-auto`}>
-                    {title}
-                  </span>
-                </div>
-                <p className="w-75 mx-auto mb-2 ">{description}</p>
-              </Link>
-            ) : (
-              // For other sections, use regular divs
-              <div key={id} className="vision_card rounded my-2 mx-2 w-100 border border-light-subtle " data-aos="fade-up" data-aos-duration='1000'>
-                <div className="mt-4 mx-4 d-flex flex-column">
-                  <img className='w-100 rounded' src={image} style={{ height: "155px" }} />
-                  <span className={`vision_card__title fw-bold cursor-pointer text-white rounded p-2 w-75 my-4 px-3 ${classes} mx-auto`}>
-                    {title}
-                  </span>
-                </div>
-                <p className="w-75 mx-auto mb-2 ">{description}</p>
-              </div>
-            )
-          ))}
-        </div>
-      </div>
-    </>
-  );
-};
-
-export default Vision;
diff --git a/src/Components copy/gototop.jsx b/src/Components copy/gototop.jsx
deleted file mode 100644
index 51c9545..0000000
--- a/src/Components copy/gototop.jsx	
+++ /dev/null
@@ -1,43 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import {FaArrowCircleUp} from 'react-icons/fa'; 
-
-const ScrollToTopButton = () => {
-  const [isVisible, setIsVisible] = useState(false);
-
-  useEffect(() => {
-    // Add a scroll event listener to check if the user has scrolled down 50% of the page.
-    const handleScroll = () => {
-      const scrollY = window.scrollY || document.documentElement.scrollTop;
-
-      if (scrollY > window.innerHeight / 2) {
-        setIsVisible(true);
-      } else {
-        setIsVisible(false);
-      }
-    };
-
-    window.addEventListener('scroll', handleScroll);
-
-    // Remove the event listener when the component unmounts.
-    return () => {
-      window.removeEventListener('scroll', handleScroll);
-    };
-  }, []);
-
-  const scrollToTop = () => {
-    window.scrollTo({
-      top: 0,
-      behavior: 'smooth', // You can change this to 'auto' for an instant scroll
-    });
-  };
-
-  return (
-    <div className={`scroll-to-top-button ${isVisible ? 'visible' : ''}`}>
-      <button onClick={scrollToTop}>
-        <FaArrowCircleUp/>
-      </button>
-    </div>
-  );
-};
-
-export default ScrollToTopButton;
diff --git a/src/Components/Projects.jsx b/src/Components/Projects.jsx
index 35e149f..4184aca 100644
--- a/src/Components/Projects.jsx
+++ b/src/Components/Projects.jsx
@@ -1,8 +1,9 @@
 import React, { useEffect } from "react";
 import AOS from 'aos';
 import Box from "@mui/material/Box";
-import { Link, redirect } from 'react-router-dom';
-
+import { Link } from 'react-router-dom';
+import Navbar from './Navbar'
+import Footer from './Footer'
 
 const Projects = () => {
   useEffect(() => {
@@ -40,21 +41,23 @@ const Projects = () => {
   ];
 
   return (
+    <>
+    <Navbar/>
     <Box
       display="flex"
       flexWrap="wrap"
       justifyContent="center"
       alignItems="center"
-      p={4} // Add padding as needed
+      p={4} 
     >
       {projects.map(({ id, TechStack, description, classes, Redirect ,image }) => (
         <Box
           key={id}
           className="vision_card rounded my-2 mx-2 w-100 border border-light-subtle " data-aos="fade-up" data-aos-duration='1000'
-          maxWidth="300px" // Set a maximum width as needed
+          maxWidth="300px" 
            
           style={{height:"450px"}}
-          m={2} // Add margin as needed
+          m={2} 
         >
           <Link to={Redirect}  style={{color:"black",textDecoration:"none",}}  >
             <div className="mt-4 mx-4 d-flex flex-column">
@@ -74,6 +77,8 @@ const Projects = () => {
         </Box>
       ))}
     </Box>
+    <Footer/>
+    </>
   );
 };
 export default Projects;