♻️ refactor moonboard-log page

Signed-off-by: SindreKjelsrud <sindre@kjelsrud.dev>

src/data/moonboard.json

@@ -1,46 +0,0 @@
-{
-  "2016": [
-    {
-      "route":"Klingon Easy",
-      "grade":"6B+",
-      "benchmark":true,
-      "tries":2,
-      "image":"/img/moonboard_2016/klingoneasy.webp",
-      "date": 
-        {
-          "year": "2024",
-          "month": "03",
-          "day": "02",
-          "string": "02.03.2024"
-        }
-    },
-    {
-      "route":"An easy problem",
-      "grade":"6B+",
-      "benchmark":true,
-      "tries":1,
-      "image":"/img/moonboard_2016/aneasyproblem.webp",
-      "date": 
-        {
-          "year": "2024",
-          "month": "02",
-          "day": "09",
-          "string": "09.02.2024"
-        }
-    },
-    {
-      "route":"BokChoiBoi",
-      "grade":"6B+",
-      "benchmark":false,
-      "tries":5,
-      "image":"/img/moonboard_2016/bokchoiboi.webp",
-      "date": 
-        {
-          "year": "2024",
-          "month": "02",
-          "day": "07",
-          "string": "07.02.2024"
-        }
-    }
-  ] 
-}

src/pages/logs/moonboard.astro

@@ -1,32 +0,0 @@
----
-import SectionContainer from '../../components/SectionContainer.astro';
-import mb from '../../data/moonboard.json';
-const mb2016Setups = mb["2016"];
----
-
-<SectionContainer>
-  <main class="flex flex-col flex-1 gap-4 mt-4">
-     <h1 class="text-3xl font-extrabold">[ MoonBoard 2016 ]</h1>
-
-     <div class="grid grid-cols-2 md:grid-cols-3 gap-2">
-            {mb2016Setups.map((mb) => (
-                <div class="flex flex-col items-center">
-                    <img
-                        src={mb.image}
-                        class="bg-yellow-500 rounded-xl"
-                    />
-                    <p class="font-bold text-xs">{mb.route} ({mb.grade}):</p>
-                     
-                    <div class="flex flex-col md:flex-row md:gap-1 text-xs items-center">
-                      <span>
-                        {mb.tries == 1 ? "Flash" : `${mb.tries} tries`} | {mb.benchmark ? "Benchmarked" : "Not benchmarked"}
-                      </span>
-                      <span class="hidden md:inline"> | </span>
-                      <span class="block md:inline">{mb.date.string}</span>
-                    </div>
-                </div>
-            ))}
-     </div>
-  </main>
-</SectionContainer>
-

src/pages/logs/moonboard.md

@@ -0,0 +1,13 @@
+---
+title: 'MoonBoard'
+description: ''
+layout: "../../layouts/Layout.astro"
+---
+
+## 2016
+
+| 📌 **Route**          | ⭐ **Grade** | ✔️ **Status**       | ⏳ **Attempts** | 📅 **Date**   |
+|-----------------------|-------------|---------------------|----------------|--------------|
+| *Klingon Easy*    | 6b+         | Benchmarked         | 2 tries        | 02.03.2024   |
+| *An easy problem* | 6b+         | Benchmarked         | Flash          | 09.02.2024   |
+| *BokChoiBoi*      | 6b+         | Not benchmarked     | 5 tries        | 07.02.2024   |

src/styles/global.css

@@ -104,6 +104,7 @@ h2, h3, h4 {
 }
 
 .blog table {
+    width: 100%;
     border-collapse: collapse;
     margin: 10px 0px;
 }
@@ -112,6 +113,10 @@ h2, h3, h4 {
     border: 1px solid;
 }
 
+.blog th {
+    padding: 5px 5px;
+}
+
 .blog a { color: var(--light-link); font-weight: bolder; }
 
 .dark .blog a { color: var(--dark-link); }