You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
69 lines
2.4 KiB
69 lines
2.4 KiB
include utils.pug
|
|
|
|
doctype html
|
|
html(lang="zh-CN")
|
|
head
|
|
block $$head
|
|
title #{site_title || $site && $site.site_title || ''}
|
|
meta(name="description" content=site_description || $site && $site.site_description || '')
|
|
meta(name="keywords" content=keywords || $site && $site.keywords || '')
|
|
if $site && $site.site_favicon
|
|
link(rel="shortcut icon", href=$site.site_favicon)
|
|
meta(charset="utf-8")
|
|
meta(name="viewport" content="width=device-width, initial-scale=1")
|
|
+css('lib/reset.css')
|
|
+css('lib/simplebar.css', true)
|
|
+css('lib/simplebar-shim.css')
|
|
+css('css/layouts/root.css')
|
|
+js('lib/htmx.min.js')
|
|
+js('lib/tailwindcss.3.4.17.js')
|
|
+js('lib/simplebar.min.js', true)
|
|
body
|
|
noscript
|
|
style.
|
|
.simplebar-content-wrapper {
|
|
scrollbar-width: auto;
|
|
-ms-overflow-style: auto;
|
|
}
|
|
|
|
.simplebar-content-wrapper::-webkit-scrollbar,
|
|
.simplebar-hide-scrollbar::-webkit-scrollbar {
|
|
display: initial;
|
|
width: initial;
|
|
height: initial;
|
|
}
|
|
div(data-simplebar style="height: 100%")
|
|
div(style="height: 100%; display: flex; flex-direction: column")
|
|
block $$content
|
|
block $$scripts
|
|
script.
|
|
//- 处理滚动条位置
|
|
window.onload = function() {
|
|
const el = document.querySelector('.simplebar-content-wrapper')
|
|
const scrollTop = sessionStorage.getItem('scrollTop-'+location.pathname)
|
|
el.scrollTop = scrollTop
|
|
el.addEventListener("scroll", function(e) {
|
|
sessionStorage.setItem('scrollTop-'+location.pathname, e.target.scrollTop)
|
|
})
|
|
}
|
|
//- 处理点击慢慢回到顶部
|
|
const backToTopBtn = document.querySelector('.back-to-top');
|
|
if (backToTopBtn) {
|
|
backToTopBtn.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
const el = document.querySelector('.simplebar-content-wrapper');
|
|
if (!el) return;
|
|
const duration = 400;
|
|
const start = el.scrollTop;
|
|
const startTime = performance.now();
|
|
function animateScroll(currentTime) {
|
|
const elapsed = currentTime - startTime;
|
|
const progress = Math.min(elapsed / duration, 1);
|
|
el.scrollTop = start * (1 - progress);
|
|
if (progress < 1) {
|
|
requestAnimationFrame(animateScroll);
|
|
}
|
|
}
|
|
requestAnimationFrame(animateScroll);
|
|
});
|
|
}
|