src/components/LeftNav.jsx

@@ -1,20 +0,0 @@
-import React from "react";
-import { GoChevronLeft } from "react-icons/go";
-
-const LeftNav = React.memo(({ disabled, onClick }) => {
-  return (
-    <button
-      type="button"
-      className="image-gallery-icon image-gallery-left-nav text-2xl md:text-4xl text-highlight"
-      disabled={disabled}
-      onClick={onClick}
-      aria-label="Previous Slide"
-    >
-      <GoChevronLeft />
-    </button>
-  );
-});
-
-LeftNav.displayName = "LeftNav";
-
-export default LeftNav;

src/components/PlayPause.jsx

@@ -1,25 +0,0 @@
-import React from "react";
-// import { bool, func } from "prop-types";
-// import SVG from "src/components/SVG";
-
-const PlayPause = React.memo(({ isPlaying, onClick }) => {
-  return (
-    <button
-      type="button"
-      className="image-gallery-icon image-gallery-play-button"
-      onClick={onClick}
-      aria-label="Play or Pause Slideshow"
-    >
-      <SVG strokeWidth={2} icon={isPlaying ? "pause" : "play"} />
-    </button>
-  );
-});
-
-PlayPause.displayName = "PlayPause";
-
-// PlayPause.propTypes = {
-//   isPlaying: bool.isRequired,
-//   onClick: func.isRequired,
-// };
-
-export default PlayPause;

src/components/RightNav.jsx

@@ -1,19 +0,0 @@
-import React from "react";
-import { GoChevronRight } from "react-icons/go";
-const RightNav = React.memo(({ disabled, onClick }) => {
-  return (
-    <button
-      type="button"
-      className="image-gallery-icon image-gallery-right-nav text-2xl md:text-4xl text-highlight"
-      disabled={disabled}
-      onClick={onClick}
-      aria-label="Next Slide"
-    >
-      <GoChevronRight />
-    </button>
-  );
-});
-
-RightNav.displayName = "RightNav";
-
-export default RightNav;

src/pages/About.jsx

@@ -8,7 +8,6 @@ function About() {
   return (
     <div className="relative">
       <div id="about" className=" absolute -top-16 "></div>
-      <div className=" h-screen">
       <h2 className="mb-2 text-subTPhone md:text-subT font-headline">
         About<span className=" text-highlight">.</span>
       </h2>
@@ -20,10 +19,10 @@ function About() {
             dynamic team, continually learn, and foster innovation. My
             dedication lies in transforming design concepts into user-friendly
             experiences and achieving organizational goals through creativity
-              and teamwork. I aspire to engage in work that allows the
+            and teamwork. I aspire to engage in work that allows the utilization
-              utilization of technical and creative skills to contribute
+            of technical and creative skills to contribute effectively to the
-              effectively to the growth of an organization. If you think you've
+            growth of an organization. If you think you've got an opening that I
-              got an opening that I might like, let's connect 🔗
+            might like, let's connect 🔗
           </p>
         </div>
         <div className=" basis-1/3">
@@ -36,7 +35,6 @@ function About() {
         </div>
       </div>
     </div>
-    </div>
   );
 }
 

src/pages/Experience.jsx

@@ -53,13 +53,11 @@ function Experiance() {
   return (
     <div className="relative">
       <div id="experience" className=" absolute -top-16 "></div>
-      <div className=" h-screen">
       <h2 className=" text-subTPhone md:text-subT font-headline">
         Experience<span className=" text-highlight">.</span>
       </h2>
       <div className="py-4">{experianceListUI}</div>
     </div>
-    </div>
   );
 }
 

src/pages/ExperienceDetail.jsx

@@ -4,8 +4,6 @@ import { projectsAtom } from "../store";
 import ImageGallery from "react-image-gallery";
 import Tags from "../components/Tags";
 import { IoChevronBackOutline as BackButton } from "react-icons/io5";
-import LeftNav from "../components/LeftNav";
-import RightNav from "../components/RightNav";
 
 function ExperianceDetail() {
   const { id } = useParams();
@@ -50,13 +48,13 @@ function ExperianceDetail() {
       </button>
       <div className="flex flex-col">
         <div className="flex-1">
-          <h1 className=" text-subTPhone md:text-subT font-headline">
+          <h1 className=" text-subTPhone md:text-subT">
             Project: {myProject.title}
           </h1>
         </div>
         <div className="flex-1 mt-2 mb-6">
           <Tags listOfTags={myProject.tags} />
-        </div>
+        </div>{" "}
       </div>
       <div className="flex flex-col md:flex-row gap-4">
         <div className="flex-1">
@@ -67,12 +65,6 @@ function ExperianceDetail() {
             slideDuration={1000}
             slideInterval={4000}
             items={projectImg}
-            renderLeftNav={(onClick, disabled) => (
-              <LeftNav onClick={onClick} disabled={disabled} />
-            )}
-            renderRightNav={(onClick, disabled) => (
-              <RightNav onClick={onClick} disabled={disabled} />
-            )}
           />
         </div>
         <div className="flex-1 text-base">

src/pages/Start.jsx

@@ -3,7 +3,7 @@ function Start() {
     <div className="relative">
       <div id="start" className="absolute  -top-16 "></div>
 
-      <div className=" h-screen">
+      <div>
         <h1 className="text-titlePhone md:text-title md:leading-tight mb-2 font-headline">
           Hello, my name is Maria<span className=" text-highlight">.</span>
         </h1>