Add basic support for nested menu

* Related issue: #53

assets/scss/style.scss

@@ -145,6 +145,10 @@ table {
   height: 1em;
 }
 
+.sub-menu {
+  font-size: .7em;
+}
+
 .desktop-only, .desktop-only-ib {
   display: none;
 }
@@ -215,6 +219,15 @@ table {
     font-size: 1.1em;
     opacity: .8;
 
+    .has-children {
+      padding-right: .5em;
+      border-right: 2px solid $highlight-grey;
+    }
+
+    .sub-menu > a{
+      margin-left: .3em;
+    }
+
     a {
       margin-left: .8em;
     }

layouts/index.html

@@ -24,9 +24,7 @@
 			</div>
 			{{- end }}
 			<nav id="home-nav" class="site-nav">
-				{{- range .Site.Menus.main }}
+				{{ partialCached "menu.html" . }}
-				<a href="{{ .URL | absLangURL }}">{{ .Name }}</a>
-				{{- end }}
 			</nav>
 		</div>
 		<div id="home-footer">

layouts/partials/header.html

@@ -5,9 +5,7 @@
 					<a href="{{.Site.BaseURL}}">{{ .Site.Title }}</a>
 				</div>
 				<nav class="site-nav hide-in-mobile">
-					{{- range .Site.Menus.main }}
+					{{ partialCached "menu.html" . }}
-					<a href="{{ .URL | absLangURL}}">{{ .Name }}</a>
-					{{- end }}
 				</nav>
 			</div>
 			<div class="hdr-right hdr-icons">

layouts/partials/menu.html

@@ -0,0 +1,12 @@
+		{{- range .Site.Menus.main }}
+			{{- if .HasChildren }}
+				<a href="{{ .URL | absLangURL }}" class="has-children">{{ .Name }}</a>
+				<span class="sub-menu">
+				{{- range .Children }}
+					<a href="{{ .URL | absLangURL }}">{{ .Name }}</a>
+				{{- end }}
+				</span>
+			{{- else }}
+				<a href="{{ .URL | absLangURL }}">{{ .Name }}</a>
+			{{- end }}
+		{{- end }}

resources/_gen/assets/js/js/main.js_d11fe7b62c27961c87ecd0f2490357b9.content

@@ -0,0 +1,9 @@
+const throttle=(callback,limit)=>{let timeoutHandler=null;return()=>{if(timeoutHandler==null){timeoutHandler=setTimeout(()=>{callback();timeoutHandler=null;},limit);}};};const listen=(ele,e,callback)=>{if(document.querySelector(ele)!==null){document.querySelector(ele).addEventListener(e,callback);}}
+let header=document.getElementById('site-header');let lastScrollPosition=window.pageYOffset;const autoHideHeader=()=>{let currentScrollPosition=Math.max(window.pageYOffset,0);if(currentScrollPosition>lastScrollPosition){header.classList.remove('slideInUp');header.classList.add('slideOutDown');}else{header.classList.remove('slideOutDown');header.classList.add('slideInUp');}
+lastScrollPosition=currentScrollPosition;}
+let mobileMenuVisible=false;const toggleMobileMenu=()=>{let mobileMenu=document.getElementById('mobile-menu');if(mobileMenuVisible==false){mobileMenu.style.animationName='bounceInRight';mobileMenu.style.webkitAnimationName='bounceInRight';mobileMenu.style.display='block';mobileMenuVisible=true;}else{mobileMenu.style.animationName='bounceOutRight';mobileMenu.style.webkitAnimationName='bounceOutRight'
+mobileMenuVisible=false;}}
+const showImg=()=>{document.querySelector('.bg-img').classList.add('show-bg-img');}
+const hideImg=()=>{document.querySelector('.bg-img').classList.remove('show-bg-img');}
+const toggleToc=()=>{document.getElementById('toc').classList.toggle('show-toc');}
+if(header!==null){listen('#menu-btn',"click",toggleMobileMenu);listen('#toc-btn',"click",toggleToc);listen('#img-btn',"click",showImg);listen('.bg-img',"click",hideImg);document.querySelectorAll('.post-year').forEach((ele)=>{ele.addEventListener('click',()=>{window.location.hash='#'+ele.id;});});window.addEventListener('scroll',throttle(()=>{autoHideHeader();if(mobileMenuVisible==true){toggleMobileMenu();}},250));}

resources/_gen/assets/js/js/main.js_d11fe7b62c27961c87ecd0f2490357b9.json

@@ -0,0 +1 @@
+{"Target":"js/main.min.35ccbf1cdceb91e4c64c06b5d009d6e2977fafe56beda7762febd4e67528d2ac.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-Ncy/HNzrkeTGTAa10AnW4pd/r+Vr7ad2L+vU5nUo0qw="}}

resources/_gen/assets/scss/scss/style.scss_c16d144eee185fbddd582cd5e25a4fae.json

@@ -1 +1 @@
-{"Target":"css/style.min.183d31ccbed0fd59293d435028691de8635f709926a69d5df7c744cc5ebf42a3.css","MediaType":"text/css","Data":{"Integrity":"sha256-GD0xzL7Q/VkpPUNQKGkd6GNfcJkmpp1d98dEzF6/QqM="}}
+{"Target":"css/style.min.568c54a56780af2a70c45272522247710b69dbfc080b315211fb98381e3796f8.css","MediaType":"text/css","Data":{"Integrity":"sha256-VoxUpWeArypwxFJyUiJHcQtp2/wICzFSEfuYOB43lvg="}}