Update index.html

index.html

@@ -15,14 +15,14 @@
             <img src="assets/obo-icon.png">
             LimePot
           </a>
-          <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
+          <a role="button" class="navbar-burger" data-target="navMenu" aria-label="menu" aria-expanded="false">
             <span aria-hidden="true"></span>
             <span aria-hidden="true"></span>
             <span aria-hidden="true"></span>
           </a>
         </div>
       
-        <div class="navbar-menu is-active">
+        <div class="navbar-menu" id="navMenu">
           <div class="navbar-start">
             <a class="navbar-item" href="https://limepot.xyz/">
               Home
@@ -80,6 +80,27 @@
             </div>
           </div>
         </div>
+        <script>document.addEventListener('DOMContentLoaded', () => {
+
+          // Get all "navbar-burger" elements
+          const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
+        
+          // Add a click event on each of them
+          $navbarBurgers.forEach( el => {
+            el.addEventListener('click', () => {
+        
+              // Get the target from the "data-target" attribute
+              const target = el.dataset.target;
+              const $target = document.getElementById(target);
+        
+              // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
+              el.classList.toggle('is-active');
+              $target.classList.toggle('is-active');
+        
+            });
+          });
+        
+        });</script>
       </nav>
 
 
@@ -87,7 +108,7 @@
   <section class="section">
     <div class="container">
       <h1 class="title">
-      Hello World
+      Hello Worldd
       </h1>
       <div class="content">