admin login migration to new structure, new design

static/admin/js/init-alpine.js

@@ -0,0 +1,57 @@
+/**
+ * Alpine.js v3 global data initialization
+ * Provides theme toggle, menu controls, and page state
+ */
+function data() {
+  function getThemeFromLocalStorage() {
+    // if user already changed the theme, use it
+    if (window.localStorage.getItem('dark')) {
+      return JSON.parse(window.localStorage.getItem('dark'))
+    }
+
+    // else return their preferences
+    return (
+      !!window.matchMedia &&
+      window.matchMedia('(prefers-color-scheme: dark)').matches
+    )
+  }
+
+  function setThemeToLocalStorage(value) {
+    window.localStorage.setItem('dark', value)
+  }
+
+  return {
+    dark: getThemeFromLocalStorage(),
+    toggleTheme() {
+      this.dark = !this.dark
+      setThemeToLocalStorage(this.dark)
+    },
+    isSideMenuOpen: false,
+    toggleSideMenu() {
+      this.isSideMenuOpen = !this.isSideMenuOpen
+    },
+    closeSideMenu() {
+      this.isSideMenuOpen = false
+    },
+    isNotificationsMenuOpen: false,
+    toggleNotificationsMenu() {
+      this.isNotificationsMenuOpen = !this.isNotificationsMenuOpen
+    },
+    closeNotificationsMenu() {
+      this.isNotificationsMenuOpen = false
+    },
+    isProfileMenuOpen: false,
+    toggleProfileMenu() {
+      this.isProfileMenuOpen = !this.isProfileMenuOpen
+    },
+    closeProfileMenu() {
+      this.isProfileMenuOpen = false
+    },
+    isPagesMenuOpen: false,
+    togglePagesMenu() {
+      this.isPagesMenuOpen = !this.isPagesMenuOpen
+    },
+    // Page identifier - will be set by individual pages
+    currentPage: ''
+  }
+}