From 8202dbe4c035249897616b2fa277966fec92b798 Mon Sep 17 00:00:00 2001 From: BackRunner Date: Wed, 5 Feb 2020 16:09:08 +0800 Subject: [PATCH 1/3] Style back-to-top button to make sidebar more comfortable --- source/css/_common/components/back-to-top-sidebar.styl | 3 ++- source/js/utils.js | 4 ++-- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/source/css/_common/components/back-to-top-sidebar.styl b/source/css/_common/components/back-to-top-sidebar.styl index f79b14ed26..71b95f0e77 100644 --- a/source/css/_common/components/back-to-top-sidebar.styl +++ b/source/css/_common/components/back-to-top-sidebar.styl @@ -1,7 +1,7 @@ .back-to-top { background: $b2t-sidebar-bg-color; font-size: $b2t-font-size; - margin: 20px - $sidebar-offset -10px -20px; + margin: 8px - $sidebar-offset -10px -18px; opacity: 0; text-align: center; the-transition(); @@ -15,6 +15,7 @@ &.back-to-top-on { cursor: pointer; opacity: $b2t-opacity; + margin-top: 16px; &:hover { opacity: $b2t-opacity-hover; diff --git a/source/js/utils.js b/source/js/utils.js index 809f071d74..247b5ce53c 100644 --- a/source/js/utils.js +++ b/source/js/utils.js @@ -321,8 +321,8 @@ NexT.utils = { var sidebarOffset = CONFIG.sidebar.offset || 12; var sidebarb2tHeight = CONFIG.back2top.enable && CONFIG.back2top.sidebar ? document.querySelector('.back-to-top').offsetHeight : 0; var sidebarSchemePadding = (CONFIG.sidebar.padding * 2) + sidebarNavHeight + sidebarb2tHeight; - // Margin of sidebar b2t: 8px -10px -20px, brings a different of 12px. - if (CONFIG.scheme === 'Pisces' || CONFIG.scheme === 'Gemini') sidebarSchemePadding += (sidebarOffset * 2) - 12; + // Margin of sidebar b2t: -4px -10px -18px, brings a different of 22px. + if (CONFIG.scheme === 'Pisces' || CONFIG.scheme === 'Gemini') sidebarSchemePadding += (sidebarOffset * 2) - 22; // Initialize Sidebar & TOC Height. var sidebarWrapperHeight = document.body.offsetHeight - sidebarSchemePadding + 'px'; document.querySelector('.site-overview-wrap').style.maxHeight = sidebarWrapperHeight; From 54b048d12b9681853310df9b1833e3a5724a260f Mon Sep 17 00:00:00 2001 From: BackRunner Date: Wed, 12 Feb 2020 21:09:55 +0800 Subject: [PATCH 2/3] Put patch into the scheme file --- source/css/_common/components/back-to-top-sidebar.styl | 3 +-- source/css/_schemes/Pisces/_sidebar.styl | 8 ++++++++ 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/source/css/_common/components/back-to-top-sidebar.styl b/source/css/_common/components/back-to-top-sidebar.styl index 71b95f0e77..f79b14ed26 100644 --- a/source/css/_common/components/back-to-top-sidebar.styl +++ b/source/css/_common/components/back-to-top-sidebar.styl @@ -1,7 +1,7 @@ .back-to-top { background: $b2t-sidebar-bg-color; font-size: $b2t-font-size; - margin: 8px - $sidebar-offset -10px -18px; + margin: 20px - $sidebar-offset -10px -20px; opacity: 0; text-align: center; the-transition(); @@ -15,7 +15,6 @@ &.back-to-top-on { cursor: pointer; opacity: $b2t-opacity; - margin-top: 16px; &:hover { opacity: $b2t-opacity-hover; diff --git a/source/css/_schemes/Pisces/_sidebar.styl b/source/css/_schemes/Pisces/_sidebar.styl index 07d86275a4..ec3f634d1d 100644 --- a/source/css/_schemes/Pisces/_sidebar.styl +++ b/source/css/_schemes/Pisces/_sidebar.styl @@ -119,3 +119,11 @@ } } } + +.back-to-top { + margin: 8px - $sidebar-offset -10px -18px; + + &.back-to-top-on { + margin-top: 16px; + } +} From c98972b1340ddc2d8ef6bb9d6eb2da94bde40029 Mon Sep 17 00:00:00 2001 From: BackRunner Date: Thu, 13 Feb 2020 12:56:50 +0800 Subject: [PATCH 3/3] Add a condition judgment to avoid styles be affected when back2top.sidebar set to false --- source/css/_schemes/Pisces/_sidebar.styl | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/source/css/_schemes/Pisces/_sidebar.styl b/source/css/_schemes/Pisces/_sidebar.styl index ec3f634d1d..ed3d69b299 100644 --- a/source/css/_schemes/Pisces/_sidebar.styl +++ b/source/css/_schemes/Pisces/_sidebar.styl @@ -120,10 +120,13 @@ } } -.back-to-top { - margin: 8px - $sidebar-offset -10px -18px; +if (hexo-config('back2top.sidebar')) { + // Only when back2top.sidebar is true, apply the following styles + .back-to-top { + margin: 8px - $sidebar-offset -10px -18px; - &.back-to-top-on { - margin-top: 16px; + &.back-to-top-on { + margin-top: 16px; + } } }