Merge pull request #1741 from sau-mili/fix

Fix: Resolved conflicts: HTML JS fixed for learn more in cookie modal

assets/css/styles.css

@@ -204,14 +204,14 @@ svg {
     left: 10px;
     background-color: #f1f1f1;
     padding: 20px;
-
+    z-index: 10000;
     display: flex;
     flex-direction: column;
     justify-content: space-between;
     align-items: center;
     width: 300px;
     height: fit-content;
-    z-index: 100;
+
     border-radius: 10px;
     margin-bottom: 5px;
     margin: 20px;
@@ -229,14 +229,16 @@ svg {
 width: 280px;
 height: 40px;
 color: white;
+border-radius:5px;
 background-color: #A30F17;
 }
 .reject-cookies {
 margin-top: 10px;
 padding-top: 5px;
 height: 40px;
 width: 280px;
-color: white;
+border-radius: 5px;
+color:white;
 background-color: #A30F17;
 }
 

index.html

@@ -70,25 +70,25 @@
   </div>
 
   <div id="cookie-consent">
-
-
-    <p style="color: black;">We use cookies to improve your experience. By using our website, you consent to all cookies in accordance with
-      our Cookie Policy. <a href="#">Learn More</a></p>
-      <div id="cookie-content">
-        <p>Our Cookie Policy explains how we use cookies to enhance your experience. Cookies are small text files that are stored on your device when you visit a website. They help us to remember your preferences, track website usage, and provide personalized content. You can control your cookie preferences through your browser settings. By continuing to use our website, you agree to the use of cookies as described in our Cookie Policy.</p>
-      </div>
+    <p style="color: black;">
+        We use cookies to improve your experience. By using our website, you consent to all cookies in accordance with our Cookie Policy. 
+        <a href="#" id="learn-more-link">Learn More</a>
+    </p>
+    <div id="learn-more-content" style="display: none; color: black;">
+        <p>Cookies are small text files that can be used by websites to make a user's experience more efficient. The law states that we can store cookies on your device if they are strictly necessary for the operation of this site. For all other types of cookies we need your permission.</p>
+        <p>This site uses different types of cookies. Some cookies are placed by third party services that appear on our pages.</p>
+    </div>
     <button class="accept-cookies">Accept</button>
     <button class="reject-cookies">Reject</button>
 </div>
+
 <script>
-  document.getElementById("cookie-content").onclick = function() {
-          document.getElementById("cookie-consent").style.display = "none";
-  }
-
   document.addEventListener('DOMContentLoaded', function() {
     const cookieConsent = document.getElementById('cookie-consent');
     const acceptButton = document.querySelector('.accept-cookies');
     const rejectButton = document.querySelector('.reject-cookies');
+    const learnMoreLink = document.getElementById('learn-more-link');
+    const learnMoreContent = document.getElementById('learn-more-content');
 
     // Check if the user has already made a choice
     if (localStorage.getItem('cookieConsent')) {
@@ -109,17 +109,18 @@
     rejectButton.addEventListener('click', function() {
       handleConsent('rejected');
     });
-  });
 
-  document.addEventListener('DOMContentLoaded', (event) => {
-      document.getElementById('learn-more-link').addEventListener('click', function(event) {
-          event.preventDefault();
-          document.getElementById('cookie-content').style.display = 'block';
-          var learnMoreLink = document.getElementById('learn-more-link');
-                learnMoreLink.style.display = 'none';
-      });
+    // Add event listener to "Learn More" link
+    learnMoreLink.addEventListener('click', function(event) {
+      event.preventDefault();
+      learnMoreContent.style.display = 'block';
+      learnMoreLink.style.display = 'none';
+    });
   });
 </script>
+
+
+
   <div id="preloader">
     <div class="loader">
       <div class="book-wrapper">