feat(Contact): started contact us page

This commit is contained in:
darkicewolf50 2025-06-10 17:08:53 -06:00
parent 1e71a8ef52
commit a0c3d51743
4 changed files with 70 additions and 21 deletions

0
src/Contact/Contact.css Normal file
View File

45
src/Contact/Contact.jsx Normal file
View File

@ -0,0 +1,45 @@
import UpdateBanner from "../Header/UpdateBanner";
import "./Contact.css";
export default function Contact() {
return (
<>
<UpdateBanner
updatedTitleText="Contact Us"
updatedSubtitleText=""
updatedImgUrl="https://picsum.photos/200"
updatetdImgAlt="Lorem Picsum"
/>
<div>
<h1>Hours of Operation</h1>
<a href="mailto:uofcbaja@gmail.com">
<h4>Send us an email.</h4>
<h4>uofcbaja@gmail.com</h4>
</a>
<ul>
<li>Wednesday: 6pm - 8pm</li>
<li>Saturday: 10am - 4pm</li>
</ul>
</div>
<div>
<h1>Join the team</h1>
<div>
<p>
Applications are now on for the 2024-2025 season. Please take a look
at our Instagram to see how you can apply!
</p>
<a href="https://www.instagram.com/ucalgarybaja/">@UofCBaja</a>
</div>
</div>
<div>
<h1>Sponsor the Team</h1>
<a href="mailto:uofcbaja@gmail.com?subject=Lets start something great">
<img
src="https://www.svgrepo.com/show/390657/email-envelope-letter-mail-message-communication.svg"
alt="email symbol"
/>
</a>
</div>
</>
);
}

View File

@ -67,24 +67,24 @@ export default function Header() {
</Link> </Link>
<nav> <nav>
<ul> <ul>
<Link to={"/"}> <li>
<li id="FirstNav">HOME</li> <Link to={"/"}>HOME</Link>
</Link> </li>
<Link to={"/About"}> <li>
<li>ABOUT</li> <Link to={"/About"}>ABOUT</Link>
</Link> </li>
<Link to={"/Vehicles"}> <li>
<li>OUR VEHICLES</li> <Link to={"/Vehicles"}>OUR VEHICLES</Link>
</Link> </li>
<Link to={"/"}> {/* <li>
<li>HISTORY</li> <Link to={"/"}>HISTORY</Link>
</Link> </li> */}
<Link to={"/OurSponsors"}> <li>
<li>SPONSORS</li> <Link to={"/OurSponsors"}>SPONSORS</Link>
</Link> </li>
{/* <Link to={"/OurSponsors"}> {/* <li>
<li>Become a Sponsor</li> <Link to={"/OurSponsors"}>Become a Sponsor</Link>
</Link> */} </li> */}
{/* Removed as no longer needed */} {/* Removed as no longer needed */}
{/* <li className="DropDown"> {/* <li className="DropDown">
{/* this link and li only exits for styling purposes } {/* this link and li only exits for styling purposes }
@ -115,9 +115,9 @@ export default function Header() {
</Link> </Link>
</ul> </ul>
</li> */} </li> */}
<Link to={"/"}> <li>
<li>CONTACT US</li> <Link to={"/Contact"}>CONTACT US</Link>
</Link> </li>
</ul> </ul>
</nav> </nav>
<div> <div>

View File

@ -13,6 +13,7 @@ import "./index.css";
import MockPage from "./MockDB/MockPage"; import MockPage from "./MockDB/MockPage";
import Home from "./Home/Home"; import Home from "./Home/Home";
import Vehicles from "./Vehicles/Vehicles"; import Vehicles from "./Vehicles/Vehicles";
import Contact from "./Contact/Contact";
const root = ReactDOM.createRoot(document.getElementById("root")); const root = ReactDOM.createRoot(document.getElementById("root"));
root.render( root.render(
@ -42,6 +43,9 @@ root.render(
<Route <Route
path="/Gallery" path="/Gallery"
element={<Gallery />}></Route> element={<Gallery />}></Route>
<Route
path="/Contact"
element={<Contact />}></Route>
<Route <Route
path="/MockPage" path="/MockPage"
element={<MockPage />}></Route> element={<MockPage />}></Route>