add stacklok logo

frontend/src/App.js

@@ -105,7 +105,7 @@ function App() {
                   }}
                 >
                   <Routes>
-                    <Route path="/" element={<LeaderboardPage />} />
+                    <Route path="/" element={<LeaderboardPage mode={mode} />} />
                     <Route path="/add" element={<AddModelPage />} />
                     <Route path="/quote" element={<QuotePage />} />
                     <Route path="/vote" element={<VoteModelPage />} />

frontend/src/pages/LeaderboardPage/LeaderboardPage.js

@@ -6,8 +6,10 @@ import { useLeaderboardData } from "../../pages/LeaderboardPage/components/Leade
 import { useLeaderboard } from "../../pages/LeaderboardPage/components/Leaderboard/context/LeaderboardContext";
 import { usePageTracking } from "../../hooks/usePageTracking";
 
-function LeaderboardPage() {
+function LeaderboardPage({mode}) {
   const { data, isLoading, error } = useLeaderboardData();
+  const logoSrc =
+    mode === "dark" ? "logo-dark.svg" : "logo.svg";
   const { actions } = useLeaderboard();
   usePageTracking();
 
@@ -31,7 +33,7 @@ function LeaderboardPage() {
       <Box
         sx={{ display: "flex", justifyContent: "center", pt: 6, mb: -4, pb: 0 }}
       >
-    <span style={{"fontSize": 100}}>⛩️</span>
+        <img src={logoSrc} alt="Stacklok" style={{width: 300}} />
       </Box>
       <PageHeader
         title="LLM Security Leaderboard"