bobbert/peworkshop
1
0 Fork 0
mirror of https://github.com/mudabbir-ahmad/peworkshop.git synced 2026-10-07 19:50:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

fixing navbar

Browse Source 
Adding Svg files and fixing appearance of navbar to look like the design pages
This commit is contained in:
bobbert committed 2025-03-23 12:54:05 +00:00
1 parent 5a20899808
commit c496b08d52
13 files changed
+674 -867
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

components/NavBar.js
+15 -23
View File
@@ -35,7 +35,7 @@ export default function NavBar({ activeLink, teamData }) {
checkHuntStatus();
}, []);
// Handle map link click
// Handle map link click - only redirect for map page
const handleMapClick = (e) => {
if (huntActive === false) {
e.preventDefault();
@@ -44,46 +44,38 @@ export default function NavBar({ activeLink, teamData }) {
};
return (
<nav className={styles["nav-bar"]}>
<nav className="nav-bar">
<Link
href="/map"
className={`${styles["nav-item"]} ${
activeLink === "map" ? styles["active"] : ""
}`}
className={`nav-item ${activeLink === "map" ? "active" : ""}`}
onClick={handleMapClick}
>
<div className={styles["nav-icon"]}>🗺️</div>
<div className={styles["nav-label"]}>Map</div>
<div className="nav-icon">🗺️</div>
<div className="nav-label">Map</div>
</Link>
<Link
href="/stats"
className={`${styles["nav-item"]} ${
activeLink === "stats" ? styles["active"] : ""
}`}
className={`nav-item ${activeLink === "stats" ? "active" : ""}`}
>
<div className={styles["nav-icon"]}>📊</div>
<div className={styles["nav-label"]}>Stats</div>
<div className="nav-icon">📊</div>
<div className="nav-label">Stats</div>
</Link>
<Link
href={teamData?.team ? `/${teamData.team.id}` : "/team-selection"}
className={`${styles["nav-item"]} ${
activeLink === "team" ? styles["active"] : ""
}`}
href={teamData?.id ? `/${teamData.id}` : "/team-selection"}
className={`nav-item ${activeLink === "team" ? "active" : ""}`}
>
<div className={styles["nav-icon"]}>👥</div>
<div className={styles["nav-label"]}>Team</div>
<div className="nav-icon">👥</div>
<div className="nav-label">Team</div>
</Link>
<Link
href="/leaderboard"
className={`${styles["nav-item"]} ${
activeLink === "leaderboard" ? styles["active"] : ""
}`}
className={`nav-item ${activeLink === "leaderboard" ? "active" : ""}`}
>
<div className={styles["nav-icon"]}>🏆</div>
<div className={styles["nav-label"]}>Leaderboard</div>
<div className="nav-icon">🏆</div>
<div className="nav-label">Leaderboard</div>
</Link>
</nav>
);