class IndustrialHeader extends HTMLElement {
constructor() {
super();
this.attachShadow({ mode: 'open' });
}
connectedCallback() {
this.render();
this.setupMobileMenu();
}
render() {
this.shadowRoot.innerHTML = `
`;
}
setupMobileMenu() {
const toggle = this.shadowRoot.querySelector('.mobile-menu-toggle');
const navLinks = this.shadowRoot.querySelector('.nav-links');
toggle.addEventListener('click', () => {
navLinks.classList.toggle('open');
});
// Close menu when clicking a link
navLinks.addEventListener('click', (e) => {
if (e.target.tagName === 'A') {
navLinks.classList.remove('open');
}
});
}
}
customElements.define('industrial-header', IndustrialHeader);