web/layout: preload meowbalt assets

no more flickering i hope is this rational? maybe not so much, but it makes cobalt feel like a native app
imputnet · Mar 11, 2025 · e6e2fea · e6e2fea
1 parent 429591c
commit e6e2fea
Showing 1 changed file with 14 additions and 0 deletions.
diff --git a/web/src/routes/+layout.svelte b/web/src/routes/+layout.svelte
@@ -75,6 +75,7 @@
     data-theme={browser ? $currentTheme : undefined}
     lang={$locale}
 >
+    <div id="preload-meowbalt" aria-hidden="true"></div>
     <div
         id="cobalt"
         class:loaded={browser}
@@ -644,4 +645,17 @@
             transform: rotate(360deg);
         }
     }
+
+    /* preload meowbalt assets to prevent flickering in dialogs */
+    #preload-meowbalt {
+        width: 0;
+        height: 0;
+        position: absolute;
+        z-index: -10;
+        content:
+            url(/meowbalt/smile.png)
+            url(/meowbalt/error.png)
+            url(/meowbalt/question.png)
+            url(/meowbalt/think.png);
+    }
 </style>