From bd6f4aac15432436a2e43656d2bfe25781e456cb Mon Sep 17 00:00:00 2001
From: xaoxuu <xaoxuu@gmail.com>
Date: Fri, 13 Mar 2020 21:20:01 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E3=80=8C=E7=BD=91=E5=9D=80#?=
 =?UTF-8?q?=E6=A0=87=E9=A2=98=E3=80=8DURL=E5=AE=9A=E4=BD=8D=E8=A2=AB?=
 =?UTF-8?q?=E5=AF=BC=E8=88=AA=E6=A0=8F=E9=81=AE=E7=9B=96=E7=9A=84=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 _config.yml                     | 10 +++++-----
 source/css/_defines/layout.styl |  6 +++---
 source/css/_layout/article.styl | 14 +++++++++++---
 source/js/app.js                |  4 ++--
 4 files changed, 21 insertions(+), 13 deletions(-)

diff --git a/_config.yml b/_config.yml
index e29277f..3072750 100755
--- a/_config.yml
+++ b/_config.yml
@@ -4,8 +4,8 @@ info:
   version: '2.1.3'
   docs: https://volantis.js.org/
   cdn: # To use CDN, write 'use_cdn: true' in 'blog/_config.yml'.
-    css: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-volantis@2.1.3/css/style.css
-    js: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-volantis@2.1.3/js/app.js
+    # css: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-volantis@2.1.3/css/style.css
+    # js: https://cdn.jsdelivr.net/gh/xaoxuu/cdn-volantis@2.1.3/js/app.js
 
 
 ############################### Style ###############################
@@ -28,9 +28,9 @@ style:
       h4: left
       p: justify
   gap:
-    h2: 2.5em # Spacing above H2
-    h3: 1.5em # Spacing above H3
-    h4: 1em # Spacing above H4
+    h2: 48px # Spacing above H2 (only px unit)
+    h3: 32px # Spacing above H3 (only px unit)
+    h4: 16px # Spacing above H4 (only px unit)
     line: 1rem # Paragraph spacing
     inline: .5rem # Paragraph spacing within a block
   border_radius:
diff --git a/source/css/_defines/layout.styl b/source/css/_defines/layout.styl
index 03b0e92..9350199 100644
--- a/source/css/_defines/layout.styl
+++ b/source/css/_defines/layout.styl
@@ -18,9 +18,9 @@ $navbar-height = convert(hexo-config('style.navbar.height')) || 64px
 
 // gap
 $gap = convert(hexo-config('style.gap.base')) || 16px
-$gap-h2 = convert(hexo-config('style.gap.h2')) || 2.5em
-$gap-h3 = convert(hexo-config('style.gap.h3')) || 1.5em
-$gap-h4 = convert(hexo-config('style.gap.h4')) || 1em
+$gap-h2 = convert(hexo-config('style.gap.h2')) || 48px
+$gap-h3 = convert(hexo-config('style.gap.h3')) || 32px
+$gap-h4 = convert(hexo-config('style.gap.h4')) || 16px
 $gap-line = convert(hexo-config('style.gap.line')) || 1rem      // 段落间距
 $gap-inline = convert(hexo-config('style.gap.inline')) || .5rem   // 块内行间距
 $gap-card = $gap
diff --git a/source/css/_layout/article.styl b/source/css/_layout/article.styl
index b527593..118477b 100644
--- a/source/css/_layout/article.styl
+++ b/source/css/_layout/article.styl
@@ -96,6 +96,11 @@
 
   h1,h2,h3,h4,h5,h6
     position: relative
+    &:before
+      content: ''
+      display: block
+      height: $navbar-height + 2 * $gap
+      margin-top: 0 - $navbar-height - 2 * $gap
     &:first-child
       margin-top: 0
       padding-top: 0
@@ -104,7 +109,8 @@
       &:before
         content: none
   h1,h2
-    margin-top: $gap-h2
+    &:before
+      margin-top: $gap-h2 - $navbar-height - 2 * $gap
     padding-bottom: .2em
     border-bottom: 1px solid alpha($color-text, 10%)
   h1
@@ -114,11 +120,13 @@
     text-align: $textalign-h2
     color: $color-h2
   h3
-    margin-top: $gap-h3
+    &:before
+      margin-top: $gap-h3 - $navbar-height - 2 * $gap
     text-align: $textalign-h3
     color: $color-h3
   h4
-    padding-top:$gap-h4
+    &:before
+      margin-top: $gap-h4 - $navbar-height - 2 * $gap
     text-align: $textalign-h4
     margin-bottom: $gap-line
     color: $color-h4
diff --git a/source/js/app.js b/source/js/app.js
index 679ce92..6cc9518 100755
--- a/source/js/app.js
+++ b/source/js/app.js
@@ -228,9 +228,9 @@ var customSearch;
 			e.preventDefault();
 			e.stopPropagation();
 			if (e.target.tagName === 'A') {
-				scrolltoElement(e.target);
+				scrolltoElement(e.target, 0);
 			} else if (e.target.tagName === 'SPAN') {
-				scrolltoElement(e.target.parentElement);
+				scrolltoElement(e.target.parentElement, 0);
 			}
 			$toc.removeClass('active');
 			const $tocBtn = $('.s-toc');