From 82635a94e374bdd52cf5a1edfb0d572cd477e84a Mon Sep 17 00:00:00 2001
From: Lurkars <lurkars@we.bstly.de>
Date: Sat, 20 Sep 2025 19:51:25 +0200
Subject: [PATCH] add darkmode to imprint

---
 pom.xml                                   |  2 +-
 src/main/resources/templates/imprint.html | 28 ++++++++++++++++++++++-
 2 files changed, 28 insertions(+), 2 deletions(-)
diff --git a/pom.xml b/pom.xml
index 7b0090f..8f234b9 100644
--- a/pom.xml
+++ b/pom.xml
@@ -4,7 +4,7 @@
   <modelVersion>4.0.0</modelVersion>
   <groupId>de.champonthis</groupId>
   <artifactId>abi</artifactId>
-  <version>0.2.1</version>
+  <version>0.2.2</version>
   <name>abi</name>
 
   <parent>
diff --git a/src/main/resources/templates/imprint.html b/src/main/resources/templates/imprint.html
index f2a1439..dc6a48b 100644
--- a/src/main/resources/templates/imprint.html
+++ b/src/main/resources/templates/imprint.html
@@ -5,11 +5,12 @@
     <title>20 Jahre Abitur 2007</title>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <script defer src="/lib/alpinejs.min.js"></script>
     <link rel="stylesheet" href="/lib/bootstrap.min.css">
     <link rel="stylesheet" href="/css/style.css" />
 </head>
 
-<body>
+<body x-data="imprintApp()" :data-bs-theme="darkMode ? 'dark' : 'light'">
     <div class="container mt-5">
         <div class="card shadow">
             <div class="card-body">
@@ -91,6 +92,31 @@
             </div>
         </div>
     </div>
+
+    <script>
+        function imprintApp() {
+            return {
+                darkMode: false,
+                
+                init() {
+                    // Check for saved preference or default to system preference
+                    const savedTheme = localStorage.getItem('darkMode');
+                    if (savedTheme !== null) {
+                        this.darkMode = savedTheme === 'true';
+                    } else {
+                        this.darkMode = window.matchMedia('(prefers-color-scheme: dark)').matches;
+                    }
+                    
+                    // Listen for system theme changes
+                    window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
+                        if (localStorage.getItem('darkMode') === null) {
+                            this.darkMode = e.matches;
+                        }
+                    });
+                }
+            }
+        }
+    </script>
 </body>
 
 </html>
\ No newline at end of file
