From 6b43fa7ce5573753b1c21b92f7b9ca37d86dcd04 Mon Sep 17 00:00:00 2001
From: mkelvers <mikkelelvers@outlook.com>
Date: Fri, 5 Jun 2026 16:24:07 +0200
Subject: [PATCH] feat: add inline theme script to prevent FOUC

---
 templates/base.gohtml | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/templates/base.gohtml b/templates/base.gohtml
index d8a3a8a..3c538ad 100644
--- a/templates/base.gohtml
+++ b/templates/base.gohtml
@@ -11,6 +11,13 @@
   <title>MyAnimeList: {{template "title" .}}</title>
   <link rel="manifest" href="/static/assets/manifest.json">
   <link rel="icon" type="image/svg+xml" href="/static/assets/favicon.svg">
+  <script>
+    (function () {
+      var theme = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+      document.documentElement.dataset.theme = theme;
+      document.documentElement.style.colorScheme = theme;
+    })();
+  </script>
   <link rel="stylesheet" href="/dist/tailwind.css">
   <style>
     /* Prevent transition on load */
@@ -48,12 +55,6 @@
       transition-duration: 300ms;
     }
 
-    /* Theme toggle icon visibility */
-    html[data-theme="dark"] .theme-icon-dark { display: none; }
-    html[data-theme="dark"] .theme-icon-light { display: block; }
-    html[data-theme="light"] .theme-icon-light { display: none; }
-   html[data-theme="light"] .theme-icon-dark { display: block; }
-
     [data-htmx-loading="true"] {
       opacity: 0.65;
       pointer-events: none;