From 240fa031bb1989807727981056c1ca9f4228e924 Mon Sep 17 00:00:00 2001
From: Ananya Gupta <145869907+ananyag309@users.noreply.github.com>
Date: Fri, 28 Jun 2024 11:02:59 +0530
Subject: [PATCH 1/2] Update index.html

added functionality to feedback form
---
 index.html | 83 ++++++++++++++++++++++++++++++++++--------------------
 1 file changed, 53 insertions(+), 30 deletions(-)

diff --git a/index.html b/index.html
index 46a3c74a..ca4934b7 100644
--- a/index.html
+++ b/index.html
@@ -1250,63 +1250,88 @@ <h3 class="name">Shikha Pandey</h3>
 
 
     <!-- Feedback System-->
-    <section id="feedback" class="feed">
+  <section id="feedback" class="feed">
       <div class="feedback">
         <h1>Give Us Your Valuable Feedback.</h1>
         <p>Your feedback is very important for Rapidoc.</p>
-        <div class="emoji" >
-          <input type="radio" id="emoji1" name="emoji" value="&#128578;" style="display: none;">
-          <label for="emoji1" style="font-size: 2rem; cursor: pointer; padding: 5px;">&#128578;</label>
-          <input type="radio" id="emoji2" name="emoji" value="&#128515;" style="display: none;">
-          <label for="emoji2" style="font-size: 2rem; cursor: pointer; padding: 5px;">&#128515;</label>
-          <input type="radio" id="emoji3" name="emoji" value="&#128519;" style="display: none;">
-          <label for="emoji3" style="font-size: 2rem; cursor: pointer; padding: 5px;">&#128519;</label>
-          <input type="radio" id="emoji4" name="emoji" value="&#128531;" style="display: none;">
-          <label for="emoji4" style="font-size: 2rem; cursor: pointer; padding: 5px;">&#128531;</label>
-          <input type="radio" id="emoji5" name="emoji" value="&#128532;" style="display: none;">
-          <label for="emoji5" style="font-size: 2rem; cursor: pointer; padding: 5px;">&#128532;</label>
-          <input type="radio" id="emoji6" name="emoji" value="&#128545;" style="display: none;">
-          <label for="emoji6" style="font-size: 2rem; cursor: pointer; padding: 5px;">&#128545;</label>
+        <div class="emoji">
+          <input type="radio" id="emoji1" name="emoji" value="😊" style="display: none;">
+          <label for="emoji1" style="font-size: 2rem; cursor: pointer; padding: 5px;">😊</label>
+          <input type="radio" id="emoji2" name="emoji" value="😁" style="display: none;">
+          <label for="emoji2" style="font-size: 2rem; cursor: pointer; padding: 5px;">😁</label>
+          <input type="radio" id="emoji3" name="emoji" value="😇" style="display: none;">
+          <label for="emoji3" style="font-size: 2rem; cursor: pointer; padding: 5px;">😇</label>
+          <input type="radio" id="emoji4" name="emoji" value="😕" style="display: none;">
+          <label for="emoji4" style="font-size: 2rem; cursor: pointer; padding: 5px;">😕</label>
+          <input type="radio" id="emoji5" name="emoji" value="😔" style="display: none;">
+          <label for="emoji5" style="font-size: 2rem; cursor: pointer; padding: 5px;">😔</label>
+          <input type="radio" id="emoji6" name="emoji" value="😡" style="display: none;">
+          <label for="emoji6" style="font-size: 2rem; cursor: pointer; padding: 5px;">😡</label>
         </div>
+        <p id="mood-text" style="font-size: 1rem; font-weight: bold;"></p>
         <p class="ques">What you want to say?</p>
         <textarea id="textarea" cols="20" rows="5"></textarea>
-        <p class="ques">Are you satisfied with rapidoc?</p>
+        <p class="ques">Are you satisfied with Rapidoc?</p>
         <div class="radiobtn">
           <div class="one">
-            <input class="input" type="radio" name="one" id="Yes" />
+            <input class="input" type="radio" name="satisfaction" id="Yes" />
             <label class="label" for="Yes">Yes</label>
           </div>
           <div class="one">
-            <input class="input" type="radio" name="one" id="No" />
+            <input class="input" type="radio" name="satisfaction" id="No" />
             <label class="label" for="No">No</label>
           </div>
         </div>
       </div>
       <div class="info">
         <div class="center">
-          <button class="btn button" style="text-align: center; font-weight: 700; padding-bottom:40px ;"onclick="submitFeedback(event)">Submit</button>
+          <button class="btn button" style="text-align: center; font-weight: 700; padding-bottom:40px;" onclick="submitFeedback(event)">Submit</button>
         </div>
-
       </div>
     </section>
     <div id="overlay" style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: none; justify-content: center; align-items: center; z-index: 1000;">
