fix theme position

expressjs · Aug 10, 2024 · f3c78f3 · f3c78f3
1 parent 67010e7
commit f3c78f3
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 14 deletions.
diff --git a/css/menu.css b/css/menu.css
@@ -82,6 +82,7 @@
     #navbar {
         padding: 0;
         top: 1px;
+        position: static;
     }
 
     #navmenu>li:first-child {
@@ -155,6 +156,7 @@
     .submenu-content li a {
         font-size: 16px !important;
         padding: 5px 5px 5px 5%;
+        padding-left: 10% !important;
     }
 
     .submenu-content li {
@@ -165,4 +167,9 @@
         background: #cccccc;
         color: #666 !important;
     }
+
+    #theme-icon-container{
+        position: absolute;bottom: 15px;
+        z-index: 10000;
+    }
 }
diff --git a/js/app.js b/js/app.js
@@ -144,18 +144,6 @@ $(function(){
       $(this).next().addClass('active')
     })
 
-  // show mobile menu
-  $('#nav-button').click(function () {
-    $('#navmenu').toggleClass('opens');
-    $('#overlay').toggleClass('blurs');
-  });
-
-  // close mobile menu
-  $('#overlay').click(function () {
-    $('#navmenu').removeClass('opens');
-    $('#overlay').removeClass('blurs');
-  });
-
   // i18n notice
   if (readCookie('i18nClose')) {
     $('#i18n-notice-box').hide()

diff --git a/js/menu.js b/js/menu.js
@@ -22,11 +22,11 @@ for (const el of $itemsMenu) {
 	});
 
 	el.addEventListener("click", () => {
-		$itemsMenu.forEach((item) => {
+		for (const item of $itemsMenu) {
 			if (item.id !== el.id) {
 				item.classList.remove("open");
 			}
-		});
+		}	
 		el.classList.toggle("open");
 	});
 }
@@ -35,6 +35,8 @@ for (const el of $itemsMenu) {
 
 const $linkItemsMenu = document.querySelectorAll(".submenu > a");
 const $linkItemsContentMenu = document.querySelectorAll(".submenu-content a");
+const $menu = document.querySelector("#navmenu");
+const $overlay = document.querySelector("#overlay");
 
 for (const el of $linkItemsMenu) {
 	el.addEventListener("click", (e) => {
@@ -46,6 +48,17 @@ for (const el of $linkItemsMenu) {
 	});
 }
 
+document.querySelector("#nav-button").addEventListener("click", () => {
+	$menu.classList.toggle("opens");
+	$overlay.classList.toggle("blurs");
+});
+
+// close mobile menu
+$overlay.addEventListener("click", () => {
+	$menu.classList.remove("opens");
+	$overlay.classList.remove("blurs");
+});
+
 // hilight the menu item of the current page
 document
 	.querySelector(`.submenu-content a[href="${document.location.pathname}"]`)