94 lines
5.1 KiB
HTML
94 lines
5.1 KiB
HTML
<!DOCTYPE html>
|
|
<html xmlns:th="http://www.thymeleaf.org"
|
|
th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'moments',title = ${title + ' | ' + site.title}, head = ~{::head}, _title = ${title})}">
|
|
<th:block th:fragment="head">
|
|
<th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${_title},
|
|
_permalink = '/moments',
|
|
_cover = ${theme.config.other.opengraph.image},
|
|
_excerpt = ${site.seo.description},
|
|
_type = 'website')}"></th:block>
|
|
</th:block>
|
|
<th:block th:fragment="content">
|
|
|
|
<div class="page" id="body-wrap">
|
|
|
|
<!-- 头部导航栏 -->
|
|
<header class="not-top-img" id="page-header">
|
|
<nav th:replace="~{modules/nav :: nav(title = ${_title})}"></nav>
|
|
</header>
|
|
<main class="layout hide-aside" id="content-inner">
|
|
<div id="page">
|
|
<div th:replace="~{macro/author-content :: author-content(background = ${theme.config.moment.backgroundImg},
|
|
smallTitle = ${theme.config.moment.smallTitle},
|
|
bigTitle = ${theme.config.moment.bigTitle},
|
|
detail = ${theme.config.moment.detail},
|
|
buttonUrl = ${theme.config.moment.buttonUrl},
|
|
buttonTitle = ${theme.config.moment.buttonTitle})}"></div>
|
|
<div id="bber">
|
|
<section class="timeline page-1">
|
|
<ul class="list" id="waterfall">
|
|
<li class="item" th:each="moment : ${moments.items}"
|
|
th:with="content=${moment.spec.content}">
|
|
<div class="bber-content">
|
|
<div class="datacont" th:if="${not #strings.isEmpty(content.html)}"
|
|
th:utext="${content.html}">
|
|
</div>
|
|
<th:block th:if="${not #lists.isEmpty(content.medium)}">
|
|
<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="${isLazyload ? loadingImg : momentItem.url}"
|
|
th:data-lazy-src="${ isLazyload ? momentItem.url : ''}" title="瞬间配图">
|
|
<div class="bber-content-noimg"></div>
|
|
<div class="bber-content-noimg"></div>
|
|
<div class="bber-content-noimg"></div>
|
|
</div>
|
|
<div th:each="momentItem : ${content.medium}" class="bber-music"
|
|
th:if="${momentItem.type.name == 'VIDEO'}">
|
|
<video th:src="${momentItem.url}"></video>
|
|
</div>
|
|
</th:block>
|
|
</div>
|
|
|
|
<hr>
|
|
<div class="bber-bottom">
|
|
<div class="bber-info">
|
|
<div class="bber-info-time"><i class="haofont hao-icon-clock"></i>
|
|
<time class="datatime"
|
|
th:text="${#dates.format(moment.spec.releaseTime,'yyyy-MM-dd')}"></time>
|
|
</div>
|
|
</div>
|
|
<a class="bber-reply" th:onclick="rightMenuCommentText([[${content.html}]]);"
|
|
data-pjax-state=""> <i class="haofont hao-icon-chat--fill"
|
|
style="font-size: 20px;"></i>
|
|
</a>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</section>
|
|
<!-- 分页还没写 -->
|
|
</div>
|
|
<div id="bber-tips" style="color: var(--heo-secondtext);">- 只展示最近30条短文 -</div>
|
|
<script>heo.reflashEssayWaterFall();</script>
|
|
<hr />
|
|
<!--/* 评论组件 */-->
|
|
<th:block th:replace="~{modules/comment :: comment(group = 'content.halo.run',
|
|
kind = 'SinglePage',
|
|
name = 'moments',
|
|
allowComment = true)}" />
|
|
|
|
</div>
|
|
|
|
|
|
</main>
|
|
<!-- 底部 -->
|
|
<footer th:replace="~{modules/footer}"/>
|
|
<!-- 卡片顶部气泡效果 -->
|
|
<script th:if="${theme.config.other.bubbleEnable}" async data-pjax
|
|
th:src="${assets_link + '/libs/canvas/bubble.js'}"></script>
|
|
</div>
|
|
|
|
</th:block>
|
|
|
|
</html> |