usr777/codeguardian-hub

1// Theme toggle functionality2document.addEventListener('DOMContentLoaded', function() {3    const themeToggle = document.getElementById('themeToggle');4    const html = document.documentElement;5    6    // Check for saved theme preference or default to dark7    const savedTheme = localStorage.getItem('theme') || 'dark';8    html.classList.toggle('dark', savedTheme === 'dark');9    10    if (themeToggle) {11        themeToggle.addEventListener('click', function() {12            html.classList.toggle('dark');13            const currentTheme = html.classList.contains('dark') ? 'dark' : 'light';14            localStorage.setItem('theme', currentTheme);15            updateThemeIcon();16        });17        18        updateThemeIcon();19    }20    21    function updateThemeIcon() {22        if (!themeToggle) return;23        24        const isDark = html.classList.contains('dark');25        const icon = themeToggle.querySelector('i');26        27        if (icon) {28            icon.setAttribute('data-feather', isDark ? 'sun' : 'moon');29            feather.replace();30        }31    }32    33    // Smooth scrolling for anchor links34    document.querySelectorAll('a[href^="#"]').forEach(anchor => {35        anchor.addEventListener('click', function (e) {36            e.preventDefault();37            const target = document.querySelector(this.getAttribute('href'));38            if (target) {39                target.scrollIntoView({40                    behavior: 'smooth',41                    block: 'start'42                });43            }44        });45    });46    47    // Intersection Observer for animations48    const observerOptions = {49        threshold: 0.1,50        rootMargin: '0px 0px -50px 0px'51    };52    53    const observer = new IntersectionObserver((entries) => {54        entries.forEach(entry => {55            if (entry.isIntersecting) {56                entry.target.classList.add('animate-fade-in');57            }58        });59    }, observerOptions);60    61    // Observe all sections for animation62    document.querySelectorAll('section').forEach(section => {63        observer.observe(section);64    });65});