From d5ba3b108a51240946836eeab2abda1e430c3276 Mon Sep 17 00:00:00 2001
From: Maria Rushkova <maryrushkova@gmail.com>
Date: Wed, 4 Aug 2021 12:26:31 +0200
Subject: [PATCH] Add form submit script

---
 _includes/footer.html | 9 +++++++--
 assets/js/main.js     | 8 ++++++++
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/_includes/footer.html b/_includes/footer.html
index b4b0101..c4583e4 100644
--- a/_includes/footer.html
+++ b/_includes/footer.html
@@ -87,17 +87,17 @@
 
       <div class="flex flex-col w-52">
         <h3 class="text-base text-white mb-5">Signup for updates</h3>
-        <form action="">
+        <form action="" class="footer__form">
           <div class="flex items-center w-full">
             <input
               class="
                 text-xs text-white
-                opacity-50
                 w-full
                 bg-black
                 border-b border-white
                 mr-2
                 focus:outline-none
+                placeholder-white placeholder-opacity-50
               "
               type="email"
               placeholder="your email"
@@ -113,6 +113,11 @@
             ></button>
           </div>
         </form>
+        <p
+          class="footer__confirm text-base italic text-white opacity-75 hidden"
+        >
+          You signed up! Check your e-mail
+        </p>
       </div>
     </div>
   </div>
diff --git a/assets/js/main.js b/assets/js/main.js
index 56d9e85..7c4c39e 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -6,6 +6,8 @@ const burgerClose = document.querySelector(".burger__button--close");
 const menuMobile = document.querySelector(".nav-mobile");
 const menuLinks = document.querySelectorAll(".nav__link");
 const overlay = document.querySelector(".overlay");
+const form = document.querySelector(".footer__form");
+const confirmation = document.querySelector(".footer__confirm");
 
 const closeMobileMenu = () => {
   burgerOpen.classList.toggle("hidden");
@@ -29,3 +31,9 @@ menuLinks.forEach(function (link) {
     });
   });
 });
+
+form.addEventListener("submit", function (e) {
+  e.preventDefault();
+  form.classList.toggle("hidden");
+  confirmation.classList.toggle("hidden");
+});