Add anchor points to post list page

* post-year now has anchor point, you can click on it or input url with hash tag to jump to a specific year. * See #39
Track3 · Mar 24, 2019 · 028dc62 · 028dc62
1 parent e6177e0
commit 028dc62
Show file tree

Hide file tree

Showing 7 changed files with 16 additions and 5 deletions.
diff --git a/assets/js/main.js b/assets/js/main.js
@@ -86,6 +86,12 @@ if (header !== null) {
   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();
 

diff --git a/assets/scss/style.scss b/assets/scss/style.scss
@@ -408,6 +408,11 @@ p.img-404 {
     margin-right: 1.8em;
     font-size: 1.6em;
     @include dimmed;
+
+    &:hover {
+      text-decoration: underline;
+      cursor: pointer;
+    }
   }
 
   .posts-list {

diff --git a/layouts/_default/list.html b/layouts/_default/list.html
@@ -12,7 +12,7 @@ <h1>{{ .Title }}</h1>
 		{{- end }}
 		{{- range .Data.Pages.GroupByDate "2006" }}
 		<div class="posts-group">
-			<div class="post-year">{{ .Key }}</div>
+			<div class="post-year" id="{{ .Key }}">{{ .Key }}</div>
 			<ul class="posts-list">
 				{{- range .Pages }}
 				<li class="post-item">

diff --git a/resources/_gen/assets/js/js/main.js_d11fe7b62c27961c87ecd0f2490357b9.content b/resources/_gen/assets/js/js/main.js_d11fe7b62c27961c87ecd0f2490357b9.content
@@ -6,4 +6,4 @@ 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);window.addEventListener('scroll',throttle(()=>{autoHideHeader();if(mobileMenuVisible==true){toggleMobileMenu();}},250));}
+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));}
diff --git a/resources/_gen/assets/js/js/main.js_d11fe7b62c27961c87ecd0f2490357b9.json b/resources/_gen/assets/js/js/main.js_d11fe7b62c27961c87ecd0f2490357b9.json
@@ -1 +1 @@
-{"Target":"js/main.min.8f39f24808e9d0a9b02da58c2d2838da859dc0b7bdfadbdb1883aae8b6adacfe.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-jznySAjp0KmwLaWMLSg42oWdwLe9+tvbGIOq6LatrP4="}}
+{"Target":"js/main.min.784417f5847151f848c339cf0acb13a06cbb648b1483435a28ed4556c4ead69b.js","MediaType":"application/javascript","Data":{"Integrity":"sha256-eEQX9YRxUfhIwznPCssToGy7ZIsUg0NaKO1FVsTq1ps="}}
diff --git a/resources/_gen/assets/scss/scss/style.scss_c16d144eee185fbddd582cd5e25a4fae.content b/resources/_gen/assets/scss/scss/style.scss_c16d144eee185fbddd582cd5e25a4fae.content
diff --git a/resources/_gen/assets/scss/scss/style.scss_c16d144eee185fbddd582cd5e25a4fae.json b/resources/_gen/assets/scss/scss/style.scss_c16d144eee185fbddd582cd5e25a4fae.json
@@ -1 +1 @@
-{"Target":"css/style.min.c693329ce3bac2503f88115a4011a284a06d53e30f484562a37664dc4c5f0a74.css","MediaType":"text/css","Data":{"Integrity":"sha256-xpMynOO6wlA/iBFaQBGihKBtU+MPSEVio3Zk3ExfCnQ="}}
+{"Target":"css/style.min.31706917653d2b9e8410abd431f30ec4359a88a94fc87a63654779d87329edec.css","MediaType":"text/css","Data":{"Integrity":"sha256-MXBpF2U9K56EEKvUMfMOxDWaiKlPyHpjZUd52HMp7ew="}}