From 60a0ca1f4f54e3214f05778ed6ff7e6417517df8 Mon Sep 17 00:00:00 2001
From: Jonas Leder <git@jonasled.de>
Date: Tue, 13 Apr 2021 13:16:13 +0200
Subject: [PATCH] fix mobile menu
---
js/burgerMenu.js | 9 ---------
js/customElements/mainMenu.js | 17 +++++++++++++++++
js/script.js | 1 -
scss/_menuMobile.scss | 2 +-
4 files changed, 18 insertions(+), 11 deletions(-)
delete mode 100644 js/burgerMenu.js
diff --git a/js/burgerMenu.js b/js/burgerMenu.js
deleted file mode 100644
index bbad0b7..0000000
--- a/js/burgerMenu.js
+++ /dev/null
@@ -1,9 +0,0 @@
-let burgerMenu = document.querySelector("#burgerMenu");
-
-if(burgerMenu != null) {
- burgerMenu.onclick = () => {
- document.getElementById("burgerMenu").classList.toggle("change");
- document.getElementById("mainMenuContainer").classList.toggle("visible");
-
- }
-}
\ No newline at end of file
diff --git a/js/customElements/mainMenu.js b/js/customElements/mainMenu.js
index 261a8fe..6719582 100644
--- a/js/customElements/mainMenu.js
+++ b/js/customElements/mainMenu.js
@@ -9,6 +9,23 @@ class MainMenu extends HTMLElement {
let menuContainer = document.createElement("div");
menuContainer.className = "mainMenuContainer";
+ let burgerMenu = document.createElement("div");
+ burgerMenu.id = "burgerMenu";
+
+ burgerMenu.onclick = () => {
+ document.getElementById("burgerMenu").classList.toggle("change");
+ document.querySelector(".mainMenuContainer").classList.toggle("visible");
+
+ }
+
+ for(let i = 1; i <= 3; i++) {
+ let bar = document.createElement("div");
+ bar.className = "bar" + i;
+ burgerMenu.appendChild(bar);
+ }
+ this.appendChild(burgerMenu);
+
+
menu.forEach((element) => {
if(element["type"] === "link"){
let a = document.createElement("a");
diff --git a/js/script.js b/js/script.js
index e11eca1..8150603 100644
--- a/js/script.js
+++ b/js/script.js
@@ -1,4 +1,3 @@
-require("./burgerMenu");
require("./error");
require("./imgPreview");
require("./includeHTML");
diff --git a/scss/_menuMobile.scss b/scss/_menuMobile.scss
index 9bef85e..a4df6c4 100644
--- a/scss/_menuMobile.scss
+++ b/scss/_menuMobile.scss
@@ -34,7 +34,7 @@
display: inline-grid !important;
}
- #mainMenuContainer{
+ .mainMenuContainer{
display: none;
text-align: left;
--
GitLab