1023){
if(mobileNavOpen){
mobileNavOpen = false;
animateMobileNav();
}
else{
mobileNavOpen = false
}
}
" x-data="{ mobileNavOpen: false, searchModalOpen: false,
animateMobileNav(){
let burgerMenu = document.getElementById('burgerMenu');
let spans = burgerMenu.querySelectorAll('span');
if(!this.mobileNavOpen){
spans[0].className = 'block absolute h-[3px] w-full bg-blue-700 rounded-lg left-0 rotate-0 transition-all duration-200 top-0 ease-cc-cubic';
spans[1].className = 'block absolute h-[3px] w-full bg-blue-700 rounded-lg left-0 rotate-0 transition-all duration-200 top-[6px] ease-cc-cubic';
spans[2].className = 'block absolute h-[3px] w-full bg-blue-700 rounded-lg left-0 rotate-0 transition-all duration-200 top-[6px] ease-cc-cubic';
spans[3].className = 'block absolute h-[3px] w-full bg-blue-700 rounded-lg left-0 rotate-0 transition-all duration-200 top-3 ease-cc-cubic';
}
else{
spans[0].className = 'block absolute h-[3px] bg-blue-700 rounded-lg rotate-0 transition-all duration-200 top-[6px] left-1/2 w-0 ease-cc-cubic'
spans[1].className = 'block absolute h-[3px] w-full bg-blue-700 rounded-lg left-0 rotate-45 transition-all duration-200 top-[6px] ease-cc-cubic'
spans[2].className = 'block absolute h-[3px] w-full bg-blue-700 rounded-lg left-0 -rotate-45 transition-all duration-200 top-[6px] ease-cc-cubic'
spans[3].className = 'block absolute h-[3px] bg-blue-700 rounded-lg rotate-0 transition-all duration-200 top-2 left-1/2 w-0 ease-cc-cubic'
}
} }" x-init="width = (window.innerWidth > 0) ? window.innerWidth : screen.width;" x-trap.noscroll="mobileNavOpen">
Search