Fixed hamburger menu in component category pages

assets/html_files/accordions.html

@@ -11,6 +11,7 @@
     <link rel="stylesheet" type="text/css" href="../css_files/accordions.css" />
     <link rel="stylesheet" href="../css_files/search.css">
     <script src="../js_files/commonnav.js"></script>
+    <script src="../js_files/hamburgerMenu.js"></script>
     <script src="https://kit.fontawesome.com/b08b6de27e.js" crossorigin="anonymous"></script>
     <title>Beautiify | Accordions</title>
 </head>
@@ -188,6 +189,7 @@ <h1>Simple Accordion</h1>
     <script src="../../script.js"></script>
 
 
+
 </body>
 
 </html>

assets/js_files/hamburgerMenu.js

@@ -0,0 +1,16 @@
+const hamburger = document.querySelector(".hamburger");
+const navMenu = document.querySelector(".nav-menu");
+
+hamburger.addEventListener("click", mobileMenu);
+function mobileMenu() {
+    hamburger.classList.toggle("active");
+    navMenu.classList.toggle("active");
+}
+
+const navLink = document.querySelectorAll(".nav-link");
+navLink.forEach(n => n.addEventListener("click", closeMenu));
+
+function closeMenu() {
+    hamburger.classList.remove("active");
+    navMenu.classList.remove("active");
+}

index.html

@@ -268,6 +268,7 @@ <h2>Transfer Lists</h2>
     <script src="https://cdn.botpress.cloud/webchat/v1/inject.js"></script>
     <script src="https://mediafiles.botpress.cloud/c49225f4-f243-440f-a8ab-9ef97d82964b/webchat/config.js" defer></script>
     <script src="./script.js"></script>
+    <script src="./assets/js_files/hamburgerMenu.js"></script>
     <script src="./assets/js_files/contributor.js"></script>
 
 </body>

script.js

@@ -1,26 +1,9 @@
-const hamburger = document.querySelector(".hamburger");
-const navMenu = document.querySelector(".nav-menu");
-
 document.addEventListener("DOMContentLoaded", function() {
     setTimeout(function() {
         document.querySelector("body").classList.add("loaded");
     }, 500)
 });
 
-hamburger.addEventListener("click", mobileMenu);
-function mobileMenu() {
-    hamburger.classList.toggle("active");
-    navMenu.classList.toggle("active");
-}
-
-const navLink = document.querySelectorAll(".nav-link");
-navLink.forEach(n => n.addEventListener("click", closeMenu));
-
-function closeMenu() {
-    hamburger.classList.remove("active");
-    navMenu.classList.remove("active");
-}
-
 let calcScrollValue = () => {
     let scrollProg = document.getElementById("progress");
     let pos = document.documentElement.scrollTop;