github
/
halo-theme-hao
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化瞬间页面图片展示

This commit is contained in:
1152958806@qq.com 2023-08-06 20:54:50 +08:00 committed by 困困鱼
parent 8fa12607ff
commit 8e279c18bb
3 changed files with 28 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
templates/assets/js/main.js
View File

@ -173,7 +173,7 @@ document.addEventListener('DOMContentLoaded', function () {
const jqLoadAndRun = () => {
const $fancyboxEle = GLOBAL_CONFIG.lightbox === 'fancybox'
? document.querySelectorAll('#article-container :not(a):not(.gallery-group):not(.site-card-avatar):not(.flink-item-info) > img, #article-container > img,.bber-content-img > img')
? document.querySelectorAll('#article-container :not(a):not(.gallery-group):not(.site-card-avatar):not(.flink-item-info) > img, #article-container > img,.bber-container-img > img')
: []
const fbLengthNoZero = $fancyboxEle.length > 0
const $jgEle = document.querySelectorAll('#article-container .gallery')

26
templates/assets/zhheo/zhheoblog.css
View File

@ -14982,22 +14982,34 @@ figure.gallery-group:hover .gallery-group-name::after {
/* 图片 */
#bber .bber-content-img img {
#bber .bber-container-img img {
object-fit: cover;
max-height: 100%;
border-radius: 12px;
}
#bber .bber-content-img {
height: 100px;
margin: auto;
margin-top: 0.2rem;
#bber .bber-container-img {
display: flex;
align-items: center;
justify-content: space-around;
width: 100%;
flex-wrap: wrap;
margin-bottom: 0.3rem;
margin-left: 0;
border-radius: 12px;
}
#bber .bber-container-img a {
height: 100px;
border-radius: 8px;
overflow: hidden;
display: flex;
justify-content: center;
position: relative;
/* width:calc(100% / 4 - 5px); */
margin-bottom: 10px
}
#bber .bber-container-img .bber-content-noimg {
width: calc(100% / 4 - 5px)
}
/* 时间 */

14
templates/moments.html
View File

@ -27,17 +27,19 @@
<p class="datacont" th:if="${not #strings.isEmpty(content.html)}"
th:utext="${content.html}"></p>
</div>
<th:block th:each="momentItem : ${content.medium}"
th:if="${not #lists.isEmpty(content.medium)}">
<th:block th:if="${not #lists.isEmpty(content.medium)}">
<div class="bber-content-img" th:if="${momentItem.type.name == 'PHOTO'}">
<img class="bber-content-image-self entered loaded" data-ll-status="loaded"
<div class="bber-container-img" th:if="${#strings.contains(content.medium,'PHOTO')}">
<img th:each="momentItem : ${content.medium}"
th:if="${momentItem.type.name == 'PHOTO'}"
th:src="${momentItem.url}" title="瞬间配图">
<div class="bber-content-noimg"></div>
<div class="bber-content-noimg"></div>
<div class="bber-content-noimg"></div>
</div>
<div class="bber-music" th:if="${momentItem.type.name == 'VIDEO'}">
<div th:each="momentItem : ${content.medium}" class="bber-music" th:if="${momentItem.type.name == 'VIDEO'}">
<video th:src="${momentItem.url}"></video>
</div>
</th:block>
<hr>
<div class="bber-bottom">