Skip to content

Commit 029823f

Browse files
S1M0N38S1M0N38
committed
feat: improve headers legend
1 parent d83ac7b commit 029823f

1 file changed

Lines changed: 90 additions & 35 deletions

File tree

‎index.html‎

Lines changed: 90 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -155,48 +155,103 @@ <h1 class="text-2xl sm:text-4xl font-bold text-white mb-4">
155155

156156

157157
<!-- Leaderboard Columns Explained -->
158-
<div class="bg-gray-800 rounded-lg p-4 sm:p-6 lg:p-8 border border-gray-700">
159-
<h2 class="text-xl sm:text-2xl font-bold mb-4">Leaderboard Columns Explained</h2>
160-
<div class="grid sm:grid-cols-1 lg:grid-cols-2 gap-4 sm:gap-6 text-gray-300">
161-
<div class="space-y-4">
162-
<div>
163-
<h3 class="font-semibold text-white mb-2 text-base sm:text-lg">Ranking & Model Info</h3>
164-
<div class="space-y-2 text-sm sm:text-base">
165-
<div><strong class="text-blue-400">Rank:</strong> Sorted by average rounds reached (highest first)</div>
166-
<div><strong class="text-blue-400">Model:</strong> OpenRouter model names with creator-suggested
167-
parameters for open-source models, defaults for closed-source</div>
168-
<div><strong class="text-blue-400">Provider:</strong> Model developer/organization</div>
158+
<div class="bg-gray-800 rounded-lg p-4 sm:p-6 lg:p-8 border border-gray-700 shadow-lg">
159+
<div class="grid grid-cols-1 gap-6 sm:gap-8">
160+
<div class="space-y-6">
161+
<!-- Ranking & Model Info -->
162+
<div class="bg-gray-700/50 rounded-lg p-4 border border-gray-600">
163+
<div class="flex items-center gap-2 mb-3">
164+
<i class="fas fa-trophy text-yellow-400"></i>
165+
<h3 class="font-semibold text-white text-base sm:text-lg">Ranking & Model Info</h3>
166+
</div>
167+
<div class="space-y-3 text-sm sm:text-base">
168+
<div class="flex items-start gap-2">
169+
<i class="fas fa-medal text-yellow-500 mt-1 text-xs"></i>
170+
<div><strong class="text-blue-400">Rank:</strong> <span class="text-gray-300">Sorted by average rounds
171+
reached (highest first)</span></div>
172+
</div>
173+
<div class="flex items-start gap-2">
174+
<i class="fas fa-robot text-blue-500 mt-1 text-xs"></i>
175+
<div><strong class="text-blue-400">Model:</strong> <span class="text-gray-300">OpenRouter model names
176+
with creator-suggested parameters for open-source models, defaults for closed-source</span></div>
177+
</div>
178+
<div class="flex items-start gap-2">
179+
<i class="fas fa-building text-purple-500 mt-1 text-xs"></i>
180+
<div><strong class="text-blue-400">Provider:</strong> <span class="text-gray-300">Model
181+
developer/organization</span></div>
182+
</div>
169183
</div>
170184
</div>
171-
<div>
172-
<h3 class="font-semibold text-white mb-2 text-base sm:text-lg">Performance Metrics</h3>
173-
<div class="space-y-2 text-sm sm:text-base">
174-
<div><strong class="text-blue-400">Rounds:</strong> Average rounds reached across multiple games</div>
175-
<div><strong class="text-blue-400">Completed:</strong> Success rate for round completion (rounds stopped
176-
at 3 consecutive errors/failed calls)</div>
185+
186+
<!-- Performance Metrics -->
187+
<div class="bg-gray-700/50 rounded-lg p-4 border border-gray-600">
188+
<div class="flex items-center gap-2 mb-3">
189+
<i class="fas fa-chart-line text-green-400"></i>
190+
<h3 class="font-semibold text-white text-base sm:text-lg">Performance Metrics</h3>
191+
</div>
192+
<div class="space-y-3 text-sm sm:text-base">
193+
<div class="flex items-start gap-2">
194+
<i class="fas fa-dice text-orange-500 mt-1 text-xs"></i>
195+
<div><strong class="text-blue-400">Rounds:</strong> <span class="text-gray-300">Average rounds reached
196+
across multiple games</span></div>
197+
</div>
198+
<div class="flex items-start gap-2">
199+
<i class="fas fa-check-circle text-green-500 mt-1 text-xs"></i>
200+
<div><strong class="text-blue-400">Completed:</strong> <span class="text-gray-300">Success rate for
201+
round completion (rounds stopped at 3 consecutive errors/failed calls)</span></div>
202+
</div>
177203
</div>
178204
</div>
179205
</div>
180-
<div class="space-y-4">
181-
<div>
182-
<h3 class="font-semibold text-white mb-2 text-base sm:text-lg">Call Quality Breakdown</h3>
183-
<div class="space-y-2 text-sm sm:text-base">
184-
<div><strong class="text-green-400">Success:</strong> Valid tool calls that execute successfully in game
185-
state</div>
186-
<div><strong class="text-red-400">Error:</strong> Invalid responses (no tool call, JSON errors, plain text
187-
responses)</div>
188-
<div><strong class="text-yellow-400">Failed:</strong> Valid tool calls that can't execute (e.g.,
189-
discarding 6 cards when limit is 5)</div>
206+
207+
<div class="space-y-6">
208+
<!-- Call Quality Breakdown -->
209+
<div class="bg-gray-700/50 rounded-lg p-4 border border-gray-600">
210+
<div class="flex items-center gap-2 mb-3">
211+
<i class="fas fa-traffic-light text-yellow-400"></i>
212+
<h3 class="font-semibold text-white text-base sm:text-lg">Call Quality Breakdown</h3>
213+
</div>
214+
<div class="space-y-3 text-sm sm:text-base">
215+
<div class="flex items-start gap-2">
216+
<div class="w-3 h-3 bg-green-400 rounded-full mt-2 flex-shrink-0"></div>
217+
<div><strong class="text-green-400">Success:</strong> <span class="text-gray-300">Valid tool calls that
218+
execute successfully in game state</span></div>
219+
</div>
220+
<div class="flex items-start gap-2">
221+
<div class="w-3 h-3 bg-red-400 rounded-full mt-2 flex-shrink-0"></div>
222+
<div><strong class="text-red-400">Error:</strong> <span class="text-gray-300">Invalid responses (no tool
223+
call, JSON errors, plain text responses)</span></div>
224+
</div>
225+
<div class="flex items-start gap-2">
226+
<div class="w-3 h-3 bg-yellow-400 rounded-full mt-2 flex-shrink-0"></div>
227+
<div><strong class="text-yellow-400">Failed:</strong> <span class="text-gray-300">Valid tool calls that
228+
can't execute (e.g., discarding 6 cards when limit is 5)</span></div>
229+
</div>
190230
</div>
191231
</div>
192-
<div>
193-
<h3 class="font-semibold text-white mb-2 text-base sm:text-lg">Efficiency Metrics</h3>
194-
<div class="space-y-2 text-sm sm:text-base">
195-
<div><strong class="text-blue-400">Input/Output Tokens:</strong> Token counts per tool call (including
196-
reasoning and tool call tokens)</div>
197-
<div><strong class="text-blue-400">Time per Call:</strong> Average LLM response generation time</div>
198-
<div><strong class="text-blue-400">Cost per 1K Calls:</strong> Pricing based on cheapest OpenRouter option
199-
(scaled to 1K for visual comparison)</div>
232+
233+
<!-- Efficiency Metrics -->
234+
<div class="bg-gray-700/50 rounded-lg p-4 border border-gray-600">
235+
<div class="flex items-center gap-2 mb-3">
236+
<i class="fas fa-tachometer-alt text-cyan-400"></i>
237+
<h3 class="font-semibold text-white text-base sm:text-lg">Efficiency Metrics</h3>
238+
</div>
239+
<div class="space-y-3 text-sm sm:text-base">
240+
<div class="flex items-start gap-2">
241+
<i class="fas fa-coins text-amber-500 mt-1 text-xs"></i>
242+
<div><strong class="text-blue-400">Input/Output Tokens:</strong> <span class="text-gray-300">Token
243+
counts per tool call (including reasoning and tool call tokens)</span></div>
244+
</div>
245+
<div class="flex items-start gap-2">
246+
<i class="fas fa-clock text-indigo-500 mt-1 text-xs"></i>
247+
<div><strong class="text-blue-400">Time per Call:</strong> <span class="text-gray-300">Average LLM
248+
response generation time</span></div>
249+
</div>
250+
<div class="flex items-start gap-2">
251+
<i class="fas fa-dollar-sign text-green-500 mt-1 text-xs"></i>
252+
<div><strong class="text-blue-400">Cost per 1K Calls:</strong> <span class="text-gray-300">Pricing based
253+
on cheapest OpenRouter option (scaled to 1K for visual comparison)</span></div>
254+
</div>
200255
</div>
201256
</div>
202257
</div>

0 commit comments

Comments
 (0)
⚡