上一篇,下一篇样式修改
This commit is contained in:
parent
2f7d7faccc
commit
2eb8596e0a
|
@ -5,7 +5,8 @@ let heo_cookiesTime = null
|
|||
,heo_musicPlaying = false
|
||||
,heo_keyboard = false
|
||||
,heo_intype = false
|
||||
,lastSayHello = "";
|
||||
,lastSayHello = ""
|
||||
,refreshNum = 1;
|
||||
// 私有函数
|
||||
var heo = {
|
||||
// 检测显示模式
|
||||
|
@ -67,6 +68,12 @@ var heo = {
|
|||
|
||||
// 页脚友链
|
||||
addFriendLinksInFooter: function () {
|
||||
var footerRandomFriendsBtn = document.getElementById("footer-random-friends-btn");
|
||||
if(!footerRandomFriendsBtn) return;
|
||||
footerRandomFriendsBtn.style.opacity = "0.2";
|
||||
footerRandomFriendsBtn.style.transitionDuration = "0.3s";
|
||||
footerRandomFriendsBtn.style.transform = "rotate(" + 360 * refreshNum++ + "deg)";
|
||||
|
||||
const fetchUrl = "/apis/api.plugin.halo.run/v1alpha1/plugins/PluginLinks/links?keyword=&sort=priority,asc"
|
||||
const linksUrl = GLOBAL_CONFIG.source.links.linksUrl
|
||||
const num = GLOBAL_CONFIG.source.links.linksNum
|
||||
|
@ -84,6 +91,9 @@ var heo = {
|
|||
document.getElementById("friend-links-in-footer").innerHTML = htmlText;
|
||||
}
|
||||
})
|
||||
setTimeout(()=>{
|
||||
footerRandomFriendsBtn.style.opacity = "1";
|
||||
}, 300)
|
||||
},
|
||||
|
||||
//禁止图片右键单击
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
.comment-barrage {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 20px;
|
||||
right: 60px;
|
||||
padding: 0 0 20px 10px;
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
|
|
|
@ -137,29 +137,6 @@ if(GLOBAL_CONFIG.htmlType!='comments') {
|
|||
}, 1000)
|
||||
}
|
||||
|
||||
|
||||
// 自动隐藏
|
||||
document.addEventListener('scroll', btf.throttle(function () {
|
||||
//滚动条高度+视窗高度 = 可见区域底部高度
|
||||
var visibleBottom = window.scrollY + document.documentElement.clientHeight;
|
||||
//可见区域顶部高度
|
||||
var visibleTop = window.scrollY;
|
||||
// 获取翻页按钮容器
|
||||
var pagination = document.querySelector('.comment-barrage');
|
||||
// 获取位置监测容器,此处采用评论区
|
||||
var eventlistner = document.getElementById('post-comment');
|
||||
if (eventlistner && pagination) {
|
||||
var centerY = eventlistner.offsetTop + 200;
|
||||
if (document.body.clientWidth > 768) {
|
||||
if (centerY > visibleBottom) {
|
||||
pagination.style.bottom = '0';
|
||||
} else {
|
||||
pagination.style.bottom = '-200px';
|
||||
}
|
||||
}
|
||||
}
|
||||
}, 200))
|
||||
|
||||
initCommentBarrage();
|
||||
|
||||
if (localStorage.getItem('commentBarrageSwitch') !== 'false') {
|
||||
|
|
|
@ -1,12 +1,5 @@
|
|||
// var full_page = document.getElementsByClassName("full_page");
|
||||
// if (full_page.length != 0) {
|
||||
// full_page[0].style.background = "transparent";
|
||||
// }
|
||||
|
||||
|
||||
function checkOpen() {
|
||||
}
|
||||
|
||||
function checkOpen() {}
|
||||
checkOpen.toString = function () {
|
||||
this.opened = true;
|
||||
};
|
||||
|
@ -191,24 +184,6 @@ function showcopy() {
|
|||
}
|
||||
}
|
||||
|
||||
//导航栏上显示标题
|
||||
// var OriginTitile = document.title;
|
||||
// var titleTime;
|
||||
// document.addEventListener('visibilitychange', function () {
|
||||
// if (document.hidden) {
|
||||
// // $('[rel="shortcut icon"]').attr('href', "https://cdn.jsdelivr.net/gh/Akilarlxh/Akilarlxh.github.io@v3.3.3_3/img/siteicon/favicon.png");
|
||||
// document.title = '张洪Heo';
|
||||
// clearTimeout(titleTime);
|
||||
// }
|
||||
// else {
|
||||
// // $('[rel="shortcut icon"]').attr('href', "https://cdn.jsdelivr.net/gh/Akilarlxh/Akilarlxh.github.io@v3.3.3_3/img/siteicon/favicon.png");
|
||||
// document.title = OriginTitile;
|
||||
// // titleTime = setTimeout(function () {
|
||||
// // document.title = OriginTitile;
|
||||
// // }, 2000);
|
||||
// }
|
||||
// });
|
||||
|
||||
// 早上好问好
|
||||
// 获取时间
|
||||
var getTimeState = () => {
|
||||
|
@ -390,7 +365,6 @@ document.addEventListener('scroll', btf.throttle(function () {
|
|||
heo.initThemeColor()
|
||||
}, 200))
|
||||
|
||||
//友链随机传送
|
||||
//友链随机传送
|
||||
function travelling() {
|
||||
const links = "/apis/api.plugin.halo.run/v1alpha1/plugins/PluginLinks/links?keyword=&sort=priority,asc"
|
||||
|
@ -577,29 +551,19 @@ $(".topGroup").hover(function () {
|
|||
});
|
||||
|
||||
|
||||
//文章页面上一篇下一篇
|
||||
// document.addEventListener('scroll', btf.throttle(function () {
|
||||
// //滚动条高度+视窗高度 = 可见区域底部高度
|
||||
// var visibleBottom = window.scrollY + document.documentElement.clientHeight;
|
||||
// //可见区域顶部高度
|
||||
// var visibleTop = window.scrollY;
|
||||
// // 获取翻页按钮容器
|
||||
// var pagination = document.getElementById('pagination');
|
||||
// // 获取位置监测容器,此处采用评论区
|
||||
// var eventlistner = document.getElementById('post-tools');
|
||||
// if (eventlistner && pagination) {
|
||||
// var centerY = eventlistner.offsetTop + (eventlistner.offsetHeight / 2);
|
||||
// if (document.body.clientWidth > 1300) {
|
||||
// if (centerY < visibleTop) {
|
||||
// pagination.classList.add("show-window");
|
||||
// } else {
|
||||
// pagination.classList.remove("show-window");
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }, 200));
|
||||
|
||||
|
||||
function initObserver() {
|
||||
var e = document.getElementById("post-comment")
|
||||
, t = document.getElementById("pagination");
|
||||
e && new IntersectionObserver((function(e) {
|
||||
e.forEach((function(e) {
|
||||
e.isIntersecting ? (t && t.classList.add("show-window"),
|
||||
document.querySelector(".comment-barrage").style.bottom = "-200px") : (t && t.classList.remove("show-window"),
|
||||
document.querySelector(".comment-barrage").style.bottom = "0px")
|
||||
}
|
||||
))
|
||||
}
|
||||
)).observe(e)
|
||||
}
|
||||
|
||||
// 页面百分比
|
||||
function percent() {
|
||||
|
@ -670,6 +634,7 @@ function initBlog() {
|
|||
heo.initThemeColor(),
|
||||
//隐藏加载动画
|
||||
GLOBAL_CONFIG.loadingBox && heo.hideLoading(),
|
||||
initObserver(),
|
||||
checkUrlAndAddHideBanner()
|
||||
}
|
||||
|
||||
|
|
|
@ -3187,14 +3187,6 @@ ul {
|
|||
height: 150px;
|
||||
}
|
||||
|
||||
#pagination .next-post2 a,
|
||||
#pagination .prev-post2 a {
|
||||
position: relative;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
#pagination .next-post:hover img.next-cover,
|
||||
#pagination .next-post:hover img.prev-cover,
|
||||
#pagination .prev-post:hover img.next-cover,
|
||||
|
@ -11553,13 +11545,6 @@ a.reward-main-btn:hover {
|
|||
background: #363636;
|
||||
}
|
||||
|
||||
.next-post2.pull-right,
|
||||
.prev-post2.pull-left,
|
||||
#pagination .prev-post2,
|
||||
#pagination .next-post2 {
|
||||
background: #363636;
|
||||
}
|
||||
|
||||
#preimg{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
|
@ -11573,10 +11558,7 @@ a.reward-main-btn:hover {
|
|||
object-fit: cover;
|
||||
border-radius: 0;
|
||||
}
|
||||
.prev-post2.pull-left:hover #preimg {
|
||||
opacity: 1;
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.prev-post.pull-left:hover #preimg {
|
||||
opacity: 1;
|
||||
transform: scale(1.1);
|
||||
|
@ -11587,15 +11569,10 @@ a.reward-main-btn:hover {
|
|||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.next-post2.pull-right:hover #preimg {
|
||||
opacity: 1;
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
#pagination .next-post a {
|
||||
border-left: var(--heo-card-bg);
|
||||
border-left-width: 3px;
|
||||
border-left:var(--heo-main-op);
|
||||
border-left-width: .5px;
|
||||
border-left-style: solid;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
|
@ -11607,9 +11584,9 @@ a.reward-main-btn:hover {
|
|||
}
|
||||
|
||||
#pagination .prev-post a {
|
||||
border-right: var(--heo-card-bg);
|
||||
border-right-width: 3px;
|
||||
border-right-style: solid;
|
||||
border-right: var(--heo-main-op);
|
||||
border-right-width: .5px;
|
||||
border-right-style: solid
|
||||
}
|
||||
|
||||
#pagination .pagination-info {
|
||||
|
@ -11623,17 +11600,16 @@ a.reward-main-btn:hover {
|
|||
margin: auto;
|
||||
height: 100%;
|
||||
}
|
||||
#pagination .prev-post a:hover div,
|
||||
#pagination .next-post a:hover div {
|
||||
color: var(--heo-white) !important;
|
||||
|
||||
#pagination .next-post a:hover div,#pagination .prev-post a:hover div {
|
||||
color: var(--heo-white)!important
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
|
||||
#pagination .prev-post a:hover,
|
||||
#pagination .next-post a:hover {
|
||||
background: var(--heo-none);
|
||||
#pagination .next-post a:hover,#pagination .prev-post a:hover {
|
||||
background:var(--heo-none)
|
||||
}
|
||||
|
||||
}
|
||||
|
@ -11658,37 +11634,137 @@ a.reward-main-btn:hover {
|
|||
filter: blur(5px);
|
||||
}
|
||||
|
||||
#post #pagination .prev-post .label,
|
||||
#pagination .next-post .label {
|
||||
color: white;
|
||||
}
|
||||
|
||||
#post #pagination .prev-post2 .label,
|
||||
#pagination .next-post2 .label {
|
||||
color: white;
|
||||
}
|
||||
|
||||
#post #pagination .prev_info,
|
||||
#pagination .next_info {
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
#pagination .next_info,#post #pagination .prev_info {
|
||||
font-weight: 700;
|
||||
-webkit-line-clamp: 2;
|
||||
white-space: normal;
|
||||
line-height: 1.3;
|
||||
font-size: 0.9rem;
|
||||
font-size: .9rem;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
margin-bottom: 10px
|
||||
}
|
||||
|
||||
#post #pagination {
|
||||
overflow: hidden;
|
||||
position: inherit;
|
||||
border: var(--style-border-always)
|
||||
}
|
||||
|
||||
#pagination.pagination-post {
|
||||
background: var(--heo-card-bg);
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1300px) {
|
||||
#post #pagination {
|
||||
position:fixed;
|
||||
width: 300px;
|
||||
bottom: -100px;
|
||||
right: 60px;
|
||||
z-index: 1000;
|
||||
height: fit-content;
|
||||
transition: cubic-bezier(.42,0,.3,1.11) .3s;
|
||||
border: var(--style-border);
|
||||
border-radius: 12px;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
z-index: 1002
|
||||
}
|
||||
|
||||
|
||||
|
||||
#post #pagination.show-window {
|
||||
bottom: 20px;
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
#post #pagination:hover {
|
||||
border: var(--style-border-hover)
|
||||
}
|
||||
|
||||
#pagination .next-post a,#pagination .prev-post a {
|
||||
border: none;
|
||||
height: fit-content;
|
||||
padding: .5rem 0
|
||||
}
|
||||
|
||||
#pagination.pagination-post {
|
||||
border-radius: 0
|
||||
}
|
||||
|
||||
#pagination .next_info,#post #pagination .prev_info {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
margin-bottom: 0
|
||||
}
|
||||
|
||||
#pagination .pagination-info {
|
||||
padding: .5rem 1rem;
|
||||
transform: none
|
||||
}
|
||||
|
||||
#post #pagination {
|
||||
background: 0 0
|
||||
}
|
||||
|
||||
#pagination .next_info,#post #pagination .prev_info {
|
||||
color: var(--heo-fontcolor);
|
||||
}
|
||||
|
||||
#pagination .next-post,#pagination .prev-post,.next-post.pull-right,.prev-post.pull-left {
|
||||
background: var(--heo-maskbgdeep);
|
||||
-webkit-backdrop-filter: blur(5px);
|
||||
backdrop-filter: blur(5px);
|
||||
transform: translateZ(0)
|
||||
}
|
||||
|
||||
#pagination .next-post a:hover,#pagination .prev-post a:hover {
|
||||
background: var(--heo-main);
|
||||
}
|
||||
|
||||
#pagination .next-post .label,#post #pagination .prev-post .label {
|
||||
color: var(--heo-fontcolor)
|
||||
}
|
||||
|
||||
#pagination.pagination-post .next-post.pull-full img,#pagination.pagination-post .next-post.pull-right img,#pagination.pagination-post .prev-post.pull-full img,#pagination.pagination-post .prev-post.pull-left img {
|
||||
display: none;
|
||||
top: 0
|
||||
}
|
||||
|
||||
|
||||
#post #pagination .prev-post .label,
|
||||
#pagination .next-post .label {
|
||||
color: var(--heo-fontcolor)
|
||||
}
|
||||
|
||||
|
||||
.prev-post.pull-left {
|
||||
display: none
|
||||
}
|
||||
|
||||
.next-post.pull-right {
|
||||
width: 100%!important
|
||||
}
|
||||
|
||||
#pagination .next-post .pagination-info {
|
||||
text-align: left;
|
||||
position: relative
|
||||
}
|
||||
|
||||
#pagination .next-post .label,#post #pagination .prev-post .label {
|
||||
color: var(--heo-fontcolor);
|
||||
font-weight: 700;
|
||||
font-size: 12px;
|
||||
margin-bottom: .5rem;
|
||||
border-bottom: var(--style-border);
|
||||
line-height: 1;
|
||||
padding-bottom: .5rem
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.prev-post.pull-left {
|
||||
border-bottom: var(--style-border-always);
|
||||
|
|
|
@ -19,6 +19,12 @@
|
|||
#rightside {
|
||||
display: none;
|
||||
}
|
||||
.comment-barrage {
|
||||
right: 20px;
|
||||
}
|
||||
#post #pagination {
|
||||
right: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<link th:if="${theme.config.tool.rightside.readmode && theme.config.tool.rightside.rightsideEnable}"
|
||||
|
|
|
@ -45,9 +45,9 @@
|
|||
<div th:if="${theme.config.footer.footer_group.enable_footer_group}" class="footer-group">
|
||||
<div class="footer-title-group">
|
||||
<h3 class="footer-title">友链</h3>
|
||||
<a class="random-friends-btn"
|
||||
<a class="random-friends-btn" id="footer-random-friends-btn"
|
||||
href="javascript:heo.addFriendLinksInFooter();" rel="external nofollow" title="换一批友情链接"
|
||||
data-pjax-state="external"><i class="haofont hao-icon-arrow-rotate-right"></i></a>
|
||||
data-pjax-state="external"><i class="haofont hao-icon-arrow-rotate-right" style="font-size: 16px;"></i></a>
|
||||
</div>
|
||||
<div class="footer-links" id="friend-links-in-footer"></div>
|
||||
</div>
|
||||
|
|
|
@ -128,10 +128,10 @@
|
|||
<!-- 版权声明 -->
|
||||
<th:block th:replace="~{modules/post/copyright :: copyright}"></th:block>
|
||||
|
||||
<nav class="pagination-post" id="pagination"
|
||||
<nav class="pagination-post needEndHide" id="pagination"
|
||||
th:with="postCursor = ${postFinder.cursor(post.metadata.name)},
|
||||
postRandomImg=${#strings.contains(theme.config.layout.postRandomImg,'?') ? theme.config.layout.postRandomImg+'&' : theme.config.layout.postRandomImg+'?'}">
|
||||
<div th:class="${postCursor.hasPrevious()==true && postCursor.hasNext()==false} ? 'prev-post2 pull-left postcarnepre' : 'prev-post pull-left'">
|
||||
<div th:if="${postCursor.hasPrevious()}" th:class="${postCursor.hasNext()==false} ? 'prev-post pull-full ' : 'prev-post pull-left'">
|
||||
<a th:if="${postCursor.hasPrevious()}" th:href="@{${postCursor.previous.status.permalink}}">
|
||||
<img alt="cover" id="preimg" class="nolazyload"
|
||||
th:with="img = ${#strings.isEmpty(postCursor.previous.spec.cover) ? postRandomImg+postCursor.previous.spec.title : postCursor.previous.spec.cover}"
|
||||
|
@ -144,7 +144,7 @@
|
|||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div th:class="${postCursor.hasPrevious()==false && postCursor.hasNext()==true} ? 'next-post2 pull-right postcarnepre':'next-post pull-right'">
|
||||
<div th:if="${postCursor.hasNext()}" th:class="${postCursor.hasPrevious()==false} ? 'next-post pull-full ':'next-post pull-right'">
|
||||
<a th:if="${postCursor.hasNext()}" th:href="@{${postCursor.next.status.permalink}}">
|
||||
<img alt="cover" id="preimg" class="nolazyload"
|
||||
th:with="img = ${#strings.isEmpty(postCursor.next.spec.cover) ? postRandomImg+postCursor.next.spec.title : postCursor.next.spec.cover}"
|
||||
|
|
Loading…
Reference in New Issue