From bd3acd68fc0aa43f6be4c55b524319820550ba92 Mon Sep 17 00:00:00 2001
From: Mark Saroufim <marksaroufim@meta.com>
Date: Wed, 18 Feb 2026 00:15:18 -0800
Subject: [PATCH] Make benchmark shapes collapsible by default

Use a <details>/<summary> element so the benchmark shapes list
is collapsed by default, preventing long descriptions from
pushing the leaderboard tabs out of view.
---
 frontend/src/pages/leaderboard/Leaderboard.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/pages/leaderboard/Leaderboard.tsx b/frontend/src/pages/leaderboard/Leaderboard.tsx
index 86fe666..d81349d 100644
--- a/frontend/src/pages/leaderboard/Leaderboard.tsx
+++ b/frontend/src/pages/leaderboard/Leaderboard.tsx
@@ -194,10 +194,10 @@ export default function Leaderboard() {
               <CardTitle fontWeight="bold">Description</CardTitle>
               <MarkdownRenderer content={data.description} />
               {data.benchmarks && data.benchmarks.length > 0 && (
-                <Box sx={{ mt: 2 }}>
-                  <Typography variant="subtitle1" fontWeight="bold">
+                <details>
+                  <summary style={{ cursor: "pointer", fontWeight: "bold", marginTop: 16 }}>
                     Benchmark Shapes
-                  </Typography>
+                  </summary>
                   <ul>
                     {data.benchmarks.map((b, i) => (
                       <li key={i}>
@@ -205,7 +205,7 @@ export default function Leaderboard() {
                       </li>
                     ))}
                   </ul>
-                </Box>
+                </details>
               )}
             </CardContent>
           </Card>