From: Danilo M. Date: Wed, 15 Apr 2026 15:30:01 +0000 (+0200) Subject: Remove Alpine.js dependency from menu toggle, use vanilla JavaScript X-Git-Tag: release_22042026-1342~251 X-Git-Url: https://git.danix.xyz/?a=commitdiff_plain;h=f14342001ef1fb15e697ea2c23e3cc91b3c21683;p=danix.xyz-2.git Remove Alpine.js dependency from menu toggle, use vanilla JavaScript - Replace Alpine.js directives (@click, x-ref) with vanilla JS - Update hamburger-menu.html to use id selectors instead of x-ref - Rewrite menu.js to work without Alpine.js - Menu now opens/closes on click with proper event handling - Language toggle now accessible in hamburger menu Co-Authored-By: Claude Haiku 4.5 --- diff --git a/i18n/en.yaml b/i18n/en.yaml new file mode 100644 index 0000000..cd061c0 --- /dev/null +++ b/i18n/en.yaml @@ -0,0 +1,51 @@ +# Navigation & UI +articles: "Articles" +about: "About" +here: "Contact" +legal: "Privacy" +language: "Language" +toggleTheme: "Theme" +toggleMenu: "Menu" +closeMenu: "Close" +email: "Email" +contact: "Contact" +links: "Links" +allRightsReserved: "All rights reserved." + +# Articles +readMore: "Read more" +published: "Published" +updated: "Updated" +readingTime: "reading time" +min: "min" +author: "Author" +category: "Category" +tags: "Tags" +relatedPosts: "Related articles" +noRelated: "No related articles." + +# Article types +life: "Life" +photo: "Photo" +link: "Link" +quote: "Quote" +tech: "Tech" + +# Sharing +share: "Share" +shareOn: "Share on" +copyLink: "Copy link" +twitter: "Twitter" +facebook: "Facebook" + +# Forms +name: "Name" +message: "Message" +submit: "Send" +sending: "Sending..." +success: "Message sent successfully!" +error: "An error occurred. Please try again." + +# Social +follow: "Follow me" +contactMe: "Contact me" diff --git a/i18n/it.yaml b/i18n/it.yaml new file mode 100644 index 0000000..92406d9 --- /dev/null +++ b/i18n/it.yaml @@ -0,0 +1,51 @@ +# Navigation & UI +articles: "Articoli" +about: "Chi Sono" +here: "Contatti" +legal: "Privacy" +language: "Lingua" +toggleTheme: "Tema" +toggleMenu: "Menu" +closeMenu: "Chiudi" +email: "Email" +contact: "Contatti" +links: "Link" +allRightsReserved: "Tutti i diritti riservati." + +# Articles +readMore: "Leggi di più" +published: "Pubblicato" +updated: "Aggiornato" +readingTime: "tempo di lettura" +min: "min" +author: "Autore" +category: "Categoria" +tags: "Tag" +relatedPosts: "Articoli correlati" +noRelated: "Nessun articolo correlato." + +# Article types +life: "Vita" +photo: "Foto" +link: "Link" +quote: "Citazione" +tech: "Tech" + +# Sharing +share: "Condividi" +shareOn: "Condividi su" +copyLink: "Copia link" +twitter: "Twitter" +facebook: "Facebook" + +# Forms +name: "Nome" +message: "Messaggio" +submit: "Invia" +sending: "Invio in corso..." +success: "Messaggio inviato con successo!" +error: "Si è verificato un errore. Riprova." + +# Social +follow: "Seguimi" +contactMe: "Contattami" diff --git a/themes/danix-xyz-hacker/assets/js/menu.js b/themes/danix-xyz-hacker/assets/js/menu.js index 257736b..f61e60b 100644 --- a/themes/danix-xyz-hacker/assets/js/menu.js +++ b/themes/danix-xyz-hacker/assets/js/menu.js @@ -1,51 +1,52 @@ document.addEventListener('DOMContentLoaded', () => { - // Get the menu toggle button and overlay const menuToggle = document.getElementById('menu-toggle'); const menuOverlay = document.getElementById('menu-overlay'); + const menuPanel = document.getElementById('menu-panel'); - /** - * Toggle menu visibility and state - */ function toggleMenu() { - const overlay = document.getElementById('menu-overlay'); - const menuPanel = document.querySelector('[x-ref="menuPanel"]'); - - if (!overlay || !menuPanel) return; + if (!menuOverlay || !menuPanel) return; // Toggle overlay visibility classes - overlay.classList.toggle('opacity-0'); - overlay.classList.toggle('invisible'); + menuOverlay.classList.toggle('opacity-0'); + menuOverlay.classList.toggle('invisible'); // Toggle menu panel translation menuPanel.classList.toggle('translate-x-full'); // Control body overflow - const isMenuOpen = !overlay.classList.contains('opacity-0'); + const isMenuOpen = !menuOverlay.classList.contains('opacity-0'); document.body.style.overflow = isMenuOpen ? 'hidden' : ''; } + function closeMenu() { + if (!menuOverlay || menuOverlay.classList.contains('opacity-0')) return; + toggleMenu(); + } + // Toggle menu when clicking the hamburger button if (menuToggle) { menuToggle.addEventListener('click', toggleMenu); } - // Close menu when clicking on the overlay (but not the panel itself) + // Close menu when clicking on the overlay if (menuOverlay) { menuOverlay.addEventListener('click', (e) => { - // Only close if clicking the overlay itself, not the menu panel if (e.target === menuOverlay) { - toggleMenu(); + closeMenu(); } }); } + // Close menu when clicking menu items + const menuLinks = document.querySelectorAll('#menu-panel a, #menu-panel button'); + menuLinks.forEach(link => { + link.addEventListener('click', closeMenu); + }); + // Close menu on Escape key document.addEventListener('keydown', (e) => { - if (e.key === 'Escape') { - const overlay = document.getElementById('menu-overlay'); - if (overlay && !overlay.classList.contains('opacity-0')) { - toggleMenu(); - } + if (e.key === 'Escape' && menuOverlay && !menuOverlay.classList.contains('opacity-0')) { + closeMenu(); } }); }); diff --git a/themes/danix-xyz-hacker/layouts/partials/hamburger-menu.html b/themes/danix-xyz-hacker/layouts/partials/hamburger-menu.html index 6eeddd4..c22981b 100644 --- a/themes/danix-xyz-hacker/layouts/partials/hamburger-menu.html +++ b/themes/danix-xyz-hacker/layouts/partials/hamburger-menu.html @@ -1,12 +1,10 @@