new
This commit is contained in:
@@ -0,0 +1,34 @@
|
||||
<style type="text/css">
|
||||
/* don't remove. */
|
||||
.about-cover {
|
||||
height: 90.2vh;
|
||||
}
|
||||
</style>
|
||||
<div class="bg-cover pd-header about-cover">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col s10 offset-s1 m8 offset-m2 l8 offset-l2">
|
||||
<div class="brand">
|
||||
<div class="title center-align">
|
||||
404
|
||||
</div>
|
||||
<div class="description center-align">
|
||||
<%= page.description %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% if (theme.banner.enable) { %>
|
||||
<script>
|
||||
// 每天切换 banner 图. Switch banner image every day.
|
||||
var bannerUrl = "<%- theme.jsDelivr.url %><%- url_for('/medias/banner/') %>" + new Date().getDay() + '.jpg';
|
||||
$('.bg-cover').css('background-image', 'url(' + bannerUrl + ')');
|
||||
</script>
|
||||
<% } else { %>
|
||||
<script>
|
||||
$('.bg-cover').css('background-image', 'url(<%- theme.jsDelivr.url %><%- url_for('/medias/banner/0.jpg') %>)');
|
||||
</script>
|
||||
<% } %>
|
||||
@@ -0,0 +1,6 @@
|
||||
<!-- 回到顶部按钮 -->
|
||||
<div id="backTop" class="top-scroll">
|
||||
<a class="btn-floating btn-large waves-effect waves-light" href="#!">
|
||||
<i class="fas fa-arrow-up"></i>
|
||||
</a>
|
||||
</div>
|
||||
@@ -0,0 +1,8 @@
|
||||
<style>
|
||||
body{
|
||||
background-image: url(<%- theme.background.url %>);
|
||||
background-repeat:no-repeat;
|
||||
background-size:cover;
|
||||
background-attachment:fixed;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,12 @@
|
||||
<!-- Baidu Analytics -->
|
||||
<% if (theme.baiduAnalytics.enable) { %>
|
||||
<script>
|
||||
var _hmt = _hmt || [];
|
||||
(function () {
|
||||
var hm = document.createElement("script");
|
||||
hm.src = "https://hm.baidu.com/hm.js?<%- theme.baiduAnalytics.id %>";
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(hm, s);
|
||||
})();
|
||||
</script>
|
||||
<% } %>
|
||||
@@ -0,0 +1,16 @@
|
||||
<!-- Baidu Push -->
|
||||
<% if (theme.baiduPush) { %>
|
||||
<script>
|
||||
(function () {
|
||||
var bp = document.createElement('script');
|
||||
var curProtocol = window.location.protocol.split(':')[0];
|
||||
if (curProtocol === 'https') {
|
||||
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
|
||||
} else {
|
||||
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
|
||||
}
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(bp, s);
|
||||
})();
|
||||
</script>
|
||||
<% } %>
|
||||
@@ -0,0 +1,44 @@
|
||||
<div class="row">
|
||||
<div class="col s10 offset-s1 m8 offset-m2 l8 offset-l2">
|
||||
<div class="brand">
|
||||
<div class="title center-align">
|
||||
<% if (config.subtitle && config.subtitle.length > 0) { %>
|
||||
<%= config.subtitle %>
|
||||
<% } else { %>
|
||||
subtitle
|
||||
<% } %>
|
||||
</div>
|
||||
|
||||
<div class="description center-align">
|
||||
<% if (theme.subtitle.enable) { %>
|
||||
<span id="subtitle"></span>
|
||||
<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.11"></script>
|
||||
<script>
|
||||
var typed = new Typed("#subtitle", {
|
||||
strings: ['<%= theme.subtitle.sub1 %>','<%= theme.subtitle.sub2 %>'],
|
||||
startDelay: <%= theme.subtitle.startDelay %>,
|
||||
typeSpeed: <%= theme.subtitle.typeSpeed %>,
|
||||
loop: <%= theme.subtitle.loop %>,
|
||||
backSpeed: <%= theme.subtitle.backSpeed %>,
|
||||
showCursor: <%= theme.subtitle.showCursor %>
|
||||
});
|
||||
</script>
|
||||
<% } else { %>
|
||||
<%= config.description %>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% if (theme.banner.enable) { %>
|
||||
<script>
|
||||
// 每天切换 banner 图. Switch banner image every day.
|
||||
var bannerUrl = "<%- theme.jsDelivr.url %><%- url_for('/medias/banner/') %>" + new Date().getDay() + '.jpg';
|
||||
$('.bg-cover').css('background-image', 'url(' + bannerUrl + ')');
|
||||
</script>
|
||||
<% } else { %>
|
||||
<script>
|
||||
$('.bg-cover').css('background-image', 'url(<%- theme.jsDelivr.url %><%- url_for('/medias/banner/0.jpg') %>)');
|
||||
</script>
|
||||
<% } %>
|
||||
@@ -0,0 +1,5 @@
|
||||
<div class="bg-cover pd-header about-cover">
|
||||
<div class="container">
|
||||
<%- partial('_partial/bg-cover-content') %>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,52 @@
|
||||
<% if (theme.changyan.appId && theme.changyan.conf) { %>
|
||||
<div id="SOHUCS"></div>
|
||||
<script type="text/javascript">
|
||||
window.onload = function () {
|
||||
var loadChangYan = function () {
|
||||
var appid = '<%= theme.changyan.appId %>';
|
||||
var conf = '<%= theme.changyan.conf %>';
|
||||
var width = window.innerWidth || document.documentElement.clientWidth;
|
||||
if (width < 960) {
|
||||
var head = document.getElementsByTagName('head')[0] || document.head || document.documentElement;
|
||||
var script = document.createElement('script');
|
||||
script.type = 'text/javascript';
|
||||
script.charset = 'utf-8';
|
||||
script.id = 'changyan_mobile_js';
|
||||
script.src = 'https://cy-cdn.kuaizhan.com/upload/mobile/wap-js/changyan_mobile.js?client_id=' + appid +
|
||||
'&conf=' + conf;
|
||||
head.appendChild(script);
|
||||
} else {
|
||||
var loadJs = function (d, a) {
|
||||
var c = document.getElementsByTagName("head")[0] || document.head || document.documentElement;
|
||||
var b = document.createElement("script");
|
||||
b.setAttribute("type", "text/javascript");
|
||||
b.setAttribute("charset", "UTF-8");
|
||||
b.setAttribute("src", d);
|
||||
if (typeof a === "function") {
|
||||
if (window.attachEvent) {
|
||||
b.onreadystatechange = function () {
|
||||
var e = b.readyState;
|
||||
if (e === "loaded" || e === "complete") {
|
||||
b.onreadystatechange = null;
|
||||
a()
|
||||
}
|
||||
}
|
||||
} else {
|
||||
b.onload = a
|
||||
}
|
||||
}
|
||||
c.appendChild(b)
|
||||
};
|
||||
loadJs("https://cy-cdn.kuaizhan.com/upload/changyan.js", function () {
|
||||
window.changyan.api.config({
|
||||
appid: appid,
|
||||
conf: conf
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
loadChangYan();
|
||||
}
|
||||
</script>
|
||||
<% } %>
|
||||
@@ -0,0 +1,24 @@
|
||||
<div class="disqus-card card" data-aos="fade-up">
|
||||
<div id="disqus_thread" class="card-content">
|
||||
<noscript>Please enable JavaScript to view the
|
||||
<a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a>
|
||||
</noscript>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
disqus_config = function () {
|
||||
this.page.url = '<%- full_url_for(page.path) %>';
|
||||
this.page.identifier = '<%- url_for(page.path) %>';
|
||||
this.page.title = '<%= page.title %>';
|
||||
};
|
||||
let disqus_shortname = '<%= theme.disqus.shortname %>';
|
||||
|
||||
(function () { // DON'T EDIT BELOW THIS LINE
|
||||
let d = document, s = d.createElement('script');
|
||||
// 如：s.src = 'https://blinkfox.disqus.com/embed.js';
|
||||
s.src = '//' + disqus_shortname + '.disqus.com/embed.js';
|
||||
s.setAttribute('data-timestamp', new Date());
|
||||
(d.head || d.body).appendChild(s);
|
||||
})();
|
||||
</script>
|
||||
@@ -0,0 +1,95 @@
|
||||
<footer class="page-footer bg-color">
|
||||
<%if(theme.music.enable&&theme.music.fixed){ %>
|
||||
<%- partial('_widget/music') %>
|
||||
<% } %>
|
||||
<div class="container row center-align" style="margin-bottom: <% if (theme.time.enable) { %>15<% } else { %>0<% } %>px !important;">
|
||||
<div class="col s12 m8 l8 copy-right">
|
||||
Copyright ©
|
||||
<% if (theme.time.year !== new Date().getFullYear()) { %>
|
||||
<span id="year"><%- theme.time.year %>-<%- new Date().getFullYear() %></span>
|
||||
<% } else { %>
|
||||
<span id="year"><%- theme.time.year %></span>
|
||||
<% } %>
|
||||
<span id="year"><%- theme.time.year %></span>
|
||||
<a href="<%- url_for('/about') %>" target="_blank"><%- config.author %></a>
|
||||
| Powered by <a href="https://hexo.io/" target="_blank">Hexo</a>
|
||||
| Theme <a href="https://github.com/blinkfox/hexo-theme-matery" target="_blank">Matery</a>
|
||||
<br>
|
||||
<% if (theme.postInfo.totalCount) { %>
|
||||
<i class="fas fa-chart-area"></i> 站点总字数: <span
|
||||
class="white-color"><%= totalcount(site) %></span> 字
|
||||
<% } %>
|
||||
<% let socialClass = '' %>
|
||||
<% if (theme.busuanziStatistics && theme.busuanziStatistics.enable) { %>
|
||||
<% socialClass = 'social-statis' %>
|
||||
<% } %>
|
||||
<% if (theme.busuanziStatistics && theme.busuanziStatistics.totalTraffic) { %>
|
||||
<span id="busuanzi_container_site_pv">
|
||||
| <i class="far fa-eye"></i> 总访问量: <span id="busuanzi_value_site_pv"
|
||||
class="white-color"></span> 次
|
||||
</span>
|
||||
<% } %>
|
||||
<% if (theme.busuanziStatistics && theme.busuanziStatistics.totalNumberOfvisitors) { %>
|
||||
<span id="busuanzi_container_site_uv">
|
||||
| <i class="fas fa-users"></i> 总访问人数: <span id="busuanzi_value_site_uv"
|
||||
class="white-color"></span> 人
|
||||
</span>
|
||||
<% } %>
|
||||
<br>
|
||||
<% if (theme.time.enable) { %>
|
||||
<span id="sitetime">载入运行时间...</span>
|
||||
<script>
|
||||
function siteTime() {
|
||||
var seconds = 1000;
|
||||
var minutes = seconds * 60;
|
||||
var hours = minutes * 60;
|
||||
var days = hours * 24;
|
||||
var years = days * 365;
|
||||
var today = new Date();
|
||||
var startYear = "<%- theme.time.year %>";
|
||||
var startMonth = "<%- theme.time.month %>";
|
||||
var startDate = "<%- theme.time.date %>";
|
||||
var startHour = "<%- theme.time.hour %>";
|
||||
var startMinute = "<%- theme.time.minute %>";
|
||||
var startSecond = "<%- theme.time.second %>";
|
||||
var todayYear = today.getFullYear();
|
||||
var todayMonth = today.getMonth() + 1;
|
||||
var todayDate = today.getDate();
|
||||
var todayHour = today.getHours();
|
||||
var todayMinute = today.getMinutes();
|
||||
var todaySecond = today.getSeconds();
|
||||
var t1 = Date.UTC(startYear, startMonth, startDate, startHour, startMinute, startSecond);
|
||||
var t2 = Date.UTC(todayYear, todayMonth, todayDate, todayHour, todayMinute, todaySecond);
|
||||
var diff = t2 - t1;
|
||||
var diffYears = Math.floor(diff / years);
|
||||
var diffDays = Math.floor((diff / days) - diffYears * 365);
|
||||
var diffHours = Math.floor((diff - (diffYears * 365 + diffDays) * days) / hours);
|
||||
var diffMinutes = Math.floor((diff - (diffYears * 365 + diffDays) * days - diffHours * hours) /
|
||||
minutes);
|
||||
var diffSeconds = Math.floor((diff - (diffYears * 365 + diffDays) * days - diffHours * hours -
|
||||
diffMinutes * minutes) / seconds);
|
||||
if (startYear == todayYear) {
|
||||
document.getElementById("year").innerHTML = todayYear;
|
||||
document.getElementById("sitetime").innerHTML = "本站已安全运行 " + diffDays + " 天 " + diffHours +
|
||||
" 小时 " + diffMinutes + " 分钟 " + diffSeconds + " 秒";
|
||||
} else {
|
||||
document.getElementById("year").innerHTML = startYear + " - " + todayYear;
|
||||
document.getElementById("sitetime").innerHTML = "本站已安全运行 " + diffYears + " 年 " + diffDays +
|
||||
" 天 " + diffHours + " 小时 " + diffMinutes + " 分钟 " + diffSeconds + " 秒";
|
||||
}
|
||||
}
|
||||
setInterval(siteTime, 1000);
|
||||
</script>
|
||||
<% } %>
|
||||
<br>
|
||||
<% if (theme.icp.enable) { %>
|
||||
<span id="icp"><img src="<%- theme.jsDelivr.url %><%- url_for('/medias/icp.png') %>" style="vertical-align: text-bottom;" />
|
||||
<a href="<%- url_for(theme.icp.url) %>" target="_blank"><%= theme.icp.text %></a>
|
||||
</span>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="col s12 m4 l4 social-link <%- socialClass %>"><%- partial('_partial/social-link') %></div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<div class="progress-bar"></div>
|
||||
@@ -0,0 +1,25 @@
|
||||
<link rel="stylesheet" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.gitalk) %>">
|
||||
<link rel="stylesheet" href="<%- theme.jsDelivr.url %><%- url_for('/css/my-gitalk.css') %>">
|
||||
|
||||
<div class="card gitalk-card" data-aos="fade-up">
|
||||
<div class="comment_headling" style="font-size: 20px; font-weight: 700; position: relative; padding-left: 20px; top: 15px; padding-bottom: 5px;">
|
||||
<i class="fas fa-comments fa-fw" aria-hidden="true"></i>
|
||||
<span>评论</span>
|
||||
</div>
|
||||
<div id="gitalk-container" class="card-content"></div>
|
||||
</div>
|
||||
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.gitalk) %>"></script>
|
||||
<script>
|
||||
let gitalk = new Gitalk({
|
||||
clientID: '<%- theme.gitalk.oauth.clientId %>',
|
||||
clientSecret: '<%- theme.gitalk.oauth.clientSecret %>',
|
||||
repo: '<%- theme.gitalk.repo %>',
|
||||
owner: '<%- theme.gitalk.owner %>',
|
||||
admin: <%- JSON.stringify(theme.gitalk.admin) %>,
|
||||
id: '<%- date(page.date, 'YYYY-MM-DDTHH-mm-ss') %>',
|
||||
distractionFreeMode: false // Facebook-like distraction free mode
|
||||
});
|
||||
|
||||
gitalk.render('gitalk-container');
|
||||
</script>
|
||||
@@ -0,0 +1,55 @@
|
||||
<style>
|
||||
.nav-transparent .github-corner {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.github-corner {
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
top: 0;
|
||||
right: 0;
|
||||
border: 0;
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.github-corner svg {
|
||||
color: #0f9d58;
|
||||
fill: #fff;
|
||||
height: 64px;
|
||||
width: 64px;
|
||||
}
|
||||
|
||||
.github-corner:hover .octo-arm {
|
||||
animation: a 0.56s ease-in-out;
|
||||
}
|
||||
|
||||
.github-corner .octo-arm {
|
||||
animation: none;
|
||||
}
|
||||
|
||||
@keyframes a {
|
||||
0%,
|
||||
to {
|
||||
transform: rotate(0);
|
||||
}
|
||||
20%,
|
||||
60% {
|
||||
transform: rotate(-25deg);
|
||||
}
|
||||
40%,
|
||||
80% {
|
||||
transform: rotate(10deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<a href="<%- theme.githubLink.url %>" class="github-corner tooltipped hide-on-med-and-down" target="_blank"
|
||||
data-tooltip="<%- theme.githubLink.title %>" data-position="left" data-delay="50">
|
||||
<svg viewBox="0 0 250 250" aria-hidden="true">
|
||||
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
|
||||
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
|
||||
fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
|
||||
<path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z"
|
||||
fill="currentColor" class="octo-body"></path>
|
||||
</svg>
|
||||
</a>
|
||||
@@ -0,0 +1,25 @@
|
||||
<link rel="stylesheet" href="<%- theme.jsDelivr.url %><%- url_for('/libs/gitment/gitment-default.css') %>">
|
||||
<link rel="stylesheet" href="<%- theme.jsDelivr.url %><%- url_for('/css/gitment.css') %>">
|
||||
|
||||
<div class="gitment-card card" data-aos="fade-up">
|
||||
<div class="comment_headling" style="font-size: 20px; font-weight: 700; position: relative; padding-left: 20px; top: 15px; padding-bottom: 5px;">
|
||||
<i class="fas fa-comments fa-fw" aria-hidden="true"></i>
|
||||
<span>评论</span>
|
||||
</div>
|
||||
<div id="gitment-content" class="card-content"></div>
|
||||
</div>
|
||||
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for('/libs/gitment/gitment.js') %>"></script>
|
||||
<script>
|
||||
var gitment = new Gitment({
|
||||
id: '<%= page.date %>',
|
||||
owner: '<%= theme.gitment.owner %>',
|
||||
repo: '<%= theme.gitment.repo %>',
|
||||
oauth: {
|
||||
client_id: '<%= theme.gitment.oauth.clientId %>',
|
||||
client_secret: '<%= theme.gitment.oauth.clientSecret %>'
|
||||
}
|
||||
});
|
||||
|
||||
gitment.render('gitment-content');
|
||||
</script>
|
||||
@@ -0,0 +1,13 @@
|
||||
<!-- Global site tag (gtag.js) - Google Analytics -->
|
||||
<% if (theme.googleAnalytics.enable) { %>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=<%- theme.googleAnalytics.id %>"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag() {
|
||||
dataLayer.push(arguments);
|
||||
}
|
||||
|
||||
gtag('js', new Date());
|
||||
gtag('config', '<%- theme.googleAnalytics.id %>');
|
||||
</script>
|
||||
<% } %>
|
||||
@@ -0,0 +1,100 @@
|
||||
<%
|
||||
var title = page.title;
|
||||
|
||||
// tags, categories, about pages title
|
||||
if (title == 'tags') {
|
||||
title = __('tags');
|
||||
} else if (title == 'categories') {
|
||||
title = __('categories');
|
||||
} else if (title == 'about') {
|
||||
title = __('about');
|
||||
}
|
||||
|
||||
// archives, category, tag pages title
|
||||
if (is_archive()) {
|
||||
title = __('archives');
|
||||
if (is_month()) {
|
||||
title += ': ' + page.year + '/' + page.month;
|
||||
} else if (is_year()) {
|
||||
title += ': ' + page.year;
|
||||
}
|
||||
} else if (is_category()) {
|
||||
title = __('category') + ': ' + page.category;
|
||||
} else if (is_tag()) {
|
||||
title = __('tag') + ': ' + page.tag;
|
||||
}
|
||||
|
||||
// final page title.
|
||||
var pageTitle = title ? title + ' | ' + config.title : config.title;
|
||||
|
||||
// keywords.
|
||||
var keyWords = config.keywords ? config.keywords : config.title;
|
||||
if (page.keywords) {
|
||||
keyWords = page.keywords;
|
||||
} else {
|
||||
keyWords = title ? title + ', ' + keyWords : keyWords;
|
||||
}
|
||||
|
||||
// description.
|
||||
var description = null;
|
||||
if (page.summary) {
|
||||
description = page.summary;
|
||||
} else if (page.hasOwnProperty('__post') && page.__post) {
|
||||
description = strip_html(page.content).substring(0, 120);
|
||||
}
|
||||
description = description ? description : pageTitle;
|
||||
|
||||
let iconType = 'image/png'
|
||||
let faviconExt = theme.favicon.substr(theme.favicon.lastIndexOf('.') + 1, theme.favicon.length)
|
||||
if (faviconExt === 'png') {
|
||||
iconType = 'image/png'
|
||||
} else if (faviconExt === 'svg') {
|
||||
iconType = 'image/svg+xml'
|
||||
} else if (faviconExt === 'gif') {
|
||||
iconType = 'image/gif'
|
||||
} else if (faviconExt === 'jpeg') {
|
||||
iconType = 'image/jpeg'
|
||||
} else if (faviconExt === 'jpg') {
|
||||
iconType = 'image/jpeg'
|
||||
} else if (faviconExt === 'ico') {
|
||||
iconType = 'image/x-icon, image/vnd.microsoft.icon'
|
||||
}
|
||||
%>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="keywords" content="<%= keyWords %>">
|
||||
<meta name="description" content="<%= config.description %>">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
||||
<meta name="renderer" content="webkit|ie-stand|ie-comp">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<meta name="format-detection" content="telephone=no">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
||||
<meta name="google-site-verification" content="pBWoGvVEP36FzzS4xIpoMejc5UKi3RKcxd9rWWcjiDg" />
|
||||
<%- partial('_partial/google-analytics') %>
|
||||
<title><%= pageTitle %></title>
|
||||
|
||||
<link rel="icon" type="<%= iconType %>" href="<%- theme.jsDelivr.url %><%- url_for(theme.favicon) %>">
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.fontAwesome) %>">
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.materialize) %>">
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.aos) %>">
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.animate) %>">
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.lightgallery) %>">
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.matery) %>">
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.mycss) %>">
|
||||
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.jquery) %>"></script>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;900&display=swap" rel="stylesheet" media="print" onload="this.media='all'">
|
||||
<script>
|
||||
var _hmt = _hmt || [];
|
||||
(function() {
|
||||
var hm = document.createElement("script");
|
||||
hm.src = "https://hm.baidu.com/hm.js?aaa6c944b0ed07922901d7fc571a171d";
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(hm, s);
|
||||
})();
|
||||
</script>
|
||||
</head>
|
||||
@@ -0,0 +1,20 @@
|
||||
<header class="navbar-fixed">
|
||||
<nav id="headNav" class="bg-color nav-transparent">
|
||||
<div id="navContainer" class="nav-wrapper container">
|
||||
<div class="brand-logo">
|
||||
<a href="<%- url_for() %>" class="waves-effect waves-light">
|
||||
<% if (theme.logo !== undefined && theme.logo.length > 0) { %>
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(theme.logo) %>" class="logo-img" alt="LOGO">
|
||||
<% } %>
|
||||
<span class="logo-span"><%= config.title %></span>
|
||||
</a>
|
||||
</div>
|
||||
<%- partial('_partial/navigation') %>
|
||||
</div>
|
||||
|
||||
<% if (theme.githubLink && theme.githubLink.enable) { %>
|
||||
<%- partial('_partial/github-link') %>
|
||||
<% } %>
|
||||
</nav>
|
||||
|
||||
</header>
|
||||
@@ -0,0 +1,209 @@
|
||||
<style>
|
||||
.carousel-control {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
line-height: 55px;
|
||||
border-radius: 45px;
|
||||
background: transparent;
|
||||
cursor: pointer;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
#prev-cover {
|
||||
position: absolute;
|
||||
top: 48%;
|
||||
left: 8px;
|
||||
}
|
||||
|
||||
#next-cover {
|
||||
position: absolute;
|
||||
top: 48%;
|
||||
right: 8px;;
|
||||
}
|
||||
|
||||
#prev-cover i {
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
#next-cover i {
|
||||
margin-left: 3px;
|
||||
}
|
||||
|
||||
.carousel-control:hover {
|
||||
background-color: rgba(0, 0, 0, .4);
|
||||
}
|
||||
|
||||
.carousel-control i {
|
||||
color: #fff;
|
||||
font-size: 2.4rem;
|
||||
}
|
||||
</style>
|
||||
|
||||
<%
|
||||
// get all cover posts.
|
||||
var coverPosts = [];
|
||||
site.posts.forEach(function (post) {
|
||||
if (post.cover) {
|
||||
coverPosts.push(post);
|
||||
}
|
||||
});
|
||||
var coverPostsCount = coverPosts.length;
|
||||
%>
|
||||
|
||||
<div class="carousel carousel-slider center index-cover" data-indicators="true" style="margin-top: -64px;">
|
||||
<% if (coverPostsCount > 0 && theme.cover.showPrevNext) { %>
|
||||
<div id="prev-cover" class="left waves-effect carousel-control">
|
||||
<i class="icon fa fa-angle-left"></i>
|
||||
</div>
|
||||
<div id="next-cover" class="right waves-effect carousel-control">
|
||||
<i class="icon fa fa-angle-right"></i>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<div class="carousel-item red white-text bg-cover about-cover">
|
||||
<div class="container">
|
||||
<%- partial('_partial/bg-cover-content') %>
|
||||
|
||||
<div class="cover-btns">
|
||||
<a href="<%=
|
||||
[theme.dream, theme.music, theme.video, theme.recommend]
|
||||
.every(i=>i.enable)? "#indexCard": "#articles"
|
||||
%>" class="waves-effect waves-light btn">
|
||||
<i class="fa fa-angle-double-down"></i><%- __('startRead') %>
|
||||
</a>
|
||||
|
||||
<% if (theme.indexbtn && theme.indexbtn.enable) { %>
|
||||
<a href="<%- url_for(theme.indexbtn.url) %>" class="waves-effect waves-light btn" target="_blank">
|
||||
<i class="<%- theme.indexbtn.icon %>"></i><%= theme.indexbtn.name %>
|
||||
</a>
|
||||
<% } else if (theme.githubLink.enable) { %>
|
||||
<a href="<%- theme.githubLink.url %>" class="waves-effect waves-light btn" target="_blank">
|
||||
<i class="fab fa-github %>"></i><%= theme.githubLink.title %>
|
||||
</a>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="cover-social-link"><%- partial('_partial/social-link') %></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% if (coverPostsCount > 0) { %>
|
||||
<%
|
||||
var hashCode = function (str) {
|
||||
if (!str && str.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var hash = 0;
|
||||
for (var i = 0, len = str.length; i < len; i++) {
|
||||
hash = ((hash << 5) - hash) + str.charCodeAt(i);
|
||||
hash |= 0;
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
|
||||
var featureImages = theme.featureImages;
|
||||
var imgCount = featureImages.length;
|
||||
%>
|
||||
|
||||
<% for (var i = 0; i < coverPostsCount; i++) { %>
|
||||
<%
|
||||
var post = coverPosts[i];
|
||||
var featureImage = featureImages[Math.abs(hashCode(post.title) % imgCount)];
|
||||
|
||||
var coverImg;
|
||||
if (post.coverImg) {
|
||||
coverImg = post.coverImg;
|
||||
} else if (post.img) {
|
||||
coverImg = post.img;
|
||||
} else {
|
||||
coverImg = featureImage;
|
||||
}
|
||||
%>
|
||||
<div class="carousel-item amber white-text carousel-post bg-cover"
|
||||
style="background-image: url('<%- theme.jsDelivr.url %><%- url_for(coverImg) %>');">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col s10 offset-s1">
|
||||
<div class="title center-align"><%= post.title %></div>
|
||||
<div class="description center-align">
|
||||
<% if (post.summary && post.summary.length > 0) { %>
|
||||
<%- post.summary %>
|
||||
<% } else { %>
|
||||
<%- strip_html(post.content).substring(0, 120) %>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="cover-btns">
|
||||
<a href="<%- url_for(post.path) %>" class="waves-effect waves-light btn"
|
||||
target="_blank">
|
||||
<i class="icon fa fa-eye fa-fw"></i><%- __('readMore') %>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
<% } %>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(function () {
|
||||
let coverSlider = $('.carousel');
|
||||
|
||||
//用户触摸轮播自动 restartPlay 是否生效
|
||||
let initUserPressedOrDraggedActive = false
|
||||
|
||||
//用户触摸轮播自动 restartPlay
|
||||
function initUserPressedOrDragged(instance) {
|
||||
setInterval(() => {
|
||||
if (instance.pressed || instance.dragged) {
|
||||
// console.log('initUserPressedOrDragged: ',instance.pressed,instance.dragged)
|
||||
restartPlay()
|
||||
}
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
coverSlider.carousel({
|
||||
duration: Number('<%- theme.cover.duration %>'),
|
||||
fullWidth: true,
|
||||
indicators: '<%- theme.cover.showIndicators %>' === 'true',
|
||||
onCycleTo() {
|
||||
if (!initUserPressedOrDraggedActive) {
|
||||
// console.log('initUserPressedOrDraggedActive')
|
||||
initUserPressedOrDragged(this)
|
||||
initUserPressedOrDraggedActive = true
|
||||
}
|
||||
},
|
||||
})
|
||||
|
||||
let carouselIntervalId;
|
||||
<% if (theme.cover.autoLoop) { %>
|
||||
// Loop to call the next cover article picture.
|
||||
let autoCarousel = function () {
|
||||
carouselIntervalId = setInterval(function () {
|
||||
coverSlider.carousel('next');
|
||||
}, <%- theme.cover.intervalTime %>);
|
||||
};
|
||||
autoCarousel();
|
||||
<% } %>
|
||||
|
||||
function restartPlay() {
|
||||
<% if (theme.cover.autoLoop) { %>
|
||||
clearInterval(carouselIntervalId);
|
||||
autoCarousel();
|
||||
<% } %>
|
||||
};
|
||||
|
||||
<% if (theme.cover.showPrevNext) { %>
|
||||
// prev and next cover post.
|
||||
$('#prev-cover').click(function () {
|
||||
coverSlider.carousel('prev');
|
||||
restartPlay();
|
||||
});
|
||||
$('#next-cover').click(function () {
|
||||
coverSlider.carousel('next');
|
||||
restartPlay();
|
||||
});
|
||||
<% } %>
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,21 @@
|
||||
<div class="livere-card card" data-aos="fade-up">
|
||||
<!-- 来必力City版安装代码 -->
|
||||
<div id="lv-container" class="card-content" data-id="city" data-uid="<%- theme.livere.uid %>">
|
||||
<script type="text/javascript">
|
||||
(function (d, s) {
|
||||
let j, e = d.getElementsByTagName(s)[0];
|
||||
if (typeof LivereTower === 'function') {
|
||||
return;
|
||||
}
|
||||
|
||||
j = d.createElement(s);
|
||||
j.src = 'https://cdn-city.livere.com/js/embed.dist.js';
|
||||
j.async = true;
|
||||
|
||||
e.parentNode.insertBefore(j, e);
|
||||
})(document, 'script');
|
||||
</script>
|
||||
<noscript>为正常使用来必力评论功能请激活JavaScript。</noscript>
|
||||
</div>
|
||||
<!-- City版安装代码已完成 -->
|
||||
</div>
|
||||
@@ -0,0 +1,44 @@
|
||||
<style>
|
||||
.mvaline-card {
|
||||
margin: 1.5rem auto;
|
||||
}
|
||||
|
||||
.mvaline-card .card-content {
|
||||
padding: 20px 20px 5px 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="card mvaline-card" data-aos="fade-up">
|
||||
<div class="comment_headling" style="font-size: 20px; font-weight: 700; position: relative; padding-left: 20px; top: 15px; padding-bottom: 5px;">
|
||||
<i class="fas fa-comments fa-fw" aria-hidden="true"></i>
|
||||
<span>评论</span>
|
||||
</div>
|
||||
<div id="mvcomments" class="card-content" style="display: grid">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.minivaline) %>"></script>
|
||||
<script>
|
||||
new MiniValine({
|
||||
el: '#mvcomments',
|
||||
appId: '<%- theme.minivaline.appId %>',
|
||||
appKey: '<%- theme.minivaline.appKey %>',
|
||||
mode: '<%- theme.minivaline.mode %>',
|
||||
placeholder: '<%- theme.minivaline.placeholder %>',
|
||||
pathname: window.location.pathname,
|
||||
lang: '<%- theme.minivaline.lang %>',
|
||||
adminEmailMd5: '<%- theme.minivaline.adminEmailMd5 %>',
|
||||
tagMeta: <%- '["' + theme.minivaline.tagMeta.join('", "') + '"]' %>,
|
||||
master: <%- '["' + theme.minivaline.master.join('", "') + '"]' %>,
|
||||
friends: <%- '["' + theme.minivaline.friends.join('", "') + '"]' %>,
|
||||
math: <%- theme.minivaline.math %>,
|
||||
md: <%- theme.minivaline.md %>,
|
||||
enableQQ: <%- theme.minivaline.enableQQ %>,
|
||||
NoRecordIP: <%- theme.minivaline.NoRecordIP %>,
|
||||
visitor: <%- theme.minivaline.visitor %>,
|
||||
maxNest: <%- theme.minivaline.maxNest %>,
|
||||
pageSize: <%- theme.minivaline.pageSize %>,
|
||||
serverURLs: '<%- theme.minivaline.serverURLs %>',
|
||||
emoticonUrl: <%- '["' + theme.minivaline.emoticonUrl.join('", "') + '"]' %>,
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,83 @@
|
||||
<%
|
||||
var configRoot = config.root
|
||||
configRoot = (configRoot === null || configRoot === undefined || configRoot === '/') ? '' : configRoot;
|
||||
%>
|
||||
<div id="mobile-nav" class="side-nav sidenav">
|
||||
|
||||
<div class="mobile-head bg-color">
|
||||
<% if (theme.logo !== undefined && theme.logo.length > 0) { %>
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(theme.logo) %>" class="logo-img circle responsive-img">
|
||||
<% } %>
|
||||
<div class="logo-name"><%= config.title %></div>
|
||||
<div class="logo-desc">
|
||||
<% if (config.description && config.description.length > 0) { %>
|
||||
<%= config.description %>
|
||||
<% } else { %>
|
||||
Never really desperate, only the lost of the soul.
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<%
|
||||
var menuMap = new Map();
|
||||
menuMap.set("Index", "首页");
|
||||
menuMap.set("Tags", "标签");
|
||||
menuMap.set("Categories", "分类");
|
||||
menuMap.set("Archives", "归档");
|
||||
menuMap.set("About", "关于");
|
||||
menuMap.set("Contact", "留言板");
|
||||
menuMap.set("Friends", "友链");
|
||||
menuMap.set("List", "清单");
|
||||
menuMap.set("Navi", "百宝箱");
|
||||
menuMap.set("Hacking", "谷歌搜索");
|
||||
menuMap.set("More", "更多");
|
||||
%>
|
||||
|
||||
<ul class="menu-list mobile-menu-list">
|
||||
<% Object.keys(theme.menu).forEach(function(key) { %>
|
||||
<li class="m-nav-item">
|
||||
<% if(!theme.menu[key].children) { %>
|
||||
<a href="<%- url_for(theme.menu[key].url) %>" class="waves-effect waves-light">
|
||||
<% if (theme.menu[key].icon && theme.menu[key].icon.length > 0) { %>
|
||||
<i class="fa-fw <%- theme.menu[key].icon %>"></i>
|
||||
<% } else { %>
|
||||
<i class="fas fa-fw fa-link"></i>
|
||||
<% } %>
|
||||
<%- (config.language === 'zh-CN' && menuMap.has(key)) ? menuMap.get(key) : key %>
|
||||
</a>
|
||||
<% } else { %>
|
||||
<a href="javascript:;">
|
||||
<% if (theme.menu[key].icon && theme.menu[key].icon.length > 0) { %>
|
||||
<i class="fa-fw <%- theme.menu[key].icon %>"></i>
|
||||
<% } else { %>
|
||||
<i class="fas fa-fw fa-link"></i>
|
||||
<% } %>
|
||||
<%- (config.language === 'zh-CN' && menuMap.has(key)) ? menuMap.get(key) : key %>
|
||||
<span class="m-icon"><i class="fas fa-chevron-right"></i></span>
|
||||
</a>
|
||||
<ul <%if(theme.navMenu&&theme.navMenu.bgColor){%> style="background: <%-theme.navMenu.bgColor%>;"<%}%> >
|
||||
<% for(let childrenLink of theme.menu[key].children){ %>
|
||||
<li>
|
||||
|
||||
<a href="<%- url_for(childrenLink.url)%> " style="margin-left:<% if (theme.navMenu && theme.navMenu.mleft) {%>50px<%}else{%>75px<%}%>">
|
||||
<% if (childrenLink.icon && childrenLink.icon.length > 0) { %>
|
||||
<i class="fa <%- childrenLink.icon %>" style="position: absolute;left:<%if(theme.navMenu&&theme.navMenu.mleft){%>28px<%}else{%>50px<%}%>" ></i>
|
||||
<% } %>
|
||||
<span><%- childrenLink.name %></span>
|
||||
</a>
|
||||
</li>
|
||||
<% } %>
|
||||
</ul>
|
||||
<% } %>
|
||||
</li>
|
||||
<% }); %>
|
||||
<% if (theme.githubLink && theme.githubLink.enable) { %>
|
||||
<li><div class="divider"></div></li>
|
||||
<li>
|
||||
<a href="<%- theme.githubLink.url %>" class="waves-effect waves-light" target="_blank">
|
||||
<i class="fab fa-github-square fa-fw"></i><%- theme.githubLink.title %>
|
||||
</a>
|
||||
</li>
|
||||
<% } %>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -0,0 +1,61 @@
|
||||
<%
|
||||
var menuMap = new Map();
|
||||
menuMap.set("Index", "首页");
|
||||
menuMap.set("Tags", "标签");
|
||||
menuMap.set("Categories", "分类");
|
||||
menuMap.set("Archives", "归档");
|
||||
menuMap.set("About", "关于");
|
||||
menuMap.set("Contact", "留言板");
|
||||
menuMap.set("Friends", "友链");
|
||||
menuMap.set("List", "清单");
|
||||
menuMap.set("Navi", "百宝箱");
|
||||
menuMap.set("Hacking", "谷歌搜索");
|
||||
menuMap.set("More", "更多");
|
||||
|
||||
var configRoot = config.root
|
||||
configRoot = (configRoot === null || configRoot === undefined || configRoot === '/') ? '' : configRoot;
|
||||
%>
|
||||
|
||||
<a href="#" data-target="mobile-nav" class="sidenav-trigger button-collapse"><i class="fas fa-bars"></i></a>
|
||||
<ul class="right nav-menu">
|
||||
<% Object.keys(theme.menu).forEach(function(key) { %>
|
||||
<li class="hide-on-med-and-down nav-item">
|
||||
<% if(!theme.menu[key].children) { %>
|
||||
<a href="<%- url_for(theme.menu[key].url) %>" class="waves-effect waves-light">
|
||||
<% if (theme.menu[key].icon && theme.menu[key].icon.length > 0) { %>
|
||||
<i class="<%- theme.menu[key].icon %>" style="zoom: 0.6;"></i>
|
||||
<% } %>
|
||||
<span><%- (config.language === 'zh-CN' && menuMap.has(key)) ? menuMap.get(key) : key %></span>
|
||||
</a>
|
||||
<% } else { %>
|
||||
<a href="<%- theme.menu[key].url %>" class="waves-effect waves-light">
|
||||
|
||||
<% if (theme.menu[key].icon && theme.menu[key].icon.length > 0) { %>
|
||||
<i class="<%- theme.menu[key].icon %>" style="zoom: 0.6;"></i>
|
||||
<% } %>
|
||||
<span><%- (config.language === 'zh-CN' && menuMap.has(key)) ? menuMap.get(key) : key %></span>
|
||||
<i class="fas fa-chevron-down" aria-hidden="true" style="zoom: 0.6;"></i>
|
||||
</a>
|
||||
<ul class="sub-nav menus_item_child ">
|
||||
<% for(let childrenLink of theme.menu[key].children){ %>
|
||||
<li>
|
||||
<a href="<%- url_for(childrenLink.url)%>">
|
||||
<% if (childrenLink.icon && childrenLink.icon.length > 0) { %>
|
||||
<i class="<%- childrenLink.icon %>" style="margin-top: -20px; zoom: 0.6;"></i>
|
||||
<% } %>
|
||||
<span><%- childrenLink.name %></span>
|
||||
</a>
|
||||
</li>
|
||||
<% } %>
|
||||
</ul>
|
||||
<% } %>
|
||||
</li>
|
||||
<% }); %>
|
||||
<li>
|
||||
<a href="#searchModal" class="modal-trigger waves-effect waves-light">
|
||||
<i id="searchIcon" class="fas fa-search" title="<%= __('search') %>" style="zoom: 0.85;"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<%- partial('_partial/mobile-nav') %>
|
||||
@@ -0,0 +1,31 @@
|
||||
<div class="container paging">
|
||||
<div class="row">
|
||||
<div class="col s6 m4 l4">
|
||||
<% if (page.prev) { %>
|
||||
<a href="<%- url_for(page.prev_link) %>"
|
||||
class="left btn-floating btn-large waves-effect waves-light bg-color">
|
||||
<i class="fas fa-angle-left"></i>
|
||||
</a>
|
||||
<% } else { %>
|
||||
<a class="left btn-floating btn-large disabled">
|
||||
<i class="fas fa-angle-left"></i>
|
||||
</a>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="page-info col m4 l4 hide-on-small-only">
|
||||
<div class="center-align b-text-gray"><%- page.current %> / <%- page.total %></div>
|
||||
</div>
|
||||
<div class="col s6 m4 l4">
|
||||
<% if (page.next) { %>
|
||||
<a href="<%- url_for(page.next_link) %>"
|
||||
class="right btn-floating btn-large waves-effect waves-light bg-color">
|
||||
<i class="fas fa-angle-right"></i>
|
||||
</a>
|
||||
<% } else { %>
|
||||
<a class="right btn-floating btn-large disabled">
|
||||
<i class="fas fa-angle-right"></i>
|
||||
</a>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,38 @@
|
||||
<%
|
||||
var featureimg = url_for('/medias/bg.jpg');
|
||||
if (page.img) {
|
||||
featureimg = url_for(page.img);
|
||||
} else {
|
||||
var hashCode = function (str) {
|
||||
if (!str && str.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var hash = 0;
|
||||
for (var i = 0, len = str.length; i < len; i++) {
|
||||
hash = ((hash << 5) - hash) + str.charCodeAt(i);
|
||||
hash |= 0;
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
|
||||
var len = theme.featureImages.length;
|
||||
var num = Math.abs(hashCode(page.title) % len);
|
||||
|
||||
featureimg = theme.jsDelivr.url
|
||||
? theme.jsDelivr.url + url_for(theme.featureImages[num])
|
||||
: url_for(theme.featureImages[num]);
|
||||
}
|
||||
%>
|
||||
|
||||
<div class="bg-cover pd-header post-cover" style="background-image: url('<%- featureimg %>')">
|
||||
<div class="container" style="right: 0px;left: 0px;">
|
||||
<div class="row">
|
||||
<div class="col s12 m12 l12">
|
||||
<div class="brand">
|
||||
<h1 class="description center-align post-title"><%= page.title %></h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,193 @@
|
||||
<link rel="stylesheet" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.tocbot) %>">
|
||||
<style>
|
||||
#articleContent h1::before,
|
||||
#articleContent h2::before,
|
||||
#articleContent h3::before,
|
||||
#articleContent h4::before,
|
||||
#articleContent h5::before,
|
||||
#articleContent h6::before {
|
||||
display: block;
|
||||
content: " ";
|
||||
height: 100px;
|
||||
margin-top: -100px;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
#articleContent :focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.toc-fixed {
|
||||
position: fixed;
|
||||
top: 64px;
|
||||
}
|
||||
|
||||
.toc-widget {
|
||||
background-color: white;
|
||||
width: 345px;
|
||||
padding-left: 20px;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 10px 35px 2px rgba(0, 0, 0, .15), 0 5px 15px rgba(0, 0, 0, .07), 0 2px 5px -5px rgba(0, 0, 0, .1) !important;
|
||||
}
|
||||
|
||||
.toc-widget .toc-title {
|
||||
padding: 35px 0 15px 17px;
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
|
||||
.toc-widget ol {
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#toc-content {
|
||||
height: calc(100vh - 300px);
|
||||
overflow: scroll;
|
||||
|
||||
}
|
||||
|
||||
#toc-content ol {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
#toc-content ol li {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
#toc-content .toc-link:hover {
|
||||
color: #42b983;
|
||||
font-weight: 700;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#toc-content .toc-link::before {
|
||||
background-color: transparent;
|
||||
max-height: 25px;
|
||||
|
||||
position: absolute;
|
||||
right: 23.5vw;
|
||||
display: block;
|
||||
}
|
||||
|
||||
#toc-content .is-active-link {
|
||||
color: #42b983;
|
||||
}
|
||||
|
||||
#floating-toc-btn {
|
||||
position: fixed;
|
||||
right: 15px;
|
||||
bottom: 76px;
|
||||
padding-top: 15px;
|
||||
margin-bottom: 0;
|
||||
z-index: 998;
|
||||
}
|
||||
|
||||
#floating-toc-btn .btn-floating {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
bottom: 120px;
|
||||
}
|
||||
|
||||
#floating-toc-btn .btn-floating i {
|
||||
line-height: 48px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
</style>
|
||||
<div class="row">
|
||||
<div id="main-content" class="col s12 m12 l9">
|
||||
<%- partial('_partial/post-detail.ejs') %>
|
||||
</div>
|
||||
<div id="toc-aside" class="expanded col l3 hide-on-med-and-down">
|
||||
<div class="toc-widget card">
|
||||
<div class="toc-title"><i class="far fa-list-alt"></i> <%- __('toc') %></div>
|
||||
<div id="toc-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TOC 悬浮按钮. -->
|
||||
<% if (theme.toc.enable && theme.toc.showToggleBtn) { %>
|
||||
<div id="floating-toc-btn" class="hide-on-med-and-down">
|
||||
<a class="btn-floating btn-large bg-color">
|
||||
<i class="fas fa-list-ul"></i>
|
||||
</a>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.tocbot) %>"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
tocbot.init({
|
||||
tocSelector: '#toc-content',
|
||||
contentSelector: '#articleContent',
|
||||
headingsOffset: -($(window).height() * 0.4 - 45),
|
||||
collapseDepth: Number('<%- theme.toc.collapseDepth %>'),
|
||||
headingSelector: '<%- theme.toc.heading %>'
|
||||
});
|
||||
|
||||
// modify the toc link href to support Chinese.
|
||||
let i = 0;
|
||||
let tocHeading = 'toc-heading-';
|
||||
$('#toc-content a').each(function () {
|
||||
$(this).attr('href', '#' + tocHeading + (++i));
|
||||
});
|
||||
|
||||
// modify the heading title id to support Chinese.
|
||||
i = 0;
|
||||
$('#articleContent').children('<%- theme.toc.heading %>').each(function () {
|
||||
$(this).attr('id', tocHeading + (++i));
|
||||
});
|
||||
|
||||
// Set scroll toc fixed.
|
||||
let tocHeight = parseInt($(window).height() * 0.4 - 64);
|
||||
let $tocWidget = $('.toc-widget');
|
||||
$(window).scroll(function () {
|
||||
let scroll = $(window).scrollTop();
|
||||
/* add post toc fixed. */
|
||||
if (scroll > tocHeight) {
|
||||
$tocWidget.addClass('toc-fixed');
|
||||
} else {
|
||||
$tocWidget.removeClass('toc-fixed');
|
||||
}
|
||||
});
|
||||
|
||||
<% if (theme.toc.enable && theme.toc.showToggleBtn) { %>
|
||||
/* 修复文章卡片 div 的宽度. */
|
||||
let fixPostCardWidth = function (srcId, targetId) {
|
||||
let srcDiv = $('#' + srcId);
|
||||
if (srcDiv.length === 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
let w = srcDiv.width();
|
||||
if (w >= 450) {
|
||||
w = w + 21;
|
||||
} else if (w >= 350 && w < 450) {
|
||||
w = w + 18;
|
||||
} else if (w >= 300 && w < 350) {
|
||||
w = w + 16;
|
||||
} else {
|
||||
w = w + 14;
|
||||
}
|
||||
$('#' + targetId).width(w);
|
||||
};
|
||||
|
||||
// 切换TOC目录展开收缩的相关操作.
|
||||
const expandedClass = 'expanded';
|
||||
let $tocAside = $('#toc-aside');
|
||||
let $mainContent = $('#main-content');
|
||||
$('#floating-toc-btn .btn-floating').click(function () {
|
||||
if ($tocAside.hasClass(expandedClass)) {
|
||||
$tocAside.removeClass(expandedClass).hide();
|
||||
$mainContent.removeClass('l9');
|
||||
} else {
|
||||
$tocAside.addClass(expandedClass).show();
|
||||
$mainContent.addClass('l9');
|
||||
}
|
||||
fixPostCardWidth('artDetail', 'prenext-posts');
|
||||
});
|
||||
<% } %>
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,251 @@
|
||||
<!-- 文章内容详情 -->
|
||||
<div id="artDetail">
|
||||
<div class="card">
|
||||
<div class="card-content article-info">
|
||||
<div class="row tag-cate">
|
||||
<div class="col s7">
|
||||
<% if (page.tags && page.tags.length) { %>
|
||||
<div class="article-tag">
|
||||
<% page.tags.forEach(function(tag) { %>
|
||||
<a href="<%- url_for(tag.path) %>">
|
||||
<span class="chip bg-color"><%= tag.name %></span>
|
||||
</a>
|
||||
<% }); %>
|
||||
</div>
|
||||
<% } else { %>
|
||||
<div class="article-tag">
|
||||
<span class="chip bg-color"><%- __("notag") %></span>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="col s5 right-align">
|
||||
<% if (page.categories && page.categories.length > 0) { %>
|
||||
<div class="post-cate">
|
||||
<i class="fas fa-bookmark fa-fw icon-category"></i>
|
||||
<% page.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="post-category">
|
||||
<%- category.name %>
|
||||
</a>
|
||||
<% }); %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="post-info">
|
||||
<% if (theme.postInfo.date) { %>
|
||||
<div class="post-date info-break-policy">
|
||||
<i class="far fa-calendar-minus fa-fw"></i><%- __('publishDate') %>:
|
||||
<%- date(page.date, 'YYYY-MM-DD') %>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.postInfo.update) { %>
|
||||
<div class="post-date info-break-policy">
|
||||
<i class="far fa-calendar-check fa-fw"></i><%- __('updateDate') %>:
|
||||
<%- date(page.updated, 'YYYY-MM-DD') %>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.postInfo.wordCount) { %>
|
||||
<div class="info-break-policy">
|
||||
<i class="far fa-file-word fa-fw"></i><%- __('wordCount') %>:
|
||||
<%= wordcount(page.content) %>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.postInfo.min2read) { %>
|
||||
<div class="info-break-policy">
|
||||
<i class="far fa-clock fa-fw"></i><%- __('readTimes') %>:
|
||||
<%= min2read(page.content) %> <%= __('Minutes') %>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.postInfo.readCount && theme.busuanziStatistics && theme.busuanziStatistics.enable) { %>
|
||||
<div id="busuanzi_container_page_pv" class="info-break-policy">
|
||||
<i class="far fa-eye fa-fw"></i><%- __('readCount') %>:
|
||||
<span id="busuanzi_value_page_pv"></span>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
<hr class="clearfix">
|
||||
|
||||
<% if (config.prismjs && config.prismjs.enable) { %>
|
||||
<!-- 是否加载使用自带的 prismjs. -->
|
||||
<link rel="stylesheet" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.prism) %>">
|
||||
<% } %>
|
||||
|
||||
<% if (theme.code.break) { %>
|
||||
<!-- 代码块折行 -->
|
||||
<style type="text/css">
|
||||
code[class*="language-"], pre[class*="language-"] { white-space: pre-wrap !important; }
|
||||
</style>
|
||||
<% } %>
|
||||
|
||||
<div class="card-content article-card-content">
|
||||
<div id="articleContent">
|
||||
<%- page.content %>
|
||||
<% if (theme.bbtime.enable && page.layout == 'bb') { %>
|
||||
<link rel="stylesheet" href="<%- theme.jsDelivr.url %><%- url_for('/css/bb.css') %>">
|
||||
<style>
|
||||
@font-face {
|
||||
font-family: "iconfont";
|
||||
src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168');
|
||||
/* IE9 */
|
||||
src: url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.eot?t=1586882866168#iefix') format('embedded-opentype'),
|
||||
/* IE6-IE8 */
|
||||
url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAALcAAsAAAAAB2gAAAKPAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCfgqCUII8ATYCJAMMCwgABCAFhG0HQBuEBsiuMRkynL4YFCHtLKs4b+k7/80U8DwHIB6+xtr7u3vniDZI6tmnkyDS8NC5iFgJlE7pTPcO8e5b+803aYQy8YtH1JPKyZzY3ttb1EonioVGSBAiRJp4JV9cFppCxLpe2z8sUs37O4QEDFRM0lFeAw4XN6bQPG06zTG8DRwHFOBeGEVWIjE+mP8wduVFPCbQNK4ktN8/OgFJhbEqEFemLkEyFVcUVqoL1ZKDRbyIqafb9AA8+9+PX41IklQyY+PBSZ8KnR+9iBx0OxZcp8PxvGDHyFgACnFY6j8QCfMLIppKPmoCrGtW8OG/y0eufLX/8AiJqDKa22AGWpMzUth6p6aARySQQRUUL4AnSBmuyvIwPdbz21OX5ybO5duOJifaLl6cvkrd1HR7kWEy6yikff29PvgO17V/Tf/9f/oN3PDqz22a719IYlZJHQetpLY08MV6fwFDrF0B6F4XyB3/FyEEnZnU2XGtVwHvpxtA1d6pftKB4AcoWo4U1QQbiiy35Xow27whbwK2NNFlhAc99zeOtM4S6ikFQ1IzhqxuglAoC6ho2UBV3Raa5g0cbxnCRURpYM4pQOh3h6TXG7J+j4RCeULFqFdU9UcETYfRdGHLVJjpHk6SIBXlTTQV5mmWS6SD1jHSVx2JJ1U+a4p4YKawvrSSLQ2QR3yMLcGa3hBCQ40zF/vBc+Q4DH3OLFJExRDCb64un5S9qaIwF9L2cEQiEBWSbUImBePR3PFCOvf5MUS3yiHhNR0VySmEC5jTo7qKWgvCgN5r1XEtrwTW6BoEQYM0HONC/cBLHDPPIL98noUohAqjR7uvWVV1HlVbfWV+o/t8J6DJOJ4jRY6idmVKnmVS1q8tK8zfBAAA') format('woff2'),
|
||||
url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.woff?t=1586882866168') format('woff'),
|
||||
url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.ttf?t=1586882866168') format('truetype'),
|
||||
/* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
|
||||
url('//at.alicdn.com/t/font_1755564_z4mhxbw13mq.svg?t=1586882866168#iconfont') format('svg');
|
||||
/* iOS 4.1- */
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-lianjie:before {
|
||||
content: "\e6a3";
|
||||
}
|
||||
|
||||
.icon-lianjie-copy:before {
|
||||
content: "\e6a4";
|
||||
}
|
||||
</style>
|
||||
<main id="app">
|
||||
<p class="tip">共计发送 {{count}} 条说说</p>
|
||||
<div class="timenode" v-for="item in contents" v-cloak>
|
||||
<div class="meta">
|
||||
<p><time v-bind:datetime="item.attributes.time">{{item.attributes.time}}</time></p>
|
||||
</div>
|
||||
<div class="body">
|
||||
<p v-html='item.attributes.content'></p>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<% } %>
|
||||
</div>
|
||||
<hr/>
|
||||
|
||||
<%- partial('_partial/reprint-statement') %>
|
||||
|
||||
<div class="tag_share" style="display: block;">
|
||||
<div class="post-meta__tag-list" style="display: inline-block;">
|
||||
<% if (page.tags && page.tags.length) { %>
|
||||
<div class="article-tag">
|
||||
<% page.tags.forEach(function(tag) { %>
|
||||
<a href="<%- url_for(tag.path) %>">
|
||||
<span class="chip bg-color"><%= tag.name %></span>
|
||||
</a>
|
||||
<% }); %>
|
||||
</div>
|
||||
<% } else { %>
|
||||
<div class="article-tag">
|
||||
<span class="chip bg-color"><%- __("notag") %></span>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="post_share" style="zoom: 80%; width: fit-content; display: inline-block; float: right; margin: -0.15rem 0;">
|
||||
<%- partial('_partial/share') %>
|
||||
</div>
|
||||
</div>
|
||||
<% if (theme.reward && theme.reward.enable) { %>
|
||||
<%- partial('_partial/reward') %>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% if (theme.gitalk && theme.gitalk.enable) { %>
|
||||
<%- partial('_partial/gitalk') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.gitment.enable) { %>
|
||||
<%- partial('_partial/gitment') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.disqus.enable) { %>
|
||||
<%- partial('_partial/disqus') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.livere && theme.livere.enable) { %>
|
||||
<%- partial('_partial/livere') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.valine && theme.valine.enable) { %>
|
||||
<%- partial('_partial/valine') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.minivaline && theme.minivaline.enable) { %>
|
||||
<%- partial('_partial/minivaline') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.changyan && theme.changyan.enable) { %>
|
||||
<%- partial('_partial/changyan') %>
|
||||
<% } %>
|
||||
|
||||
<%- partial('_partial/prev-next') %>
|
||||
</div>
|
||||
|
||||
<% if (theme.copyright.enable) { %>
|
||||
<script>
|
||||
$('#articleContent').on('copy', function (e) {
|
||||
// IE8 or earlier browser is 'undefined'
|
||||
if (typeof window.getSelection === 'undefined') return;
|
||||
|
||||
var selection = window.getSelection();
|
||||
// if the selection is short let's not annoy our users.
|
||||
if (('' + selection).length < Number.parseInt('<%- theme.copyright.minCharNumber %>')) {
|
||||
return;
|
||||
}
|
||||
|
||||
// create a div outside of the visible area and fill it with the selected text.
|
||||
var bodyElement = document.getElementsByTagName('body')[0];
|
||||
var newdiv = document.createElement('div');
|
||||
newdiv.style.position = 'absolute';
|
||||
newdiv.style.left = '-99999px';
|
||||
bodyElement.appendChild(newdiv);
|
||||
newdiv.appendChild(selection.getRangeAt(0).cloneContents());
|
||||
|
||||
// we need a <pre> tag workaround.
|
||||
// otherwise the text inside "pre" loses all the line breaks!
|
||||
if (selection.getRangeAt(0).commonAncestorContainer.nodeName === 'CODE') {
|
||||
newdiv.innerHTML = "<pre>" + newdiv.innerHTML + "</pre>";
|
||||
}
|
||||
|
||||
var url = document.location.href;
|
||||
newdiv.innerHTML += '<br />'
|
||||
+ '<%- __("from") %>: <%= config.title %><br />'
|
||||
+ '<%- __("author") %>: <%= config.author %><br />'
|
||||
+ '<%- __("link") %>: <a href="' + url + '">' + url + '</a><br />'
|
||||
+ '<%- theme.copyright.description %>';
|
||||
|
||||
selection.selectAllChildren(newdiv);
|
||||
window.setTimeout(function () {bodyElement.removeChild(newdiv);}, 200);
|
||||
});
|
||||
</script>
|
||||
<% } %>
|
||||
|
||||
<!-- 代码块功能依赖 -->
|
||||
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for('/libs/codeBlock/codeBlockFuction.js') %>"></script>
|
||||
|
||||
<!-- 代码语言 -->
|
||||
<% if (theme.code.lang) { %>
|
||||
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for('/libs/codeBlock/codeLang.js') %>"></script>
|
||||
<% } %>
|
||||
|
||||
<!-- 代码块复制 -->
|
||||
<% if (theme.code.copy) { %>
|
||||
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for('/libs/codeBlock/codeCopy.js') %>"></script>
|
||||
<% } %>
|
||||
|
||||
<!-- 代码块收缩 -->
|
||||
<% if (theme.code.shrink) { %>
|
||||
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for('/libs/codeBlock/codeShrink.js') %>"></script>
|
||||
<% } %>
|
||||
@@ -0,0 +1,20 @@
|
||||
<% if (site.posts && site.posts.length > 0) { %>
|
||||
<div class="statis">
|
||||
<span class="count"><a href="<%- url_for('/') %>"><%- site.posts.length %></a></span>
|
||||
<span class="name"><%- __('posts') %></span>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<% if (site.categories && site.categories.length > 0) { %>
|
||||
<div class="statis">
|
||||
<span class="count"><a href="<%- url_for('/categories') %>"><%- site.categories.length %></a></span>
|
||||
<span class="name"><%- __('categories') %></span>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<% if (site.tags && site.tags.length > 0) { %>
|
||||
<div class="statis">
|
||||
<span class="count"><a href="<%- url_for('/tags') %>"><%- site.tags.length %></a></span>
|
||||
<span class="name"><%- __('tags') %></span>
|
||||
</div>
|
||||
<% } %>
|
||||
@@ -0,0 +1,267 @@
|
||||
<%
|
||||
var hashCode = function (str) {
|
||||
if (!str && str.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var hash = 0;
|
||||
for (var i = 0, len = str.length; i < len; i++) {
|
||||
hash = ((hash << 5) - hash) + str.charCodeAt(i);
|
||||
hash |= 0;
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
|
||||
var featureimg = '/medias/featureimages/0.jpg';
|
||||
var featureImages = theme.featureImages;
|
||||
%>
|
||||
|
||||
<article id="prenext-posts" class="prev-next articles">
|
||||
<div class="row article-row">
|
||||
<% if (page.prev) { %>
|
||||
<div class="article col s12 m6" data-aos="fade-up">
|
||||
<div class="article-badge left-badge text-color">
|
||||
<i class="fas fa-chevron-left"></i> <%= __('prev') %></div>
|
||||
<div class="card">
|
||||
<a href="<%- url_for(page.prev.path) %>">
|
||||
<div class="card-image">
|
||||
<% if (page.prev.img) { %>
|
||||
<img src="<%- url_for(page.prev.img) %>" class="responsive-img" alt="<%= page.prev.title %>">
|
||||
<% } else { %>
|
||||
<%
|
||||
var len = featureImages.length;
|
||||
var num = Math.abs(hashCode(page.prev.title) % len);
|
||||
featureimg = featureImages[num];
|
||||
%>
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(featureimg) %>" class="responsive-img" alt="<%= page.prev.title %>">
|
||||
<% } %>
|
||||
<span class="card-title"><%= page.prev.title %></span>
|
||||
</div>
|
||||
</a>
|
||||
<div class="card-content article-content">
|
||||
<div class="summary block-with-text">
|
||||
<% if (page.prev.summary && page.prev.summary.length > 0) { %>
|
||||
<%- page.prev.summary %>
|
||||
<% } else { %>
|
||||
<%- strip_html(page.prev.excerpt).substring(0, 120) %>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="publish-info">
|
||||
<span class="publish-date">
|
||||
<i class="far fa-clock fa-fw icon-date"></i><%= date(page.prev.date, config.date_format) %>
|
||||
</span>
|
||||
<span class="publish-author">
|
||||
<% if (page.prev.categories && page.prev.categories.length > 0) { %>
|
||||
<i class="fas fa-bookmark fa-fw icon-category"></i>
|
||||
<% page.prev.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="post-category">
|
||||
<%- category.name %>
|
||||
</a>
|
||||
<% }); %>
|
||||
<% } else if (page.prev.author && page.prev.author.length > 0) { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- page.prev.author %>
|
||||
<% } else { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- config.author %>
|
||||
<% } %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<% if(page.prev.tags && page.prev.tags.length > 0) { %>
|
||||
<div class="card-action article-tags">
|
||||
<% page.prev.tags.forEach(tag => { %>
|
||||
<a href="<%- url_for(tag.path) %>">
|
||||
<span class="chip bg-color"><%= tag.name %></span>
|
||||
</a>
|
||||
<% }); %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
<% } else { %>
|
||||
<div class="article col s12 m6" data-aos="fade-up" data-aos="fade-up">
|
||||
<div class="article-badge left-badge text-color">
|
||||
<i class="far fa-dot-circle"></i> <%= __('curr') %>
|
||||
</div>
|
||||
<div class="card">
|
||||
<a href="<%- url_for(page.path) %>">
|
||||
<div class="card-image">
|
||||
<% if (page.img) { %>
|
||||
<img src="<%- url_for(page.img) %>" class="responsive-img" alt="<%= page.title %>">
|
||||
<% } else { %>
|
||||
<%
|
||||
featureimg = featureImages[Math.abs(hashCode(page.title) % featureImages.length)];
|
||||
%>
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(featureimg) %>" class="responsive-img" alt="<%= page.title %>">
|
||||
<% } %>
|
||||
<span class="card-title"><%= page.title %></span>
|
||||
</div>
|
||||
</a>
|
||||
<div class="card-content article-content">
|
||||
<div class="summary block-with-text">
|
||||
<% if (page.summary && page.summary.length > 0) { %>
|
||||
<%- page.summary %>
|
||||
<% } else { %>
|
||||
<%- strip_html(page.excerpt).substring(0, 120) %>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="publish-info">
|
||||
<span class="publish-date">
|
||||
<i class="far fa-clock fa-fw icon-date"></i><%= date(page.date, config.date_format) %>
|
||||
</span>
|
||||
<span class="publish-author">
|
||||
<% if (page.categories && page.categories.length > 0) { %>
|
||||
<i class="fas fa-bookmark fa-fw icon-category"></i>
|
||||
<% page.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="post-category">
|
||||
<%- category.name %>
|
||||
</a>
|
||||
<% }); %>
|
||||
<% } else if (page.author && page.author.length > 0) { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- page.author %>
|
||||
<% } else { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- config.author %>
|
||||
<% } %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% if(page.tags && page.tags.length > 0) { %>
|
||||
<div class="card-action article-tags">
|
||||
<% page.tags.forEach(tag => { %>
|
||||
<a href="<%- url_for(tag.path) %>">
|
||||
<span class="chip bg-color"><%= tag.name %></span>
|
||||
</a>
|
||||
<% }); %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
<% if (page.next) { %>
|
||||
<div class="article col s12 m6" data-aos="fade-up">
|
||||
<div class="article-badge right-badge text-color">
|
||||
<%= __('next') %> <i class="fas fa-chevron-right"></i>
|
||||
</div>
|
||||
<div class="card">
|
||||
<a href="<%- url_for(page.next.path) %>">
|
||||
<div class="card-image">
|
||||
<% if (page.next.img) { %>
|
||||
<img src="<%- url_for(page.next.img) %>" class="responsive-img" alt="<%= page.next.title %>">
|
||||
<% } else { %>
|
||||
<%
|
||||
featureimg = featureImages[Math.abs(hashCode(page.next.title) % featureImages.length)];
|
||||
%>
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(featureimg) %>" class="responsive-img" alt="<%= page.next.title %>">
|
||||
<% } %>
|
||||
<span class="card-title"><%= page.next.title %></span>
|
||||
</div>
|
||||
</a>
|
||||
<div class="card-content article-content">
|
||||
<div class="summary block-with-text">
|
||||
<% if (page.next.summary && page.next.summary.length > 0) { %>
|
||||
<%- page.next.summary %>
|
||||
<% } else { %>
|
||||
<%- strip_html(page.next.excerpt).substring(0, 120) %>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="publish-info">
|
||||
<span class="publish-date">
|
||||
<i class="far fa-clock fa-fw icon-date"></i><%= date(page.next.date, config.date_format) %>
|
||||
</span>
|
||||
<span class="publish-author">
|
||||
<% if (page.next.categories && page.next.categories.length > 0) { %>
|
||||
<i class="fas fa-bookmark fa-fw icon-category"></i>
|
||||
<% page.next.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="post-category">
|
||||
<%- category.name %>
|
||||
</a>
|
||||
<% }); %>
|
||||
<% } else if (page.next.author && page.next.author.length > 0) { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- page.next.author %>
|
||||
<% } else { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- config.author %>
|
||||
<% } %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<% if(page.next.tags && page.next.tags.length > 0) { %>
|
||||
<div class="card-action article-tags">
|
||||
<% page.next.tags.forEach(tag => { %>
|
||||
<a href="<%- url_for(tag.path) %>">
|
||||
<span class="chip bg-color"><%= tag.name %></span>
|
||||
</a>
|
||||
<% }); %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
<% } else { %>
|
||||
<div class="article col s12 m6" data-aos="fade-up">
|
||||
<div class="article-badge right-badge text-color">
|
||||
<%= __('curr') %> <i class="far fa-dot-circle"></i>
|
||||
</div>
|
||||
<div class="card">
|
||||
<a href="<%- url_for(page.path) %>">
|
||||
<div class="card-image">
|
||||
<% if (page.img) { %>
|
||||
<img src="<%- url_for(page.img) %>" class="responsive-img" alt="<%= page.title %>">
|
||||
<% } else { %>
|
||||
<%
|
||||
featureimg = featureImages[Math.abs(hashCode(page.title) % featureImages.length)];
|
||||
%>
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(featureimg) %>" class="responsive-img" alt="<%= page.title %>">
|
||||
<% } %>
|
||||
<span class="card-title"><%= page.title %></span>
|
||||
</div>
|
||||
</a>
|
||||
<div class="card-content article-content">
|
||||
<div class="summary block-with-text">
|
||||
<% if (page.summary && page.summary.length > 0) { %>
|
||||
<%- page.summary %>
|
||||
<% } else { %>
|
||||
<%- strip_html(page.excerpt).substring(0, 120) %>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="publish-info">
|
||||
<span class="publish-date">
|
||||
<i class="far fa-clock fa-fw icon-date"></i><%= date(page.date, config.date_format) %>
|
||||
</span>
|
||||
<span class="publish-author">
|
||||
<% if (page.categories && page.categories.length > 0) { %>
|
||||
<i class="fas fa-bookmark fa-fw icon-category"></i>
|
||||
<% page.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="post-category">
|
||||
<%- category.name %>
|
||||
</a>
|
||||
<% }); %>
|
||||
<% } else if (page.author && page.author.length > 0) { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- page.author %>
|
||||
<% } else { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- config.author %>
|
||||
<% } %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% if(page.tags && page.tags.length > 0) { %>
|
||||
<div class="card-action article-tags">
|
||||
<% page.tags.forEach(tag => { %>
|
||||
<a href="<%- url_for(tag.path) %>">
|
||||
<span class="chip bg-color"><%= tag.name %></span>
|
||||
</a>
|
||||
<% }); %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</article>
|
||||
@@ -0,0 +1,258 @@
|
||||
<%
|
||||
let reprintPolicyEnabled = theme.reprint && theme.reprint.enable;
|
||||
let reprintPolicy = page.reprintPolicy || theme.reprint.default || 'cc_by';
|
||||
%>
|
||||
<% if (reprintPolicyEnabled) { %>
|
||||
<div class="reprint" id="reprint-statement">
|
||||
<% if (reprintPolicy === 'cc_by') { %>
|
||||
<div class="reprint__author">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-user">
|
||||
<%= __('author') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- url_for('/about') %>" rel="external nofollow noreferrer"><%- page.author || config.author %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__type">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-link">
|
||||
<%= __('link') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %><%- url_for(page.path) %>"><%- config.url %><%- url_for(page.path) %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__notice">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-copyright">
|
||||
<%= __('reprint') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<%= __('use') %>
|
||||
<a href="<%= __('cc_by_url') %>" rel="external nofollow noreferrer" target="_blank"><%= __('cc_by_name') %></a>
|
||||
<%= __('licensed') %>
|
||||
<a href="<%- url_for('/about') %>" target="_blank"><%- page.author || config.author %></a>
|
||||
!
|
||||
</span>
|
||||
</div>
|
||||
<% } else if (reprintPolicy === 'cc_by_nd') { %>
|
||||
<div class="reprint__author">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-user">
|
||||
<%= __('author') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- url_for('/about') %>" rel="external nofollow noreferrer"><%- page.author || config.author %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__type">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-link">
|
||||
<%= __('link') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %><%- url_for(page.path) %>"><%- config.url %><%- url_for(page.path) %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__notice">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-copyright">
|
||||
<%= __('reprint') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<%= __('use') %>
|
||||
<a href="<%= __('cc_by_nd_url') %>" rel="external nofollow noreferrer" target="_blank"><%= __('cc_by_nd_name') %></a>
|
||||
<%= __('licensed') %>
|
||||
<a href="<%- config.url %>" target="_blank"><%- page.author || config.author %></a>
|
||||
!
|
||||
</span>
|
||||
</div>
|
||||
<% } else if (reprintPolicy === 'cc_by_sa') { %>
|
||||
<div class="reprint__author">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-user">
|
||||
<%= __('author') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %>" rel="external nofollow noreferrer"><%- page.author || config.author %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__type">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-link">
|
||||
<%= __('link') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %><%- url_for(page.path) %>"><%- config.url %><%- url_for(page.path) %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__notice">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-copyright">
|
||||
<%= __('reprint') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<%= __('use') %>
|
||||
<a href="<%= __('cc_by_sa_url') %>" rel="external nofollow noreferrer" target="_blank"><%= __('cc_by_sa_name') %></a>
|
||||
<%= __('licensed') %>
|
||||
<a href="<%- config.url %>" target="_blank"><%- page.author || config.author %></a>
|
||||
!
|
||||
</span>
|
||||
</div>
|
||||
<% } else if (reprintPolicy === 'cc_by_nc') { %>
|
||||
<div class="reprint__author">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-user">
|
||||
<%= __('author') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %>" rel="external nofollow noreferrer"><%- page.author || config.author %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__type">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-link">
|
||||
<%= __('link') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %><%- url_for(page.path) %>"><%- config.url %><%- url_for(page.path) %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__notice">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-copyright">
|
||||
<%= __('reprint') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<%= __('use') %>
|
||||
<a href="<%= __('cc_by_nc_url') %>" rel="external nofollow noreferrer" target="_blank"><%= __('cc_by_nc_name') %></a>
|
||||
<%= __('licensed') %>
|
||||
<a href="<%- config.url %>" target="_blank"><%- page.author || config.author %></a>
|
||||
!
|
||||
</span>
|
||||
</div>
|
||||
<% } else if (reprintPolicy === 'cc_by_nc_nd') { %>
|
||||
<div class="reprint__author">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-user">
|
||||
<%= __('author') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %>" rel="external nofollow noreferrer"><%- page.author || config.author %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__type">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-link">
|
||||
<%= __('link') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %><%- url_for(page.path) %>"><%- config.url %><%- url_for(page.path) %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__notice">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-copyright">
|
||||
<%= __('reprint') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<%= __('use') %>
|
||||
<a href="<%= __('cc_by_nc_nd_url') %>" rel="external nofollow noreferrer" target="_blank"><%= __('cc_by_nc_nd_name') %></a>
|
||||
<%= __('licensed') %>
|
||||
<a href="<%- config.url %>" target="_blank"><%- page.author || config.author %></a>
|
||||
!
|
||||
</span>
|
||||
</div>
|
||||
<% } else if (reprintPolicy === 'cc_by_nc_sa') { %>
|
||||
<div class="reprint__author">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-user">
|
||||
<%= __('author') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %>" rel="external nofollow noreferrer"><%- page.author || config.author %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__type">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-link">
|
||||
<%= __('link') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %><%- url_for(page.path) %>"><%- config.url %><%- url_for(page.path) %></a>
|
||||
</span>
|
||||
</div>
|
||||
<div class="reprint__notice">
|
||||
<span class="reprint-meta" style="font-weight: bold;">
|
||||
<i class="fas fa-copyright">
|
||||
<%= __('reprint') %>:
|
||||
</i>
|
||||
</span>
|
||||
<span class="reprint-info">
|
||||
<%= __('use') %>
|
||||
<a href="<%= __('cc_by_nc_sa_url') %>" rel="external nofollow noreferrer" target="_blank"><%= __('cc_by_nc_sa_name') %></a>
|
||||
<%= __('licensed') %>
|
||||
<a href="<%- config.url %>" target="_blank"><%- page.author || config.author %></a>
|
||||
!
|
||||
</span>
|
||||
</div>
|
||||
<% } else if (reprintPolicy === 'cc0') { %>
|
||||
<i class="fas fa-exclamation-circle"></i>
|
||||
<%= __('toTheExtentPossibleUnderLaw') %>
|
||||
<a href="<%- config.url %>">
|
||||
<%- page.author || config.author %>
|
||||
</a>
|
||||
<%= __('hasWaivedAllCopyrightAndRelatedOrNeighboringRightsTo') %>
|
||||
<a href="<%- url_for(page.path) %>">
|
||||
《<%= page.title %>》
|
||||
</a>
|
||||
<%= __('workPublishedFrom') %>
|
||||
<span property="vcard:Country" datatype="dct:ISO3166"
|
||||
content="<%= __('cc_0_content') %>" about="<%- url_for(page.path) %>">
|
||||
<%= __('cc_0_country') %>
|
||||
</span>
|
||||
</p>
|
||||
<% } else if (reprintPolicy === 'noreprint') { %>
|
||||
<i class="fas fa-exclamation-circle"></i>
|
||||
<span>
|
||||
<%= __('noreprint') %>
|
||||
</span>
|
||||
<% } else if (reprintPolicy === 'pay') { %>
|
||||
<i class="fas fa-exclamation-circle"></i>
|
||||
<%= __('paycontact') %>
|
||||
<span class="reprint-info">
|
||||
<a href="<%- config.url %>" rel="external nofollow noreferrer"><%- page.author || config.author %></a>
|
||||
</span>
|
||||
<%= __('payreprint') %>
|
||||
<% } %>
|
||||
</div>
|
||||
|
||||
<script async defer>
|
||||
document.addEventListener("copy", function (e) {
|
||||
let toastHTML = '<span><%= __('pleaseFollowReprintPolicy') %></span><button class="btn-flat toast-action" onclick="navToReprintStatement()" style="font-size: smaller"><%= __('checkPolicy') %></a>';
|
||||
M.toast({html: toastHTML})
|
||||
});
|
||||
|
||||
function navToReprintStatement() {
|
||||
$("html, body").animate({scrollTop: $("#reprint-statement").offset().top - 80}, 800);
|
||||
}
|
||||
</script>
|
||||
<% } %>
|
||||
@@ -0,0 +1,124 @@
|
||||
<style>
|
||||
#reward {
|
||||
margin: 40px 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#reward .reward-link {
|
||||
font-size: 1.4rem;
|
||||
line-height: 38px;
|
||||
}
|
||||
|
||||
#reward .btn-floating:hover {
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2), 0 5px 15px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
#rewardModal {
|
||||
width: 320px;
|
||||
height: 350px;
|
||||
}
|
||||
|
||||
#rewardModal .reward-title {
|
||||
margin: 15px auto;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
#rewardModal .modal-content {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#rewardModal .close {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 15px;
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
font-size: 1.3rem;
|
||||
line-height: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#rewardModal .close:hover {
|
||||
color: #ef5350;
|
||||
transform: scale(1.3);
|
||||
-moz-transform:scale(1.3);
|
||||
-webkit-transform:scale(1.3);
|
||||
-o-transform:scale(1.3);
|
||||
}
|
||||
|
||||
#rewardModal .reward-tabs {
|
||||
margin: 0 auto;
|
||||
width: 210px;
|
||||
}
|
||||
|
||||
.reward-tabs .tabs {
|
||||
height: 38px;
|
||||
margin: 10px auto;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.reward-content ul {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
.reward-tabs .tabs .tab {
|
||||
height: 38px;
|
||||
line-height: 38px;
|
||||
}
|
||||
|
||||
.reward-tabs .tab a {
|
||||
color: #fff;
|
||||
background-color: #ccc;
|
||||
}
|
||||
|
||||
.reward-tabs .tab a:hover {
|
||||
background-color: #ccc;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.reward-tabs .wechat-tab .active {
|
||||
color: #fff !important;
|
||||
background-color: #22AB38 !important;
|
||||
}
|
||||
|
||||
.reward-tabs .alipay-tab .active {
|
||||
color: #fff !important;
|
||||
background-color: #019FE8 !important;
|
||||
}
|
||||
|
||||
.reward-tabs .reward-img {
|
||||
width: 210px;
|
||||
height: 210px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="reward">
|
||||
<a href="#rewardModal" class="reward-link modal-trigger btn-floating btn-medium waves-effect waves-light red">赏</a>
|
||||
|
||||
<!-- Modal Structure -->
|
||||
<div id="rewardModal" class="modal">
|
||||
<div class="modal-content">
|
||||
<a class="close modal-close"><i class="fas fa-times"></i></a>
|
||||
<h4 class="reward-title"><%= theme.reward.title %></h4>
|
||||
<div class="reward-content">
|
||||
<div class="reward-tabs">
|
||||
<ul class="tabs row">
|
||||
<li class="tab col s6 alipay-tab waves-effect waves-light"><a href="#alipay">支付宝</a></li>
|
||||
<li class="tab col s6 wechat-tab waves-effect waves-light"><a href="#wechat">微 信</a></li>
|
||||
</ul>
|
||||
<div id="alipay">
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(theme.reward.alipay) %>" class="reward-img" alt="支付宝打赏二维码">
|
||||
</div>
|
||||
<div id="wechat">
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(theme.reward.wechat) %>" class="reward-img" alt="微信打赏二维码">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(function () {
|
||||
$('.tabs').tabs();
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,103 @@
|
||||
<!-- 搜索遮罩框 -->
|
||||
<div id="searchModal" class="modal">
|
||||
<div class="modal-content">
|
||||
<div class="search-header">
|
||||
<span class="title"><i class="fas fa-search"></i> <%= __('search') %></span>
|
||||
<input type="search" id="searchInput" name="s" placeholder="<%= __('searchTip') %>"
|
||||
class="search-input">
|
||||
</div>
|
||||
<div id="searchResult"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(function () {
|
||||
var searchFunc = function (path, search_id, content_id) {
|
||||
'use strict';
|
||||
$.ajax({
|
||||
url: path,
|
||||
dataType: "xml",
|
||||
success: function (xmlResponse) {
|
||||
// get the contents from search data
|
||||
var datas = $("entry", xmlResponse).map(function () {
|
||||
return {
|
||||
title: $("title", this).text(),
|
||||
content: $("content", this).text(),
|
||||
url: $("url", this).text()
|
||||
};
|
||||
}).get();
|
||||
var $input = document.getElementById(search_id);
|
||||
var $resultContent = document.getElementById(content_id);
|
||||
$input.addEventListener('input', function () {
|
||||
var str = '<ul class=\"search-result-list\">';
|
||||
var keywords = this.value.trim().toLowerCase().split(/[\s\-]+/);
|
||||
$resultContent.innerHTML = "";
|
||||
if (this.value.trim().length <= 0) {
|
||||
return;
|
||||
}
|
||||
// perform local searching
|
||||
datas.forEach(function (data) {
|
||||
var isMatch = true;
|
||||
var data_title = data.title.trim().toLowerCase();
|
||||
var data_content = data.content.trim().replace(/<[^>]+>/g, "").toLowerCase();
|
||||
var data_url = data.url;
|
||||
data_url = data_url.indexOf('/') === 0 ? data.url : '/' + data_url;
|
||||
var index_title = -1;
|
||||
var index_content = -1;
|
||||
var first_occur = -1;
|
||||
// only match artiles with not empty titles and contents
|
||||
if (data_title !== '' && data_content !== '') {
|
||||
keywords.forEach(function (keyword, i) {
|
||||
index_title = data_title.indexOf(keyword);
|
||||
index_content = data_content.indexOf(keyword);
|
||||
if (index_title < 0 && index_content < 0) {
|
||||
isMatch = false;
|
||||
} else {
|
||||
if (index_content < 0) {
|
||||
index_content = 0;
|
||||
}
|
||||
if (i === 0) {
|
||||
first_occur = index_content;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
// show search results
|
||||
if (isMatch) {
|
||||
str += "<li><a href='" + data_url + "' class='search-result-title'>" + data_title + "</a>";
|
||||
var content = data.content.trim().replace(/<[^>]+>/g, "");
|
||||
if (first_occur >= 0) {
|
||||
// cut out 100 characters
|
||||
var start = first_occur - 20;
|
||||
var end = first_occur + 80;
|
||||
if (start < 0) {
|
||||
start = 0;
|
||||
}
|
||||
if (start === 0) {
|
||||
end = 100;
|
||||
}
|
||||
if (end > content.length) {
|
||||
end = content.length;
|
||||
}
|
||||
var match_content = content.substr(start, end);
|
||||
// highlight all keywords
|
||||
keywords.forEach(function (keyword) {
|
||||
var regS = new RegExp(keyword, "gi");
|
||||
match_content = match_content.replace(regS, "<em class=\"search-keyword\">" + keyword + "</em>");
|
||||
});
|
||||
|
||||
str += "<p class=\"search-result\">" + match_content + "...</p>"
|
||||
}
|
||||
str += "</li>";
|
||||
}
|
||||
});
|
||||
str += "</ul>";
|
||||
$resultContent.innerHTML = str;
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
searchFunc('<%- url_for('/search.xml') %>', 'searchInput', 'searchResult');
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,14 @@
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.jsDelivr.url %><%- url_for('/libs/share/css/share.min.css') %>">
|
||||
<div id="article-share">
|
||||
|
||||
<% if (theme.sharejs.enable) { %>
|
||||
<div class="social-share" data-sites="<%- theme.sharejs.sites %>" data-wechat-qrcode-helper="<p>微信扫一扫即可分享！</p>"></div>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for('/libs/share/js/social-share.min.js') %>"></script>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.addthis.enable) { %>
|
||||
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=<%- theme.addthis.pubid %>"></script>
|
||||
<div class="addthis_inline_share_toolbox"></div>
|
||||
<% } %>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,47 @@
|
||||
<% if (theme.socialLink.github) { %>
|
||||
<a href="<%= theme.socialLink.github %>" class="tooltipped" target="_blank" data-tooltip="访问我的GitHub" data-position="top" data-delay="50">
|
||||
<i class="fab fa-github"></i>
|
||||
</a>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.socialLink.email) { %>
|
||||
<a href="mailto:<%= theme.socialLink.email %>" class="tooltipped" target="_blank" data-tooltip="邮件联系我" data-position="top" data-delay="50">
|
||||
<i class="fas fa-envelope-open"></i>
|
||||
</a>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.socialLink.facebook) { %>
|
||||
<a href="<%= theme.socialLink.facebook %>" class="tooltipped" target="_blank" data-tooltip="关注我的Facebook: <%= theme.socialLink.facebook %>" data-position="top" data-delay="50">
|
||||
<i class="fab fa-facebook-f"></i>
|
||||
</a>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.socialLink.twitter) { %>
|
||||
<a href="<%= theme.socialLink.twitter %>" class="tooltipped" target="_blank" data-tooltip="关注我的Twitter: <%= theme.socialLink.twitter %>" data-position="top" data-delay="50">
|
||||
<i class="fab fa-twitter"></i>
|
||||
</a>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.socialLink.qq) { %>
|
||||
<a href="tencent://AddContact/?fromId=50&fromSubId=1&subcmd=all&uin=<%= theme.socialLink.qq %>" class="tooltipped" target="_blank" data-tooltip="QQ联系我: <%= theme.socialLink.qq %>" data-position="top" data-delay="50">
|
||||
<i class="fab fa-qq"></i>
|
||||
</a>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.socialLink.weibo) { %>
|
||||
<a href="<%= theme.socialLink.weibo %>" class="tooltipped" target="_blank" data-tooltip="关注我的微博: <%= theme.socialLink.weibo %>" data-position="top" data-delay="50">
|
||||
<i class="fab fa-weibo"></i>
|
||||
</a>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.socialLink.zhihu) { %>
|
||||
<a href="<%= theme.socialLink.zhihu %>" class="tooltipped" target="_blank" data-tooltip="关注我的知乎: <%= theme.socialLink.zhihu %>" data-position="top" data-delay="50">
|
||||
<i class="fab fa-zhihu1">知</i>
|
||||
</a>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.socialLink.rss) { %>
|
||||
<a href="<%- url_for('/atom.xml') %>" class="tooltipped" target="_blank" data-tooltip="RSS 订阅" data-position="top" data-delay="50">
|
||||
<i class="fas fa-rss"></i>
|
||||
</a>
|
||||
<% } %>
|
||||
@@ -0,0 +1,300 @@
|
||||
<style>
|
||||
.valine-card {
|
||||
margin: 1.5rem auto;
|
||||
}
|
||||
|
||||
.valine-card .card-content {
|
||||
padding: 20px 20px 5px 20px;
|
||||
}
|
||||
|
||||
#vcomments textarea {
|
||||
box-sizing: border-box;
|
||||
background: url("<%- url_for(theme.valine.background) %>") 100% 100% no-repeat;
|
||||
}
|
||||
|
||||
#vcomments p {
|
||||
margin: 2px 2px 10px;
|
||||
font-size: 1.05rem;
|
||||
line-height: 1.78rem;
|
||||
}
|
||||
|
||||
#vcomments blockquote p {
|
||||
text-indent: 0.2rem;
|
||||
}
|
||||
|
||||
#vcomments a {
|
||||
padding: 0 2px;
|
||||
color: #4cbf30;
|
||||
font-weight: 500;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#vcomments img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#vcomments ol li {
|
||||
list-style-type: decimal;
|
||||
}
|
||||
|
||||
#vcomments ol,
|
||||
ul {
|
||||
display: block;
|
||||
padding-left: 2em;
|
||||
word-spacing: 0.05rem;
|
||||
}
|
||||
|
||||
#vcomments ul li,
|
||||
ol li {
|
||||
display: list-item;
|
||||
line-height: 1.8rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
#vcomments ul li {
|
||||
list-style-type: disc;
|
||||
}
|
||||
|
||||
#vcomments ul ul li {
|
||||
list-style-type: circle;
|
||||
}
|
||||
|
||||
#vcomments table, th, td {
|
||||
padding: 12px 13px;
|
||||
border: 1px solid #dfe2e5;
|
||||
}
|
||||
|
||||
#vcomments table, th, td {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
table tr:nth-child(2n), thead {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
||||
#vcomments table th {
|
||||
background-color: #f2f2f2;
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
#vcomments table td {
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
#vcomments h1 {
|
||||
font-size: 1.85rem;
|
||||
font-weight: bold;
|
||||
line-height: 2.2rem;
|
||||
}
|
||||
|
||||
#vcomments h2 {
|
||||
font-size: 1.65rem;
|
||||
font-weight: bold;
|
||||
line-height: 1.9rem;
|
||||
}
|
||||
|
||||
#vcomments h3 {
|
||||
font-size: 1.45rem;
|
||||
font-weight: bold;
|
||||
line-height: 1.7rem;
|
||||
}
|
||||
|
||||
#vcomments h4 {
|
||||
font-size: 1.25rem;
|
||||
font-weight: bold;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
|
||||
#vcomments h5 {
|
||||
font-size: 1.1rem;
|
||||
font-weight: bold;
|
||||
line-height: 1.4rem;
|
||||
}
|
||||
|
||||
#vcomments h6 {
|
||||
font-size: 1rem;
|
||||
line-height: 1.3rem;
|
||||
}
|
||||
|
||||
#vcomments p {
|
||||
font-size: 1rem;
|
||||
line-height: 1.5rem;
|
||||
}
|
||||
|
||||
#vcomments hr {
|
||||
margin: 12px 0;
|
||||
border: 0;
|
||||
border-top: 1px solid #ccc;
|
||||
}
|
||||
|
||||
#vcomments blockquote {
|
||||
margin: 15px 0;
|
||||
border-left: 5px solid #42b983;
|
||||
padding: 1rem 0.8rem 0.3rem 0.8rem;
|
||||
color: #666;
|
||||
background-color: rgba(66, 185, 131, .1);
|
||||
}
|
||||
|
||||
#vcomments pre {
|
||||
font-family: monospace, monospace;
|
||||
padding: 1.2em;
|
||||
margin: .5em 0;
|
||||
background: #272822;
|
||||
overflow: auto;
|
||||
border-radius: 0.3em;
|
||||
tab-size: 4;
|
||||
}
|
||||
|
||||
#vcomments code {
|
||||
font-family: monospace, monospace;
|
||||
padding: 1px 3px;
|
||||
font-size: 0.92rem;
|
||||
color: #e96900;
|
||||
background-color: #f8f8f8;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#vcomments pre code {
|
||||
font-family: monospace, monospace;
|
||||
padding: 0;
|
||||
color: #e8eaf6;
|
||||
background-color: #272822;
|
||||
}
|
||||
|
||||
#vcomments pre[class*="language-"] {
|
||||
padding: 1.2em;
|
||||
margin: .5em 0;
|
||||
}
|
||||
|
||||
#vcomments code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: #e8eaf6;
|
||||
}
|
||||
|
||||
#vcomments [type="checkbox"]:not(:checked), [type="checkbox"]:checked {
|
||||
position: inherit;
|
||||
margin-left: -1.3rem;
|
||||
margin-right: 0.4rem;
|
||||
margin-top: -1px;
|
||||
vertical-align: middle;
|
||||
left: unset;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
#vcomments b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#vcomments dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
#vcomments small {
|
||||
font-size: 85%;
|
||||
}
|
||||
|
||||
#vcomments cite {
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
#vcomments mark {
|
||||
background-color: #fcf8e3;
|
||||
padding: .2em;
|
||||
}
|
||||
|
||||
#vcomments table, th, td {
|
||||
padding: 12px 13px;
|
||||
border: 1px solid #dfe2e5;
|
||||
}
|
||||
|
||||
table tr:nth-child(2n), thead {
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
||||
#vcomments table th {
|
||||
background-color: #f2f2f2;
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
#vcomments table td {
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
#vcomments [type="checkbox"]:not(:checked), [type="checkbox"]:checked {
|
||||
position: inherit;
|
||||
margin-left: -1.3rem;
|
||||
margin-right: 0.4rem;
|
||||
margin-top: -1px;
|
||||
vertical-align: middle;
|
||||
left: unset;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.v[data-class="v"] .vwrap .vheader .vinput {
|
||||
width: 32%;
|
||||
border-bottom: 1px dashed #dedede;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="card valine-card" data-aos="fade-up">
|
||||
<div class="comment_headling" style="font-size: 20px; font-weight: 700; position: relative; padding-left: 20px; top: 15px; padding-bottom: 5px;">
|
||||
<i class="fas fa-comments fa-fw" aria-hidden="true"></i>
|
||||
<span>评论</span>
|
||||
</div>
|
||||
<div id="vcomments" class="card-content" style="display: grid">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for('/libs/valine/av-min.js') %>"></script>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.valine) %>"></script>
|
||||
<script>
|
||||
let metaPlaceholder = <%- JSON.stringify(theme.valine.metaPlaceholder) %> ;
|
||||
//这里要换行
|
||||
new Valine({
|
||||
el: '#vcomments',
|
||||
appId: '<%- theme.valine.appId %>',
|
||||
appKey: '<%- theme.valine.appKey %>',
|
||||
notify: '<%- theme.valine.notify %>' === 'true',
|
||||
verify: '<%- theme.valine.verify %>' === 'true',
|
||||
visitor: '<%- theme.valine.visitor %>' === 'true',
|
||||
avatar: '<%- theme.valine.avatar %>',
|
||||
pageSize: '<%- theme.valine.pageSize %>',
|
||||
lang: '<%- theme.valine.lang %>',
|
||||
placeholder: '<%= theme.valine.placeholder %>',
|
||||
meta: <%- '["' + theme.valine.guest_info.join('", "') + '"]' %>,
|
||||
recordIP: '<%- theme.valine.recordIP %>' === 'true',
|
||||
enableQQ: '<%- theme.valine.avatar %>',
|
||||
requiredFields: <%- '["' + theme.valine.master.join('", "') + '"]' %>,
|
||||
master: <%- '["' + theme.valine.master.join('", "') + '"]' %>,
|
||||
friends: <%- '["' + theme.valine.friends.join('", "') + '"]' %>,
|
||||
tagMeta: <%- '["' + theme.valine.tagMeta.join('", "') + '"]' %>,
|
||||
metaPlaceholder: metaPlaceholder,
|
||||
|
||||
});
|
||||
|
||||
document.body.addEventListener('click', function(e) {
|
||||
if (e.target.classList.contains('vsubmit')) {
|
||||
const email = document.querySelector('input[type=email]');
|
||||
const nick = document.querySelector('input[name=nick]');
|
||||
const reg = /^[A-Za-z0-9_-\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
|
||||
if (!email.value || !nick.value || !reg.test(email.value)) {
|
||||
const str = `<div class="valert txt-center"><div class="vtext">请填写正确的昵称和邮箱！</div></div>`;
|
||||
const vmark = document.querySelector('.vmark');
|
||||
vmark.innerHTML = str;
|
||||
vmark.style.display = 'block';
|
||||
|
||||
e.stopPropagation();
|
||||
|
||||
setTimeout(function() {
|
||||
vmark.style.display = 'none';
|
||||
vmark.innerHTML = '';
|
||||
}, 2500);
|
||||
}
|
||||
}
|
||||
}, true);
|
||||
</script>
|
||||
|
||||
|
||||
@@ -0,0 +1,8 @@
|
||||
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/artitalk"></script>
|
||||
<div id="artitalk_main"></div>
|
||||
<script>
|
||||
new Artitalk({
|
||||
appId: '<%- theme.artitalk.appId %>',
|
||||
appKey: '<%- theme.artitalk.appKey %>',
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,171 @@
|
||||
<%
|
||||
var colorArr = ['#F9EBEA', '#F5EEF8', '#D5F5E3', '#E8F8F5', '#FEF9E7',
|
||||
'#F8F9F9', '#82E0AA', '#D7BDE2', '#A3E4D7', '#85C1E9', '#F8C471', '#F9E79F', '#FFF'];
|
||||
var colorCount = colorArr.length;
|
||||
var hashCode = function (str) {
|
||||
if (!str && str.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var hash = 0;
|
||||
for (var i = 0, len = str.length; i < len; i++) {
|
||||
hash = ((hash << 5) - hash) + str.charCodeAt(i);
|
||||
hash |= 0;
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
var i = 0;
|
||||
var isCategory = is_category();
|
||||
%>
|
||||
|
||||
<div id="category-cloud" class="container chip-container">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="tag-title center-align">
|
||||
<i class="fas fa-bookmark"></i> <%= __('postCategoryTitle') %>
|
||||
</div>
|
||||
<div class="tag-chips">
|
||||
<% if (site.categories && site.categories.length > 0) { %>
|
||||
<% site.categories.map(function(category) { %>
|
||||
<%
|
||||
i++;
|
||||
// 随机颜色
|
||||
var colors = '#' + Math.random().toString(16).substr(2, 6).toUpperCase();
|
||||
|
||||
/* var color = i >= colorCount
|
||||
? colorArr[Math.abs(hashCode(category.name) % colorCount)]
|
||||
: colorArr[i - 1]; */
|
||||
%>
|
||||
<a href="<%- url_for(category.path) %>" title="<%- category.name %>: <%- category.length %>">
|
||||
<div class="moleskine-wrapper">
|
||||
<div class="moleskine-notebook">
|
||||
<div class="chip notebook-cover center-align waves-effect waves-light
|
||||
<% if (isCategory && category.name == page.category) { %> chip-active <% } else { %> chip-default <% } %>"
|
||||
style="background-color: <%- colors %>;">
|
||||
<div class="notebook-skin
|
||||
<% if (isCategory && category.name == page.category) { %> chip-active <% } else { %> chip-default <% } %>"
|
||||
><%- category.name %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="notebook-page dotted"></div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<% }); %>
|
||||
<% } else { %>
|
||||
<%= __('categoryEmptyTip') %>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<style>
|
||||
/* 文章分类书本样式 */
|
||||
.chip-container .tag-chips {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.chip-container .tag-chips a {
|
||||
margin: 0 7px 10px;
|
||||
}
|
||||
.chip-container .chip {
|
||||
max-width: calc(100% / 4);
|
||||
min-width: 10em;
|
||||
height: 200px;
|
||||
position: relative;
|
||||
transition: .5s linear;
|
||||
padding: 19px 0;
|
||||
line-height: 20px;
|
||||
z-index: 990;
|
||||
border-radius: 5px 15px 15px 5px;
|
||||
transform-origin: left center 0;
|
||||
}
|
||||
.chip-container .notebook-cover::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: calc(100% + 2px);
|
||||
top: -1px;
|
||||
z-index: 100;
|
||||
border-radius: 2px;
|
||||
right: 25px;
|
||||
transition: 2s ease;
|
||||
/* background: linear-gradient(to right,#9c2e2b 0,#cc4b48 12%,#9c2e2b 25%,#cc4b48 37%,#9c2e2b 50%,#cc4b48 62%,#9c2e2b 75%,#cc4b48 87%,#9c2e2b 100%); */
|
||||
background: linear-gradient(to right,#1e606e 0,#2e95aa 12%,#1e606e 25%,#2e95aa 37%,#1e606e 50%,#2e95aa 62%,#1e606e 75%,#2e95aa 87%,#1e606e 100%);
|
||||
}
|
||||
|
||||
.chip .notebook-skin {
|
||||
height: 50px;
|
||||
width: 100%;
|
||||
background: #e8e8e0;
|
||||
margin-top: 42px;
|
||||
padding: 10px 32px 64px 10px;
|
||||
font-size: 19px;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
color: #222;
|
||||
text-align: left;
|
||||
box-shadow: 0 1px 1px rgba(0,0,0,.2);
|
||||
}
|
||||
.chip .notebook-skin:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 15px;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
background: #cddc39;
|
||||
}
|
||||
.notebook-cover {
|
||||
background: #cc4b48;
|
||||
height: 200px;
|
||||
width: 140px;
|
||||
position: absolute;
|
||||
border-radius: 5px 15px 15px 5px;
|
||||
z-index: 10;
|
||||
transition: .5s linear;
|
||||
transform-style: preserve-3d;
|
||||
transform-origin: left center 0;
|
||||
}
|
||||
|
||||
.moleskine-wrapper {
|
||||
max-width: calc(100% / 4);
|
||||
min-width: 10em;
|
||||
}
|
||||
.moleskine-notebook:hover .notebook-cover {
|
||||
transform: rotateY(-50deg);
|
||||
z-index: 99;
|
||||
box-shadow: 20px 10px 50px rgba(0,0,0,.2);
|
||||
}
|
||||
.moleskine-notebook {
|
||||
height: 200px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-around;
|
||||
transition: .5s linear;
|
||||
border-radius: 5px 15px 15px 5px;
|
||||
transform-origin: left center 0;
|
||||
}
|
||||
.moleskine-notebook:hover {
|
||||
transform: rotateZ(-10deg);
|
||||
}
|
||||
.notebook-page.dotted {
|
||||
background: linear-gradient(to bottom,#fbfae8 9px,#e4e4e4 1px);
|
||||
background-size: 100% 10px;
|
||||
}
|
||||
.chip-container .chip:hover {
|
||||
background: none;
|
||||
}
|
||||
.notebook-page {
|
||||
height: 100%;
|
||||
width: 140px;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
background-color: #fbfae8;
|
||||
z-index: 0;
|
||||
border-radius: 5px 16px 16px 5px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,74 @@
|
||||
<style type="text/css">
|
||||
#category-radar {
|
||||
width: 100%;
|
||||
height: 360px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="container" data-aos="fade-up">
|
||||
<div class="card">
|
||||
<div id="category-radar" class="card-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.echarts) %>"></script>
|
||||
<script type="text/javascript">
|
||||
let radarChart = echarts.init(document.getElementById('category-radar'));
|
||||
|
||||
<%
|
||||
var categories = site.categories;
|
||||
|
||||
// Find the maximum and average values of the post categories.
|
||||
var radarValueArr = [];
|
||||
categories.some(function(category) {
|
||||
radarValueArr.push(category.length);
|
||||
});
|
||||
|
||||
var max = Math.max.apply(null, radarValueArr) + Math.min.apply(null, radarValueArr);
|
||||
|
||||
// Calculate the data needed for the radar chart.
|
||||
var indicatorArr = [];
|
||||
categories.map(function(category) {
|
||||
indicatorArr.push({'name': category.name, 'max': max});
|
||||
});
|
||||
|
||||
var indicatorData = JSON.stringify(indicatorArr);
|
||||
var radarValueData = JSON.stringify(radarValueArr);
|
||||
%>
|
||||
|
||||
let option = {
|
||||
title: {
|
||||
left: 'center',
|
||||
text: '<%= __("categoryRadarTitle") %>',
|
||||
textStyle: {
|
||||
fontWeight: 500,
|
||||
fontSize: 22
|
||||
}
|
||||
},
|
||||
tooltip: {},
|
||||
radar: {
|
||||
name: {
|
||||
textStyle: {
|
||||
color: '#3C4858'
|
||||
}
|
||||
},
|
||||
indicator: <%- indicatorData %>,
|
||||
nameGap: 5,
|
||||
center: ['50%','55%'],
|
||||
radius: '66%'
|
||||
},
|
||||
series: [{
|
||||
type: 'radar',
|
||||
color: ['#3ecf8e'],
|
||||
itemStyle: {normal: {areaStyle: {type: 'default'}}},
|
||||
data : [
|
||||
{
|
||||
value : <%- radarValueData %>,
|
||||
name : '<%= __("categoryNumber") %>'
|
||||
}
|
||||
]
|
||||
}]
|
||||
};
|
||||
|
||||
radarChart.setOption(option);
|
||||
</script>
|
||||
@@ -0,0 +1,12 @@
|
||||
<div class="dream">
|
||||
<% if (theme.dream.showTitle) { %>
|
||||
<div class="title center-align">
|
||||
<i class="far fa-lightbulb"></i> <%= theme.dream.title %>
|
||||
</div>
|
||||
<% } %>
|
||||
<div class="row">
|
||||
<div class="col l8 offset-l2 m10 offset-m1 s10 offset-s1 center-align text">
|
||||
<%= theme.dream.text %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,56 @@
|
||||
<link rel="stylesheet" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.aplayer) %>">
|
||||
<style>
|
||||
.aplayer .aplayer-lrc p {
|
||||
<%if(theme.music.hideLrc){%>
|
||||
display: none;
|
||||
<%}%>
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
line-height: 16px !important;
|
||||
}
|
||||
|
||||
.aplayer .aplayer-lrc p.aplayer-lrc-current {
|
||||
<%if(theme.music.hideLrc){%>
|
||||
display: none;
|
||||
<%}%>
|
||||
font-size: 15px;
|
||||
color: <%- theme.music.theme %>;
|
||||
}
|
||||
|
||||
<%if(theme.music.autoHide){%>
|
||||
.aplayer.aplayer-fixed.aplayer-narrow .aplayer-body {
|
||||
left: -66px !important;
|
||||
}
|
||||
|
||||
.aplayer.aplayer-fixed.aplayer-narrow .aplayer-body:hover {
|
||||
left: 0px !important;
|
||||
}
|
||||
|
||||
<%}%>
|
||||
</style>
|
||||
<div class="<% if(!theme.music.fixed) { %>music-player<% } %>">
|
||||
<% if (!theme.music.fixed && theme.music.title.enable) { %>
|
||||
<div class="title center-align">
|
||||
<i class="fas fa-music"></i> <%- theme.music.title.show %>
|
||||
</div>
|
||||
<% } %>
|
||||
<div class="row">
|
||||
<meting-js class="col l8 offset-l2 m10 offset-m1 s12"
|
||||
server="<%- theme.music.server %>"
|
||||
type="<%- theme.music.type %>"
|
||||
id="<%- theme.music.id %>"
|
||||
fixed='<%- theme.music.fixed ? 'true' : 'false' %>'
|
||||
autoplay='<%- theme.music.autoplay === true %>'
|
||||
theme='<%- theme.music.theme %>'
|
||||
loop='<%- theme.music.loop %>'
|
||||
order='<%- theme.music.order %>'
|
||||
preload='<%- theme.music.preload %>'
|
||||
volume='<%- Number(theme.music.volume) %>'
|
||||
list-folded='<%- theme.music.listFolded ? 'true' : 'false' %>'
|
||||
>
|
||||
</meting-js>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.aplayer) %>"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>
|
||||
@@ -0,0 +1,58 @@
|
||||
<link rel="stylesheet" href="<%- theme.libs.css.aplayer %>">
|
||||
<style>
|
||||
.aplayer .aplayer-lrc p {
|
||||
<%if(theme.musics.hideLrc){%>
|
||||
display: none;
|
||||
<%}%>
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
line-height: 16px !important;
|
||||
}
|
||||
|
||||
.aplayer .aplayer-lrc p.aplayer-lrc-current {
|
||||
<%if(theme.musics.hideLrc){%>
|
||||
display: none;
|
||||
<%}%>
|
||||
font-size: 15px;
|
||||
color: <%- theme.musics.theme %>;
|
||||
}
|
||||
|
||||
<%if(theme.musics.autoHide){%>
|
||||
.aplayer.aplayer-fixed.aplayer-narrow .aplayer-body {
|
||||
left: -66px !important;
|
||||
}
|
||||
|
||||
.aplayer.aplayer-fixed.aplayer-narrow .aplayer-body:hover {
|
||||
left: 0px !important;
|
||||
}
|
||||
|
||||
<%}%>
|
||||
</style>
|
||||
<div class="<% if(!theme.musics.fixed) { %>music-player<% } %>">
|
||||
<% if (!theme.musics.fixed && theme.musics.title.enable) { %>
|
||||
<div class="title center-align">
|
||||
<i class="fa fa-music"></i> <%- theme.musics.title.show %>
|
||||
</div>
|
||||
<% } %>
|
||||
<div class="row">
|
||||
<meting-js class="col l8 offset-l2 m10 offset-m1 s12"
|
||||
server="<%- theme.musics.server %>"
|
||||
type="<%- theme.musics.type %>"
|
||||
id="<%- theme.musics.id %>"
|
||||
fixed='<%- theme.musics.fixed ? 'true' : 'false' %>'
|
||||
autoplay='<%- theme.musics.autoplay === true %>'
|
||||
theme='<%- theme.musics.theme %>'
|
||||
loop='<%- theme.musics.loop %>'
|
||||
order='<%- theme.musics.order %>'
|
||||
preload='<%- theme.musics.preload %>'
|
||||
volume='<%- Number(theme.musics.volume) %>'
|
||||
listMaxHeight='<%- theme.musics.listMaxHeight %>'
|
||||
list-folded='<%- theme.musics.listFolded ? 'true' : 'false' %>'
|
||||
>
|
||||
</meting-js>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script src="<%- theme.libs.js.aplayer %>"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>
|
||||
@@ -0,0 +1,31 @@
|
||||
<%
|
||||
// the gallery photos of theme _config.yml.
|
||||
var gallery = theme.myGallery.data;
|
||||
%>
|
||||
<div id="myGallery" class="my-gallery">
|
||||
<div class="title center-align" data-aos="zoom-in-up">
|
||||
<i class="far fa-image"></i> <%- __('gallery') %>
|
||||
</div>
|
||||
<div class="row">
|
||||
<% if (gallery) { %>
|
||||
<% Object.keys(gallery).forEach(function(photo) { %>
|
||||
<div class="photo col s12 m6 l4" data-aos="fade-up">
|
||||
<div class="img-item" data-src="<%- gallery[photo] %>">
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(gallery[photo]) %>" class="responsive-img">
|
||||
</div>
|
||||
</div>
|
||||
<% }); %>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(function () {
|
||||
let animateClass = 'animated pulse';
|
||||
$('#myGallery .photo').hover(function () {
|
||||
$(this).addClass(animateClass);
|
||||
}, function () {
|
||||
$(this).removeClass(animateClass);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,27 @@
|
||||
<%
|
||||
// the projects information of theme _config.yml.
|
||||
var myprojects = theme.myProjects.data;
|
||||
%>
|
||||
<div class="my-projects">
|
||||
<div class="title center-align" data-aos="zoom-in-up">
|
||||
<i class="fas fa-gift"></i> <%- __('myProjects') %>
|
||||
</div>
|
||||
<div class="row">
|
||||
<% if (myprojects) { %>
|
||||
<% Object.keys(myprojects).forEach(function(project) { %>
|
||||
<div class="col s12 m6 l4" data-aos="fade-up">
|
||||
<div class="info center-align">
|
||||
<a href="<%- myprojects[project].url %>" class="icon"
|
||||
style="background: <%- myprojects[project].iconBackground %>" target="_blank">
|
||||
<i class="<%- myprojects[project].icon %>"></i>
|
||||
</a>
|
||||
<div class="info-title">
|
||||
<a href="<%- url_for(myprojects[project].url) %>" target="_blank"><%- project %></a>
|
||||
</div>
|
||||
<div class="info-desc"><%= myprojects[project].desc %></div>
|
||||
</div>
|
||||
</div>
|
||||
<% }); %>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,59 @@
|
||||
<%
|
||||
// the skills information of theme _config.yml.
|
||||
var mySkills = theme.mySkills.data;
|
||||
var topSkillArr = [];
|
||||
%>
|
||||
<div class="my-skills">
|
||||
<div class="title center-align" data-aos="zoom-in-up">
|
||||
<i class="fas fa-wrench"></i> <%- __('mySkills') %>
|
||||
</div>
|
||||
<div class="row">
|
||||
<% if (mySkills) { %>
|
||||
<% Object.keys(mySkills).forEach(function(skill) { %>
|
||||
<% topSkillArr.push(skill); %>
|
||||
<div class="col s12 m6 l6" data-aos="fade-up">
|
||||
<div class="skillbar">
|
||||
<div class="skillbar-title"
|
||||
style="background: <%- mySkills[skill].background %>; width: <%- mySkills[skill].percent %>">
|
||||
<span><%- skill %></span>
|
||||
</div>
|
||||
<div class="skill-bar-percent"><%- mySkills[skill].percent %></div>
|
||||
</div>
|
||||
</div>
|
||||
<% }); %>
|
||||
<% } %>
|
||||
</div>
|
||||
|
||||
<%
|
||||
/**
|
||||
* Determine if an element is included in the array.
|
||||
*
|
||||
* @param arr array
|
||||
* @param value value
|
||||
*/
|
||||
var isInArray = function (arr, value) {
|
||||
for (var i = 0; i < arr.length; i++) {
|
||||
if (value == arr[i]) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
%>
|
||||
|
||||
<% if (site.tags) { %>
|
||||
<div class="other-skills chip-container" data-aos="zoom-in-up">
|
||||
<div class="sub-title center-align"><i class="fa fa-book"></i> <%- __('otherSkills') %></div>
|
||||
<div class="tag-chips center-align">
|
||||
<% site.tags.map(function(tag) { %>
|
||||
<% if (!isInArray(topSkillArr, tag.name)) { %>
|
||||
<a href="<%- url_for(tag.path) %>">
|
||||
<span class="chip center-align waves-effect waves-light chip-default"><%- tag.name %></span>
|
||||
</a>
|
||||
<% } %>
|
||||
<% }); %>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,110 @@
|
||||
<div class="container archive-calendar">
|
||||
<div class="card">
|
||||
<div id="post-calendar" class="card-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.echarts) %>"></script>
|
||||
<script type="text/javascript">
|
||||
let myChart = echarts.init(document.getElementById('post-calendar'));
|
||||
|
||||
<%
|
||||
var nameMap = (config.language && config.language.indexOf('zh') >= 0) ? 'cn' : 'en';
|
||||
var titleText = (config.language && config.language.indexOf('zh') >= 0) ? '文章日历' : 'Post Calendar';
|
||||
|
||||
// calculate range.
|
||||
var startDate = moment().subtract(1, 'years');
|
||||
var endDate = moment();
|
||||
var rangeArr = '["' + startDate.format('YYYY-MM-DD') + '", "' + endDate.format('YYYY-MM-DD') + '"]';
|
||||
|
||||
// post and count map.
|
||||
var dateMap = new Map();
|
||||
site.posts.forEach(function (post) {
|
||||
var date = post.date.format('YYYY-MM-DD');
|
||||
var count = dateMap.get(date);
|
||||
dateMap.set(date, count == null || count == undefined ? 1 : count + 1);
|
||||
});
|
||||
|
||||
// loop the data for the current year, generating the number of post per day
|
||||
var i = 0;
|
||||
var datePosts = '[';
|
||||
var dayTime = 3600 * 24 * 1000;
|
||||
for (var time = startDate; time <= endDate; time += dayTime) {
|
||||
var date = moment(time).format('YYYY-MM-DD');
|
||||
datePosts = (i === 0 ? datePosts + '["' : datePosts + ', ["') + date + '", '
|
||||
+ (dateMap.has(date) ? dateMap.get(date) : 0) + ']';
|
||||
i++;
|
||||
}
|
||||
datePosts += ']';
|
||||
%>
|
||||
|
||||
let option = {
|
||||
title: {
|
||||
top: 0,
|
||||
text: '<%- titleText %>',
|
||||
left: 'center',
|
||||
textStyle: {
|
||||
color: '#3C4858'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
padding: 10,
|
||||
backgroundColor: '#555',
|
||||
borderColor: '#777',
|
||||
borderWidth: 1,
|
||||
formatter: function (obj) {
|
||||
var value = obj.value;
|
||||
return '<div style="font-size: 14px;">' + value[0] + '：' + value[1] + '</div>';
|
||||
}
|
||||
},
|
||||
visualMap: {
|
||||
show: true,
|
||||
showLabel: true,
|
||||
categories: [0, 1, 2, 3, 4],
|
||||
calculable: true,
|
||||
inRange: {
|
||||
symbol: 'rect',
|
||||
color: ['#ebedf0', '#c6e48b', '#7bc96f', '#239a3b', '#196127']
|
||||
},
|
||||
itemWidth: 12,
|
||||
itemHeight: 12,
|
||||
orient: 'horizontal',
|
||||
left: 'center',
|
||||
bottom: 0
|
||||
},
|
||||
calendar: [{
|
||||
left: 'center',
|
||||
range: <%- rangeArr %>,
|
||||
cellSize: [13, 13],
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
itemStyle: {
|
||||
color: '#196127',
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2
|
||||
},
|
||||
yearLabel: {
|
||||
show: false
|
||||
},
|
||||
monthLabel: {
|
||||
nameMap: '<%- nameMap %>',
|
||||
fontSize: 11
|
||||
},
|
||||
dayLabel: {
|
||||
formatter: '{start} 1st',
|
||||
nameMap: '<%- nameMap %>',
|
||||
fontSize: 11
|
||||
}
|
||||
}],
|
||||
series: [{
|
||||
type: 'heatmap',
|
||||
coordinateSystem: 'calendar',
|
||||
calendarIndex: 0,
|
||||
data: <%- datePosts %>
|
||||
}]
|
||||
|
||||
};
|
||||
|
||||
myChart.setOption(option);
|
||||
</script>
|
||||
@@ -0,0 +1,218 @@
|
||||
<style type="text/css">
|
||||
#posts-chart,
|
||||
#categories-chart,
|
||||
#tags-chart {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
margin: 0.5rem auto;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="postCharts" class="post-charts">
|
||||
<div class="title center-align" data-aos="zoom-in-up">
|
||||
<i class="far fa-bar-chart"></i> <%- __('postCharts') %>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="chart col s12 m6 l4" data-aos="zoom-in-up">
|
||||
<div id="posts-chart"></div>
|
||||
</div>
|
||||
|
||||
<div class="chart col s12 m6 l4" data-aos="zoom-in-up">
|
||||
<div id="categories-chart"></div>
|
||||
</div>
|
||||
|
||||
<div class="chart col s12 m6 l4" data-aos="zoom-in-up">
|
||||
<div id="tags-chart"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.echarts) %>"></script>
|
||||
<script>
|
||||
let postsChart = echarts.init(document.getElementById('posts-chart'));
|
||||
let categoriesChart = echarts.init(document.getElementById('categories-chart'));
|
||||
let tagsChart = echarts.init(document.getElementById('tags-chart'));
|
||||
|
||||
<%
|
||||
/* calculate postsOption data. */
|
||||
var startDate = moment().subtract(1, 'years').startOf('month');
|
||||
var endDate = moment().endOf('month');
|
||||
|
||||
var monthMap = new Map();
|
||||
var dayTime = 3600 * 24 * 1000;
|
||||
for (var time = startDate; time <= endDate; time += dayTime) {
|
||||
var month = moment(time).format('YYYY-MM');
|
||||
if (!monthMap.has(month)) {
|
||||
monthMap.set(month, 0);
|
||||
}
|
||||
}
|
||||
|
||||
// post and count map.
|
||||
site.posts.forEach(function (post) {
|
||||
var month = post.date.format('YYYY-MM');
|
||||
if (monthMap.has(month)) {
|
||||
monthMap.set(month, monthMap.get(month) + 1);
|
||||
}
|
||||
});
|
||||
|
||||
// xAxis data and yAxis data.
|
||||
var monthArr = JSON.stringify([...monthMap.keys()]);
|
||||
var monthValueArr = JSON.stringify([...monthMap.values()]);
|
||||
%>
|
||||
|
||||
let postsOption = {
|
||||
title: {
|
||||
text: '<%- __("postPublishChart") %>',
|
||||
top: -5,
|
||||
x: 'center'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: <%- monthArr %>
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '<%- __("postsNumberName") %>',
|
||||
type: 'line',
|
||||
color: ['#6772e5'],
|
||||
data: <%- monthValueArr %>,
|
||||
markPoint: {
|
||||
symbolSize: 45,
|
||||
color: ['#fa755a','#3ecf8e','#82d3f4'],
|
||||
data: [{
|
||||
type: 'max',
|
||||
itemStyle: {color: ['#3ecf8e']},
|
||||
name: '<%- __("maximum") %>'
|
||||
}, {
|
||||
type: 'min',
|
||||
itemStyle: {color: ['#fa755a']},
|
||||
name: '<%- __("minimum") %>'
|
||||
}]
|
||||
},
|
||||
markLine: {
|
||||
itemStyle: {color: ['#ab47bc']},
|
||||
data: [
|
||||
{type: 'average', name: '<%- __("average") %>'}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
<%
|
||||
/* calculate categoriesOption data. */
|
||||
var categoryArr = [];
|
||||
site.categories.map(function(category) {
|
||||
categoryArr.push({'name': category.name, 'value': category.length})
|
||||
});
|
||||
|
||||
var categoryArrJson = JSON.stringify(categoryArr);
|
||||
%>
|
||||
|
||||
let categoriesOption = {
|
||||
title: {
|
||||
text: '<%- __("categoriesChart") %>',
|
||||
top: -4,
|
||||
x: 'center'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
formatter: "{a} <br/>{b} : {c} ({d}%)"
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '<%- __("categories") %>',
|
||||
type: 'pie',
|
||||
radius: '50%',
|
||||
color: ['#6772e5', '#ff9e0f', '#fa755a', '#3ecf8e', '#82d3f4', '#ab47bc', '#525f7f', '#f51c47', '#26A69A'],
|
||||
data: <%- categoryArrJson %>,
|
||||
itemStyle: {
|
||||
emphasis: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
<%
|
||||
/* calculate tagsOption data. */
|
||||
// get all tags name and count,then order by length desc.
|
||||
var tagArr = [];
|
||||
site.tags.map(function(tag) {
|
||||
tagArr.push({'name': tag.name, 'value': tag.length});
|
||||
});
|
||||
tagArr.sort((a, b) => {return b.value - a.value});
|
||||
|
||||
// get Top 10 tags name and count.
|
||||
var tagNameArr = [];
|
||||
var tagCountArr = [];
|
||||
for (var i = 0, len = Math.min(tagArr.length, 10); i < len; i++) {
|
||||
tagNameArr.push(tagArr[i].name);
|
||||
tagCountArr.push(tagArr[i].value);
|
||||
}
|
||||
|
||||
var tagNameArrJson = JSON.stringify(tagNameArr);
|
||||
var tagCountArrJson = JSON.stringify(tagCountArr);
|
||||
%>
|
||||
|
||||
let tagsOption = {
|
||||
title: {
|
||||
text: '<%- __("top10TagsChart") %>',
|
||||
top: -5,
|
||||
x: 'center'
|
||||
},
|
||||
tooltip: {},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
data: <%- tagNameArrJson %>
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
type: 'bar',
|
||||
color: ['#82d3f4'],
|
||||
barWidth : 18,
|
||||
data: <%- tagCountArrJson %>,
|
||||
markPoint: {
|
||||
symbolSize: 45,
|
||||
data: [{
|
||||
type: 'max',
|
||||
itemStyle: {color: ['#3ecf8e']},
|
||||
name: '<%- __("maximum") %>'
|
||||
}, {
|
||||
type: 'min',
|
||||
itemStyle: {color: ['#fa755a']},
|
||||
name: '<%- __("minimum") %>'
|
||||
}],
|
||||
},
|
||||
markLine: {
|
||||
itemStyle: {color: ['#ab47bc']},
|
||||
data: [
|
||||
{type: 'average', name: '<%- __("average") %>'}
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
// render the charts
|
||||
postsChart.setOption(postsOption);
|
||||
categoriesChart.setOption(categoriesOption);
|
||||
tagsChart.setOption(tagsOption);
|
||||
</script>
|
||||
@@ -0,0 +1,131 @@
|
||||
<%
|
||||
// get all top posts.
|
||||
var topPosts = [];
|
||||
if (theme.recommend.useConfig) {
|
||||
topPosts = site.data.recommends;
|
||||
} else {
|
||||
site.posts.forEach(function (post) {
|
||||
if (post.top) {
|
||||
topPosts.push(post);
|
||||
}
|
||||
});
|
||||
}
|
||||
var topPostsCount = topPosts.length;
|
||||
%>
|
||||
|
||||
<% if (topPostsCount > 0) { %>
|
||||
<%
|
||||
var hashCode = function (str) {
|
||||
if (!str && str.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var hash = 0;
|
||||
for (var i = 0, len = str.length; i < len; i++) {
|
||||
hash = ((hash << 5) - hash) + str.charCodeAt(i);
|
||||
hash |= 0;
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
|
||||
var featureImages = theme.featureImages;
|
||||
var imgCount = featureImages.length;
|
||||
var bgColorArr = [
|
||||
'linear-gradient(to right, #FF5E3A 0%, #FF2A68 100%)',
|
||||
'linear-gradient(to right, #EF4DB6 0%, #C643FC 100%)',
|
||||
'linear-gradient(to right, #1AD6FD 0%, #1D62F0 100%)',
|
||||
'linear-gradient(to right, #FFCC00 0%, #FF9500 100%)',
|
||||
'linear-gradient(to right, #4cbf30 0%, #0f9d58 100%)',
|
||||
'linear-gradient(to right, #C644FC 0%, #5856D6 100%)',
|
||||
'linear-gradient(to right, #55EFCB 0%, #5BCAFF 100%)'];
|
||||
var colorCount = bgColorArr.length;
|
||||
%>
|
||||
|
||||
<% if (theme.recommend.showTitle) { %>
|
||||
<div class="title"><i class="far fa-thumbs-up"></i> <%- __('recommendedPosts') %></div>
|
||||
<% } %>
|
||||
<div class="row">
|
||||
<% if (topPostsCount % 2 === 0) { %>
|
||||
<% for (var i = 0; i < topPostsCount; i++) { %>
|
||||
<%
|
||||
var post = topPosts[i];
|
||||
var featureImg = post.img ? url_for(post.img) : url_for(featureImages[Math.abs(hashCode(post.title) % imgCount)]);
|
||||
var bgColor = bgColorArr[i % colorCount];
|
||||
%>
|
||||
<div class="col s12 m6" <% if (i > 1) { %>data-aos="zoom-in-up"<% } %>>
|
||||
<% if (post.img) {%>
|
||||
<div class="post-card" style="background-image: url('<%- featureImg %>')">
|
||||
<%}else{%>
|
||||
<div class="post-card" style="background-image: url('<%- theme.jsDelivr.url %><%- featureImg %>')">
|
||||
<% } %>
|
||||
<div class="post-body">
|
||||
<div class="post-categories">
|
||||
<% if (theme.recommend.useConfig) { %>
|
||||
<a href="<%- url_for(post.categoryPath) %>" class="category"><%= post.categoryName %></a>
|
||||
<% } else { %>
|
||||
<% post.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="category"><%= category.name %></a>
|
||||
<% }); %>
|
||||
<% } %>
|
||||
</div>
|
||||
<a href="<%- url_for(post.path) %>">
|
||||
<h3 class="post-title"><%= post.title %></h3>
|
||||
</a>
|
||||
<p class="post-description">
|
||||
<% if (post.summary && post.summary.length > 0) { %>
|
||||
<%- post.summary %>
|
||||
<% } else { %>
|
||||
<%- strip_html(post.content).substring(0, 70) %>
|
||||
<% } %>
|
||||
</p>
|
||||
<a href="<%- url_for(post.path) %>" class="read-more btn waves-effect waves-light" style="background: <%- bgColor %>" target="_blank">
|
||||
<i class="icon far fa-eye fa-fw"></i><%- __('readMore') %>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
<% } else { %>
|
||||
<% for (var i = 0; i < topPostsCount; i++) { %>
|
||||
<%
|
||||
var post = topPosts[i];
|
||||
var grid = (i % 3 === 0) ? 's12' : 's12 m6';
|
||||
var description = (i % 3 === 0) ? strip_html(post.content).substring(0, 85)
|
||||
: strip_html(post.content).substring(0, 70);
|
||||
if (post.summary && post.summary.length > 0) {
|
||||
description = post.summary;
|
||||
}
|
||||
|
||||
var featureImg = post.img ? url_for(post.img) : url_for(featureImages[Math.abs(hashCode(post.title) % imgCount)]);
|
||||
var bgColor = bgColorArr[i % colorCount];
|
||||
%>
|
||||
<div class="col <%- grid %>" <% if (i > 0) { %>data-aos="zoom-in-up"<% } %>>
|
||||
<% if (post.img) {%>
|
||||
<div class="post-card" style="background-image: url('<%- featureImg %>')">
|
||||
<%}else{%>
|
||||
<div class="post-card" style="background-image: url('<%- theme.jsDelivr.url %><%- featureImg %>')">
|
||||
<% } %>
|
||||
<div class="post-body">
|
||||
<div class="post-categories">
|
||||
<% if (theme.recommend.useConfig) { %>
|
||||
<a href="<%- url_for(post.categoryPath) %>" class="category"><%= post.categoryName %></a>
|
||||
<% } else { %>
|
||||
<% post.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="category"><%= category.name %></a>
|
||||
<% }); %>
|
||||
<% } %>
|
||||
</div>
|
||||
<a href="<%- url_for(post.path) %>">
|
||||
<h3 class="post-title"><%= post.title %></h3>
|
||||
</a>
|
||||
<p class="post-description"><%= description %></p>
|
||||
<a href="<%- url_for(post.path) %>" class="read-more btn waves-effect waves-light" style="background: <%- bgColor %>" target="_blank">
|
||||
<i class="icon far fa-eye fa-fw"></i><%- __('readMore') %>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
<% } %>
|
||||
</div>
|
||||
<% } %>
|
||||
@@ -0,0 +1,45 @@
|
||||
<%
|
||||
var colorArr = ['#F9EBEA', '#F5EEF8', '#D5F5E3', '#E8F8F5', '#FEF9E7',
|
||||
'#F8F9F9', '#82E0AA', '#D7BDE2', '#A3E4D7', '#85C1E9', '#F8C471', '#F9E79F', '#FFF'];
|
||||
var colorCount = colorArr.length;
|
||||
var hashCode = function (str) {
|
||||
if (!str && str.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var hash = 0;
|
||||
for (var i = 0, len = str.length; i < len; i++) {
|
||||
hash = ((hash << 5) - hash) + str.charCodeAt(i);
|
||||
hash |= 0;
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
var i = 0;
|
||||
var isTag = is_tag();
|
||||
%>
|
||||
|
||||
<div id="tags" class="container chip-container">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="tag-title center-align">
|
||||
<i class="fas fa-tags"></i> <%= __('postTagTitle') %>
|
||||
</div>
|
||||
<div class="tag-chips">
|
||||
<% site.tags.map(function(tag) { %>
|
||||
<%
|
||||
i++;
|
||||
var color = i >= colorCount ? colorArr[Math.abs(hashCode(tag.name) % colorCount)]
|
||||
: colorArr[i - 1];
|
||||
%>
|
||||
<a href="<%- url_for(tag.path) %>" title="<%- tag.name %>: <%- tag.length %>">
|
||||
<span class="chip center-align waves-effect waves-light
|
||||
<% if (isTag && tag.name == page.tag) { %> chip-active <% } else { %> chip-default <% } %>"
|
||||
data-tagname="<%- tag.name %>" style="background-color: <%- color %>;"><%- tag.name %>
|
||||
<span class="tag-length"><%- tag.length %></span>
|
||||
</span>
|
||||
</a>
|
||||
<% }); %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,29 @@
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.jqcloud) %>">
|
||||
<style type="text/css">
|
||||
#tag-wordcloud {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="container" data-aos="fade-up">
|
||||
<div class="card">
|
||||
<div id="tag-wordcloud" class="card-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.jqcloud) %>"></script>
|
||||
<script type="text/javascript">
|
||||
<%
|
||||
let tagWordArr = [];
|
||||
site.tags.map(function(tag) {
|
||||
tagWordArr.push({'text': tag.name, 'weight': tag.length, 'link': decodeURI(url_for(tag.path))});
|
||||
});
|
||||
|
||||
let tagWords = JSON.stringify(tagWordArr);
|
||||
%>
|
||||
|
||||
$('#tag-wordcloud').jQCloud(<%- tagWords %>, {
|
||||
autoResize: true
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,34 @@
|
||||
<link rel="stylesheet" href="<%- theme.jsDelivr.url %><%- url_for(theme.libs.css.dplayer) %>">
|
||||
<div class="video-player">
|
||||
<% if (theme.video.showTitle) { %>
|
||||
<div class="title center-align">
|
||||
<i class="fas fa-video-camera"></i> <%= theme.video.title %>
|
||||
</div>
|
||||
<% } %>
|
||||
<div class="row">
|
||||
<div class="col l8 offset-l2 m10 offset-m1 s12">
|
||||
<div id="dplayer" class="dplayer-video"
|
||||
<% if (theme.video.height) { %> style="height: <%- theme.video.height %>px;"<% } %>></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.dplayer) %>"></script>
|
||||
<script>
|
||||
$(function () {
|
||||
new DPlayer({
|
||||
container: document.getElementById('dplayer'),
|
||||
autoplay: '<%- theme.video.autoplay %>' === 'true',
|
||||
theme: '<%- theme.video.theme %>',
|
||||
loop: '<%- theme.video.loop %>' === 'true',
|
||||
lang: '<%- config.language %>' === 'zh-CN' ? 'zh-cn' : 'en',
|
||||
preload: '<%- theme.video.preload %>',
|
||||
volume: Number('<%- theme.video.volume %>'),
|
||||
video: {
|
||||
url: '<% if (theme.video.url) { %><%- url_for(theme.video.url) %><% } %>',
|
||||
pic: '<% if (theme.video.pic) { %><%- url_for(theme.video.pic) %><% } %>',
|
||||
thumbnails: '<% if (theme.video.thumbnails) { %><%- url_for(theme.video.thumbnails) %><% } %>'
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,63 @@
|
||||
<style type="text/css">
|
||||
/* don't remove. */
|
||||
.about-cover {
|
||||
height: 75vh;
|
||||
}
|
||||
</style>
|
||||
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
|
||||
<main class="content">
|
||||
|
||||
<div id="aboutme" class="container about-container">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="row">
|
||||
<div class="post-statis col l4 hide-on-med-and-down" data-aos="zoom-in-right">
|
||||
<%- partial('_partial/post-statis') %>
|
||||
</div>
|
||||
<div class="col s12 m12 l4">
|
||||
<div class="profile center-align">
|
||||
<div class="avatar">
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(theme.profile.avatar) %>" alt="<%- config.author %>"
|
||||
class="circle responsive-img avatar-img">
|
||||
</div>
|
||||
<div class="author">
|
||||
<div class="post-statis hide-on-large-only" data-aos="zoom-in-right">
|
||||
<%- partial('_partial/post-statis') %>
|
||||
</div>
|
||||
<div class="title"><%- config.author %></div>
|
||||
<div class="career"><%- theme.profile.career %></div>
|
||||
<div class="social-link hide-on-large-only" data-aos="zoom-in-left">
|
||||
<%- partial('_partial/social-link') %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col l4 hide-on-med-and-down" data-aos="zoom-in-left">
|
||||
<div class="social-link">
|
||||
<%- partial('_partial/social-link') %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="introduction center-align" data-aos="fade-up"><%= theme.profile.introduction %></div>
|
||||
|
||||
<%- partial('_widget/post-charts') %>
|
||||
|
||||
<% if (theme.myProjects && theme.myProjects.enable) { %>
|
||||
<%- partial('_widget/my-projects') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.mySkills && theme.mySkills.enable) { %>
|
||||
<%- partial('_widget/my-skills') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.myGallery && theme.myGallery.enable) { %>
|
||||
<%- partial('_widget/my-gallery') %>
|
||||
<% } %>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
@@ -0,0 +1,130 @@
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
|
||||
<main class="content">
|
||||
|
||||
<% if (theme.postCalendar) { %>
|
||||
<%- partial('_widget/post-calendar') %>
|
||||
<% } %>
|
||||
|
||||
<%
|
||||
/**
|
||||
* hashCode function.
|
||||
*
|
||||
* @param str str
|
||||
* @returns {number}
|
||||
*/
|
||||
var hashCode = function (str) {
|
||||
if (!str && str.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var hash = 0;
|
||||
for (var i = 0, len = str.length; i < len; i++) {
|
||||
hash = ((hash << 5) - hash) + str.charCodeAt(i);
|
||||
hash |= 0;
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
|
||||
// init year and month variable.
|
||||
var year = '1970';
|
||||
var month = '1970-01';
|
||||
|
||||
// post feature image.
|
||||
var featureimg = '/medias/featureimages/0.jpg';
|
||||
var featureImages = theme.featureImages;
|
||||
%>
|
||||
|
||||
<div id="cd-timeline" class="container">
|
||||
<% page.posts.each(function(post) { %>
|
||||
<div class="cd-timeline-block">
|
||||
|
||||
<%# year. %>
|
||||
<% if (date(post.date, 'YYYY') != year) { %>
|
||||
<% year = date(post.date, 'YYYY'); %>
|
||||
<div class="cd-timeline-img year" data-aos="zoom-in-up">
|
||||
<a href="<%- url_for('/archives/' + year) %>"><%- year %></a>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<%# month. %>
|
||||
<% if (date(post.date, 'YYYY-MM') != month) { %>
|
||||
<%
|
||||
month = date(post.date, 'YYYY-MM');
|
||||
var m = date(post.date, 'MM')
|
||||
%>
|
||||
<div class="cd-timeline-img month" data-aos="zoom-in-up">
|
||||
<a href="<%- url_for('/archives/' + year + '/' + m) %>"><%- m %></a>
|
||||
</div>
|
||||
<% } %>
|
||||
|
||||
<%# every day posts. %>
|
||||
<div class="cd-timeline-img day" data-aos="zoom-in-up">
|
||||
<span><%- date(post.date, 'YYYY-MM-DD').substring(8, 10) %></span>
|
||||
</div>
|
||||
<article class="cd-timeline-content" data-aos="fade-up">
|
||||
<div class="article col s12 m6">
|
||||
<div class="card">
|
||||
<a href="<%- url_for(post.path) %>">
|
||||
<div class="card-image">
|
||||
<% if (post.img) { %>
|
||||
<img src="<%- url_for(post.img) %>" class="responsive-img" alt="<%= post.title %>">
|
||||
<% } else { %>
|
||||
<%
|
||||
featureimg = featureImages[Math.abs(hashCode(post.title) % featureImages.length)];
|
||||
%>
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(featureimg) %>" class="responsive-img" alt="<%= post.title %>">
|
||||
<% } %>
|
||||
<span class="card-title"><%= post.title %></span>
|
||||
</div>
|
||||
</a>
|
||||
<div class="card-content article-content">
|
||||
<div class="summary block-with-text">
|
||||
<% if (post.summary && post.summary.length > 0) { %>
|
||||
<%- post.summary %>
|
||||
<% } else { %>
|
||||
<%- strip_html(post.content).substring(0, 120) %>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="publish-info">
|
||||
<span class="publish-date">
|
||||
<i class="far fa-clock fa-fw icon-date"></i><%= date(post.date, config.date_format) %>
|
||||
</span>
|
||||
<span class="publish-author">
|
||||
<% if (post.categories && post.categories.length > 0) { %>
|
||||
<i class="fas fa-bookmark fa-fw icon-category"></i>
|
||||
<% post.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="post-category">
|
||||
<%- category.name %>
|
||||
</a>
|
||||
<% }); %>
|
||||
<% } else if (post.author && post.author.length > 0) { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- post.author %>
|
||||
<% } else { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- config.author %>
|
||||
<% } %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% if (post.tags && post.tags.length) { %>
|
||||
<div class="card-action article-tags">
|
||||
<% post.tags.forEach(tag => { %>
|
||||
<a href="<%- url_for(tag.path) %>"><span class="chip bg-color"><%= tag.name %></span></a>
|
||||
<% }); %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<% }); %>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
|
||||
<% if (page.total > 1) { %>
|
||||
<%- partial('_partial/paging') %>
|
||||
<% } %>
|
||||
@@ -0,0 +1,142 @@
|
||||
<% if (theme.bbtime.enable) { %>
|
||||
<% if (theme.verifyPassword.enable) { %>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.crypto) %>"></script>
|
||||
<script>
|
||||
(function () {
|
||||
let pwd = '<%- page.password %>';
|
||||
if (pwd && pwd.length > 0) {
|
||||
if (pwd !== CryptoJS.SHA256(prompt('<%- theme.verifyPassword.promptMessage %>')).toString(CryptoJS.enc.Hex)) {
|
||||
alert('<%- theme.verifyPassword.errorMessage %>');
|
||||
location.href = '<%- url_for("/") %>';
|
||||
}
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
<% } %>
|
||||
|
||||
<%- partial('_partial/post-cover') %>
|
||||
|
||||
<%
|
||||
var isTocEnable = theme.toc.enable && String(page.toc) !== 'false';
|
||||
var containerClass = isTocEnable ? 'post-container' : 'container';
|
||||
%>
|
||||
|
||||
<main class="<%- containerClass %> content">
|
||||
<%- partial('_partial/post-detail.ejs') %>
|
||||
</main>
|
||||
|
||||
<script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/leancloud-storage@4.5.3/dist/av-min.js"></script>
|
||||
<script type="text/javascript">
|
||||
var {
|
||||
Query
|
||||
} = AV;
|
||||
AV.init({
|
||||
appId: "<%= theme.bbtime.appId %>",
|
||||
appKey: "<%= theme.bbtime.appKey %>",
|
||||
serverURLs: '<%= theme.bbtime.serverURLs %>'
|
||||
});
|
||||
|
||||
var query = new AV.Query('content');
|
||||
var app = new Vue({
|
||||
el: '#app',
|
||||
data: {
|
||||
page: 0,
|
||||
count: 0,
|
||||
contents: []
|
||||
},
|
||||
methods: {
|
||||
loadMore: function (event) {
|
||||
getData(++this.page);
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
function urlToLink(str) {
|
||||
//增加发图片功能
|
||||
var re = /\bhttps?:\/\/(?!\S+(?:jpe?g|png|bmp|gif|webp|gif))\S+/g;
|
||||
var re_forpic = /\bhttps?:\/\/.*?(\.gif|\.jpeg|\.png|\.jpg|\.bmp|\.webp)/g;
|
||||
str = str.replace(re, function (website) {
|
||||
return "<a href='" + website + "' target='_blank'> <i class='iconfont icon-lianjie-copy'></i>链接 </a>";
|
||||
});
|
||||
str = str.replace(re_forpic, function (imgurl) {
|
||||
return "<img src='" + imgurl + "' /> ";
|
||||
});
|
||||
return str;
|
||||
}
|
||||
|
||||
//友好地显示时间
|
||||
function timeago(dateTimeStamp) {
|
||||
var minute = 1000 * 60; //把分，时，天，周，半个月，一个月用毫秒表示。
|
||||
var hour = minute * 60;
|
||||
var day = hour * 24;
|
||||
var week = day * 7;
|
||||
var month = day * 30;
|
||||
var now = new Date().getTime(); //获取当前时间毫秒
|
||||
var diffValue = now - dateTimeStamp; //时间差
|
||||
if (diffValue < 0) {
|
||||
return;
|
||||
}
|
||||
var minC = diffValue / minute; //计算时间差的分，时，天，周，月
|
||||
var hourC = diffValue / hour;
|
||||
var dayC = diffValue / day;
|
||||
var weekC = diffValue / week;
|
||||
var monthC = diffValue / month;
|
||||
if (monthC >= 1 && monthC <= 3) {
|
||||
result = " " + parseInt(monthC) + " 月前"
|
||||
} else if (weekC >= 1 && weekC <= 3) {
|
||||
result = " " + parseInt(weekC) + " 周前"
|
||||
} else if (dayC >= 1 && dayC <= 6) {
|
||||
result = " " + parseInt(dayC) + " 天前"
|
||||
} else if (hourC >= 1 && hourC <= 23) {
|
||||
result = " " + parseInt(hourC) + " 小时前"
|
||||
} else if (minC >= 1 && minC <= 59) {
|
||||
result = " " + parseInt(minC) + " 分钟前"
|
||||
} else if (diffValue >= 0 && diffValue <= minute) {
|
||||
result = "刚刚"
|
||||
} else {
|
||||
var datetime = new Date();
|
||||
datetime.setTime(dateTimeStamp);
|
||||
var Nmonth = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
|
||||
var Ndate = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
|
||||
result = Nmonth + "-" + Ndate
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
function getData(page = 0) {
|
||||
query.descending('createdAt').skip(page * 10).limit(10).find().then(function (results) {
|
||||
if (results.length == 0) {
|
||||
alert('之前没发表过说说')
|
||||
} else {
|
||||
let resC = results;
|
||||
reqData = false;
|
||||
resC.forEach((i) => {
|
||||
let dateTmp = new Date(i.createdAt);
|
||||
i.attributes.time = timeago(dateTmp);
|
||||
i.attributes.content = urlToLink(i.attributes.content);
|
||||
app.contents.push(i);
|
||||
})
|
||||
}
|
||||
|
||||
}, function (error) {
|
||||
});
|
||||
}
|
||||
|
||||
getData(0);
|
||||
|
||||
query.count().then(function (count) {
|
||||
app.count = count;
|
||||
}, function (error) {
|
||||
});
|
||||
</script>
|
||||
|
||||
<% if (theme.mathjax.enable && page.mathjax) { %>
|
||||
<script src="<%- theme.mathjax.cdn %>"></script>
|
||||
<script>
|
||||
MathJax.Hub.Config({
|
||||
tex2jax: {inlineMath: [['$', '$'], ['\(', '\)']]}
|
||||
});
|
||||
</script>
|
||||
<% } %>
|
||||
<% } %>
|
||||
@@ -0,0 +1,11 @@
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
|
||||
<main class="content">
|
||||
|
||||
<%- partial('_widget/category-cloud') %>
|
||||
|
||||
<% if (site.categories && site.categories.length > 0) { %>
|
||||
<%- partial('_widget/category-radar') %>
|
||||
<% } %>
|
||||
|
||||
</main>
|
||||
@@ -0,0 +1,89 @@
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
|
||||
<main class="content">
|
||||
|
||||
<%- partial('_widget/category-cloud') %>
|
||||
|
||||
<%
|
||||
var hashCode = function (str) {
|
||||
if (!str && str.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var hash = 0;
|
||||
for (var i = 0, len = str.length; i < len; i++) {
|
||||
hash = ((hash << 5) - hash) + str.charCodeAt(i);
|
||||
hash |= 0;
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
%>
|
||||
|
||||
<article id="articles" class="container articles">
|
||||
<div class="row tags-posts">
|
||||
<% page.posts.sort('date').reverse().forEach(post => { %>
|
||||
<div class="article tag-post col s12 m6 l4" data-aos="zoom-in">
|
||||
<div class="card">
|
||||
<a href="<%- url_for(post.path) %>">
|
||||
<div class="card-image tag-image">
|
||||
<% if (post.img) { %>
|
||||
<img src="<%- url_for(post.img) %>" class="responsive-img" alt="<%= post.title %>">
|
||||
<% } else { %>
|
||||
<%
|
||||
var featureimg = theme.featureImages[Math.abs(hashCode(post.title) % theme.featureImages.length)];
|
||||
%>
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(featureimg) %>" class="responsive-img" alt="<%= post.title %>">
|
||||
<% } %>
|
||||
<span class="card-title"><%= post.title %></span>
|
||||
</div>
|
||||
</a>
|
||||
<div class="card-content article-content">
|
||||
<div class="summary block-with-text">
|
||||
<% if (post.summary && post.summary.length > 0) { %>
|
||||
<%- post.summary %>
|
||||
<% } else { %>
|
||||
<%- strip_html(post.content).substring(0, 120) %>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="publish-info">
|
||||
<span class="publish-date">
|
||||
<i class="far fa-clock fa-fw icon-date"></i><%= date(post.date, config.date_format) %>
|
||||
</span>
|
||||
<span class="publish-author">
|
||||
<% if (post.categories && post.categories.length > 0) { %>
|
||||
<i class="fas fa-bookmark fa-fw icon-category"></i>
|
||||
<% post.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="post-category">
|
||||
<%- category.name %>
|
||||
</a>
|
||||
<% }); %>
|
||||
<% } else if (post.author && post.author.length > 0) { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- post.author %>
|
||||
<% } else { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- config.author %>
|
||||
<% } %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% if (post.tags && post.tags.length) { %>
|
||||
<div class="card-action article-tags">
|
||||
<% post.tags.forEach(tag => { %>
|
||||
<a href="<%- url_for(tag.path) %>">
|
||||
<span class="chip bg-color"><%= tag.name %></span>
|
||||
</a>
|
||||
<% }); %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
<% }); %>
|
||||
</div>
|
||||
</article>
|
||||
</main>
|
||||
|
||||
<% if (page.total > 1) { %>
|
||||
<%- partial('_partial/paging') %>
|
||||
<% } %>
|
||||
@@ -0,0 +1,54 @@
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.echarts) %>"></script>
|
||||
<main class="content">
|
||||
<div class="container">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div id="uv-container" style="min-width: 250px; height: 400px; margin-top: 50px; -webkit-tap-highlight-color: transparent; user-select: none; position: relative;" _echarts_instance_="ec_1609569953900">
|
||||
<div style="position: relative; width: 800px; height: 400px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1000" height="500" style="position: absolute; left: 0px; top: 0px; width: 800px; height: 400px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div style="position: absolute; display: none; border-style: solid; white-space: nowrap; z-index: 9999999; transition: left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s; background-color: rgba(50, 50, 50, 0.7); border-width: 0px; border-color: rgb(51, 51, 51); border-radius: 4px; color: rgb(255, 255, 255); font: 14px / 21px "Microsoft YaHei"; padding: 5px; left: 146px; top: 150px; pointer-events: none;">二月<br><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#d223e7;"></span>2020年访客数: -<br><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#3F77FE;"></span>2021年访客数: 2,225</div></div>
|
||||
|
||||
<div id="pv-container" style="min-width: 250px; height: 400px; margin-top: 50px; -webkit-tap-highlight-color: transparent; user-select: none; position: relative;" _echarts_instance_="ec_1609569953901"><div style="position: relative; width: 800px; height: 400px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1000" height="500" style="position: absolute; left: 0px; top: 0px; width: 800px; height: 400px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div style="position: absolute; display: none; border-style: solid; white-space: nowrap; z-index: 9999999; transition: left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s; background-color: rgba(50, 50, 50, 0.7); border-width: 0px; border-color: rgb(51, 51, 51); border-radius: 4px; color: rgb(255, 255, 255); font: 14px / 21px "Microsoft YaHei"; padding: 5px; left: 577px; top: 315px; pointer-events: none;">九月<br><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#01C2F9;"></span>2020年访问量: 14,501<br><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#18D070;"></span>2021年访问量: 9,436</div></div>
|
||||
|
||||
<div id="refer-container" style="min-width: 250px; height: 400px; margin-top: 50px; -webkit-tap-highlight-color: transparent; user-select: none; position: relative;" _echarts_instance_="ec_1609569953902"><div style="position: relative; width: 800px; height: 400px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1000" height="500" style="position: absolute; left: 0px; top: 0px; width: 800px; height: 400px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div style="position: absolute; display: none; border-style: solid; white-space: nowrap; z-index: 9999999; transition: left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s; background-color: rgba(50, 50, 50, 0.7); border-width: 0px; border-color: rgb(51, 51, 51); border-radius: 4px; color: rgb(255, 255, 255); font: 14px / 21px "Microsoft YaHei"; padding: 5px; left: 538px; top: 206px; pointer-events: none;">访问来源 <br>直达: 3412 (52.67%)</div></div> </div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var uvChart=echarts.init(document.getElementById('uv-container'),'shine');
|
||||
var option={color:['#d223e7','#3F77FE','#01C2F9','#18D070'],title:{text:'站点访客数统计',subtext:'数据来源: 百度统计（自 2020/01/01 开始统计）',textStyle:{color:'#504b4d',}},tooltip:{trigger:'axis'},
|
||||
legend:{data:['2020年访客数','2021年访客数'],bottom:0,left:'center',textStyle:{color:'#504b4d',}},//修改年份
|
||||
toolbox:{show:true,feature:{mark:{show:true},magicType:{show:true,type:['line','bar','stack','tiled']},restore:{show:true},saveAsImage:{show:true}}},
|
||||
calculable:true,xAxis:[{type:'category',boundaryGap:false,data:['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月'],
|
||||
axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}}}],yAxis:[{type:'value',axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}}}],
|
||||
series:[{name:'2020年访客数',type:'line',smooth:true,itemStyle:{normal:{areaStyle:{type:'default'}}},
|
||||
data:[788,2225,3145,2522,2798,2442,4028,3556,2835,2331,2423,1124],//第一个年份对应的数据顺序对应月份
|
||||
axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}},},
|
||||
{name:'2021年访客数',type:'line',smooth:true,itemStyle:{normal:{areaStyle:{type:'default'}}},
|
||||
data:[2152,1656,2836,4606,null,null,null,null,null,null,null,null],//第二个年份对应的数据顺序对应月份
|
||||
axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}},}]};
|
||||
uvChart.setOption(option);var pvChart=echarts.init(document.getElementById('pv-container'));
|
||||
var pv_option={color:['#01C2F9','#18D070','#d223e7','#3F77FE'],
|
||||
title:{text:'站点访问量统计',subtext:'数据来源: 百度统计（自 2020/01/01 开始统计）',
|
||||
textStyle:{color:'#504b4d',}},legend:{data:['2020年访问量','2021年访问量'],//修改年份
|
||||
bottom:0,left:'center',textStyle:{color:'#504b4d',}},
|
||||
tooltip:{trigger:'axis'},toolbox:{show:true,feature:{mark:{show:true},
|
||||
magicType:{show:true,type:['line','bar','stack','tiled']},
|
||||
restore:{show:true},saveAsImage:{show:true}}},calculable:true,
|
||||
xAxis:[{type:'category',boundaryGap:false,data:['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月'],
|
||||
axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}}}],yAxis:[{type:'value',axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}}}],
|
||||
series:[{name:'2020年访问量',type:'line',stack:'总量',data:[1101,2909,3784,2978,3090,2682,5207,4887,4436,3047,3262,2474],axisLabel:{formatter:'{value}',//第一个年份对应的数据顺序对应月份
|
||||
textStyle:{color:'#929298'}}},{name:'2021年访问量',type:'line',stack:'总量',data:[6648,3882,5580,8817,null,null,null,null,null,null,null,null],//第二个年份对应的数据顺序对应月份
|
||||
axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}}}]};
|
||||
pvChart.setOption(pv_option);
|
||||
var referChart=echarts.init(document.getElementById('refer-container'));
|
||||
var refer_option={title:{text:'站点访客来源统计',itemGap:20,subtext:'数据来源: 百度统计（最近30天的统计数据）',left:'right',textStyle:{color:'#504b4d',}},
|
||||
tooltip:{trigger:'item',
|
||||
formatter:'{a} <br/>{b}: {c} ({d}%)'},
|
||||
legend:{orient:'vertical',left:10,data:['直达','百度','Google','Bing','其他'],//来源
|
||||
textStyle:{color:'#929298',}},series:[{name:'访问来源',type:'pie',selectedMode:'single',radius:[0,'30%'],label:{position:'inner'},labelLine:{show:false},
|
||||
data:[{value:4067,name:'直接访问',selected:true},{value:423,name:'外链'},{value:4327,name:'搜索'}]},//大类数据，修改value后面的值
|
||||
{name:'访问来源',type:'pie',radius:['40%','55%'],
|
||||
label:{formatter:'{a|{a}}{abg|}\n{hr|}\n {b|{b}：}{c} {per|{d}%} ',backgroundColor:'#eee',borderColor:'#aaa',borderWidth:1,borderRadius:4,rich:{a:{color:'#999',lineHeight:22,align:'center'},hr:{borderColor:'#aaa',width:'100%',borderWidth:0.5,height:0},b:{fontSize:16,lineHeight:33},per:{color:'#eee',backgroundColor:'#334455',padding:[2,4],borderRadius:2}}},
|
||||
data:[{value:2965,name:'直达'},{value:423,name:'外链'},{value:4072,name:'百度'},{value:187,name:'Google'},{value:35,name:'Bing'}]}]};//各个来源数据，修改value后面的值
|
||||
referChart.setOption(refer_option);
|
||||
</script
|
||||
</main>
|
||||
@@ -0,0 +1,55 @@
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
|
||||
<main class="content">
|
||||
<div id="contact" class="container chip-container">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="tag-title center-align">
|
||||
<i class="fas fa-comments"></i> <%= __('contact') %>
|
||||
</div>
|
||||
<script>$.get("https://v1.hitokoto.cn?c=i&c=j&c=d&c=h",function(data,status){if(status=='success'){$('#poem').html(data.hitokoto);if(data.from_who!=null){$('#info').html(data.from_who+" · "+"《 "+data.from+" 》");}else{$('#info').html(data.from);}}else{$('#poem').html("获取出错啦");}});</script>
|
||||
<!-- 加入网易云音乐热门评论，实时更新 -->
|
||||
<div class="poem-wrap">
|
||||
<div class="poem-border poem-left">
|
||||
</div>
|
||||
<div class="poem-border poem-right">
|
||||
</div>
|
||||
<h1>一言</h1>
|
||||
<p id="poem"></p>
|
||||
<p id="info"></p>
|
||||
</div>
|
||||
<%- page.content %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<% if (theme.gitalk && theme.gitalk.enable) { %>
|
||||
<%- partial('_partial/gitalk') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.gitment.enable) { %>
|
||||
<%- partial('_partial/gitment') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.disqus.enable) { %>
|
||||
<%- partial('_partial/disqus') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.livere && theme.livere.enable) { %>
|
||||
<%- partial('_partial/livere') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.valine && theme.valine.enable) { %>
|
||||
<%- partial('_partial/valine') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.minivaline && theme.minivaline.enable) { %>
|
||||
<%- partial('_partial/minivaline') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.changyan && theme.changyan.enable) { %>
|
||||
<%- partial('_partial/changyan') %>
|
||||
<% } %>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
@@ -0,0 +1,238 @@
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
<style>
|
||||
.friends-container {
|
||||
margin-top: -100px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.friends-container .tag-title {
|
||||
margin-bottom: 10px;
|
||||
color: #3C4858;
|
||||
font-size: 1.75rem;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.frind-ship img {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
/* 一下是按钮样式 */
|
||||
|
||||
.frind-ship {
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
.frind-ship .title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.frind-ship .title div {
|
||||
color: #fff;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.frind-ship .title img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.frind-ship .title h1 {
|
||||
padding-bottom: 5px;
|
||||
border-bottom: 2px solid #fff;
|
||||
position: relative;
|
||||
top:-15px;
|
||||
left: 3px;
|
||||
}
|
||||
|
||||
.friend-button {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: -27px;
|
||||
}
|
||||
|
||||
.friend-button a {
|
||||
border-radius: 40px;
|
||||
}
|
||||
|
||||
.friend-all .tag-post {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.button-caution {
|
||||
background-color: #FF4351;
|
||||
border-color: #FF4351;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.button {
|
||||
font-weight: 300;
|
||||
font-size: 16px;
|
||||
font-family: "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
padding: 0 40px;
|
||||
margin: 0;
|
||||
display: inline-block;
|
||||
appearance: none;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: .3s;
|
||||
transition-duration: .3s;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 0rem !important;
|
||||
}
|
||||
|
||||
.card {
|
||||
margin: 3rem 0 1rem 0 !important;
|
||||
}
|
||||
|
||||
.button-glow.button-caution {
|
||||
-webkit-animation-name: glowing-caution;
|
||||
animation-name: glowing-caution;
|
||||
}
|
||||
|
||||
@-webkit-keyframes glowing-caution {
|
||||
from {
|
||||
-webkit-box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);
|
||||
box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-box-shadow: 0 0 20px rgba(255, 67, 81, 0.8);
|
||||
box-shadow: 0 0 20px rgba(255, 67, 81, 0.8);
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);
|
||||
box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes glowing-caution {
|
||||
from {
|
||||
-webkit-box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);
|
||||
box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-box-shadow: 0 0 20px rgba(255, 67, 81, 0.8);
|
||||
box-shadow: 0 0 20px rgba(255, 67, 81, 0.8);
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);
|
||||
box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
.button-caution:hover {
|
||||
background-color: #ff7680;
|
||||
border-color: #ff7680;
|
||||
color: #FFF;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.frind-card1 {
|
||||
background-image: linear-gradient(to right, #4facfe 0%, #00f2fe 100%);
|
||||
}
|
||||
|
||||
.frind-card2 {
|
||||
background-image: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||||
}
|
||||
|
||||
.frind-card3 {
|
||||
background-image: linear-gradient(to right, #b8cbb8 0%, #b8cbb8 0%, #b465da 0%, #cf6cc9 33%, #ee609c 66%, #ee609c 100%);
|
||||
}
|
||||
|
||||
.frind-card4 {
|
||||
background-image: linear-gradient(to right, #6a11cb 0%, #2575fc 100%);
|
||||
}
|
||||
|
||||
.frind-card5 {
|
||||
background-image: linear-gradient(to top, #c471f5 0%, #fa71cd 100%);
|
||||
}
|
||||
|
||||
.frind-card6 {
|
||||
background-image: linear-gradient(to top, #48c6ef 0%, #6f86d6 100%);
|
||||
}
|
||||
|
||||
.frind-card7 {
|
||||
background-image: linear-gradient(to top, #0ba360 0%, #3cba92 100%);
|
||||
}
|
||||
|
||||
.frind-card8 {
|
||||
background-image: linear-gradient(to top, #0c3483 0%, #a2b6df 100%, #6b8cce 100%, #a2b6df 100%);
|
||||
}
|
||||
|
||||
.frind-card9 {
|
||||
background-image: linear-gradient(to right, #ff758c 0%, #ff7eb3 100%);
|
||||
}
|
||||
|
||||
.frind-card10 {
|
||||
background-image: linear-gradient(to top, #f77062 0%, #fe5196 100%);
|
||||
}
|
||||
|
||||
article .card {
|
||||
overflow: visible !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<main class="content">
|
||||
<div class="container friends-container">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="tag-title center-align">
|
||||
<i class="fas fa-address-book"></i> <%= __('friends') %>
|
||||
</div>
|
||||
<article id="friends-link">
|
||||
<% if (site.data && site.data.friends) { %>
|
||||
<% var friends = site.data.friends; %>
|
||||
<div class="row tags-posts friend-all">
|
||||
<% for (var i = 0, len = friends.length; i < len; i++) { %>
|
||||
<% var friend = friends[i]; %>
|
||||
<div class="col s12 m6 l4 friend-div" data-aos="zoom-in-up">
|
||||
<div class="card frind-card<%- ((i % 10) +1) %>">
|
||||
<div class="frind-ship">
|
||||
<div class="title">
|
||||
<img src="<%- url_for(friend.avatar) %>" alt="img">
|
||||
<div>
|
||||
<h1 class="friend-name"><%= friend.name %></h1>
|
||||
<p style="position: relative;top: -35px;"><%= friend.introduction %></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="friend-button">
|
||||
<a href="<%- url_for(friend.url) %>" target="_blank"
|
||||
class="button button-glow button-rounded button-caution">
|
||||
<%= friend.title %>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
<% } %>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<script>
|
||||
$(function () {
|
||||
$('#friends-link').masonry({
|
||||
itemSelector: '.friend-div'
|
||||
});
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,27 @@
|
||||
<link rel="stylesheet" href="/css/gallery.css">
|
||||
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
|
||||
<main class="content">
|
||||
<div class="container">
|
||||
<% if (site.data && site.data.galleries) { %>
|
||||
<% var galleries = site.data.galleries; %>
|
||||
<div class="gallery-wrapper row">
|
||||
<% for (var i = 0, len = galleries.length; i < len; i++) { %>
|
||||
<% var gallery = galleries[i]; %>
|
||||
<div class="col s6 m4 l4 xl3 gallery-box">
|
||||
<a href="./<%- gallery.name %>" class="gallery-item" data-aos="zoom-in-up">
|
||||
<div class="gallery-cover-box" style="background-image: url(https://cdn.jsdelivr.net/gh/LuckyZmj/imgbed@master/galleries/<%- gallery.cover%>)">
|
||||
<!--<img src="https://cdn.jsdelivr.net/gh/LuckyZmj/imgbed@master/galleries/<%- gallery.cover %>" alt="img" class="gallery-cover-img">-->
|
||||
</div>
|
||||
<p class="gallery-name">
|
||||
<%- gallery.name %>
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@@ -0,0 +1,94 @@
|
||||
<link rel="stylesheet" href="/css/gallery.css">
|
||||
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.libs.css.fancybox %>">
|
||||
<link rel="stylesheet" type="text/css" href="<%- theme.libs.css.justifiedGallery %>">
|
||||
|
||||
<%- partial('_partial/post-cover') %>
|
||||
|
||||
<%
|
||||
let galleries = [];
|
||||
if (site.data && site.data.galleries) {
|
||||
galleries = site.data.galleries;
|
||||
}
|
||||
var pageTitle = page.title;
|
||||
function getCurrentGallery(galleries, pageTitle) {
|
||||
for (let i = 0; i < galleries.length; i++) {
|
||||
if (galleries[i]['name'] == pageTitle) {
|
||||
return galleries[i];
|
||||
}
|
||||
}
|
||||
}
|
||||
var currentGallery = getCurrentGallery(galleries, pageTitle)
|
||||
|
||||
var photos = currentGallery.photos;
|
||||
|
||||
let imageStr = ''
|
||||
|
||||
for (var i = 0, len = photos.length; i < len; i++) {
|
||||
var photo = photos[i];
|
||||
|
||||
|
||||
<!-- 这儿的网址：http://sunhwee.com/ 改为你图片放的位置的网址，比如你用Github图床的话，就改为你图床的网址 -->
|
||||
imageStr += "<a href=\"https://cdn.jsdelivr.net/gh/LuckyZmj/imgbed/galleries/" + photo + "\"\n" +
|
||||
" class=\"photo-item\" rel=\"example_group\"\n" +
|
||||
" data-fancybox=\"images\">\n" +
|
||||
" <img src=\"https://cdn.jsdelivr.net/gh/LuckyZmj/imgbed@master/galleries/" + photo + "\"\n" +
|
||||
" alt=" + photo + ">\n" +
|
||||
" </a>"
|
||||
}
|
||||
%>
|
||||
|
||||
<!-- " <p class=\"photo-name\">" + photo + "</p>\n" +
|
||||
文件名先注释掉 -->
|
||||
|
||||
<!-- 不加密写法 -->
|
||||
<!-- <div class="container">
|
||||
<div class="photo-wrapper" >
|
||||
<div class="waterfall" id="mygallery">
|
||||
<%- imageStr %>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<main class="content" >
|
||||
<!-- 加密写法 -->
|
||||
<div class="container">
|
||||
<div class="photo-wrapper">
|
||||
<% if (page.password ) { %>
|
||||
|
||||
<!-- <script src="/lib/crypto-js.js"></script> -->
|
||||
<script src="/js/crypto-js.js"></script>
|
||||
<script src="/js/gallery-encrypt.js"></script>
|
||||
<div id="hbe-security">
|
||||
<div class="hbe-input-container">
|
||||
<input type="password" class="hbe-form-control" id="pass" placeholder="请输入密码查看内容"/>
|
||||
<a href="javascript:;" class="btn-decrypt" id="btn_decrypt">解密</a>
|
||||
</div>
|
||||
</div>
|
||||
<div id="mygallery">
|
||||
<div class="waterfall" id="encrypt-blog" style="display:none">
|
||||
<%- aes(imageStr, page.password) %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% } else { %>
|
||||
<div class="waterfall" id="encrypt-blog">
|
||||
<%- imageStr %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
<main>
|
||||
<script src="<%- theme.libs.js.lazyload %>"></script>
|
||||
<script src="<%- theme.libs.js.fancybox %>"></script>
|
||||
<script src="<%- theme.libs.js.justifiedGallery %>"></script>
|
||||
|
||||
<script>
|
||||
// $(".waterfall").lazyload();
|
||||
|
||||
$("a[rel=example_group]").fancybox();
|
||||
// 不加密写法
|
||||
// $("#mygallery").justifiedGallery({margins: 5, rowHeight: 150});
|
||||
$("#encrypt-blog").justifiedGallery({margins: 5, rowHeight: 150});
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1,131 @@
|
||||
<% if (is_home() && page.current === 1) { %>
|
||||
<%- partial('_partial/index-cover') %>
|
||||
<% } else { %>
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
<% } %>
|
||||
|
||||
<main class="content">
|
||||
|
||||
<% if (page.current === 1
|
||||
&& ((theme.dream.enable || theme.music.enable)
|
||||
|| theme.video.enable || theme.recommend.enable)) { %>
|
||||
<div id="indexCard" class="index-card">
|
||||
<div class="container ">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<% if (theme.dream.enable) { %>
|
||||
<%- partial('_widget/dream') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.music.enable && !theme.music.fixed) { %>
|
||||
<%- partial('_widget/music') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.video.enable) { %>
|
||||
<%- partial('_widget/video') %>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.recommend.enable) { %>
|
||||
<div id="recommend-sections" class="recommend">
|
||||
<%- partial('_widget/recommend') %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% }%>
|
||||
|
||||
<%
|
||||
var hashCode = function (str) {
|
||||
if (!str && str.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var hash = 0;
|
||||
for (var i = 0, len = str.length; i < len; i++) {
|
||||
hash = ((hash << 5) - hash) + str.charCodeAt(i);
|
||||
hash |= 0;
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
%>
|
||||
|
||||
<!-- 所有文章卡片 -->
|
||||
<article id="articles" class="container articles">
|
||||
<div class="row article-row">
|
||||
<% page.posts.forEach(post => { %>
|
||||
<div class="article col s12 m6 l4" data-aos="zoom-in">
|
||||
<div class="card">
|
||||
<a href="<%- url_for(post.path) %>">
|
||||
<div class="card-image">
|
||||
<% if (post.img) { %>
|
||||
<img src="<%- url_for(post.img) %>" class="responsive-img" alt="<%= post.title %>">
|
||||
<% } else { %>
|
||||
<%
|
||||
var featureimg = '/medias/featureimages/0.jpg';
|
||||
var featureImages = theme.featureImages;
|
||||
if (!featureImages || featureImages.length == 0) {
|
||||
return featureimg;
|
||||
}
|
||||
featureimg = featureImages[Math.abs(hashCode(post.title) % featureImages.length)]
|
||||
%>
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(featureimg) %>" class="responsive-img" alt="<%= post.title %>">
|
||||
<% } %>
|
||||
<span class="card-title"><%= post.title %></span>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="card-content article-content">
|
||||
<div class="summary block-with-text">
|
||||
<% if (post.summary && post.summary.length > 0) { %>
|
||||
<%- post.summary %>
|
||||
<% } else if (post.excerpt && post.excerpt.length > 0) { %>
|
||||
<%- strip_html(post.excerpt).substring(0, 120) %>
|
||||
<% } else if (post.content && post.content.length > 0) { %>
|
||||
<%- strip_html(post.content).substring(0, 120) %>
|
||||
<% } %>
|
||||
</div>
|
||||
<div class="publish-info">
|
||||
<span class="publish-date">
|
||||
<i class="far fa-clock fa-fw icon-date"></i><%= date(post.date, config.date_format) %>
|
||||
</span>
|
||||
<span class="publish-author">
|
||||
<% if (post.categories && post.categories.length > 0) { %>
|
||||
<i class="fas fa-bookmark fa-fw icon-category"></i>
|
||||
<% post.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="post-category">
|
||||
<%- category.name %>
|
||||
</a>
|
||||
<% }); %>
|
||||
<% } else if (post.author && post.author.length > 0) { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- post.author %>
|
||||
<% } else { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- config.author %>
|
||||
<% } %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% if(post.tags && post.tags.length > 0) { %>
|
||||
<div class="card-action article-tags">
|
||||
<% post.tags.forEach(tag => { %>
|
||||
<a href="<%- url_for(tag.path) %>">
|
||||
<span class="chip bg-color"><%= tag.name %></span>
|
||||
</a>
|
||||
<% }); %>
|
||||
</div>
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
<% }); %>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
</main>
|
||||
|
||||
<% if (page.total > 1) { %>
|
||||
<%- partial('_partial/paging') %>
|
||||
<% } %>
|
||||
@@ -0,0 +1,144 @@
|
||||
<!DOCTYPE HTML>
|
||||
<html lang="<%= config.language %>">
|
||||
<%- partial('_partial/head') %>
|
||||
|
||||
<% if (theme.background.enable) { %>
|
||||
<%- partial('_partial/background') %>
|
||||
<% } %>
|
||||
|
||||
<body>
|
||||
<%- partial('_partial/header') %>
|
||||
<%- body %>
|
||||
|
||||
<%- partial('_partial/footer') %>
|
||||
|
||||
<%- partial('_partial/search') %>
|
||||
<%- partial('_partial/back-top') %>
|
||||
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.materialize) %>"></script>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.masonry) %>"></script>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.aos) %>"></script>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.scrollProgress) %>"></script>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.lightgallery) %>"></script>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.matery) %>"></script>
|
||||
|
||||
<%- partial('_partial/baidu-analytics') %>
|
||||
<%- partial('_partial/baidu-push') %>
|
||||
<% if (theme.clicklove.enable) { %>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.clicklove) %>" async="async"></script>
|
||||
<% } %>
|
||||
<% if (theme.busuanziStatistics && theme.busuanziStatistics.enable) { %>
|
||||
<script async src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.busuanzi) %>"></script>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.tidio.enable) { %>
|
||||
<script src="//code.tidio.co/<%- theme.tidio.public_key %>.js"></script>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
setInterval(change_Tidio, 50);
|
||||
function change_Tidio() {
|
||||
var tidio=$("#tidio-chat iframe");
|
||||
if(tidio.css("display")=="block"&& $(window).width()>977 ){
|
||||
document.getElementById("tidio-chat-iframe").style.bottom= ($("div#backTop.top-scroll").css("display")=="none" &&$(window).width()>977)>0? "-40px" : ($("div.toc-title").length&&$(window).width()>977)>0?"<%if(theme.toc.showToggleBtn){%>85px<%}else{%>20px<%}%>":"20px";
|
||||
document.getElementById("tidio-chat-iframe").style.right="-15px";
|
||||
document.getElementById("tidio-chat-iframe").style.height=parseInt(tidio.css("height"))>=520?"520px":tidio.css("height");
|
||||
document.getElementById("tidio-chat-iframe").style.zIndex="997";
|
||||
}
|
||||
else if(tidio.css("display")=="block"&&$(window).width()>601 &&$(window).width()<992 ){
|
||||
document.getElementById("tidio-chat-iframe").style.bottom= ($("div#backTop.top-scroll").css("display")=="none" && 601< $(window).width()<992)>0? "-40px":"20px" ;
|
||||
document.getElementById("tidio-chat-iframe").style.right="-15px";
|
||||
document.getElementById("tidio-chat-iframe").style.zIndex="997";
|
||||
}
|
||||
else if(tidio.css("display")=="block"&&$(window).width()<601 && parseInt(tidio.css("height"))<230){
|
||||
document.getElementById("tidio-chat-iframe").style.bottom= ($("div#backTop.top-scroll").css("display")=="none" && $(window).width()<601)>0? "-10px":"45px" ;
|
||||
document.getElementById("tidio-chat-iframe").style.zIndex="997";
|
||||
}
|
||||
if( tidio.css("display")=="block"&&$(window).width()<601 && parseInt(tidio.css("height"))>=230){
|
||||
document.getElementById("tidio-chat-iframe").style.zIndex="998";
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<% } %>
|
||||
|
||||
<!-- 深色模式按钮 -->
|
||||
<script>
|
||||
if (localStorage.getItem('dark') === '1') {
|
||||
document.body.classList.add('dark');
|
||||
}
|
||||
else if (new Date().getHours() >= 22 || new Date().getHours() < 7) {
|
||||
document.body.classList.add('dark');
|
||||
}
|
||||
else if (matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
document.body.classList.add('dark');
|
||||
}
|
||||
</script>
|
||||
<a onclick="switchNightMode()" id="sma">
|
||||
<i class="fas fa-lightbulb" id="nightMode" aria-hidden="true"></i>
|
||||
</a>
|
||||
|
||||
<!-- 天气接口控件 -->
|
||||
<% if (theme.weather.enable) { %>
|
||||
<script type="text/javascript">
|
||||
WIDGET = {FID: 'zLkJSQpqsh'}
|
||||
</script>
|
||||
<!-- <script type="text/javascript" src="https://apip.weatherdt.com/float/static/js/r.js?v=1111"></script> -->
|
||||
|
||||
<script type="text/javascript">
|
||||
var windowWidth = $(window).width();
|
||||
if (windowWidth > 768) {
|
||||
document.write('<script type="text/javascript" src="https://apip.weatherdt.com/float/static/js/r.js?v=1111"><\/script>');
|
||||
}
|
||||
</script>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.daovoice.enable) { %>
|
||||
<script>
|
||||
(function (i, s, o, g, r, a, m) {
|
||||
i["DaoVoiceObject"] = r;
|
||||
i[r] = i[r] || function () {
|
||||
(i[r].q = i[r].q || []).push(arguments)
|
||||
}, i[r].l = 1 * new Date();
|
||||
a = s.createElement(o), m = s.getElementsByTagName(o)[0];
|
||||
a.async = 1;
|
||||
a.src = g;
|
||||
a.charset = "utf-8";
|
||||
m.parentNode.insertBefore(a, m)
|
||||
})(window, document, "script", ('https:' == document.location.protocol ? 'https:' : 'http:') +
|
||||
"//widget.daovoice.io/widget/6984b559.js", "daovoice")
|
||||
daovoice('init', {
|
||||
app_id: "<%- theme.daovoice.app_id %>"
|
||||
});
|
||||
daovoice('update');
|
||||
</script>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.tuxiaochao.enable) { %>
|
||||
<div style="position:fixed;bottom:125px;right:9px;cursor: pointer;">
|
||||
<a title="兔小巢" href="https://support.qq.com/products/<%- theme.tuxiaochao.productId %>"><img src="/medias/contact.png"></a>
|
||||
</div>
|
||||
<%}%>
|
||||
<% if (theme.canvas_nest.enable) { %>
|
||||
<script type="text/javascript" color="<%- theme.canvas_nest.color %>"
|
||||
pointColor="<%- theme.canvas_nest.pointColor %>" opacity='<%- theme.canvas_nest.opacity %>'
|
||||
zIndex="<%- theme.canvas_nest.zIndex %>" count="<%- theme.canvas_nest.count %>"
|
||||
src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.canvas_nest) %>"></script>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.ribbon.enable) { %>
|
||||
<% var ribbonSrc = theme.ribbon.clickChange ? theme.libs.js.ribbon : theme.libs.js.ribbonRefresh; %>
|
||||
<script type="text/javascript" size="<%- theme.ribbon.size %>" alpha='<%- theme.ribbon.alpha %>'
|
||||
zIndex="<%- theme.ribbon.zIndex %>" src="<%- theme.jsDelivr.url %><%- url_for(ribbonSrc) %>" async="async"></script>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.ribbon_dynamic.enable) { %>
|
||||
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.ribbon_dynamic) %>" async="async"></script>
|
||||
<% } %>
|
||||
|
||||
<% if (theme.instantpage.enable) { %>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.instantpage) %>" type="module"></script>
|
||||
<% } %>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,72 @@
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
<!-- 视频页面 -->
|
||||
|
||||
<style>
|
||||
@media only screen and (max-width: 601px) {
|
||||
.movies-w {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.movies-h {
|
||||
height: 90%;
|
||||
padding-top: 5%;
|
||||
padding-bottom: 5%;
|
||||
}
|
||||
}
|
||||
|
||||
/*中等屏幕下(平板类)的样式*/
|
||||
@media only screen and (min-width: 600px) and (max-width: 992px) {
|
||||
.movies-w {
|
||||
width: 95%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.movies-h {
|
||||
height: 95%;
|
||||
padding-top: 5%;
|
||||
padding-bottom: 5%;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 993px) {
|
||||
.movies-w {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.movies-h {
|
||||
height: 80%;
|
||||
padding-top: 5%;
|
||||
padding-bottom: 5%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<main class="content">
|
||||
<div id="category-cloud" class="container chip-container">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div>
|
||||
<h1 style="text-align:center;">
|
||||
📺
|
||||
<span style="color:red;">励</span>
|
||||
<span style="color:yellow;">志</span>
|
||||
<span style="color:blue;">短</span>
|
||||
<span style="color:green;">片</span>
|
||||
</h1>
|
||||
<div>
|
||||
<div class="movies-w" style="position: relative; padding-bottom: 75%;">
|
||||
<iframe class="movies-h" style="
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0;"
|
||||
src="//player.bilibili.com/player.html?aid=2979186&cid=4667585&page=1" scrolling="no" border="0"
|
||||
frameborder="no"
|
||||
framespacing="0"
|
||||
allowfullscreen="true">
|
||||
</iframe>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
@@ -0,0 +1,77 @@
|
||||
<style type="text/css">
|
||||
/* don't remove. */
|
||||
.about-cover {
|
||||
height: 75vh;
|
||||
}
|
||||
</style>
|
||||
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
|
||||
<main class="content">
|
||||
<div id="aboutme" class="container about-container">
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="music-player">
|
||||
<% if (theme.musics && theme.musics.enable) { %>
|
||||
<%- partial('_widget/musics') %>
|
||||
|
||||
|
||||
<style>
|
||||
.bubbles > .particle {
|
||||
/*初始透明度为0*/
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
/*初始颜色为荧光色，透明度为0.7*/
|
||||
background-color: rgba(128,255,0,0.7);
|
||||
/*使用bubbles动画，持续时间18秒，缓慢进入，无限循环*/
|
||||
animation: bubbles 18s ease-in infinite;
|
||||
border-radius: 100%;
|
||||
}
|
||||
/*css keyframes 动画*/
|
||||
@keyframes bubbles {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
5% {
|
||||
opacity: 1;
|
||||
transform: translate(0, -20%);
|
||||
}
|
||||
/*这里-8000%表示是气泡的8000%*/
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: translate(0, -8000%);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<!-- 这里让元素宽度100%（和页面等宽） -->
|
||||
<div style="width: 100%; height: 100%; position: relative; bottom: 0px;" class="particletext bubbles">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
|
||||
<script>
|
||||
function bubbles() {
|
||||
$.each($(".particletext.bubbles"), function(){
|
||||
var bubblecount = ($(this).width()/50)*10;
|
||||
for(var i = 0; i <= bubblecount; i++) {
|
||||
var size = ($.rnd(40,80)/10);
|
||||
//这里的animation-delay很重要，关系到你的特效是否看上去是连续无断层的，上一步中css是18秒，所以这一步中延迟时间就设置成$.rnd(0,180)/10)
|
||||
$(this).append('<span class="particle" style="top:' + $.rnd(20,80) + '%; left:' + $.rnd(0,95) + '%;width:' + size + 'px; height:' + size + 'px;animation-delay: ' + ($.rnd(0,180)/10) + 's;"></span>');
|
||||
}
|
||||
});
|
||||
}
|
||||
jQuery.rnd = function(m,n) {
|
||||
m = parseInt(m);
|
||||
n = parseInt(n);
|
||||
return Math.floor( Math.random() * (n - m + 1) ) + m;
|
||||
}
|
||||
bubbles();
|
||||
</script>
|
||||
|
||||
<% } %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
@@ -0,0 +1,40 @@
|
||||
<% if (theme.verifyPassword.enable) { %>
|
||||
<script src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.crypto) %>"></script>
|
||||
<script>
|
||||
(function() {
|
||||
let pwd = '<%- page.password %>';
|
||||
if (pwd && pwd.length > 0) {
|
||||
if (pwd !== CryptoJS.SHA256(prompt('<%- theme.verifyPassword.promptMessage %>')).toString(CryptoJS.enc.Hex)) {
|
||||
alert('<%- theme.verifyPassword.errorMessage %>');
|
||||
location.href = '<%- url_for("/") %>';
|
||||
}
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
<% } %>
|
||||
|
||||
<%- partial('_partial/post-cover') %>
|
||||
|
||||
<%
|
||||
var isTocEnable = theme.toc.enable && String(page.toc) !== 'false';
|
||||
var containerClass = isTocEnable ? 'post-container' : 'container';
|
||||
%>
|
||||
|
||||
<main class="<%- containerClass %> content">
|
||||
|
||||
<% if (isTocEnable) { %>
|
||||
<%- partial('_partial/post-detail-toc.ejs') %>
|
||||
<% } else { %>
|
||||
<%- partial('_partial/post-detail.ejs') %>
|
||||
<% } %>
|
||||
|
||||
</main>
|
||||
|
||||
<% if (theme.mathjax.enable && page.mathjax) { %>
|
||||
<script src="<%- theme.mathjax.cdn %>"></script>
|
||||
<script>
|
||||
MathJax.Hub.Config({
|
||||
tex2jax: {inlineMath: [['$', '$'], ['\(', '\)']]}
|
||||
});
|
||||
</script>
|
||||
<% } %>
|
||||
@@ -0,0 +1,81 @@
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
|
||||
<main class="content">
|
||||
|
||||
<%- partial('_widget/tag-cloud') %>
|
||||
|
||||
<%
|
||||
var hashCode = function (str) {
|
||||
if (!str && str.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var hash = 0;
|
||||
for (var i = 0, len = str.length; i < len; i++) {
|
||||
hash = ((hash << 5) - hash) + str.charCodeAt(i);
|
||||
hash |= 0;
|
||||
}
|
||||
return hash;
|
||||
};
|
||||
%>
|
||||
|
||||
<article id="articles" class="container articles">
|
||||
<div class="row tags-posts">
|
||||
<% page.posts.sort('date').reverse().forEach(post => { %>
|
||||
<%
|
||||
var tagArr = [];
|
||||
if (post.tags && post.tags.length > 0) {
|
||||
post.tags.forEach(tag => {
|
||||
tagArr.push(tag.name);
|
||||
});
|
||||
}
|
||||
var tags = tagArr.join(', ');
|
||||
%>
|
||||
<div class="article tag-post col s12 m6 l4" data-tags="<%- tags %>" data-aos="fade-up">
|
||||
<div class="card">
|
||||
<a href="<%- url_for(post.path) %>">
|
||||
<div class="card-image tag-image">
|
||||
<% if (post.img) { %>
|
||||
<img src="<%- url_for(post.img) %>" class="responsive-img" alt="<%= post.title %>">
|
||||
<% } else { %>
|
||||
<%
|
||||
var featureimg = theme.featureImages[Math.abs(hashCode(post.title) % theme.featureImages.length)];
|
||||
%>
|
||||
<img src="<%- theme.jsDelivr.url %><%- url_for(featureimg) %>" class="responsive-img" alt="<%= post.title %>">
|
||||
<% } %>
|
||||
<span class="card-title"><%= post.title %></span>
|
||||
</div>
|
||||
</a>
|
||||
<div class="card-content article-content">
|
||||
<div class="publish-info">
|
||||
<span class="publish-date">
|
||||
<i class="far fa-clock fa-fw icon-date"></i><%= date(post.date, config.date_format) %>
|
||||
</span>
|
||||
<span class="publish-author">
|
||||
<% if (post.categories && post.categories.length > 0) { %>
|
||||
<i class="fas fa-bookmark fa-fw icon-category"></i>
|
||||
<% post.categories.forEach(category => { %>
|
||||
<a href="<%- url_for(category.path) %>" class="post-category">
|
||||
<%- category.name %>
|
||||
</a>
|
||||
<% }); %>
|
||||
<% } else if (post.author && post.author.length > 0) { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- post.author %>
|
||||
<% } else { %>
|
||||
<i class="fas fa-user fa-fw"></i>
|
||||
<%- config.author %>
|
||||
<% } %>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% }); %>
|
||||
</div>
|
||||
</article>
|
||||
</main>
|
||||
|
||||
<% if (page.total > 1) { %>
|
||||
<%- partial('_partial/paging') %>
|
||||
<% } %>
|
||||
@@ -0,0 +1,11 @@
|
||||
<%- partial('_partial/bg-cover') %>
|
||||
|
||||
<main class="content">
|
||||
|
||||
<%- partial('_widget/tag-cloud') %>
|
||||
|
||||
<% if (site.tags && site.tags.length > 0) { %>
|
||||
<%- partial('_widget/tag-wordcloud') %>
|
||||
<% } %>
|
||||
|
||||
</main>
|
||||
Reference in New Issue
Block a user