59 lines
1.8 KiB
JavaScript
59 lines
1.8 KiB
JavaScript
import { navLinks } from '../data.js';
|
|
|
|
export const createNavLinks = (menuId, isMobile) => {
|
|
const menu = document.getElementById(menuId);
|
|
if (!menu) return;
|
|
|
|
navLinks.forEach(link => {
|
|
const a = document.createElement('a');
|
|
a.href = link.href;
|
|
a.textContent = link.name;
|
|
if (isMobile) {
|
|
a.className = 'text-xl text-text-dark hover:text-tech-blue transition-colors';
|
|
} else {
|
|
a.className = 'text-base font-medium text-text-medium hover:text-tech-blue transition-colors';
|
|
if (window.location.pathname.endsWith('/' + link.href) ||
|
|
(window.location.pathname === '/' && link.href === 'index.html')) {
|
|
a.classList.add('text-tech-blue', 'font-semibold');
|
|
}
|
|
}
|
|
menu.appendChild(a);
|
|
});
|
|
};
|
|
|
|
export const handleHeaderScroll = () => {
|
|
const header = document.getElementById('main-header');
|
|
if (!header) return;
|
|
|
|
if (window.scrollY > 10) {
|
|
header.classList.add('scrolled');
|
|
} else {
|
|
header.classList.remove('scrolled');
|
|
}
|
|
};
|
|
|
|
export const setupMobileMenu = () => {
|
|
const mobileMenuButton = document.getElementById('mobile-menu-button');
|
|
const mobileMenu = document.getElementById('mobile-menu');
|
|
if (mobileMenuButton && mobileMenu) {
|
|
mobileMenuButton.addEventListener('click', () => {
|
|
mobileMenu.classList.toggle('hidden');
|
|
});
|
|
}
|
|
};
|
|
|
|
export const initializeSharedUI = () => {
|
|
createNavLinks('nav-menu', false);
|
|
createNavLinks('mobile-nav-menu', true);
|
|
window.addEventListener('scroll', handleHeaderScroll);
|
|
setupMobileMenu();
|
|
|
|
if (typeof lucide !== 'undefined') {
|
|
lucide.createIcons();
|
|
}
|
|
};
|
|
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
initializeSharedUI();
|
|
});
|