💄 Add post expired tip features.

This commit is contained in:
elkan1788 2025-01-03 20:48:41 +08:00
parent 9aaaf388f8
commit b559782447
14 changed files with 132 additions and 8 deletions

View File

@ -12,7 +12,7 @@
@include alert-styles(#{$key}, $color);
}
.post-alert-title {
.post-alert-title, .post-expired-title {
display: flex;
align-items: center;
@ -31,6 +31,6 @@
}
}
.post-alert-content {
.post-alert-content, .post-expired-content {
color: var(--text-color);
}

View File

@ -86,5 +86,26 @@
visibility: hidden;
}
@import 'post-alert';
.post-expired-tip {
font-size: 0.825em;
border: 1px solid #4A90E2;
border-left: 6px solid #4A90E2;
margin: 0 0 0.85em 0;
padding: 0.65em 0.15em 0.65em 0.95em;
.post-expired-title {
color: #4A90E2;
font-weight: bold;
}
.post-expired-times {
font-weight: bold;
font-size: 1.15em;
color: #e5534b;
margin: 0 3px;
}
}
@import 'post-alert';
}

View File

@ -63,9 +63,13 @@ NexT.boot.refresh = function() {
if (!NexT.CONFIG.page.isPage) return;
NexT.utils.registerSidebarTOC();
if (NexT.CONFIG.page.toc) NexT.utils.registerSidebarTOC();
if (NexT.CONFIG.page.expired) NexT.utils.calPostExpiredDate();
NexT.utils.registerCopyCode();
NexT.utils.registerImageViewer();
NexT.utils.registerPostReward();
if(NexT.CONFIG.page.comments) {
NexT.utils.initCommontesDispaly();
NexT.utils.registerCommonSwitch();
@ -73,7 +77,6 @@ NexT.boot.refresh = function() {
} else {
NexT.utils.hideComments();
}
NexT.utils.registerImageViewer();
//TODO
/**

View File

@ -7,6 +7,35 @@ HTMLElement.prototype.wrap = function (wrapper) {
};
NexT.utils = {
calPostExpiredDate: function() {
const postMetaDom = document.querySelector('.post-meta-container');
let postTime = postMetaDom.querySelector('time[itemprop="dateCreated datePublished"]').getAttribute("datetime");
let postLastmodTime = postMetaDom.querySelector('time[itemprop="dateModified dateLastmod"]');
if (postLastmodTime != null) postTime = postLastmodTime.getAttribute("datetime");
const expireCfg = NexT.CONFIG.page.expiredTips;
let expiredTipPre = '';
let expiredTipSuf = '';
let expireTime = this.diffDate(postTime, 2);
if (expireTime == '0'+NexT.CONFIG.i18n.ds_days) {
document.getElementById('post-expired-tip').style.display = 'none';
} else {
if (expireTime.indexOf(NexT.CONFIG.i18n.ds_years) > -1){
let expireTip = expireCfg.warn.split('#');
expiredTipPre = expireTip[0];
expiredTipSuf = expireTip[1];
} else {
let expireTip = expireCfg.info.split('#');
expiredTipPre = expireTip[0];
expiredTipSuf = expireTip[1];
}
let expiredTip = expiredTipPre + '<span class="post-expired-times">' + expireTime + '</span>' + expiredTipSuf;
document.getElementById('post-expired-content').innerHTML = expiredTip;
}
},
registerMenuClick: function () {
const pMenus = document.querySelectorAll('.main-menu > li > a.menus-parent');
pMenus.forEach(function (item) {

View File

@ -495,6 +495,34 @@ params:
# 页面访问统计插件支持busuanzi, waline, waline3
# Page views counter plugin, support: busuanzi, waline, waline3
plugin: busuanzi
# 是否开启过期提示
# Expired tip
expired: false
# 文章内容中的提示信息设置
# Alert settings in post content
postAlerts:
info:
icon: "circle-info"
color: "#4A90E2"
note:
icon: "bell"
color: "#17A2B8"
help:
icon: "circle-question"
color: "#967ADC"
error:
icon: "circle-xmark"
color: "#DC3545"
warning:
icon: "triangle-exclamation"
color: "#F39C12"
success:
icon: "circle-check"
color: "#32CD32"
important:
icon: "circle-plus"
color: "#007BFF"
# 文章底部的设置
# Post footer settings

View File

@ -4,7 +4,7 @@ description: "在新版本Hugo框架中添加了对blockquote样式渲染
keywords: "hugo,block,quote"
date: 2025-01-02T16:08:02+08:00
lastmod: 2025-01-02T16:08:02+08:00
lastmod: 2025-01-02T19:08:02+08:00
categories:
- 示例文章
@ -15,6 +15,7 @@ tags:
url: "demo/hugo-blockquote.html"
toc: true
expired: true
---
过去 `HugoNexT` 主题都是通过自定义短语来实现块信息的标注,近期发现 `Hugo` 从[v0.134.0](https://github.com/gohugoio/hugo/releases/tag/v0.134.0)版本开始便是可以支持通过hook方式渲染Markdown文档中的Blockquote样式需要自己实现实现类似Github的警告风格样式。于是便在 `HugoNexT` 主题中添加7种不同风格供用户可选择使用还可以自定义图标与颜色配置。

View File

@ -16,6 +16,7 @@ tags:
url: "demo/image-viewer.html"
toc: false
expired: true
---
本主题自带图像浏览器功能,支持对文章区域内出现的图片进行浏览,点击图片可以查看大图,点击空白处可以关闭。不需要配置任何参数,只要在文章里面相应的位置添加图片信息即可 。

View File

@ -15,6 +15,7 @@ tags:
comment:
enable: false
url: "demo/no-header-title.html"
expired: true
---
刘慈欣2018克拉克奖获奖感言部分内容节选

View File

@ -71,6 +71,10 @@ PostMeta:
tags: Tags
more: "Read More"
edit: "Edit this post"
expired:
title: "Note"
info: "🕰️ HeyThis article is an aged wine of over # the information may need updating, please check the best before date before reading."
warn: "🚀 Heads up! This article is from # ago and might not keep up with the pace of time. Bring your own time machine for reading, watch out for the time travel!"
PostAlert:
info : "Info"

View File

@ -70,6 +70,10 @@ PostMeta:
tags: Tags
more: "Lire la suite"
edit: "Editer ce billet"
expired:
title: "Astuce bienveillante"
info: "🕰️ HeyThis article is an aged wine of over # the information may need updating, please check the best before date before reading."
warn: "🚀 Heads up! this article is from # ago and might not keep up with the pace of time. Bring your own time machine for reading, watch out for the time travel!"
PostAlert:
info : "Info"

View File

@ -71,6 +71,10 @@ PostMeta:
tags: 标签
more: 阅读全文
edit: 编辑
expired:
title: "温馨提醒"
info: "🕰️ 嗨,这篇文章已是#前的陈年佳酿,信息可能需要更新,阅读前请检查最佳赏味期限。"
warn: "🚀 注意啦!这篇文章来自#以前,可能已跟不上时代的步伐。阅读时请自备时光机,小心穿越哦!"
PostAlert:
info : "信息"

View File

@ -71,6 +71,10 @@ PostMeta:
tags: 標籤
more: 閱讀全文
edit: 編輯
expired:
title: "温馨提醒"
info: "🕰️ 嗨,这篇文章已是#前的陳年佳釀,資訊可能需要更新,閱讀前請檢查最佳賞味期限。"
warn: "🚀 請注意啦!這篇文章来自#以前,可能已經跟不上時代的腳步了。閱讀時請自備時光機,小心穿越哦!"
PostAlert:
info : "信息 "

View File

@ -2,11 +2,23 @@
"isHome" .IsHome
"isPage" .IsPage
"comments" (.Scratch.Get "isComment")
"toc" (default .Site.Params.toc.enable .Params.Toc)
"permalink" (.Page.Permalink | absURL)
"path" (.Page.Permalink | path.Base)
"title" .Page.Title
}}
{{/* Append post expired config */}}
{{ $expired := default .Site.Params.PostMeta.expired .Params.Expired }}
{{ $pageCfg = merge $pageCfg (dict "expired" $expired) }}
{{ if $expired }}
{{ $expiredTips := dict
"info" (T "PostMeta.expired.info")
"warn" (T "PostMeta.expired.warn")
}}
{{ $pageCfg = merge $pageCfg (dict "expiredTips" $expiredTips) }}
{{ end }}
{{/* Append waline pageview & comment plugin */}}
{{ with .Site.Params.postMeta.views }}
{{ if and .enable (ne .plugin "busuanzi") }}

View File

@ -6,9 +6,21 @@
{{ .Summary }}
{{ end }}
{{ else }}
{{/** Started use the read more content anchor the need Hugo framework min marjo version greater than 0.134.0 **/}}
{{ $expired := default .Site.Params.PostMeta.expired .Params.Expired }}
{{ if $expired }}
<div class="post-expired-tip" id="post-expired-tip">
<div class="post-expired-title">
<i class="fa-solid fa-hourglass-half"></i>
<span>{{ T "PostMeta.expired.title" }}</span>
</div>
<div id="post-expired-content" class="post-expired-content"></div>
</div>
{{ end }}
{{/** Started use the read more content anchor the need
Hugo framework min marjo version greater than 0.134.0 **/}}
{{ .Summary }}
<a id="more"><!-- It's an anchor point to locate read more content start. --></a>
<!-- It's an anchor point to locate read more content start. -->
<a id="more"></a>
{{ .ContentWithoutSummary }}
{{ end }}
{{ end }}