// Theme toggle functionality const themeToggle = document.getElementById('themeToggle'); const body = document.body; // Check for saved theme preference or default to system preference const savedTheme = localStorage.getItem('theme'); const systemPrefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches; if (savedTheme) { body.setAttribute('data-theme', savedTheme); } else if (!systemPrefersDark) { body.setAttribute('data-theme', 'light'); } themeToggle.addEventListener('click', () => { const currentTheme = body.getAttribute('data-theme'); const newTheme = currentTheme === 'light' ? 'dark' : 'light'; body.setAttribute('data-theme', newTheme); localStorage.setItem('theme', newTheme); }); // Mobile menu toggle const menuToggle = document.getElementById('menuToggle'); const mobileMenu = document.getElementById('mobileMenu'); if (menuToggle && mobileMenu) { menuToggle.addEventListener('click', () => { mobileMenu.classList.toggle('active'); }); } // Smooth scrolling for navigation links document.querySelectorAll('a[href^="#"]').forEach(anchor => { anchor.addEventListener('click', function (e) { e.preventDefault(); const target = document.querySelector(this.getAttribute('href')); if (target) { target.scrollIntoView({ behavior: 'smooth', block: 'start' }); // Close mobile menu after clicking a link if (mobileMenu) { mobileMenu.classList.remove('active'); } } }); }); // Update active navigation link on scroll window.addEventListener('scroll', () => { const sections = document.querySelectorAll('section[id]'); const navLinks = document.querySelectorAll('.nav-links a'); let current = ''; sections.forEach(section => { const sectionTop = section.offsetTop - 100; if (window.pageYOffset >= sectionTop) { current = section.getAttribute('id'); } }); navLinks.forEach(link => { link.classList.remove('active'); if (link.getAttribute('href') === `#${current}`) { link.classList.add('active'); } }); });