diff --git a/layout/_partial/scripts.ejs b/layout/_partial/scripts.ejs
index e453e88..3733c72 100644
--- a/layout/_partial/scripts.ejs
+++ b/layout/_partial/scripts.ejs
@@ -1,10 +1,13 @@
<%- js([
'js/main.js',
'js/header-shrink.js',
- 'js/toggle-mode.js',
- 'js/scroll-to-top.js'
+ 'js/toggle-mode.js'
]) %>
+<% if (theme.back2top.enable) { %>
+ <%- js('js/scroll-to-top.js') %>
+<% } %>
+
<% if (is_post()) { %>
<% if (theme.codeblock.copy_button.enable) { %>
diff --git a/layout/_partial/tools.ejs b/layout/_partial/tools.ejs
index 679e956..8e4b414 100644
--- a/layout/_partial/tools.ejs
+++ b/layout/_partial/tools.ejs
@@ -11,6 +11,7 @@
<% if (theme.local_search.enable) { %>
<% } %>
diff --git a/layout/page.ejs b/layout/page.ejs
index b524f13..9bb5968 100644
--- a/layout/page.ejs
+++ b/layout/page.ejs
@@ -39,11 +39,16 @@
<%- partial('_partial/tools') %>
-
-
-
-
-
+ <% if (theme.back2top.enable) { %>
+
+ <% } %>
diff --git a/source/css/layout/_partial/tools.styl b/source/css/layout/_partial/tools.styl
index 0e8e443..0c8d71d 100644
--- a/source/css/layout/_partial/tools.styl
+++ b/source/css/layout/_partial/tools.styl
@@ -26,6 +26,13 @@ $li-margin-bottom = 10px;
border: 1px solid var(--third-text-color);
}
+ &:hover {
+ transition();
+ color: var(--background-color);
+ background: var(--primary-color);
+ }
+
+
&.rss {
padding: 0;
@@ -47,12 +54,6 @@ $li-margin-bottom = 10px;
}
- &:hover {
- transition();
- color: var(--background-color);
- background: var(--primary-color);
- }
-
&:last-child {
margin-bottom: 0;
}
diff --git a/source/css/layout/common/animated.styl b/source/css/layout/common/animated.styl
index b2d4618..9cc2b01 100644
--- a/source/css/layout/common/animated.styl
+++ b/source/css/layout/common/animated.styl
@@ -37,7 +37,6 @@ the-transition-ease-out() {
transform: translateY(0);
}
}
-
.title-hover-animation {
display: inline-block;
position: relative;
@@ -64,4 +63,4 @@ the-transition-ease-out() {
transform: scaleX(1);
}
-}
+}
\ No newline at end of file
diff --git a/source/css/layout/page.styl b/source/css/layout/page.styl
index c13725d..564d712 100644
--- a/source/css/layout/page.styl
+++ b/source/css/layout/page.styl
@@ -58,12 +58,16 @@ $component-interspace = 30px;
.sidebar-tools {
position: fixed;
top: $header-height + $component-interspace;
- left: ((100% - $main-content-width) / 4);
+ if (hexo-config('side-tools.position') == left) {
+ left: ((100% - $main-content-width) / 4);
+ } else {
+ right: ((100% - $main-content-width) / 4);
+ }
transition();
}
- .scroll-to-top {
+ /*.scroll-to-top {
display: none;
position: fixed;
right: ((100% - $main-content-width) / 4);
@@ -82,6 +86,44 @@ $component-interspace = 30px;
}
}
}
+*/
+
+ .scroll-to-top {
+ display: none;
+ position: fixed;
+
+ if (hexo-config('back2top.position') == left) {
+ left: ((100% - $main-content-width) / 4);
+ } else {
+ right: ((100% - $main-content-width) / 4);
+ }
+ bottom: $component-interspace;
+
+ li {
+ cursor: pointer;
+ padding: 2px;
+ width: 32px;
+ height: 30px;
+ border-radius: 5px;
+ font-size: 0.9em;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background: var(--background-color);
+
+ if (hexo-config('magic.enable') == true) {
+ magic-style(1.1);
+ } else {
+ border: 1px solid var(--third-text-color);
+ }
+
+ &:hover {
+ transition();
+ color: var(--background-color);
+ background: var(--primary-color);
+ }
+ }
+ }
}
.page-bottom {
@@ -111,16 +153,28 @@ $component-interspace = 30px;
}
.sidebar-tools {
- left: 2% !important;
- transform-origin: right top;
+ if (hexo-config('side-tools.position') == left) {
+ left: 2% !important;
+ transform-origin: left top;
+ } else {
+ right: 2% !important;
+ transform-origin: right top;
+ }
transform: scale(0.8);
}
//.sidebar-toc {
// right: 2% !important;
//}
- //.scroll-to-top {
- // right: 2% !important;
- //}
+ .scroll-to-top {
+ if (hexo-config('back2top.position') == left) {
+ left: 2% !important;
+ transform-origin: left bottom;
+ } else {
+ right: 2% !important;
+ transform-origin: right bottom;
+ }
+ transform: scale(0.8);
+ }
}
\ No newline at end of file
diff --git a/source/js/header-shrink.js b/source/js/header-shrink.js
index 6b7237f..a1584b3 100644
--- a/source/js/header-shrink.js
+++ b/source/js/header-shrink.js
@@ -3,7 +3,6 @@ const headerDom = document.querySelector('.header-wrapper');
const menuBarDom = document.querySelector('.menu-bar');
const windowMaskDom = document.querySelector('.window-mask');
const scrollPercentDom = document.querySelector('.scroll-percent');
-const scrollToTopDom = document.querySelector('.scroll-to-top');
let isHeaderShrink = false;
const headerHeight = headerDom.getBoundingClientRect().height;
@@ -19,21 +18,6 @@ window.addEventListener('scroll', function (_e) {
headerDom.classList.remove('header-wrapper-shrink');
pageTemplateDom.classList.remove('page-top-shrink');
}
-
- // show scroll percent
- const scrollHeight = document.body.scrollHeight || document.documentElement.scrollHeight;
- const clientHeight = window.innerHeight || document.documentElement.clientHeight;
- const percent = Math.round(scrollTop / (scrollHeight - clientHeight) * 100).toFixed(0);
-
-
- if (percent === '0') {
- scrollToTopDom.style.display = 'none';
- } else {
- scrollToTopDom.style.display = 'block';
- scrollPercentDom.innerHTML = percent + '%';
- }
-
-
});
diff --git a/source/js/scroll-to-top.js b/source/js/scroll-to-top.js
index ef09e6a..77bc3b9 100644
--- a/source/js/scroll-to-top.js
+++ b/source/js/scroll-to-top.js
@@ -1,14 +1,34 @@
-scrollToTopDom.addEventListener('click', () => {
- let scrollTopTimer = setInterval(function () {
- let top = document.body.scrollTop || document.documentElement.scrollTop;
- let speed = top / 3;
- if (document.body.scrollTop !== 0) {
- document.body.scrollTop -= speed;
+(function () {
+ const scrollToTopDom = document.querySelector('.scroll-to-top');
+
+ scrollToTopDom.addEventListener('click', () => {
+ let scrollTopTimer = setInterval(function () {
+ let top = document.body.scrollTop || document.documentElement.scrollTop;
+ let speed = top / 2;
+ if (document.body.scrollTop !== 0) {
+ document.body.scrollTop -= speed;
+ } else {
+ document.documentElement.scrollTop -= speed;
+ }
+ if (top === 0) {
+ clearInterval(scrollTopTimer);
+ }
+ }, 30);
+ });
+
+ window.addEventListener('scroll', function (_e) {
+ // back to top
+ // show scroll percent
+ const scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
+ const scrollHeight = document.body.scrollHeight || document.documentElement.scrollHeight;
+ const clientHeight = window.innerHeight || document.documentElement.clientHeight;
+ const percent = Math.round(scrollTop / (scrollHeight - clientHeight) * 100).toFixed(0);
+ if (percent === '0') {
+ scrollToTopDom.style.display = 'none';
} else {
- document.documentElement.scrollTop -= speed;
+ scrollToTopDom.style.display = 'block';
+ scrollPercentDom.innerHTML = parseInt(percent) < 10 ? `0${percent}` : percent;
}
- if (top === 0) {
- clearInterval(scrollTopTimer);
- }
- }, 30);
-});
\ No newline at end of file
+ });
+
+})();
\ No newline at end of file