|
|
| |
| document.addEventListener('DOMContentLoaded', () => { |
| const navbar = document.querySelector('custom-navbar'); |
| if (!navbar) return; |
|
|
| const shadow = navbar.shadowRoot; |
| const mobileMenuButton = shadow.querySelector('button'); |
| const mobileMenuLinks = shadow.querySelectorAll('.nav-link'); |
| |
| if (mobileMenuButton) { |
| mobileMenuButton.addEventListener('click', () => { |
| const menu = shadow.querySelector('.hidden.md\\:flex'); |
| if (!menu) return; |
| |
| menu.classList.toggle('hidden'); |
| menu.classList.toggle('flex'); |
| menu.classList.toggle('flex-col'); |
| menu.classList.toggle('absolute'); |
| menu.classList.toggle('top-16'); |
| menu.classList.toggle('left-0'); |
| menu.classList.toggle('right-0'); |
| menu.classList.toggle('bg-gray-900'); |
| menu.classList.toggle('p-4'); |
| menu.classList.toggle('space-y-4'); |
| }); |
| } |
|
|
| |
| mobileMenuLinks.forEach(link => { |
| link.addEventListener('click', () => { |
| const menu = shadow.querySelector('.flex.flex-col'); |
| if (menu) { |
| menu.classList.add('hidden'); |
| menu.classList.remove('flex'); |
| } |
| }); |
| }); |
| |
| document.querySelectorAll('.animate-fade-in').forEach((el, i) => { |
| el.style.animationDelay = `${i * 0.2}s`; |
| }); |
| |
| document.querySelectorAll('a[href^="#"]').forEach(anchor => { |
| anchor.addEventListener('click', function(e) { |
| const targetId = this.getAttribute('href'); |
| if (targetId === '#') return; |
| |
| e.preventDefault(); |
| const target = document.querySelector(targetId); |
| if (target) { |
| window.scrollTo({ |
| top: target.offsetTop - 100, |
| behavior: 'smooth' |
| }); |
| } |
| }); |
| }); |
| }); |
