From 4f1c2bb487196807663623fc87b9865cc5317635 Mon Sep 17 00:00:00 2001
From: Juliapixel <89038897+Juliapixel@users.noreply.github.com>
Date: Thu, 27 Jun 2024 07:22:24 -0300
Subject: [PATCH] use a simpler and more correct fix for weird table layout

---
 src/lib/AsyncMarkdownReq.svelte | 26 +++++++++++++-------------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/lib/AsyncMarkdownReq.svelte b/src/lib/AsyncMarkdownReq.svelte
index ffb25de..722912d 100644
--- a/src/lib/AsyncMarkdownReq.svelte
+++ b/src/lib/AsyncMarkdownReq.svelte
@@ -10,21 +10,21 @@
         return md;
     }
 
-    const tableDiver: Partial<Renderer> = {
-        tablecell(content, _flags) {
-            return `<td><div class="flex flex-row gap-1.5">${content}</div></td>`;
+    // TailwindCSS makes img elements have display: block for *some* reason so
+    // this fixes it in this very specific instance ehehe
+    const imgFixer: Partial<Renderer> = {
+        image(href, title, text) {
+            return `<img src=${href} title=${title ?? text} alt=${text} style="display: inline-block;" />`;
         }
     };
 
-    marked.use({ renderer: tableDiver });
+    marked.use({ renderer: imgFixer });
 </script>
 
-<div>
-    {#await request(url)}
-        <!-- yea -->
-    {:then resp}
-        <div transition:slide={{ duration: 250 }}>
-            {@html marked.parse(resp)}
-        </div>
-    {/await}
-</div>
+{#await request(url)}
+    <!-- yea -->
+{:then resp}
+    <div transition:slide={{ duration: 250 }}>
+        {@html marked.parse(resp)}
+    </div>
+{/await}