finsh landingpage style

static/script.js

@@ -8,34 +8,104 @@ function toggleHamburger() {
     hamburger.classList.toggle('active');
 }
 
-/* ==========================================
-   THEME SWITCHER LOGIC
-   ========================================== */
-const themeBtn = document.getElementById('themeBtn');
-const themeDropdown = document.getElementById('themeDropdown');
-const themeButtons = document.querySelectorAll('.theme-dropdown button');
-const htmlEl = document.documentElement;
+// Initialisierung
+document.addEventListener('DOMContentLoaded', () => {
+    // ... dein bestehender Code ...
+    const savedTheme = localStorage.getItem('theme') || 'auto';
+    applyTheme(savedTheme);
 
-// Dropdown öffnen/schließen
-if (themeBtn) {
-    themeBtn.addEventListener('click', (e) => {
-        e.stopPropagation();
-        themeDropdown.classList.toggle('show');
-        // Schließe andere Dropdowns
-        if (langDropdown) langDropdown.classList.remove('show');
-    });
-}
+    // Hamburger Menü schließen bei Klick auf einen Link
+    const navLinksContainer = document.getElementById('navLinks');
+    const navLinks = navLinksContainer.querySelectorAll('a');
+    const hamburger = document.querySelector('.hamburger');
 
-// Theme auswählen
-themeButtons.forEach(btn => {
-    btn.addEventListener('click', () => {
-        const theme = btn.getAttribute('data-theme');
-        applyTheme(theme);
-        themeDropdown.classList.remove('show');
+    navLinks.forEach(link => {
+        link.addEventListener('click', () => {
+            // Prüfen, ob das Menü gerade offen ist
+            if (navLinksContainer.classList.contains('mobile-open')) {
+                navLinksContainer.classList.remove('mobile-open');
+                hamburger.classList.remove('active');
+            }
+        });
+    });
+});
+
+/* ==========================================
+   DROPDOWN LOGIC (Vereinheitlicht)
+   ========================================== */
+const langBtn = document.getElementById('langBtn');
+const langDropdown = document.getElementById('langDropdown');
+const themeBtn = document.getElementById('themeBtn');
+const themeDropdown = document.getElementById('themeDropdown');
+
+// Funktion zum Schließen aller Dropdowns
+function closeAllDropdowns() {
+    if (langDropdown) langDropdown.classList.remove('show');
+    if (themeDropdown) themeDropdown.classList.remove('show');
+}
+
+// Event Listener für Sprach-Dropdown
+if (langBtn) {
+    langBtn.addEventListener('click', (e) => {
+        e.stopPropagation();
+        closeAllDropdowns();
+        langDropdown.classList.toggle('show');
+    });
+}
+
+// Event Listener für Theme-Dropdown
+if (themeBtn) {
+    themeBtn.addEventListener('click', (e) => {
+        e.stopPropagation();
+        closeAllDropdowns();
+        themeDropdown.classList.toggle('show');
+    });
+}
+
+// Klick außerhalb schließt alle
+window.addEventListener('click', () => {
+    closeAllDropdowns();
+});
+
+/* ==========================================
+   LANGUAGE SWITCHER LOGIC
+   ========================================== */
+if (langDropdown) {
+    langDropdown.querySelectorAll('.theme-option').forEach(link => {
+        link.addEventListener('click', (e) => {
+            e.preventDefault();
+            const selectedLang = link.getAttribute('data-lang');
+            const currentPath = window.location.pathname;
+
+            // URL Logik: Pfad ersetzen
+            let newPath = currentPath.replace(/^\/(de|en|fr|es|ru)(\/|$)/, '/' + selectedLang + '/');
+            if (currentPath === '/' || !newPath.startsWith('/' + selectedLang)) {
+                newPath = '/' + selectedLang + '/';
+            }
+            newPath = newPath.replace(/\/+/g, '/');
+            window.location.href = newPath;
+        });
+    });
+}
+
+/* ==========================================
+   THEME SWITCHER LOGIC
+   ========================================== */
+const themeOptions = document.querySelectorAll('#themeDropdown .theme-option');
+const htmlEl = document.documentElement;
+
+themeOptions.forEach(btn => {
+    btn.addEventListener('click', () => {
+        const action = btn.getAttribute('data-theme');
+        let theme;
+        if (action === 'setdark') theme = 'dark';
+        else if (action === 'setlight') theme = 'light';
+        else theme = 'auto';
+
+        applyTheme(theme);
     });
 });
 
-// Theme anwenden
 function applyTheme(theme) {
     if (theme === 'auto') {
         localStorage.removeItem('theme');
@@ -49,65 +119,3 @@ function applyTheme(theme) {
     }
 }
 
-// Initialisierung beim Laden
-document.addEventListener('DOMContentLoaded', () => {
-    const savedTheme = localStorage.getItem('theme') || 'auto';
-    applyTheme(savedTheme);
-});
-
-// Klick außerhalb schließt alle Dropdowns
-window.addEventListener('click', () => {
-    if (themeDropdown) themeDropdown.classList.remove('show');
-    if (langDropdown) langDropdown.classList.remove('show');
-});
-
-// Mobile Menü schließen bei Klick auf Link
-document.querySelectorAll('.nav-links a').forEach(link => {
-    link.addEventListener('click', () => {
-        document.getElementById('navLinks').classList.remove('mobile-open');
-        const hamburger = document.querySelector('.hamburger');
-        if (hamburger) hamburger.classList.remove('active');
-    });
-});
-
-
-/* ==========================================
-   LANGUAGE SWITCHER LOGIC
-   ========================================== */
-const langBtn = document.getElementById('langBtn');
-const langDropdown = document.getElementById('langDropdown');
-
-if (langBtn) {
-    langBtn.addEventListener('click', (e) => {
-        e.stopPropagation();
-        langDropdown.classList.toggle('show');
-        // Schließe andere Dropdowns
-        if (themeDropdown) themeDropdown.classList.remove('show');
-    });
-}
-
-// Sprachwechsel Logik (Repariert für alle Sprachen)
-if (langDropdown) {
-    langDropdown.querySelectorAll('a').forEach(link => {
-        link.addEventListener('click', (e) => {
-            e.preventDefault(); // Verhindert das sofortige Neuladen
-
-            const selectedLang = link.getAttribute('data-lang');
-            const currentPath = window.location.pathname; // z.B. /de/projects/
-
-            // RegEx um den aktuellen Sprachcode (/de/, /en/, /fr/, etc.) am Anfang zu finden
-            // und durch die neue Sprache zu ersetzen.
-            let newPath = currentPath.replace(/^\/(de|en|fr|es|ru)(\/|$)/, '/' + selectedLang + '/');
-
-            // Falls man auf der Hauptseite ist (/), oder RegEx nicht matcht
-            if (currentPath === '/' || !newPath.startsWith('/' + selectedLang)) {
-                newPath = '/' + selectedLang + '/';
-            }
-
-            // Sicherstellen, dass keine Doppel-Slashes entstehen
-            newPath = newPath.replace(/\/+/g, '/');
-
-            window.location.href = newPath;
-        });
-    });
-}