优化页面刷新加载动画
This commit is contained in:
1152958806@qq.com
parent
94004bed4c
commit
11b2e9e1b5
|
|
@ -47,7 +47,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- 分页 -->
|
||||
<div th:replace="~{modules/widgets/page :: page('/archives',${archives})}"></div>
|
||||
<div th:replace="~{modules/widgets/page :: page('/archives',${archives},false)}"></div>
|
||||
</div>
|
||||
<!-- sidebar -->
|
||||
<div th:replace="~{modules/aside :: aside(${theme.config.sidebar.widgetss.categoryWidgets})}"></div>
|
||||
|
|
|
|||
|
|
@ -1091,6 +1091,28 @@ blockquote footer cite::before {
|
|||
}
|
||||
}
|
||||
|
||||
@keyframes slide-in {
|
||||
from {
|
||||
transform: translateY(20px);
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
to {
|
||||
transform: translateY(0);
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes slide-in-op {
|
||||
from {
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
.article-sort {
|
||||
margin-left: 0.5rem;
|
||||
padding-left: 1rem;
|
||||
|
|
@ -7534,6 +7556,7 @@ li.card-archive-list-item {
|
|||
@media screen and (min-width: 1300px) {
|
||||
#aside-content {
|
||||
padding-left: 1rem;
|
||||
animation: slide-in .6s .3s backwards
|
||||
}
|
||||
|
||||
#aside-content .sticky_layout {
|
||||
|
|
@ -8171,6 +8194,7 @@ div#banners {
|
|||
align-content: space-between;
|
||||
width: calc(600px + 1.5rem);
|
||||
position: relative;
|
||||
animation: slide-in .6s .1s backwards
|
||||
}
|
||||
|
||||
div#bannerGroup {
|
||||
|
|
@ -8197,6 +8221,7 @@ div#banners {
|
|||
overflow: hidden;
|
||||
transition: 0.3s;
|
||||
clip-path: inset(0 0 0 0 round 12px);
|
||||
animation: slide-in .6s .1s backwards;
|
||||
}
|
||||
|
||||
div#banners:hover {
|
||||
|
|
@ -8553,6 +8578,7 @@ div#banners {
|
|||
.recent-post-top .categoryGroup {
|
||||
flex-direction: row;
|
||||
height: 24%;
|
||||
animation: slide-in .6s .2s backwards
|
||||
}
|
||||
|
||||
.categoryItem {
|
||||
|
|
@ -8805,6 +8831,7 @@ li {
|
|||
@media screen and (min-width: 1300px) {
|
||||
#bbTimeList {
|
||||
margin-bottom: 1rem;
|
||||
animation: slide-in .6s 0s backwards;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -9597,6 +9624,7 @@ span.recent-post-top-text {
|
|||
margin-bottom: 1rem;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
animation: slide-in .6s .4s backwards;
|
||||
}
|
||||
|
||||
/* 图片在左侧 */
|
||||
|
|
@ -9659,8 +9687,13 @@ span.recent-post-top-text {
|
|||
}
|
||||
|
||||
#category-bar {
|
||||
margin-bottom: 0.75rem;
|
||||
margin-bottom: .75rem;
|
||||
box-shadow: var(--heo-shadow-border);
|
||||
animation: slide-in .6s .3s backwards
|
||||
}
|
||||
|
||||
#category #category-bar {
|
||||
animation: none
|
||||
}
|
||||
|
||||
/* 首页文章第一个 */
|
||||
|
|
@ -13417,6 +13450,12 @@ button.el-button.tk-cancel.el-button--default.el-button--small {
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1300px) {
|
||||
#page>div:not(.author-content-item) {
|
||||
animation:slide-in .6s .2s backwards
|
||||
}
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
|
||||
.article-sort .article-sort-item .article-sort-item-img {
|
||||
|
|
@ -16381,6 +16420,12 @@ span.hexo-douban-pagenum {
|
|||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1300px) {
|
||||
.author-content-item {
|
||||
animation:slide-in .6s 0s backwards
|
||||
}
|
||||
}
|
||||
|
||||
.author-content-item.game-lol::after {
|
||||
box-shadow: 0 -69px 203px 11px #575d8b inset;
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -62,7 +62,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- 分页 -->
|
||||
<div th:replace="~{modules/widgets/page :: page(${'/categories/'+category.spec.slug},${posts})}"></div>
|
||||
<div th:replace="~{modules/widgets/page :: page(${'/categories/'+category.spec.slug},${posts},false)}"></div>
|
||||
</div>
|
||||
<!-- sidebar -->
|
||||
<div th:replace="~{modules/aside :: aside(${theme.config.sidebar.widgetss.categoryWidgets})}"></div>
|
||||
|
|
|
|||
|
|
@ -102,7 +102,7 @@
|
|||
</div>
|
||||
|
||||
<!-- 分页 -->
|
||||
<div th:replace="~{modules/widgets/page :: page('',${posts})}"></div>
|
||||
<div th:replace="~{modules/widgets/page :: page('',${posts},true)}"></div>
|
||||
|
||||
</th:block>
|
||||
|
||||
|
|
|
|||
|
|
@ -5,20 +5,21 @@
|
|||
|
||||
@param path '/path/page/n' 中的 `/path` 需要保留 `/`
|
||||
@param pageInfo Halo类型UrlContextListResult<ListedPostVo>
|
||||
@param isIndex 是否主页
|
||||
-->
|
||||
<nav id="pagination" th:fragment="page(path,pageInfo)">
|
||||
<div class="pagination">
|
||||
<nav id="pagination" th:fragment="page(path,pageInfo,isIndex)">
|
||||
<div class="pagination" th:with="paths = ${isIndex ? path+'/' : path}">
|
||||
|
||||
<!-- 页码按钮 -->
|
||||
<th:block th:if="${pageInfo.page > 3}">
|
||||
<a class="page-number" th:href="${path+'/'}" th:text="1"></a>
|
||||
<a class="page-number" th:href="${paths}" th:text="1"></a>
|
||||
<span class="space" th:if="${pageInfo.page != 4}">…</span>
|
||||
</th:block>
|
||||
|
||||
<th:block th:each="index:${#numbers.sequence(pageInfo.page-2,pageInfo.page+2)}">
|
||||
<span class="page-number current" th:if="${pageInfo.page} == ${index}" th:text="${pageInfo.page}"></span>
|
||||
<a class="page-number" th:unless="${pageInfo.page == index}"
|
||||
th:if="${index > 0 && index <= pageInfo.totalPages}" th:href="${#strings.equals(index, '1') ? path+'/' : path+'/page/'+index}"
|
||||
th:if="${index > 0 && index <= pageInfo.totalPages}" th:href="${#strings.equals(index, '1') ? paths : path+'/page/'+index}"
|
||||
th:text="${index}"></a>
|
||||
</th:block>
|
||||
|
||||
|
|
@ -38,7 +39,7 @@
|
|||
<div class="pagination_tips_next">下页</div>
|
||||
<i class="haofont hao-icon-chevron-right fa-fw"></i>
|
||||
</a>
|
||||
<div th:if="${pageInfo.totalPages > 1}" class="toPageGroup">
|
||||
<div th:if="${pageInfo.totalPages > 1 && isIndex}" class="toPageGroup">
|
||||
<input id="toPageText" maxlength="3" title="跳转到指定页面"
|
||||
oninput="value=value.replace(/[^0-9]/g,'')"
|
||||
onkeyup="if (this.value === '0') this.value = ''">
|
||||
|
|
|
|||
|
|
@ -51,7 +51,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- 分页 -->
|
||||
<div th:replace="~{modules/widgets/page :: page(${'/tags/'+tag.spec.slug},${posts})}"></div>
|
||||
<div th:replace="~{modules/widgets/page :: page(${'/tags/'+tag.spec.slug},${posts},false)}"></div>
|
||||
</div>
|
||||
<!-- sidebar -->
|
||||
<div th:replace="~{modules/aside :: aside(${theme.config.sidebar.widgetss.tagWidgets})}"></div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue