From f96d639cfd56bd5546b1d1c880a001fbe128c6d5 Mon Sep 17 00:00:00 2001 From: Shen Zhang Date: Mon, 15 Dec 2025 18:14:41 -0600 Subject: [PATCH 1/6] made columns closer --- src/pages/LeaderboardPage.css | 18 ++++++------------ 1 file changed, 6 insertions(+), 12 deletions(-) diff --git a/src/pages/LeaderboardPage.css b/src/pages/LeaderboardPage.css index bac938a..26965a8 100644 --- a/src/pages/LeaderboardPage.css +++ b/src/pages/LeaderboardPage.css @@ -22,7 +22,7 @@ } .leaderboard-full-bleed .leaderboard-container { - width:90vw; + width:85vw; margin: 0 auto; } @@ -339,8 +339,8 @@ --lb-grid: minmax(0, 0.5fr) /* Select */ minmax(0, 0.7fr) /* Rank */ - minmax(0, 2.0fr) /* Name */ - minmax(0, 1.1fr) /* Affiliation */ + minmax(0, 1.8fr) /* Name */ + minmax(0, 0.7fr) /* Affiliation */ minmax(0, 0.9fr) /* Arena */ minmax(0, 0.9fr) /* Accuracy */ minmax(0, 0.9fr) /* Cost/1k */ @@ -1407,7 +1407,7 @@ .metrics-col { display: flex; justify-content: center; - align-items: center; + align-items: left; } .metric-value { @@ -1781,13 +1781,6 @@ } -/* Preserve left alignment for name and affiliation columns */ -.leaderboard-header .name-col, -.leaderboard-header .affiliation-col, -.leaderboard-row .name-col, -.leaderboard-row .affiliation-col { - text-align: left; -} /* Fix type badge and prevent flex growth */ .type-col { @@ -1820,7 +1813,8 @@ /* put padding on cells (same for header and rows) */ .leaderboard-header > div, .leaderboard-row > div { - padding: 0.75rem 0.75rem !important; + padding: 0.75rem 0rem !important; + text-align: left; overflow: hidden; /* text-overflow: ellipsis; */ white-space: nowrap; From 33f9a7c399683af6a302dc0d2b1b120be7f26708 Mon Sep 17 00:00:00 2001 From: Shen Zhang Date: Tue, 16 Dec 2025 14:58:04 -0600 Subject: [PATCH 2/6] inlined leaderboard --- src/pages/LeaderboardPage.css | 33 +-------------------------------- src/pages/LeaderboardPage.tsx | 2 -- 2 files changed, 1 insertion(+), 34 deletions(-) diff --git a/src/pages/LeaderboardPage.css b/src/pages/LeaderboardPage.css index 26965a8..b673233 100644 --- a/src/pages/LeaderboardPage.css +++ b/src/pages/LeaderboardPage.css @@ -11,21 +11,6 @@ } -.leaderboard-full-bleed { - width: 100vw; - position: relative; - left: 50%; - right: 50%; - margin-left: -50vw; - padding: 0 1rem; - margin-bottom: 2rem; -} - -.leaderboard-full-bleed .leaderboard-container { - width:85vw; - margin: 0 auto; -} - .page-header { text-align: center; margin-bottom: 2rem; @@ -367,14 +352,6 @@ align-items: center; } -.leaderboard-header > div, -.leaderboard-row > div { - padding: 0.75rem 0.75rem; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - .leaderboard-body { @@ -1772,14 +1749,6 @@ align-items: center; } -/* Prevent content like "closed-source" or long affiliations from stretching columns */ -.leaderboard-header > div, -.leaderboard-row > div { - overflow: hidden; - /* text-overflow: ellipsis; */ - white-space: nowrap; - -} /* Fix type badge and prevent flex growth */ @@ -1815,7 +1784,7 @@ .leaderboard-row > div { padding: 0.75rem 0rem !important; text-align: left; - overflow: hidden; + overflow: visible; /* text-overflow: ellipsis; */ white-space: nowrap; } diff --git a/src/pages/LeaderboardPage.tsx b/src/pages/LeaderboardPage.tsx index e1652a5..932e06f 100644 --- a/src/pages/LeaderboardPage.tsx +++ b/src/pages/LeaderboardPage.tsx @@ -378,7 +378,6 @@ const LeaderboardPage: React.FC = () => { {/* Leaderboard Table */} -
@@ -617,7 +616,6 @@ const LeaderboardPage: React.FC = () => {
-
{modelCardRouter && (
setModelCardRouter(null)}>
event.stopPropagation()}> From c16923039b82deb26e5e0f397cd6175ce39b5169 Mon Sep 17 00:00:00 2001 From: Shen Zhang Date: Tue, 16 Dec 2025 15:07:11 -0600 Subject: [PATCH 3/6] removed blue horizontal line --- src/pages/LeaderboardPage.css | 14 -------------- 1 file changed, 14 deletions(-) diff --git a/src/pages/LeaderboardPage.css b/src/pages/LeaderboardPage.css index b673233..438812a 100644 --- a/src/pages/LeaderboardPage.css +++ b/src/pages/LeaderboardPage.css @@ -1310,20 +1310,6 @@ cursor: pointer; } -.router-name-link .router-name::after { - content: ''; - position: absolute; - left: 0; - bottom: -0.15rem; - width: 100%; - height: 2px; - background: #2563eb; - opacity: 0; - transform: scaleX(0.85); - transform-origin: left; - transition: opacity 0.2s ease, transform 0.2s ease; -} - .router-name-link:hover .router-name { color: #1d4ed8; } From 663d76afa478ecf5b27bbda540a08375d26daeae Mon Sep 17 00:00:00 2001 From: Shen Zhang Date: Tue, 16 Dec 2025 16:17:13 -0600 Subject: [PATCH 4/6] Fixed scroll bar issue --- src/components/CompareModal.tsx | 2 +- src/pages/LeaderboardPage.css | 12 ++++++++---- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/src/components/CompareModal.tsx b/src/components/CompareModal.tsx index e2d7ff7..0bffddf 100644 --- a/src/components/CompareModal.tsx +++ b/src/components/CompareModal.tsx @@ -103,7 +103,7 @@ const CompareModal: React.FC = ({ .slice(0, 6); }, [searchTerm, routerIds]); - const spiderChartHeight = isCompactLayout ? 420 : 520; + const spiderChartHeight = isCompactLayout ? 360 : 460; const spiderOuterRadius = isCompactLayout ? '65%' : '80%'; const spiderChartMargin = isCompactLayout ? { top: 32, right: 32, bottom: 32, left: 32 } diff --git a/src/pages/LeaderboardPage.css b/src/pages/LeaderboardPage.css index 438812a..3d57ad4 100644 --- a/src/pages/LeaderboardPage.css +++ b/src/pages/LeaderboardPage.css @@ -635,14 +635,17 @@ border-radius: 24px; padding: 1.5rem; width: min(1200px, 100%); - height: 82vh; /* 👈 FIXED height */ - overflow: scroll; /* 👈 prevent modal scrolling */ + height: 82vh; + overflow: hidden; display: flex; flex-direction: column; } .compare-modal-body { + flex: 1; min-height: 0; + overflow-y: auto; + overflow-x: hidden; } .compare-modal-header { display: flex; @@ -681,6 +684,7 @@ min-height: 100vh; border-radius: 0; padding: 1rem; + overflow-y: auto; } .compare-modal-body { @@ -842,10 +846,10 @@ - +/* .compare-modal-chart.primary { min-height: 480px; -} +} */ @media (max-width: 768px) { .compare-modal-chart.primary { From a26dc06c7fa4d605cc4fcc236c876f08558df363 Mon Sep 17 00:00:00 2001 From: Shen Zhang Date: Tue, 16 Dec 2025 16:21:49 -0600 Subject: [PATCH 5/6] fixed axis label styling for cost --- src/components/CompareModal.tsx | 13 ++++++++++++- src/components/DifficultyBarPanel.tsx | 5 +++-- 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/src/components/CompareModal.tsx b/src/components/CompareModal.tsx index 0bffddf..1b269ac 100644 --- a/src/components/CompareModal.tsx +++ b/src/components/CompareModal.tsx @@ -260,6 +260,17 @@ useEffect(() => { const spiderChartDomain: [number, number] = activeMetric === 'cost' ? spiderValueDomain : [0, 100]; + const formatSpiderTick = useCallback( + (value: number) => { + if (activeMetric === 'cost') { + if (!Number.isFinite(value)) return '$0.000000'; + return `$${value.toFixed(6)}`; + } + return value.toFixed(0); + }, + [activeMetric] + ); + useEffect(() => { if (activeBarAxis && !currentAxes.includes(activeBarAxis)) { setActiveBarAxis(''); @@ -730,7 +741,7 @@ useEffect(() => { )} /> - + {routerIds.map((id, index) => ( = ({ position="right" formatter={(value: number) => { if (metricKey === 'cost') { - return value.toFixed(5); + const safeValue = Number.isFinite(value) ? value : 0; + return `$${safeValue.toFixed(5)}`; } - return value.toFixed(1); + return Number.isFinite(value) ? value.toFixed(1) : '0.0'; }} fill="#0f172a" fontSize={12} From 33c89635d374f61d7ceac51041a3c4ccad97c596 Mon Sep 17 00:00:00 2001 From: Shen Zhang Date: Tue, 16 Dec 2025 16:26:44 -0600 Subject: [PATCH 6/6] get rid of trailing zeros --- src/components/CompareModal.tsx | 5 +++-- src/components/DifficultyBarPanel.tsx | 3 ++- 2 files changed, 5 insertions(+), 3 deletions(-) diff --git a/src/components/CompareModal.tsx b/src/components/CompareModal.tsx index 1b269ac..f2d5eee 100644 --- a/src/components/CompareModal.tsx +++ b/src/components/CompareModal.tsx @@ -263,8 +263,9 @@ useEffect(() => { const formatSpiderTick = useCallback( (value: number) => { if (activeMetric === 'cost') { - if (!Number.isFinite(value)) return '$0.000000'; - return `$${value.toFixed(6)}`; + if (!Number.isFinite(value)) return '$0'; + const precise = value.toFixed(6).replace(/0+$/, '').replace(/\.$/, '.0'); + return `$${precise}`; } return value.toFixed(0); }, diff --git a/src/components/DifficultyBarPanel.tsx b/src/components/DifficultyBarPanel.tsx index bfd8be2..a7e655e 100644 --- a/src/components/DifficultyBarPanel.tsx +++ b/src/components/DifficultyBarPanel.tsx @@ -96,7 +96,8 @@ const DifficultyBarPanel: React.FC = ({ formatter={(value: number) => { if (metricKey === 'cost') { const safeValue = Number.isFinite(value) ? value : 0; - return `$${safeValue.toFixed(5)}`; + const precise = safeValue.toFixed(5).replace(/0+$/, '').replace(/\.$/, '.0'); + return `$${precise}`; } return Number.isFinite(value) ? value.toFixed(1) : '0.0'; }}