Ucalgary_Baja/BajaUofCWebsite
4
0
Fork 0
mirror of https://github.com/UofCBaja/BajaUofCWebsite.git synced 2025-06-15 05:14:18 -06:00
Code Issues Packages Projects Releases Wiki Activity

changed name of OpenPage to be more clear added need for css

Browse Source
This commit is contained in:
darkicewolf50 2024-03-13 14:11:42 -06:00
parent 81eadbda2f
commit acb4728b1d
3 changed files with 9 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/Header/DropdownMenu.js
View File

@ -1,4 +1,4 @@
import OpenPage from "./OpenPage";
import OpenPageButton from "./OpenPageButton";
/**
* @param {null} null - Takes in nothing
@ -9,11 +9,11 @@ import OpenPage from "./OpenPage";
const DropdownMenu = () => {
return (
<div>
<OpenPage
<OpenPageButton
pageToGoTo={"/JoinTheClub"}
textOnButton={"Join the Club"}
/>
<OpenPage
<OpenPageButton
pageToGoTo={"/UpcomingEvents"}
textOnButton={"Upcoming Events"}
/>

12
src/Header/Header.js
View File

@ -1,6 +1,6 @@
import logo from "./logo.png";
import DropdownMenu from "./DropdownMenu";
import OpenPage from "./OpenPage";
import OpenPageButton from "./OpenPageButton";
import { useNavigate, Outlet } from "react-router-dom";
import { useState } from "react";
import "./Header.css";
@ -46,19 +46,19 @@ const Header = () => {
<h2>Schulich Offroad</h2>
</div>
<nav>
<OpenPage
<OpenPageButton
pageToGoTo={"/"}
textOnButton={"About Us"}
/>
<OpenPage
<OpenPageButton
pageToGoTo={"/Teams"}
textOnButton={"Teams"}
/>
<OpenPage
<OpenPageButton
pageToGoTo={"/OurSponsors"}
textOnButton={"Our Sponsors"}
/>
<OpenPage
<OpenPageButton
pageToGoTo={"/BecomeASponsor"}
textOnButton={"Become a Sponsor"}
/>
@ -69,7 +69,7 @@ const Header = () => {
<button type="button">Club Membership & Upcoming Events</button>
{isDropdownVisible && <DropdownMenu />}
</div>
<OpenPage
<OpenPageButton
pageToGoTo={"/Gallery"}
textOnButton={"Gallery"}
/>

26
src/Header/OpenPage.js
View File

@ -1,26 +0,0 @@
import { useNavigate } from "react-router-dom";
/**
* @param {String} pageToGoTo - The page that the button goes to
* @param {String} textOnButton - The Text tht will be on the button
* @returns {JSX.Element} JSX - HTML tags and JS functionality
* @description Button Template that moves you to the
* @author Brock <darkicewolf50@gmail.com>
* @todo refactor so that name is OpenPageButton
*/
const OpenPage = ({ pageToGoTo, textOnButton }) => {
const navigate = useNavigate();
const navigateTo = (param) => {
navigate(param);
};
return (
<button
id="navigateButton"
onClick={() => navigateTo(pageToGoTo)}>
{textOnButton}
</button>
);
};
export default OpenPage;