diff --git a/source/js/menu.js b/source/js/menu.js index 63d9663..0a4899b 100644 --- a/source/js/menu.js +++ b/source/js/menu.js @@ -6,7 +6,7 @@ const desktopMenuTrigger = document.querySelector(".menu__sub-inner-more-trigger const menuMore = document.querySelector(".menu__sub-inner-more"); const mobileQuery = getComputedStyle(document.body).getPropertyValue("--phoneWidth"); const isMobile = () => window.matchMedia(mobileQuery).matches; -const isMobileMenu = () => { +const handleMenuClasses = () => { mobileMenuTrigger && mobileMenuTrigger.classList.toggle("hidden", !isMobile()); menu && menu.classList.toggle("hidden", isMobile()); menuMore && menuMore.classList.toggle("hidden", !isMobile()); @@ -17,17 +17,17 @@ const isMobileMenu = () => { menu && menu.addEventListener("click", e => e.stopPropagation()); menuMore && menuMore.addEventListener("click", e => e.stopPropagation()); -isMobileMenu(); +handleMenuClasses(); document.body.addEventListener("click", () => { - if (!isMobile() && !menuMore.classList.contains("hidden")) { + if (!isMobile() && menuMore && !menuMore.classList.contains("hidden")) { menuMore.classList.add("hidden"); } else if (isMobile() && !menu.classList.contains("hidden")) { menu.classList.add("hidden"); } }); -window.addEventListener("resize", isMobileMenu); +window.addEventListener("resize", handleMenuClasses); // Mobile menu diff --git a/static/assets/main.js b/static/assets/main.js index cde6069..0be319c 100644 --- a/static/assets/main.js +++ b/static/assets/main.js @@ -106,7 +106,7 @@ eval("// Add your script here\n\n\n//# sourceURL=webpack:///./source/js/main.js? /***/ (function(module, exports, __webpack_require__) { "use strict"; -eval("\n\nvar container = document.querySelector(\".container\");\nvar menu = document.querySelector(\".menu\");\nvar mobileMenuTrigger = document.querySelector(\".menu-trigger\");\nvar desktopMenu = document.querySelector(\".menu__inner--desktop\");\nvar desktopMenuTrigger = document.querySelector(\".menu__sub-inner-more-trigger\");\nvar menuMore = document.querySelector(\".menu__sub-inner-more\");\nvar mobileQuery = getComputedStyle(document.body).getPropertyValue(\"--phoneWidth\");\n\nvar isMobile = function isMobile() {\n return window.matchMedia(mobileQuery).matches;\n};\n\nvar isMobileMenu = function isMobileMenu() {\n mobileMenuTrigger && mobileMenuTrigger.classList.toggle(\"hidden\", !isMobile());\n menu && menu.classList.toggle(\"hidden\", isMobile());\n menuMore && menuMore.classList.toggle(\"hidden\", !isMobile());\n}; // Common\n\n\nmenu && menu.addEventListener(\"click\", function (e) {\n return e.stopPropagation();\n});\nmenuMore && menuMore.addEventListener(\"click\", function (e) {\n return e.stopPropagation();\n});\nisMobileMenu();\ndocument.body.addEventListener(\"click\", function () {\n if (!isMobile() && !menuMore.classList.contains(\"hidden\")) {\n menuMore.classList.add(\"hidden\");\n } else if (isMobile() && !menu.classList.contains(\"hidden\")) {\n menu.classList.add(\"hidden\");\n }\n});\nwindow.addEventListener(\"resize\", isMobileMenu); // Mobile menu\n\nmobileMenuTrigger && mobileMenuTrigger.addEventListener(\"click\", function (e) {\n e.stopPropagation();\n menu && menu.classList.toggle(\"hidden\");\n}); // Desktop menu\n\ndesktopMenuTrigger && desktopMenuTrigger.addEventListener(\"click\", function (e) {\n e.stopPropagation();\n menuMore && menuMore.classList.toggle(\"hidden\");\n\n if (menuMore.getBoundingClientRect().right > container.getBoundingClientRect().right) {\n menuMore.style.left = \"auto\";\n menuMore.style.right = 0;\n }\n});\n\n//# sourceURL=webpack:///./source/js/menu.js?"); +eval("\n\nvar container = document.querySelector(\".container\");\nvar menu = document.querySelector(\".menu\");\nvar mobileMenuTrigger = document.querySelector(\".menu-trigger\");\nvar desktopMenu = document.querySelector(\".menu__inner--desktop\");\nvar desktopMenuTrigger = document.querySelector(\".menu__sub-inner-more-trigger\");\nvar menuMore = document.querySelector(\".menu__sub-inner-more\");\nvar mobileQuery = getComputedStyle(document.body).getPropertyValue(\"--phoneWidth\");\n\nvar isMobile = function isMobile() {\n return window.matchMedia(mobileQuery).matches;\n};\n\nvar handleMenuClasses = function handleMenuClasses() {\n mobileMenuTrigger && mobileMenuTrigger.classList.toggle(\"hidden\", !isMobile());\n menu && menu.classList.toggle(\"hidden\", isMobile());\n menuMore && menuMore.classList.toggle(\"hidden\", !isMobile());\n}; // Common\n\n\nmenu && menu.addEventListener(\"click\", function (e) {\n return e.stopPropagation();\n});\nmenuMore && menuMore.addEventListener(\"click\", function (e) {\n return e.stopPropagation();\n});\nhandleMenuClasses();\ndocument.body.addEventListener(\"click\", function () {\n if (!isMobile() && menuMore && !menuMore.classList.contains(\"hidden\")) {\n menuMore.classList.add(\"hidden\");\n } else if (isMobile() && !menu.classList.contains(\"hidden\")) {\n menu.classList.add(\"hidden\");\n }\n});\nwindow.addEventListener(\"resize\", handleMenuClasses); // Mobile menu\n\nmobileMenuTrigger && mobileMenuTrigger.addEventListener(\"click\", function (e) {\n e.stopPropagation();\n menu && menu.classList.toggle(\"hidden\");\n}); // Desktop menu\n\ndesktopMenuTrigger && desktopMenuTrigger.addEventListener(\"click\", function (e) {\n e.stopPropagation();\n menuMore && menuMore.classList.toggle(\"hidden\");\n\n if (menuMore.getBoundingClientRect().right > container.getBoundingClientRect().right) {\n menuMore.style.left = \"auto\";\n menuMore.style.right = 0;\n }\n});\n\n//# sourceURL=webpack:///./source/js/menu.js?"); /***/ }),