chore: clean code

package.json

@@ -12,9 +12,7 @@
   "dependencies": {
     "@emotion/react": "^11.11.1",
     "@emotion/styled": "^11.11.0",
-    "@mui/material": "^5.14.4",
     "bootstrap": "^5.3.1",
-    "gsap": "^3.12.2",
     "react": "^18.2.0",
     "react-bootstrap": "^2.8.0",
     "react-dom": "^18.2.0",

src/Homepage.jsx

@@ -1,4 +1,4 @@
-import { useEffect, useState, useRef } from "react";
+import { useEffect, useState } from "react";
 import "./assets/css/Homepage.css";
 import LandingPanel from "./slides/Landing/LandingPanel";
 import CampaignVideo from "./slides/CampaignVideo/CampaignVideo";
@@ -14,17 +14,15 @@ import PortraitOverlay from "./overlays/PortraitOverlay";
 import VideoOverlay from "./overlays/VideoOverlay";
 import Healverse from "./slides/Healverse/Healverse";
 import Footer from "./slides/Footer/Footer";
-import gsap from "gsap";
-import ScrollTrigger from "gsap/ScrollTrigger";
-
+
 function Homepage() {
   const [isPortraitOverlayActive, setIsPortraitOverlayActive] = useState(false);
   const [overlayPortraitSrc, setOverlayPortraitSrc] = useState("");
   const [isVideoOverlayActive, setIsVideoOverlayActive] = useState(false);
   const [overlayVideoSrc, setOverlayVideoSrc] = useState("");
   const [viewportWidth, setViewportWidth] = useState(window.innerWidth);
-
   const [UNCCD_LOGO, SET_UNCCD_LOGO] = useState(UnccdLogoWhite);
+
   const changeLogoColor = (currentPanel) => {
     if (currentPanel.contains("unccd-logo-white")) {
       SET_UNCCD_LOGO(UnccdLogoWhite);
@@ -39,10 +37,6 @@ function Homepage() {
 
   useEffect(() => {
     window.addEventListener("resize", handleResize);
-
-    // Clean up the event listener when component unmounts
-
-    // Set up vars
     let isPanelsTallerThanWindow = false;
     const _window = window;
     const initialPanels = document.querySelectorAll(".panel");
@@ -112,14 +106,12 @@ function Homepage() {
     }
     // _window.removeEventListener("scroll", updateWindow);
 
+    // // Cleanup event listener on component unmount
     return () => {
       window.removeEventListener("resize", handleResize);
       _window.removeEventListener("scroll", updateWindow);
     };
-    // // Cleanup event listener on component unmount
-    // return () => {
-    //   _window.removeEventListener("scroll", updateWindow);
-    // };
+
   }, [viewportWidth]);
 
   return (

src/slides/Landing/LandingPanel.jsx

@@ -1,4 +1,3 @@
-import introVideo from "../../static/videos/intro.mp4";
 import DownArrow from "../../static/icons/arrow-down.svg";
 
 function LandingPanel() {

src/slides/PhotoExhibition/PhotoExhibition.jsx

@@ -1,9 +1,7 @@
 import Carousel from "react-multi-carousel";
 import "react-multi-carousel/lib/styles.css";
 import importAllSmallPortraits from "./importPortraits";
-import PortraitOverlay from "../../overlays/PortraitOverlay";
-import { useState } from "react";
-
+
 function PhotoExhibition(props) {
   const { setIsOverlayActive, setPortraitSrc } = props;
   const openOverlay = (portraitSrc) => {