Add autocomplete functionality for parks: implement URLs, views, and templates for real-time suggestions

static/js/main.js

@@ -0,0 +1,40 @@
+// Theme Toggle
+document.addEventListener('DOMContentLoaded', () => {
+    const themeToggle = document.getElementById('theme-toggle');
+    const themeIcon = themeToggle.nextElementSibling.querySelector('i');
+
+    // Set initial icon
+    updateThemeIcon();
+
+    themeToggle.addEventListener('change', () => {
+        if (document.documentElement.classList.contains('dark')) {
+            document.documentElement.classList.remove('dark');
+            localStorage.setItem('theme', 'light');
+        } else {
+            document.documentElement.classList.add('dark');
+            localStorage.setItem('theme', 'dark');
+        }
+        updateThemeIcon();
+    });
+
+    function updateThemeIcon() {
+        const isDark = document.documentElement.classList.contains('dark');
+        themeIcon.classList.remove('fa-sun', 'fa-moon');
+        themeIcon.classList.add(isDark ? 'fa-sun' : 'fa-moon');
+    }
+
+    // Mobile Menu Toggle
+    const mobileMenuBtn = document.getElementById('mobileMenuBtn');
+    const mobileMenu = document.getElementById('mobileMenu');
+    const menuIcon = mobileMenuBtn.querySelector('i');
+
+    mobileMenu.style.display = 'none';
+    let isMenuOpen = false;
+
+    mobileMenuBtn.addEventListener('click', () => {
+        isMenuOpen = !isMenuOpen;
+        mobileMenu.style.display = isMenuOpen ? 'block' : 'none';
+        menuIcon.classList.remove('fa-bars', 'fa-times');
+        menuIcon.classList.add(isMenuOpen ? 'fa-times' : 'fa-bars');
+    });
+});