diff options
author | Jeffrey Tse <jeffreytse.mail@gmail.com> | 2019-09-24 15:19:05 +0800 |
---|---|---|
committer | Jeffrey Tse <jeffreytse.mail@gmail.com> | 2019-09-24 15:19:05 +0800 |
commit | bc91aa6b7360bf520fd7e0f7a61a934c4d20ea33 (patch) | |
tree | dfe8ec88056fd2283f12e0656d32e056bd86cc6a | |
parent | 4b70145bedae98e8dc2d34b8e83eca0c669bad87 (diff) |
fix: corrcet hash locate, menu item hilight issues
-rw-r--r-- | _includes/extensions/hashlocate.html | 17 | ||||
-rw-r--r-- | _includes/sidebar/article-menu.html | 9 | ||||
-rw-r--r-- | _sass/misc/common-list.scss | 4 | ||||
-rw-r--r-- | _sass/yat.scss | 2 |
4 files changed, 20 insertions, 12 deletions
diff --git a/_includes/extensions/hashlocate.html b/_includes/extensions/hashlocate.html index 6faf553..5194273 100644 --- a/_includes/extensions/hashlocate.html +++ b/_includes/extensions/hashlocate.html @@ -7,18 +7,21 @@ return; } - var header = document.querySelector('header'); + var header = document.querySelector('header.site-header'); + var headerRect = header.getBoundingClientRect(); + var headerTop = Math.floor(headerRect.top); + var headerHeight = Math.floor(headerRect.height); var scrollPos = getScrollPos(); - var offsetY = element.offsetTop - (header.offsetTop + header.offsetHeight + 20); + var offsetY = element.offsetTop - (headerTop + headerHeight + 20); - if (offsetY == scrollPos.y) { + if (offsetY == scrollPos.y) { return; } - if (header.offsetTop == 0 && offsetY > scrollPos.y) { - offsetY += header.offsetHeight; - } else if (header.offsetTop < 0 && offsetY < scrollPos.y) { - offsetY -= header.offsetHeight; + if (headerTop == 0 && offsetY > scrollPos.y) { + offsetY += headerHeight + 2; + } else if (headerTop < 0 && offsetY < scrollPos.y) { + offsetY -= headerHeight - 2; } smoothScrollTo(offsetY); diff --git a/_includes/sidebar/article-menu.html b/_includes/sidebar/article-menu.html index 7f83160..c4286b1 100644 --- a/_includes/sidebar/article-menu.html +++ b/_includes/sidebar/article-menu.html @@ -36,9 +36,12 @@ var changed = true; for (var i = headings.length - 1; i >= 0; i--) { var h = headings[i]; - var clientRect = h.getBoundingClientRect(); - var headerHeight = header.offsetTop + header.offsetHeight + 20; - if (clientRect.top <= headerHeight) { + var headingRect = h.getBoundingClientRect(); + var headerRect = header.getBoundingClientRect(); + var headerTop = Math.floor(headerRect.top); + var headerHeight = Math.floor(headerRect.height); + var headerHeight = headerTop + headerHeight + 20; + if (headingRect.top <= headerHeight) { var id = 'h-' + h.getAttribute('id'); var curActive = menu.querySelector('a[href="#' + id + '"]'); if (curActive) { diff --git a/_sass/misc/common-list.scss b/_sass/misc/common-list.scss index 54b7165..e7439a1 100644 --- a/_sass/misc/common-list.scss +++ b/_sass/misc/common-list.scss @@ -15,6 +15,8 @@ } li { + border-bottom: solid 1px #fff; + &:last-child { border-bottom: none; } @@ -29,7 +31,7 @@ transition: background 0.2s; &:hover { - background: mix($theme-color, #fff, 20%); + background: mix($theme-color, #eaeaea, 20%); } } diff --git a/_sass/yat.scss b/_sass/yat.scss index 446a791..4db827b 100644 --- a/_sass/yat.scss +++ b/_sass/yat.scss @@ -31,7 +31,7 @@ $footer-height: $header-height * 1.05 !default; $footer-text-color: rgba(lighten(invert($theme-color), 30%), 50%) !default; $footer-background-color: darken($theme-color, 5%) !default; -$banner-height: 400px !default; +$banner-height: 420px !default; $banner-text-color: lighten($white-color, 0%) !default; $banner-background: darken(#333, 5%) !default; |