maride/hugo-theme-terminal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

change menu behavior

Browse Source
This commit is contained in:
panr 2022-06-21 17:15:11 +02:00
parent 7f097d7700
commit 5cf4720aff
3 changed files with 5 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
assets/js/menu.js
View File

@ -7,9 +7,7 @@ const menuMore = document.querySelector(".menu__sub-inner-more");
const mobileQuery = getComputedStyle(document.body).getPropertyValue("--phoneWidth"); const mobileQuery = getComputedStyle(document.body).getPropertyValue("--phoneWidth");
const isMobile = () => window.matchMedia(mobileQuery).matches; const isMobile = () => window.matchMedia(mobileQuery).matches;
const handleMenuClasses = () => { const handleMenuClasses = () => {
mobileMenuTrigger && mobileMenuTrigger.classList.toggle("hidden", !isMobile()); menuMore && menuMore.classList.toggle("hidden-on-mobile", !isMobile());
menu && menu.classList.toggle("hidden", isMobile());
menuMore && menuMore.classList.toggle("hidden", !isMobile());
}; };
// Common // Common
@ -17,7 +15,7 @@ const handleMenuClasses = () => {
menu && menu.addEventListener("click", (e) => e.stopPropagation()); menu && menu.addEventListener("click", (e) => e.stopPropagation());
menuMore && menuMore.addEventListener("click", (e) => e.stopPropagation()); menuMore && menuMore.addEventListener("click", (e) => e.stopPropagation());
handleMenuClasses(); // handleMenuClasses();
document.body.addEventListener("click", () => { document.body.addEventListener("click", () => {
if (!isMobile() && menuMore && !menuMore.classList.contains("hidden")) { if (!isMobile() && menuMore && !menuMore.classList.contains("hidden")) {
@ -34,7 +32,7 @@ window.addEventListener("resize", handleMenuClasses);
mobileMenuTrigger && mobileMenuTrigger &&
mobileMenuTrigger.addEventListener("click", (e) => { mobileMenuTrigger.addEventListener("click", (e) => {
e.stopPropagation(); e.stopPropagation();
menu && menu.classList.toggle("hidden"); menu && menu.classList.toggle("hidden-on-mobile");
}); });
// Desktop menu // Desktop menu

3
layouts/partials/footer.html
View File

@ -18,8 +18,7 @@
{{ $bundle := slice $menu $languageSelector $prism | resources.Concat "bundle.js" | resources.Minify }} {{ $bundle := slice $menu $languageSelector $prism | resources.Concat "bundle.js" | resources.Minify }}
<script type="text/javascript" src="{{ $bundle.RelPermalink }}"></script>
<script type="text/javascript" async src="{{ $bundle.RelPermalink }}"></script>
<!-- Extended footer section--> <!-- Extended footer section-->
{{ partial "extended_footer.html" . }} {{ partial "extended_footer.html" . }}

2
layouts/partials/menu.html
View File

@ -1,4 +1,4 @@
<nav class="menu"> <nav class="menu hidden-on-mobile">
<ul class="menu__inner menu__inner--desktop"> <ul class="menu__inner menu__inner--desktop">
{{ if or $.Site.Params.showMenuItems ( eq .Site.Params.showMenuItems 0 ) }} {{ if or $.Site.Params.showMenuItems ( eq .Site.Params.showMenuItems 0 ) }}
{{ range first $.Site.Params.showMenuItems $.Site.Menus.main }} {{ range first $.Site.Params.showMenuItems $.Site.Menus.main }}