Prepare migration to Tailwind

assets/js/app.js

@@ -0,0 +1,10 @@
+// Import Alpine.js
+import Alpine from 'alpinejs'
+
+// Make Alpine available on the window object
+window.Alpine = Alpine
+
+// Initialize Alpine
+Alpine.start()
+
+console.log("Hello world");

assets/js/header.js

@@ -0,0 +1,54 @@
+// Header JavaScript
+document.addEventListener('DOMContentLoaded', function() {
+  // Mobile menu toggle
+  const offcanvasToggle = document.querySelector('.cs-header__offcanvas-toggle');
+  const offcanvasClose = document.querySelector('.cs-header__offcanvas-close');
+  const offcanvas = document.querySelector('.cs-header__offcanvas');
+  const overlay = document.querySelector('.cs-search-overlay');
+  
+  if (offcanvasToggle) {
+    offcanvasToggle.addEventListener('click', function() {
+      offcanvas.classList.add('active');
+      overlay.style.display = 'block';
+      document.body.style.overflow = 'hidden';
+    });
+  }
+  
+  if (offcanvasClose) {
+    offcanvasClose.addEventListener('click', function() {
+      offcanvas.classList.remove('active');
+      overlay.style.display = 'none';
+      document.body.style.overflow = '';
+    });
+  }
+  
+  // Search functionality
+  const searchToggle = document.querySelectorAll('.cs-header__search-toggle');
+  const searchClose = document.querySelector('.cs-search__close');
+  const search = document.querySelector('.cs-search');
+  
+  searchToggle.forEach(toggle => {
+    toggle.addEventListener('click', function() {
+      search.style.display = 'block';
+      overlay.style.display = 'block';
+      document.body.style.overflow = 'hidden';
+    });
+  });
+  
+  if (searchClose) {
+    searchClose.addEventListener('click', function() {
+      search.style.display = 'none';
+      overlay.style.display = 'none';
+      document.body.style.overflow = '';
+    });
+  }
+  
+  if (overlay) {
+    overlay.addEventListener('click', function() {
+      offcanvas.classList.remove('active');
+      search.style.display = 'none';
+      overlay.style.display = 'none';
+      document.body.style.overflow = '';
+    });
+  }
+});