From 3808b81e01ede0c3fa75b0c2acb61ea14d59ecd0 Mon Sep 17 00:00:00 2001
From: partha120804 <138643473+partha120804@users.noreply.github.com>
Date: Thu, 4 Jul 2024 19:10:49 +0530
Subject: [PATCH] fixed

---
 js/FAQs.js      | 91 +++++++++++++++++++++----------------------------
 pages/FAQs.html | 14 ++++----
 2 files changed, 45 insertions(+), 60 deletions(-)

diff --git a/js/FAQs.js b/js/FAQs.js
index 7318d57..6f0d355 100644
--- a/js/FAQs.js
+++ b/js/FAQs.js
@@ -1,62 +1,47 @@
-const img = document.querySelector(".images");
-const drop = document.querySelector(".drop");
-
-const img2 = document.querySelector(".images2");
-const drop2 = document.querySelector(".drop2");
-
-const img3 = document.querySelector(".images3");
-const drop3 = document.querySelector(".drop3");
-
-const img4 = document.querySelector(".images4");
-const drop4 = document.querySelector(".drop4");
+function toggle(drop, isExpanded) {
+    const img = drop.querySelector('img');
+    if (isExpanded) {
+        img.src="../assets/images/icon-minus.svg";
+    }else {
+        img.src="../assets/images/icon-plus.svg";
+    }
+}
 
-let toggle = true;
+//Drops and their default expansion values
+const drop1 =   document.querySelector(".drop1")  ;     let drop1isExpanded = false   ;
+const drop2 =   document.querySelector(".drop2")  ;     let drop2isExpanded = false   ;
+const drop3 =   document.querySelector(".drop3")  ;     let drop3isExpanded = false   ;
+const drop4 =   document.querySelector(".drop4")  ;     let drop4isExpanded = false   ;
+const drop5 =   document.querySelector(".drop5")  ;     let drop5isExpanded = false   ;
+const drop6 =   document.querySelector(".drop6")  ;     let drop6isExpanded = false   ;
 
 
-drop.addEventListener('click', function(){
-    toggle= !toggle;
-    if(toggle)
-    {
-        img.src="../assets/images/icon-plus.svg";
-    }
-    else
-    {
-        img.src="../assets/images/icon-minus.svg"
-    }
-})
+drop1.addEventListener('click', function(){
+drop1isExpanded = !drop1isExpanded;
+toggle(drop1, drop1isExpanded);
+});
 
 drop2.addEventListener('click', function(){
-    toggle= !toggle;
-    if(toggle)
-    {
-        img2.src="../assets/images/icon-plus.svg";
-    }
-    else
-    {
-        img2.src="../assets/images/icon-minus.svg"
-    }
-})
+drop2isExpanded = !drop2isExpanded;
+toggle(drop2, drop2isExpanded);
+});
 
 drop3.addEventListener('click', function(){
-    toggle= !toggle;
-    if(toggle)
-    {
-        img3.src="../assets/images/icon-plus.svg";
-    }
-    else
-    {
-        img3.src="../assets/images/icon-minus.svg"
-    }
-})
+drop3isExpanded = !drop3isExpanded;
+toggle(drop3, drop3isExpanded);
+});
 
 drop4.addEventListener('click', function(){
-    toggle= !toggle;
-    if(toggle)
-    {
-        img4.src="../assets/images/icon-plus.svg";
-    }
-    else
-    {
-        img4.src="../assets/images/icon-minus.svg"
-    }
-})
\ No newline at end of file
+drop4isExpanded = !drop4isExpanded;
+toggle(drop4, drop4isExpanded);
+});
+
+drop5.addEventListener('click', function(){
+drop5isExpanded = !drop5isExpanded;
+toggle(drop5, drop5isExpanded);
+});
+
+drop6.addEventListener('click', function(){
+drop6isExpanded = !drop6isExpanded;
+toggle(drop6, drop6isExpanded);
+});
\ No newline at end of file
diff --git a/pages/FAQs.html b/pages/FAQs.html
index 33416b7..9dca082 100644
--- a/pages/FAQs.html
+++ b/pages/FAQs.html
@@ -36,8 +36,8 @@ <h1><img src="../assets/images/icon-star.svg" />FAQs</h1>
 
     <div class="question">
       <details>
-        <summary class="drop">
-          <img src="../assets/images/icon-plus.svg" class="images" /> How do I
+        <summary class="drop1">
+          <img src="../assets/images/icon-plus.svg"/>How do I
           win the game?
         </summary>
         <p>
@@ -52,7 +52,7 @@ <h1><img src="../assets/images/icon-star.svg" />FAQs</h1>
     <div class="question">
       <details>
         <summary class="drop2">
-          <img src="../assets/images/icon-plus.svg" class="images2" />How do I
+          <img src="../assets/images/icon-plus.svg"/>How do I
           set up the game?
         </summary>
         <p>
@@ -66,7 +66,7 @@ <h1><img src="../assets/images/icon-star.svg" />FAQs</h1>
     <div class="question">
       <details>
         <summary class="drop3">
-          <img src="../assets/images/icon-plus.svg" class="images3" />What
+          <img src="../assets/images/icon-plus.svg"/>What
           happens if I complete a box?
         </summary>
         <p>
@@ -80,7 +80,7 @@ <h1><img src="../assets/images/icon-star.svg" />FAQs</h1>
     <div class="question">
       <details>
         <summary class="drop4">
-          <img src="../assets/images/icon-plus.svg" class="images4" />When
+          <img src="../assets/images/icon-plus.svg"/>When
           does the game end?
         </summary>
         <p>
@@ -93,7 +93,7 @@ <h1><img src="../assets/images/icon-star.svg" />FAQs</h1>
     <div class="question">
       <details>
         <summary class="drop5">
-          <img src="../assets/images/icon-plus.svg" class="images5" />Is there
+          <img src="../assets/images/icon-plus.svg"/>Is there
           a strategy involved in playing this game?
         </summary>
         <p>
@@ -106,7 +106,7 @@ <h1><img src="../assets/images/icon-star.svg" />FAQs</h1>
     <div class="question">
       <details>
         <summary class="drop6">
-          <img src="../assets/images/icon-plus.svg" class="images6" />What if
+          <img src="../assets/images/icon-plus.svg"/>What if
           I need help or have more questions about gameplay?
         </summary>
         <p>