Bug Fix!!

assets/js/main.js

@@ -0,0 +1,103 @@
+const navMenu = document.getElementById('nav-menu'),
+      navToggle = document.getElementById('nav-toggle'),
+      navClose = document.getElementById('nav-close') 
+
+if (navToggle) {
+        navToggle.addEventListener('click',()=>{
+            navMenu.classList.add('show-menu')
+        })
+    }
+
+if(navClose){
+        navClose.addEventListener('click', ()=>{
+            navMenu.classList.remove('show-menu')
+        })
+    }
+
+
+const navLink = document.querySelectorAll('.nav__link')
+
+const linkAction = () =>{
+    const navMenu = document.getElementById('nav-menu')
+
+    navMenu.classList.remove('show-menu')
+}
+navLink.forEach(n => n.addEventListener('click', linkAction))
+
+
+const shadowHeader = () =>{
+    const header = document.getElementById('header')
+
+    this.scrollY >= 50 ? header.classList.add('shadow-header')
+                       : header.classList.remove('shadow-header')
+}
+window.addEventListener('scroll', shadowHeader)
+
+/*=============== EMAIL JS ===============*/
+const contactForm = document.getElementById('contact-form'),
+      contactMessage = document.getElementById('contact-message')
+
+const sendEmail = (e) =>{
+    e.preventDefault()
+
+    emailjs.sendForm('service_pkdtlsb','template_ujjnnvg','#contact-form','HvoUcQ8Jg5dGOM9ej')
+    .then(() =>{
+        contactMessage.textContent = 'Message sent Successfully ✅'
+
+        setTimeout(() =>{
+            contactMessage.textContent = ''
+        }, 5000)
+
+        contactForm.reset()
+    }, () =>{
+        contactMessage.textContent = 'Message not sent (service error) ❌'
+    })
+}
+
+contactForm.addEventListener('submit', sendEmail)
+
+/*=============== SHOW SCROLL UP ===============*/ 
+const scrollUp = () =>{
+    const scrollUp = document.getElementById('scroll-up')
+
+    this.scrollY >= 350 ? scrollUp.classList.add('show-scroll')
+                        : scrollUp.classList.remove('show-scroll')
+}
+window.addEventListener('scroll', scrollUp)
+
+/*=============== DARK LIGHT THEME ===============*/ 
+const themeButton = document.getElementById('theme-button')
+const darkTheme = 'dark-theme'
+const iconTheme = 'ri-sun-line'
+
+const selecredTheme = localStorage.getItem('selected-theme')
+const selecredIcon = localStorage.getItem('selected-icon')
+
+const getCurrentTheme = () => document.body.classList.contains(darkTheme) ? 'dark' : 'light'
+const getCurrentIcon = () => themeButton.classList.contains(iconTheme) ? 'ri-moon-line' : 'ri-sun-line'
+
+if (selecredTheme) {
+    document.body.classList[selecredTheme === 'dark' ? 'add' : 'remove'](darkTheme)
+    themeButton.classList[selecredIcon === 'ri-moon-line' ? 'add' : 'remove'](iconTheme)
+}
+
+themeButton.addEventListener('click', () =>{
+    document.body.classList.toggle(darkTheme)
+    themeButton.classList.toggle(iconTheme)
+
+    localStorage.setItem('selected-theme', getCurrentTheme())
+    localStorage.setItem('selected-icon', getCurrentIcon())
+})
+
+/*=============== SCROLL REVEAL ANIMATION ===============*/
+
+const sr = ScrollReveal({
+    origin: 'top',
+    distance: '60px',
+    duration: 2500,
+    delay: 400
+})
+
+sr.reveal('.home__perfil, .about__image, .contact__mail', {origin: 'right'})
+sr.reveal('.home__name, .home__info, .about__container, .section__title-1, .about__info, .contact__social, .contact__data', {origin: 'left'})
+sr.reveal('.services__card, .projects__card', {interval: 100})