endlich funktionierender Darkmodus

src/main.rs

@@ -117,7 +117,10 @@ async fn settings_page(data: web::Data<AppState>) -> Result<HttpResponse> {
             eprintln!("Template error: {}", e);
             actix_web::error::ErrorInternalServerError("Template error")
         })?;
-    Ok(HttpResponse::Ok().content_type("text/html").body(html))
+    Ok(HttpResponse::Ok()
+        .content_type("text/html")
+        .insert_header(("Cache-Control", "no-store, must-revalidate"))
+        .body(html))
 }
 
 
@@ -194,15 +197,26 @@ async fn save_settings(
     // Value-Maps neu initialisieren
     let mut value_maps = data.value_maps.lock().unwrap();
     *value_maps = ModbusValueMaps::from_config(&new_config);
-    *config = new_config;
     let conf_path = "paramod.yaml";
-    let yaml_str = match serde_yaml::to_string(&*config) {
+    let yaml_str = match serde_yaml::to_string(&new_config) {
         Ok(s) => s,
         Err(e) => return Ok(HttpResponse::InternalServerError().body(format!("Serialisierungsfehler: {}", e))),
     };
     if let Err(e) = fs::write(conf_path, yaml_str) {
         return Ok(HttpResponse::InternalServerError().body(format!("Fehler beim Schreiben: {}", e)));
     }
+    // Reload config from file
+    let conf_str = match std::fs::read_to_string(conf_path) {
+        Ok(s) => s,
+        Err(e) => return Ok(HttpResponse::InternalServerError().body(format!("Fehler beim Lesen: {}", e))),
+    };
+    let mut updated_config: AppConfig = match serde_yaml::from_str(&conf_str) {
+        Ok(cfg) => cfg,
+        Err(e) => return Ok(HttpResponse::InternalServerError().body(format!("Deserialisierungsfehler: {}", e))),
+    };
+    // darkmode-Konvertierung: String zu bool
+    // (YAML kann bool als string interpretieren)
+    *config = updated_config;
     Ok(HttpResponse::Ok().body("success"))
 }
 

static/settings.js

@@ -8,11 +8,20 @@ document.addEventListener('DOMContentLoaded', function() {
                 if (el) {
                     if (config && config.default && (config.default.darkmode === true || config.default.darkmode === 'true')) {
                         el.checked = true;
+                        document.body.classList.add('darkmode');
                     } else {
                         el.checked = false;
+                        document.body.classList.remove('darkmode');
                     }
+                    // Event Listener für Umschalten
+                    el.addEventListener('change', function() {
+                        if (el.checked) {
+                            document.body.classList.add('darkmode');
+                        } else {
+                            document.body.classList.remove('darkmode');
+                        }
+                    });
                 } else {
-                    // Falls das Element noch nicht existiert, erneut versuchen
                     setTimeout(setSwitch, 50);
                 }
             }
@@ -78,14 +87,16 @@ async function saveSettings() {
         if (response.ok) {
             messageDiv.className = 'message success';
             messageDiv.textContent = '✓ Einstellungen erfolgreich gespeichert!';
+            setTimeout(() => {
+                window.location.reload();
+            }, 1000);
         } else {
             messageDiv.className = 'message error';
             messageDiv.textContent = '✗ Fehler beim Speichern der Einstellungen!';
-        }
-
             setTimeout(() => {
                 messageDiv.style.display = 'none';
             }, 3000);
+        }
     } catch (error) {
         const messageDiv = document.getElementById('message');
         messageDiv.className = 'message error';

static/style.css

@@ -32,7 +32,7 @@
     --error-border: #f5c6cb;
 }
 
-body.darkmode, body.darkmode :root {
+body.darkmode {
     --background: #181a1b;
     --background-alt: #23272b;
     --container-bg: #23272b;
@@ -60,35 +60,6 @@ body.darkmode, body.darkmode :root {
     --error-border: #b71c1c;
 }
 
-@media (prefers-color-scheme: dark) {
-    :root {
-        --background: #181a1b;
-        --background-alt: #23272b;
-        --container-bg: #23272b;
-        --header-bg: #23272b;
-        --primary: #3399ff;
-        --primary-dark: #1a2a3a;
-        --text: #eee;
-        --text-light: #bbb;
-        --nav-link: #bbb;
-        --nav-link-hover: #222;
-        --table-header: #222e3a;
-        --table-header-border: #3399ff;
-        --table-row-hover: #23272b;
-        --input-border: #444;
-        --input-focus: #3399ff;
-        --button-gradient: linear-gradient(135deg, #3399ff 0%, #1a2a3a 100%);
-        --button-gradient-alt: linear-gradient(135deg, #388e3c 0%, #1b5e20 100%);
-        --delete-btn: #b71c1c;
-        --delete-btn-hover: #7f0000;
-        --success-bg: #234d2c;
-        --success-text: #b9f6ca;
-        --success-border: #388e3c;
-        --error-bg: #4a2323;
-        --error-text: #ff8a80;
-        --error-border: #b71c1c;
-    }
-}
 
 body {
     font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;