From 5fcd547c3d870e1fdf577ccaf8b21fabc6ffeb0d Mon Sep 17 00:00:00 2001
From: tree <tree@tree.fail>
Date: Fri, 26 Jan 2024 02:29:26 +0100
Subject: [PATCH] fix leaderboard

---
 src/layouts/base.astro      |  2 +-
 src/pages/leaderboard.astro | 50 ++++++++++++++++++++++++++++++++-----
 2 files changed, 45 insertions(+), 7 deletions(-)

diff --git a/src/layouts/base.astro b/src/layouts/base.astro
index 4600cac..c7ff2bc 100644
--- a/src/layouts/base.astro
+++ b/src/layouts/base.astro
@@ -88,7 +88,7 @@ import cfonts from 'cfonts';
 				<div class="middle-pane-medium mt-8 sm:mt-14 mb-2 sm:mb-8">
 					<div class="leading-none flex justify-center text-[4px] sm:text-[8px] text-white">
 						{/*<img src="/page-events.png" class="h-8 sm:h-14" title="Events" />*/}
-						<pre><code>{cfonts.render(title + ' ', { font: '', maxLength: 1000 }).string}</code></pre>
+						<pre><code>{cfonts.render(title + ' ', { font: '', maxLength: 1500 }).string}</code></pre>
 					</div>
 				</div>
 			}
diff --git a/src/pages/leaderboard.astro b/src/pages/leaderboard.astro
index 4b88d52..bc9d30b 100644
--- a/src/pages/leaderboard.astro
+++ b/src/pages/leaderboard.astro
@@ -3,23 +3,61 @@
 import BaseLayout from '../layouts/base.astro';
 import contributors from '../contributors.json';
 
+const points = {}
+let i = 0;
+for (const c of contributors) {
+    const key = `c:${c.contributions}`
+    if (!points[key]) {
+        points[key] = { arr: [c.login], start: i }
+    } else {
+        points[key].arr.push(c.login)
+    }
+    i++
+}
+
+function getPoint (num){
+    const key = `c:${num}`
+    const obj = points[key];
+    return `${obj.start+1}${obj.arr.length > 1 ? '-'+(obj.start+1+obj.arr.length) : ''}`;
+}
+
 ---
 
 <BaseLayout title="Leaderboard">
 
-	<div class="middle-pane-medium mt-10">
-        <table class="w3pn-leaderboard-table w-1/2">
+	<div class="middle-pane-medium mt-10 flex items-center justify-center">
+        <!--code><pre>
+            {JSON.stringify(points, null, 2)}
+        </pre></code-->
+        <table class="w3pn-leaderboard-table w-full sm:w-5/6 md:w-2/3 lg:w-1/2">
             <thead>
                 <tr>
+                    <th></th>
                     <th class="pb-4 uppercase" colspan="2">Contributor</th>
-                    <th align="left" class="pb-4 uppercase"># Contribs</th>
+                    <th align="left" class="pb-4 uppercase"># Contributions</th>
                 </tr>
             </thead>
             <tbody>
-                {contributors.map((contrib) => (
+                {contributors.map((contrib, i) => (
                     <tr>
-                        <td align="right" class="py-2 px-4"><div class="w-16 h-16"><img src={contrib.avatar_url} class="rounded-full" /></div></td>
-                        <td class="px-2"><a href={contrib.html_url} target="_blank" class="hover:underline">{contrib.login}</a></td>
+                        <td align="right">
+                            {[getPoint(contrib.contributions)].map((r) => (
+                                <div>
+                                    {r < 3 && 
+                                        <span class="mr-4">
+                                            {r === "1" && "🥇"}
+                                            {r === "2" && "🥈"}
+                                            {r === "3" && "🥉"}
+                                        </span>
+                                    }
+                                    <b>{r}.</b>
+                                </div>
+                            ))}
+                        </td>
+                        <td align="right" class="py-3 px-4"><div class="w-16 h-16"><img src={contrib.avatar_url} class="rounded-full border" /></div></td>
+                        <td class="px-2">
+                            <a href={contrib.html_url} target="_blank" class="hover:underline">{contrib.login}</a>
+                        </td>
                         <td class="text-white pl-10 text-lg pr-4" align="left">{contrib.contributions}</td>
                     </tr>
                 ))}