Merge pull request #3904 from SrijaVuppala295/new-more

Fix and Improve Navbar Dropdown Functionality with Correct Link Paths
anuragverma108 · Oct 23, 2024 · 474641c · 474641c
2 parents 625a228 + c321858
commit 474641c
Show file tree

Hide file tree

Showing 4 changed files with 49 additions and 28 deletions.
diff --git a/assets/html/ConnReader.html b/assets/html/ConnReader.html
@@ -558,6 +558,20 @@
 .but{
   font-size: x-large;
 }
+* Initially hide the dropdown */
+#dropdown-menu {
+  display: none;
+  position: absolute;
+  background-color: #7c0f1b;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  z-index: 1000;
+  padding: 10px;
+}
+
+/* Show the dropdown when the 'open' class is added */
+#dropdown-menu.open {
+  display: block;
+}
 </style>
 
 </head>
@@ -732,14 +746,12 @@ <h3>XYZ<br /><span>Book Lover</span></h3>
     if (savedAvatar) {
         document.getElementById("profile-avatar").src = `./assets/images/${savedAvatar}`;
     }
-
     document.getElementById('more-link').addEventListener('click', function(event) {
-  event.preventDefault(); // Prevent the default action of the anchor tag
+    event.preventDefault(); 
+    const dropdownMenu = document.getElementById('dropdown-menu');
+     dropdownMenu.classList.toggle('open');
+    });
 
-  // Toggle the 'open' class for the dropdown menu
-  const dropdownMenu = document.getElementById('dropdown-menu');
-  dropdownMenu.classList.toggle('open');
-});
 
 });
 

diff --git a/assets/html/booklistswap.html b/assets/html/booklistswap.html
@@ -522,6 +522,19 @@
 }
 .but{
   font-size: x-large;
+}
+#dropdown-menu {
+  display: none;
+  position: absolute;
+  background-color: #7c0f1b;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  z-index: 1000;
+  padding: 10px;
+}
+
+/* Show the dropdown when the 'open' class is added */
+#dropdown-menu.open {
+  display: block;
 }
   </style>
 </head>
@@ -706,14 +719,14 @@ <h3>XYZ<br /><span>Book Lover</span></h3>
       });
 
       document.getElementById('more-link').addEventListener('click', function(event) {
-  event.preventDefault(); // Prevent the default action of the anchor tag
-
-  // Toggle the 'open' class for the dropdown menu
-  const dropdownMenu = document.getElementById('dropdown-menu');
-  dropdownMenu.classList.toggle('open');
+      event.preventDefault(); 
+
+       const dropdownMenu = document.getElementById('dropdown-menu');
+       dropdownMenu.classList.toggle('open');
 });
 
 
+
       function menuToggle() {
         const toggleMenu = document.querySelector(".menu");
         toggleMenu.classList.toggle("active");

diff --git a/assets/html/freeBooks.html b/assets/html/freeBooks.html
@@ -520,13 +520,9 @@
   display: block;
 }
 
-    </style>
-
-
+</style>
 
   </head>
-
-
   <body>
 
     <div id="preloader">
@@ -713,12 +709,12 @@ <h3>XYZ<br /><span>Book Lover</span></h3>
           }
         });
         document.getElementById('more-link').addEventListener('click', function(event) {
-  event.preventDefault(); // Prevent the default action of the anchor tag
+        event.preventDefault(); 
+
+       const dropdownMenu = document.getElementById('dropdown-menu');
+       dropdownMenu.classList.toggle('open');
+      });
 
-  // Toggle the 'open' class for the dropdown menu
-  const dropdownMenu = document.getElementById('dropdown-menu');
-  dropdownMenu.classList.toggle('open');
-});
 
 
         function menuToggle() {

diff --git a/assets/html/pricing.html b/assets/html/pricing.html
@@ -481,7 +481,7 @@
   display: block;
 }
 
-    </style>
+</style>
 </head>
 <body>
 
@@ -661,13 +661,13 @@ <h3>XYZ<br /><span>Book Lover</span></h3>
                       document.getElementById("profile-avatar").src = `./assets/images/${savedAvatar}`;
                   }
                 });
-                document.getElementById('more-link').addEventListener('click', function(event) {
-  event.preventDefault(); // Prevent the default action of the anchor tag
 
-  // Toggle the 'open' class for the dropdown menu
-  const dropdownMenu = document.getElementById('dropdown-menu');
-  dropdownMenu.classList.toggle('open');
-});
+            document.getElementById('more-link').addEventListener('click', function(event) {
+            event.preventDefault(); 
+            const dropdownMenu = document.getElementById('dropdown-menu');
+            dropdownMenu.classList.toggle('open');
+           });
+
 
 
                 function menuToggle() {