From 19b8e38c4434b3de659d4f0d7e48d6201ad8f64a Mon Sep 17 00:00:00 2001
From: Akshay <akshay.allen26200@gmail.com>
Date: Thu, 20 Feb 2025 14:26:04 +0530
Subject: [PATCH] feat: Add success message to newsletter form

---
 assets/js/script.js | 18 ++++++++++++++++++
 index.html          | 17 +++++++++++++----
 2 files changed, 31 insertions(+), 4 deletions(-)

diff --git a/assets/js/script.js b/assets/js/script.js
index 831763b..2806976 100644
--- a/assets/js/script.js
+++ b/assets/js/script.js
@@ -37,4 +37,22 @@ window.addEventListener("scroll", function () {
     header.classList.remove("active");
     goTopBtn.classList.remove("active");
   }
+});
+
+document.getElementById('newsletterForm').addEventListener('submit', function (event) {
+  event.preventDefault(); // Prevent the default form submission behavior
+
+  // Simulate form submission (e.g., sending data to a server)
+  setTimeout(function () {
+    // Hide the form inputs and button
+   
+    document.querySelector('.btn-primary').style.display = 'none';
+
+    // Show the success message
+    document.getElementById('successMessage').style.display = 'block';
+  // Hide the success message after 5 seconds
+  setTimeout(function () {
+    document.getElementById('successMessage').style.display = 'none';
+  }, 5000); // 5000 milliseconds = 5 seconds
+}, 500); // Simulate a delay for form processing
 });
\ No newline at end of file
diff --git a/index.html b/index.html
index 636ddd4..22fa6de 100644
--- a/index.html
+++ b/index.html
@@ -1476,12 +1476,21 @@ <h3 class="h4 card-title">24/7 Support</h3>
               Authoritatively morph 24/7 potentialities with error-free partnerships.
             </p>
 
-            <form action="" class="newsletter-form">
-              <input type="email" name="email" required placeholder="Email Address" class="newsletter-input">
-
+            <form action="" class="newsletter-form" id="newsletterForm">
+              <input 
+                type="email" 
+                name="email" 
+                required 
+                placeholder="Email Address" 
+                class="newsletter-input"
+              >
               <button type="submit" class="btn btn-primary">Subscribe</button>
+              <!-- Success Message -->
+              
             </form>
-
+<p id="successMessage" class="success-message" style="display: none; color: green; margin-top: 10px;">
+                Thank you for subscribing! We'll keep you updated with the latest news and offers.
+              </p>
           </div>
 
         </div>