-      <div id="confirmation-message" style="width: 80%; height: 80%; color: #1c413b;; font-size: 50px; font-weight: bold; text-align: center; background-color: rgba(0, 0, 0, 0.8); padding: 20px; border-radius: 10px; display: flex; justify-content: center; align-items: center;">
+      <div id="confirmation-message" style="width: 80%; height: 80%; color: #1c413b; font-size: 50px; font-weight: bold; text-align: center; background-color: rgba(0, 0, 0, 0.8); padding: 20px; border-radius: 10px; display: flex; justify-content: center; align-items: center;">
         Thank you for your feedback!
+      </div>
     </div>
+    <script>
+      const emojiLabels = document.querySelectorAll('.emoji label');
+      const moodText = document.getElementById('mood-text');
     
+      emojiLabels.forEach(label => {
+        label.addEventListener('click', () => {
+          const emoji = label.innerHTML;
+          let mood = '';
+          switch (emoji) {
+            case '😊':
+              mood = 'Highly Satisfied';
+              break;
+            case '😁':
+              mood = 'Satisfied';
+              break;
+            case '😇':
+              mood = 'Average';
+              break;
+            case '😕':
+              mood = 'Confused';
+              break;
+            case '😔':
+              mood = 'Dissatisfied';
+              break;
+            case '😡':
+              mood = 'Highly Dissatisfied';
+              break;
+          }
+          moodText.textContent = `Mood: ${mood}`;
+        });
+      });
     
-    </div>
-	  <script>
       function submitFeedback(event) {
         event.preventDefault();
         const feedbackText = document.getElementById('textarea').value;
         const selectedEmoji = document.querySelector('input[name="emoji"]:checked');
         if (!feedbackText.trim() || !selectedEmoji) {
-          alert('Please fill the feedback form');
-          return;
-        }
-        if (!selectedEmoji) {
-          alert('Please select your satisfaction level');
+          alert('Please fill the feedback form and select your satisfaction level');
           return;
         }
         const overlay = document.getElementById('overlay');
@@ -1315,13 +1340,11 @@ <h1>Give Us Your Valuable Feedback.</h1>
         setTimeout(() => {
           overlay.style.display = 'none';
           document.body.classList.remove('blur');
-          location.reload(true); 
+          location.reload(true);
         }, 1000);
       }
     </script>
 
-
-
   </main><!-- End #main -->
   <!-- ############### Footer ############### -->
 <br><br><br><br><br><br>

From 1969a82a3832fef05e4d012820c5e57ab44da29a Mon Sep 17 00:00:00 2001
From: Ananya Gupta <145869907+ananyag309@users.noreply.github.com>
Date: Wed, 3 Jul 2024 22:14:48 +0530
Subject: [PATCH 2/2] Update index.html

---
 index.html | 40 ++++++++++++++++++++++++++++++++++------
 1 file changed, 34 insertions(+), 6 deletions(-)

diff --git a/index.html b/index.html
index c437717d..9c97178b 100644
--- a/index.html
+++ b/index.html
@@ -1387,15 +1387,43 @@ <h4>Legal</h4><br>
                 <section class="footer-col">
                   <h4>RAPIDOC Newsletter</h4><br>
                   <p>
-                    Subscribe to our newsletter for a weekly dose
-                    of news, updates, helpful tips, and
-                    exclusive offers.
+                      Subscribe to our newsletter for a weekly dose
+                      of news, updates, helpful tips, and
+                      exclusive offers.
                   </p>
                   <form action="#" class="subscribe-form">
-                    <input type="email" placeholder="Your email" required>
-                    <button type="submit">SUBSCRIBE</button>
+                      <input type="email" placeholder="Your email" required>
+                      <button type="submit">SUBSCRIBE</button>
                   </form>
-                </section>
+                  <p class="confirmation-message">Thank you for subscribing!</p>
+              </section>
+              <style>
+                .confirmation-message {
+                    display: none;
+                    color: green;
+                    margin-top: 10px;
+                }
+            </style>
+          
+              <script>
+                  document.querySelector('.subscribe-form').addEventListener('submit', function(event) {
+                      event.preventDefault(); // Prevent the form from submitting in the traditional way
+          
+                      // Here you would normally send the form data to the server using fetch or XMLHttpRequest
+                      // For demonstration purposes, we'll just show the confirmation message
+          
+                      const confirmationMessage = document.querySelector('.confirmation-message');
+                      confirmationMessage.style.display = 'block'; // Show the confirmation message
+          
+                      // Clear the input field
+                      this.querySelector('input[type="email"]').value = '';
+          
+                      // Optionally, you can hide the confirmation message after a few seconds
+                      setTimeout(() => {
+                          confirmationMessage.style.display = 'none';
+                      }, 5000); // Hide after 5 seconds
+                  });
+                  </script>
             </div>
         </div>
     </div>