diff --git a/src/App.jsx b/src/App.jsx
index b42c4da..07f697a 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -15,6 +15,7 @@ import Fundraising from "./pages/ProgramsPage/FundraisingPage/Fundraising";
import StudyHours from "./pages/StudyHours";
import Workshops from "./pages/ProgramsPage/WorkshopsPage/Workshops.jsx";
import FuFit from "./pages/FuFit";
+import FEPPage from "./pages/ProjectsPage/FEPPage/FEPPage"
import Credits from "./pages/CreditsPage/Credits";
export default function App() {
@@ -37,6 +38,7 @@ export default function App() {
} />
} />
} />
+ } />
);
diff --git a/src/images/AutonomousVacuum.png b/src/images/AutonomousVacuum.png
new file mode 100644
index 0000000..dd29425
Binary files /dev/null and b/src/images/AutonomousVacuum.png differ
diff --git a/src/images/Building.png b/src/images/Building.png
new file mode 100644
index 0000000..88881e9
Binary files /dev/null and b/src/images/Building.png differ
diff --git a/src/images/CollaboratorsBackground.png b/src/images/CollaboratorsBackground.png
new file mode 100644
index 0000000..d38a37e
Binary files /dev/null and b/src/images/CollaboratorsBackground.png differ
diff --git a/src/images/Designing.png b/src/images/Designing.png
new file mode 100644
index 0000000..07a899f
Binary files /dev/null and b/src/images/Designing.png differ
diff --git a/src/images/DottedOrangeLine.png b/src/images/DottedOrangeLine.png
new file mode 100644
index 0000000..a39e624
Binary files /dev/null and b/src/images/DottedOrangeLine.png differ
diff --git a/src/images/FACES.png b/src/images/FACES.png
new file mode 100644
index 0000000..a8c43a4
Binary files /dev/null and b/src/images/FACES.png differ
diff --git a/src/images/FASAE.png b/src/images/FASAE.png
new file mode 100644
index 0000000..46801fc
Binary files /dev/null and b/src/images/FASAE.png differ
diff --git a/src/images/FEPBackground.png b/src/images/FEPBackground.png
new file mode 100644
index 0000000..a4c74fd
Binary files /dev/null and b/src/images/FEPBackground.png differ
diff --git a/src/images/FGN.png b/src/images/FGN.png
new file mode 100644
index 0000000..e8d531f
Binary files /dev/null and b/src/images/FGN.png differ
diff --git a/src/images/GestureControlledArm.png b/src/images/GestureControlledArm.png
new file mode 100644
index 0000000..f127db0
Binary files /dev/null and b/src/images/GestureControlledArm.png differ
diff --git a/src/images/HungryHungryHippos.png b/src/images/HungryHungryHippos.png
new file mode 100644
index 0000000..b7d752e
Binary files /dev/null and b/src/images/HungryHungryHippos.png differ
diff --git a/src/images/PastProjectsBackground.png b/src/images/PastProjectsBackground.png
new file mode 100644
index 0000000..efa87b1
Binary files /dev/null and b/src/images/PastProjectsBackground.png differ
diff --git a/src/images/Planning.png b/src/images/Planning.png
new file mode 100644
index 0000000..924dbd9
Binary files /dev/null and b/src/images/Planning.png differ
diff --git a/src/images/Presentation.png b/src/images/Presentation.png
new file mode 100644
index 0000000..bdbfd33
Binary files /dev/null and b/src/images/Presentation.png differ
diff --git a/src/images/Step1.png b/src/images/Step1.png
new file mode 100644
index 0000000..3906c4f
Binary files /dev/null and b/src/images/Step1.png differ
diff --git a/src/images/Step2.png b/src/images/Step2.png
new file mode 100644
index 0000000..1afd2bc
Binary files /dev/null and b/src/images/Step2.png differ
diff --git a/src/images/Step3.png b/src/images/Step3.png
new file mode 100644
index 0000000..fa7eac3
Binary files /dev/null and b/src/images/Step3.png differ
diff --git a/src/images/Step4.png b/src/images/Step4.png
new file mode 100644
index 0000000..b6d1f2f
Binary files /dev/null and b/src/images/Step4.png differ
diff --git a/src/images/Step5.png b/src/images/Step5.png
new file mode 100644
index 0000000..baab00d
Binary files /dev/null and b/src/images/Step5.png differ
diff --git a/src/images/Testing.png b/src/images/Testing.png
new file mode 100644
index 0000000..98cef1d
Binary files /dev/null and b/src/images/Testing.png differ
diff --git a/src/images/TheProcessBackgroundFEP.png b/src/images/TheProcessBackgroundFEP.png
new file mode 100644
index 0000000..ebdb678
Binary files /dev/null and b/src/images/TheProcessBackgroundFEP.png differ
diff --git a/src/pages/ProjectsPage/FEPPage/EngineeringProcess.jsx b/src/pages/ProjectsPage/FEPPage/EngineeringProcess.jsx
new file mode 100644
index 0000000..e00b5b3
--- /dev/null
+++ b/src/pages/ProjectsPage/FEPPage/EngineeringProcess.jsx
@@ -0,0 +1,79 @@
+import React from "react";
+import ProcessCard from "./ProcessCard"; // Adjust the import path as necessary
+import Planning from "../../../images/Planning.png";
+import Designing from "../../../images/Designing.png";
+import Building from "../../../images/Building.png";
+import Testing from "../../../images/Testing.png";
+import Presentation from "../../../images/Presentation.png";
+
+import Step1 from "../../../images/Step1.png";
+import Step2 from "../../../images/Step2.png";
+import Step3 from "../../../images/Step3.png";
+import Step4 from "../../../images/Step4.png";
+import Step5 from "../../../images/Step5.png";
+import DottedOrangeLine from "../../../images/DottedOrangeLine.png";
+
+const DevelopmentProcess = () => {
+ return (
+
+ {/* Title */}
+
+
+ The Engineering Process
+
+
+
+
+ {/* Main Content: Dotted line and Process Cards */}
+
+ {/* Wrapper to position dotted line and process cards */}
+
+ {/* Dotted line centered vertically */}
+
+

+
+
+ {/* Process Cards */}
+
+
+
+
+ );
+};
+
+export default DevelopmentProcess;
diff --git a/src/pages/ProjectsPage/FEPPage/FEPPage.jsx b/src/pages/ProjectsPage/FEPPage/FEPPage.jsx
new file mode 100644
index 0000000..61d4dc6
--- /dev/null
+++ b/src/pages/ProjectsPage/FEPPage/FEPPage.jsx
@@ -0,0 +1,27 @@
+import Navbar from "../../../components/Navbar"
+import Footer from "../../../components/Footer";
+import FEPBackground from "../../../images/FEPBackground.png";
+import TheFEPProject from "./TheFEPProject";
+import OurProcess from "./OurProcess";
+import EngineeringProcess from "./EngineeringProcess";
+import OurCollaborators from "./OurCollaborators";
+import PastProjects from "./OurPastProjects";
+
+const FEPPage = () => {
+ return (
+ <>
+
+ >
+
+ );
+}
+
+export default FEPPage;
\ No newline at end of file
diff --git a/src/pages/ProjectsPage/FEPPage/OurCollaborators.jsx b/src/pages/ProjectsPage/FEPPage/OurCollaborators.jsx
new file mode 100644
index 0000000..14a7fe8
--- /dev/null
+++ b/src/pages/ProjectsPage/FEPPage/OurCollaborators.jsx
@@ -0,0 +1,33 @@
+import React from "react";
+import CollaboratorsBackground from "../../../images/CollaboratorsBackground.png";
+import FGNLogo from "../../../images/FGN.png"; // Example logos, update the paths accordingly
+import FASAELogo from "../../../images/FASAE.png";
+import FACESLogo from "../../../images/FACES.png";
+
+const OurCollaborators = () => {
+ return (
+
+ {/* Title */}
+
Our collaborators
+
+ {/* Subtext */}
+
+ We are grateful for the support from organizations dedicated to professional development,
+ cultural enrichment, and community engagement. Their contributions, including workshops,
+ mentorship, and resources, help us enhance our programs and empower future leaders.
+
+
+ {/* Logos */}
+
+
+ );
+};
+
+export default OurCollaborators;
diff --git a/src/pages/ProjectsPage/FEPPage/OurPastProjects.jsx b/src/pages/ProjectsPage/FEPPage/OurPastProjects.jsx
new file mode 100644
index 0000000..a01a874
--- /dev/null
+++ b/src/pages/ProjectsPage/FEPPage/OurPastProjects.jsx
@@ -0,0 +1,49 @@
+import React from "react";
+import PastProjectsBackground from "../../../images/PastProjectsBackground.png";
+import ProjectCard from "./ProjectCard"; // Import ProjectCard
+import GestureControlledArm from "../../../images/GestureControlledArm.png";
+import AutonomousVacuum from "../../../images/AutonomousVacuum.png";
+import HungryHungryHippos from "../../../images/HungryHungryHippos.png";
+
+const PastProjects = () => {
+ return (
+
+ {/* Title */}
+
+
+ {/* Project Cards */}
+
+
+ );
+};
+
+export default PastProjects;
diff --git a/src/pages/ProjectsPage/FEPPage/OurProcess.jsx b/src/pages/ProjectsPage/FEPPage/OurProcess.jsx
new file mode 100644
index 0000000..3e3a85c
--- /dev/null
+++ b/src/pages/ProjectsPage/FEPPage/OurProcess.jsx
@@ -0,0 +1,21 @@
+import React from "react";
+import TheProcessBackgroundFEP from "../../../images/TheProcessBackgroundFEP.png"; // Update the path if necessary
+
+const TheFIPProject = () => {
+ return (
+
+ {/* Top orange bar */}
+
+
+ {/* Image container */}
+
+

+
+
+ {/* Bottom orange bar */}
+
+
+ );
+};
+
+export default TheFIPProject;
diff --git a/src/pages/ProjectsPage/FEPPage/ProcessCard.jsx b/src/pages/ProjectsPage/FEPPage/ProcessCard.jsx
new file mode 100644
index 0000000..ad2b44a
--- /dev/null
+++ b/src/pages/ProjectsPage/FEPPage/ProcessCard.jsx
@@ -0,0 +1,28 @@
+import React from "react";
+
+const ProcessCard = ({ title, subtext, image, stepNumberImage }) => {
+ return (
+
+ {/* Content with step number image, title, and subtext */}
+
+ {/* Step number image next to the title */}
+
+

+
+
+ {/* Title and subtext */}
+
+
+
+ {/* Image */}
+
+

+
+
+ );
+};
+
+export default ProcessCard;
diff --git a/src/pages/ProjectsPage/FEPPage/ProjectCard.jsx b/src/pages/ProjectsPage/FEPPage/ProjectCard.jsx
new file mode 100644
index 0000000..e32e46d
--- /dev/null
+++ b/src/pages/ProjectsPage/FEPPage/ProjectCard.jsx
@@ -0,0 +1,19 @@
+import React from "react";
+
+const ProjectCard = ({ title, year, description, image }) => {
+ return (
+
+ {/* Image */}
+
+
+ {/* Content */}
+
+
{title}
+
{year}
+
{description}
+
+
+ );
+};
+
+export default ProjectCard;
diff --git a/src/pages/ProjectsPage/FEPPage/TheFEPProject.jsx b/src/pages/ProjectsPage/FEPPage/TheFEPProject.jsx
new file mode 100644
index 0000000..6ac8662
--- /dev/null
+++ b/src/pages/ProjectsPage/FEPPage/TheFEPProject.jsx
@@ -0,0 +1,23 @@
+import React from "react";
+
+const TheFEPProject = () => {
+ return (
+
+
+
+ The FUSION Engineering Project
+
+
+
+
+ The FUSION Engineering Project is designed to empower members with hands-on experience, fostering both technical and professional growth. Participants will develop essential engineering skills by working on real-world challenges, all while collaborating in a dynamic, team-based environment. Beyond technical expertise, the project emphasizes the development of key professional skills, including effective communication, presenting work confidently, and translating complex ideas into actionable solutions. Our goal is to prepare participants not only to succeed in their careers but to lead and innovate in the engineering field.
+
+
+
+
+ );
+};
+
+export default TheFEPProject;