From 9d72e1953f511706b6c582a81b4d7146de8cf057 Mon Sep 17 00:00:00 2001
From: moris <moris@noreply.moris.day>
Date: Thu, 3 Apr 2025 15:42:51 +0900
Subject: [PATCH] =?UTF-8?q?fallback=E3=82=92background=20image=E3=81=AB?=
 =?UTF-8?q?=E3=81=97=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/routes/(DefaultStyle)/[slug]/grid.svelte | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/routes/(DefaultStyle)/[slug]/grid.svelte b/src/routes/(DefaultStyle)/[slug]/grid.svelte
index 868e6cf..47cd4a5 100644
--- a/src/routes/(DefaultStyle)/[slug]/grid.svelte
+++ b/src/routes/(DefaultStyle)/[slug]/grid.svelte
@@ -14,7 +14,7 @@
         {:else if emoji}
             <img class='emoji' src="{emoji}" alt="thumbnail"/>
         {:else}
-            <img src='data:image/svg+xml,{encodeURIComponent('<svg fill="#aaa" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg"><path d="m41 57q-0.8 0-1.4-0.6t-0.6-1.4v-14q0-0.8 0.6-1.4t1.4-0.6h14q0.8 0 1.4 0.6t0.6 1.4v14q0 0.8-0.6 1.4t-1.4 0.6zm0-2h14v-14h-14zm1-2h12l-3.8-5-3 4-2.25-3zm-1 2v-14z"/></svg>')}' alt="fallback"/>
+            <div class='fallback'></div>
         {/if}
 
         <div class="tag date">{date.toLocaleDateString('sv-SE')}</div>
@@ -61,6 +61,11 @@
     .emoji {
         height: 70%;
     }
+    .fallback {
+        width: 100%;
+        height: 100%;
+        background: no-repeat center url('data:image/svg+xml,<svg fill="silver" viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg"><path d="m57 73q-0.8 0-1.4-0.6t-0.6-1.4v-14q0-0.8 0.6-1.4t1.4-0.6h14q0.8 0 1.4 0.6t0.6 1.4v14q0 0.8-0.6 1.4t-1.4 0.6zm0-2h14v-14h-14zm1-2h12l-3.8-5-3 4-2.25-3zm-1 2v-14z"/></svg>');
+    }
 
     .tag{
         position: absolute;