Add landing page for HELM Safety (#3006)

helm-frontend/src/components/Landing/SafetyLanding.tsx

@@ -0,0 +1,40 @@
+import MiniLeaderboard from "@/components/MiniLeaderboard";
+
+export default function SafetyLanding() {
+  return (
+    <div className="container mx-auto px-16">
+      <h1 className="text-3xl mt-16 my-8 font-bold text-center">HELM Safety</h1>
+
+      <div className="flex flex-col lg:flex-row items-center gap-8">
+        <div className="flex-1 text-xl">
+          <p>
+            Language models demonstrate powerful capabilities and pose
+            significant risks. Given their widespread deployment, standardized
+            public benchmarking of such models is vital. While language models
+            are routinely evaluated on standard capability benchmarks,
+            comparable standardization for benchmarking safety risks lags
+            behind. To address this gap, we introduce HELM-Safety as a
+            collection of 5 safety benchmarks that span 6 risk categories (e.g.
+            violence, fraud, discrimination, sexual, harassment, deception). We
+            present evaluation results for recent leading open weights and
+            closed models.
+          </p>
+          <div className="flex flex-row justify-center mt-4">
+            {/* <a
+              className="px-10 btn rounded-md mx-4"
+              href="https://crfm.stanford.edu/2024/05/01/helm-mmlu.html"
+            >
+              Blog Post
+            </a> */}
+            <a className="px-10 btn rounded-md mx-4" href="#/leaderboard">
+              Full Leaderboard
+            </a>
+          </div>
+        </div>
+        <div className="flex-1">
+          <MiniLeaderboard />
+        </div>
+      </div>
+    </div>
+  );
+}

helm-frontend/src/routes/Home.tsx

@@ -13,6 +13,7 @@ import HomeLanding from "@/components/Landing/HomeLanding";
 import Image2StructLanding from "@/components/Landing/Image2StructLanding";
 import EWoKLanding from "@/components/Landing/EWoKLanding";
 import MedicalLanding from "@/components/Landing/MedicalLanding";
+import SafetyLanding from "@/components/Landing/SafetyLanding";
 
 export default function Home() {
   // TODO consider a more streamlined way to do this?
@@ -44,6 +45,8 @@ export default function Home() {
     return <EWoKLanding />;
   } else if (window.PROJECT_ID === "medical") {
     return <MedicalLanding />;
+  } else if (window.PROJECT_ID === "safety") {
+    return <SafetyLanding />;
   } else if (window.PROJECT_ID === "home") {
     return <HomeLanding />;
   } else {