Просмотр исходного кода

fix(stats): reorder leaderboard cards

Adam 2 месяцев назад
Родитель
Сommit
4ddfa7c6fa
2 измененных файлов с 9 добавлено и 23 удалено
  1. 0 6
      packages/stats/app/src/routes/index.css
  2. 9 17
      packages/stats/app/src/routes/index.tsx

+ 0 - 6
packages/stats/app/src/routes/index.css

@@ -1719,7 +1719,6 @@
 [data-page="stats"] [data-component="leaderboard"],
 [data-page="stats"] [data-slot="leaderboard-featured"],
 [data-page="stats"] [data-slot="leaderboard-compact"],
-[data-page="stats"] [data-slot="leaderboard-column"],
 [data-page="stats"] [data-slot="leaderboard-mobile"] {
   display: grid;
 }
@@ -1752,11 +1751,6 @@
   -webkit-mask-size: 6px 6px;
 }
 
-[data-page="stats"] [data-slot="leaderboard-column"] {
-  gap: 8px;
-  align-content: start;
-}
-
 [data-page="stats"] [data-slot="leaderboard-mobile"] {
   display: none;
 }

+ 9 - 17
packages/stats/app/src/routes/index.tsx

@@ -868,9 +868,7 @@ function Leaderboard(props: {
   onActiveModelChange: (model: string | undefined) => void
 }) {
   const featured = createMemo(() => props.data.slice(0, 3))
-  const columns = createMemo(() =>
-    [0, 1, 2].map((index) => props.data.slice(3 + index * 5, 8 + index * 5)).filter((column) => column.length > 0),
-  )
+  const compact = createMemo(() => props.data.slice(3))
 
   return (
     <div id="leaderboard" data-component="leaderboard" role="list" aria-label="Model token leaderboard">
@@ -888,20 +886,14 @@ function Leaderboard(props: {
       </div>
       <div data-slot="leaderboard-pattern" aria-hidden="true" />
       <div data-slot="leaderboard-compact">
-        <For each={columns()}>
-          {(column) => (
-            <div data-slot="leaderboard-column">
-              <For each={column}>
-                {(entry) => (
-                  <LeaderboardCard
-                    entry={entry}
-                    size="compact"
-                    active={props.activeModel === entry.model}
-                    onActiveModelChange={props.onActiveModelChange}
-                  />
-                )}
-              </For>
-            </div>
+        <For each={compact()}>
+          {(entry) => (
+            <LeaderboardCard
+              entry={entry}
+              size="compact"
+              active={props.activeModel === entry.model}
+              onActiveModelChange={props.onActiveModelChange}
+            />
           )}
         </For>
       </div>