fixing navbar

Adding Svg files and fixing appearance of navbar to look like the design pages

app/(main)/leaderboard/page.js

@@ -4,6 +4,7 @@ import { useSearchParams } from "next/navigation";
 import { useRouter } from "next/navigation";
 import { useSession } from "next-auth/react";
 import Link from "next/link";
+import NavBar from "@/components/NavBar";
 
 export default function LeaderboardPage() {
   const [teams, setTeams] = useState([]);
@@ -160,31 +161,7 @@ export default function LeaderboardPage() {
 
       {/* Only show navigation bar when the hunt hasn't ended */}
       {!huntJustEnded && (
-        <div className="nav-bar">
-          <Link href="/map" className="nav-item">
-            <div className="nav-icon">🗺️</div>
-            <div className="nav-label">Map</div>
-          </Link>
-          <Link href="/stats" className="nav-item">
-            <div className="nav-icon">📊</div>
-            <div className="nav-label">Stats</div>
-          </Link>
-          <Link
-            href={
-              session?.user?.teamId
-                ? `/${session.user.teamId}`
-                : "/team-selection"
-            }
-            className="nav-item"
-          >
-            <div className="nav-icon">👥</div>
-            <div className="nav-label">Team</div>
-          </Link>
-          <Link href="/leaderboard" className="nav-item active">
-            <div className="nav-icon">🏆</div>
-            <div className="nav-label">Leaderboard</div>
-          </Link>
-        </div>
+        <NavBar activeLink="leaderboard" teamData={{ id: session?.user?.teamId }} />
       )}
 
       {/* Add a "back to home" button when the hunt has ended */}