108 lines
4.7 KiB
HTML
108 lines
4.7 KiB
HTML
{{ define "main" }}
|
|
<div id="pjax-container">
|
|
<!-- 用于 Pjax 获取当前文章 ID -->
|
|
<div id="data-pid" style="display:none;">{{ .RelPermalink }}</div>
|
|
<article style="margin-bottom: 1.5em;">
|
|
<h1 class="post-title" itemprop="name headline" uk-scrollspy="cls: uk-animation-slide-top-small; delay: 200">{{ .Title }}</h1>
|
|
<div class="meta" uk-scrollspy="cls: uk-animation-slide-bottom-small; delay: 300">
|
|
<span class="meta-item">作者: {{ .Params.author | default .Site.Params.author.name }}</span>
|
|
<span class="meta-item">浏览: <span id="busuanzi_value_page_uv"></span></span>
|
|
<span class="meta-item">字数: {{ .WordCount }}</span>
|
|
<span class="meta-item">阅读: 约 {{ .ReadingTime }} 分钟</span>
|
|
{{ with .GetTerms "categories" }}
|
|
<span class="meta-item">分类:
|
|
{{ range . }}
|
|
<a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
|
|
{{ end }}
|
|
</span>
|
|
{{ end }}
|
|
</div>
|
|
|
|
|
|
|
|
<div class="post-content" id="post-writing" itemprop="articleBody">
|
|
{{ .Content }}
|
|
</div>
|
|
|
|
<script>
|
|
function initPostScrollspy() {
|
|
var content = document.getElementById('post-writing');
|
|
if (!content) return;
|
|
content.querySelectorAll('h2, h3, h4, p, ul, ol, blockquote, table').forEach(function(el) {
|
|
if (!el.hasAttribute('uk-scrollspy')) el.setAttribute('uk-scrollspy', 'cls: uk-animation-fade; delay: 60');
|
|
});
|
|
content.querySelectorAll('figure, img, .post-video, .link-card').forEach(function(el) {
|
|
if (!el.hasAttribute('uk-scrollspy')) el.setAttribute('uk-scrollspy', 'cls: uk-animation-slide-bottom-small; delay: 100');
|
|
});
|
|
}
|
|
document.addEventListener('DOMContentLoaded', initPostScrollspy);
|
|
</script>
|
|
|
|
|
|
</article>
|
|
<hr class="uk-divider-icon">
|
|
|
|
<!-- 打赏模块 -->
|
|
{{ if .Site.Params.reward.enable }}
|
|
<div class="reward-container" uk-scrollspy="cls: uk-animation-slide-bottom-small; delay: 600">
|
|
<button id="reward-btn" class="reward-btn">
|
|
<i class="ri-hand-coin-line"></i>打赏一下
|
|
</button>
|
|
<div id="reward-modal" class="reward-modal">
|
|
<div class="reward-content">
|
|
<div class="reward-close" id="reward-close">
|
|
<i class="ri-close-line"></i>
|
|
</div>
|
|
<h3 class="reward-title">请作者喝杯咖啡，鼓励一下吧！</h3>
|
|
<div class="reward-qr-group">
|
|
{{ if .Site.Params.reward.items }}
|
|
{{ range .Site.Params.reward.items }}
|
|
<div class="reward-qr-item">
|
|
<div class="reward-qr-img-wrapper">
|
|
<img src="{{ .image }}" alt="{{ .name }}打赏" loading="lazy">
|
|
</div>
|
|
<span>{{ .name }}</span>
|
|
</div>
|
|
{{ end }}
|
|
{{ else }}
|
|
{{ with .Site.Params.reward.wechat }}
|
|
<div class="reward-qr-item">
|
|
<div class="reward-qr-img-wrapper">
|
|
<img src="{{ . }}" alt="微信打赏" loading="lazy">
|
|
</div>
|
|
<span>微信</span>
|
|
</div>
|
|
{{ end }}
|
|
{{ with .Site.Params.reward.alipay }}
|
|
<div class="reward-qr-item">
|
|
<div class="reward-qr-img-wrapper">
|
|
<img src="{{ . }}" alt="支付宝打赏" loading="lazy">
|
|
</div>
|
|
<span>支付宝</span>
|
|
</div>
|
|
{{ end }}
|
|
{{ with .Site.Params.reward.qq }}
|
|
<div class="reward-qr-item">
|
|
<div class="reward-qr-img-wrapper">
|
|
<img src="{{ . }}" alt="QQ打赏" loading="lazy">
|
|
</div>
|
|
<span>QQ</span>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{ end }}
|
|
|
|
<div id="comments" class="comments-area">
|
|
<!-- 评论区内容 -->
|
|
|
|
{{ if or (eq .Type "about") (eq .Type "post") }}
|
|
{{ partial "artalk.html" . }}
|
|
{{ end }}
|
|
<!-- 评论区内容结束 -->
|
|
</div>
|
|
</div>
|
|
{{ end }} |