From c4ba085c3bf1edc57cffd19c1c342ee1b1c3b335 Mon Sep 17 00:00:00 2001
From: darkicewolf50 <brock.tomlinson@ucalgary.ca>
Date: Sat, 9 Mar 2024 16:00:56 -0700
Subject: [PATCH] init footer

---
 src/Footer/Ender.css |  33 ++++++++++++++
 src/Footer/Ender.js  |  28 ++++++++++++
 src/Header/Header.js | 106 +++++++++++++++++++++++++++----------------
 3 files changed, 127 insertions(+), 40 deletions(-)
 create mode 100644 src/Footer/Ender.css
 create mode 100644 src/Footer/Ender.js

diff --git a/src/Footer/Ender.css b/src/Footer/Ender.css
new file mode 100644
index 0000000..90b6db3
--- /dev/null
+++ b/src/Footer/Ender.css
@@ -0,0 +1,33 @@
+#ender {
+	display: flex;
+	flex-direction: column;
+	padding-top: 10px;
+	padding-bottom: 10px;
+	justify-content: center;
+	background-color: lightgrey;
+}
+
+#pointerCursor {
+	cursor: pointer;
+}
+
+#ender div {
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+}
+#ender p {
+	padding-left: 2%;
+}
+
+#ender .hidden {
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+	display: none;
+}
+
+#ender .hidden li {
+	list-style-type: none;
+	padding-right: 2%;
+}
diff --git a/src/Footer/Ender.js b/src/Footer/Ender.js
new file mode 100644
index 0000000..a118260
--- /dev/null
+++ b/src/Footer/Ender.js
@@ -0,0 +1,28 @@
+import "./Ender.css";
+/**
+ * @param {null} null - requires onthing
+ * @returns {JSX.Element} Page - HTML tags and JS functionality
+ * @description The Footer of the page
+ * @author Brock <darkicewolf50@gmail.com>
+ * @todo add who helped developed the site and finalize css
+ */
+const Ender = () => {
+	return (
+		<footer id="ender">
+			<div>
+				<p>© 2023 by Schulich Off-Road </p>
+				<p
+					onClick={() => window.open("https://www.morphgenix.com/", "_blank")}
+					id="pointerCursor">
+					Powered by: Morphgenix
+				</p>
+			</div>
+			<ul className="hidden">
+				<li>Developed by:</li>
+				<li>Brock</li>
+			</ul>
+		</footer>
+	);
+};
+
+export default Ender;
diff --git a/src/Header/Header.js b/src/Header/Header.js
index 9d53f58..82869c5 100644
--- a/src/Header/Header.js
+++ b/src/Header/Header.js
@@ -1,52 +1,78 @@
-import logo from './logo.png';
+import logo from "./logo.png";
 import DropdownMenu from "./DropdownMenu";
 // import OpenPage from "./OpenPage";
 import { useNavigate } from "react-router-dom";
 import { useState } from "react";
 import { Outlet } from "react-router-dom";
 import "./Header.css";
+import Ender from "../Footer/Ender";
 
 export default function Header() {
-    const [isDropdownVisible, setDropdownVisible] = useState(false);
-    const navigate = useNavigate();
+	const [isDropdownVisible, setDropdownVisible] = useState(false);
+	const navigate = useNavigate();
 
-    const OpenPage = (arg) => {    
-        navigate(arg);
-        console.log(arg);
-    };
+	const OpenPage = (arg) => {
+		navigate(arg);
+		console.log(arg);
+	};
 
-    const handleMouseEnter = () => {
-        setDropdownVisible(true);
-    };
+	const handleMouseEnter = () => {
+		setDropdownVisible(true);
+	};
 
-    const handleMouseLeave = () => {
-        setDropdownVisible(false);
-    };
+	const handleMouseLeave = () => {
+		setDropdownVisible(false);
+	};
 
-    return (
-        <>
-            <header>
-                <div>
-                    <img style={{background: "gray"}} onClick = {() => OpenPage('/')} src={logo} alt="logo" />
-                    <p>Schulich Offroad</p>
-                </div>
-                <div>
-                    <button type = "button" onClick = {() => OpenPage('/')}>About Us</button>
-                    <button type = "button" onClick = {() => OpenPage('/Teams')}>Teams</button>
-                    <button type = "button" onClick = {() => OpenPage('/OurSponsors')}>Our Sponsors</button>
-                    <button type = "button" onClick = {() => OpenPage('/BecomeASponsor')}>Become a Sponsor</button>
-                    <div
-                    onMouseEnter={handleMouseEnter}
-                    onMouseLeave={handleMouseLeave}
-                    style={{background: "red"}}
-                    >
-                        <button type = "button">Club Membership & Upcoming Events</button>
-                        {isDropdownVisible && <DropdownMenu />}
-                    </div>
-                    <button type = "button" onClick = {() => OpenPage('/Gallery')}>Gallery</button>
-                </div>
-            </header>
-            <Outlet />
-        </>
-    );
-};
\ No newline at end of file
+	return (
+		<>
+			<header>
+				<div>
+					<img
+						style={{ background: "gray" }}
+						onClick={() => OpenPage("/")}
+						src={logo}
+						alt="logo"
+					/>
+					<p>Schulich Offroad</p>
+				</div>
+				<div>
+					<button
+						type="button"
+						onClick={() => OpenPage("/")}>
+						About Us
+					</button>
+					<button
+						type="button"
+						onClick={() => OpenPage("/Teams")}>
+						Teams
+					</button>
+					<button
+						type="button"
+						onClick={() => OpenPage("/OurSponsors")}>
+						Our Sponsors
+					</button>
+					<button
+						type="button"
+						onClick={() => OpenPage("/BecomeASponsor")}>
+						Become a Sponsor
+					</button>
+					<div
+						onMouseEnter={handleMouseEnter}
+						onMouseLeave={handleMouseLeave}
+						style={{ background: "red" }}>
+						<button type="button">Club Membership & Upcoming Events</button>
+						{isDropdownVisible && <DropdownMenu />}
+					</div>
+					<button
+						type="button"
+						onClick={() => OpenPage("/Gallery")}>
+						Gallery
+					</button>
+				</div>
+			</header>
+			<Outlet />
+			<Ender />
+		</>
+	);
+}