rohow
87 行
3.4 KiB
HTML
87 行
3.4 KiB
HTML
<!DOCTYPE html>
|
|
<html
|
|
xmlns:th="https://www.thymeleaf.org"
|
|
th:replace="~{modules/layout :: html(title = |${post.spec.title} - ${site.title}|, header = null, content = ~{::content}, footer = null)}"
|
|
>
|
|
<th:block th:fragment="content">
|
|
<!-- 目录组件 -->
|
|
<div class="post-toc-sticky">
|
|
<div class="post-toc" x-data="postToc" x-init="init()">
|
|
<div class="toc-header">
|
|
<span class="toc-header__icon"><></span>
|
|
<span class="toc-header__title">Outline</span>
|
|
</div>
|
|
<ul class="toc-tree">
|
|
<template x-for="(item, index) in items" :key="index">
|
|
<li class="toc-item"
|
|
:class="{'toc-item--active': activeId === item.id}"
|
|
:style="`padding-left: ${getIndent(item.level)}`"
|
|
@click="scrollTo(item.id)">
|
|
<span class="toc-item__toggle toc-item__toggle--empty">▼</span>
|
|
<span class="toc-item__icon"><></span>
|
|
<span class="toc-item__tag" x-text="item.tagName"></span>
|
|
<span class="toc-item__title" x-text="item.title"></span>
|
|
</li>
|
|
</template>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="post" x-data="postLineNum" x-init="init()">
|
|
<h1 class="post-title" th:text="'< ' + ${post.spec.title} + ' >'">Post Title</h1>
|
|
<div class="post-meta">
|
|
<span class="post-date" th:text="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}"> publishTime </span>
|
|
<span class="post-separator">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</span>
|
|
<span class="post-author" th:text="${post.owner.displayName}">Author</span>
|
|
<span class="post-tags-inline" th:each="tag : ${post.tags}">
|
|
<a th:href="${tag.status.permalink}"
|
|
th:title="${tag.spec.displayName}"
|
|
th:text="'#'+${tag.spec.displayName}"
|
|
class="post-tag"
|
|
>#Tag
|
|
</a>
|
|
</span>
|
|
</div>
|
|
<div class="post-body">
|
|
<!-- 行数组件 -->
|
|
<div class="post-line-gutter"></div>
|
|
<div class="post-content">
|
|
<div th:utext="${post.content.content}">Post Content</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="comment-wrap" th:if="${haloCommentEnabled}">
|
|
<h2>评论</h2>
|
|
<halo:comment
|
|
group="content.halo.run"
|
|
kind="Post"
|
|
th:attr="name=${post.metadata.name}"
|
|
/>
|
|
</div>
|
|
<div class="pagination">
|
|
<div class="pagination__title">
|
|
<span class="pagination__title-h">其他文章</span>
|
|
<hr />
|
|
</div>
|
|
<div class="pagination__buttons" th:with="postCursor=${postFinder.cursor(post.metadata?.name)}">
|
|
<span th:if="${postCursor.hasPrevious()}" class="button previous">
|
|
<a th:href="${postCursor.previous?.status?.permalink}">
|
|
<span class="button__icon">< </span>
|
|
<span class="button__text" th:text="${postCursor.previous?.spec?.title}">prevPost</span>
|
|
</a>
|
|
</span>
|
|
<span th:if="${postCursor.hasNext()}" class="button next">
|
|
<a th:href="${postCursor.next?.status?.permalink}">
|
|
<span class="button__text" th:text="${postCursor.next?.spec?.title}">nextPost</span>
|
|
<span class="button__icon"> ></span>
|
|
</a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</th:block>
|
|
</html>
|