github
/
halo-theme-hao
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

添加标签云随机标签颜色效果可选设置

This commit is contained in:
roozen 2023-07-25 02:06:12 +08:00
parent edad1a5434
commit f047b3cbb1
3 changed files with 17 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
settings.yaml
View File

@ -2399,6 +2399,15 @@ spec:
value: true value: true
- label: 禁用 - label: 禁用
value: false value: false
- $formkit: radio
name: tagRandomColorEnable
label: 标签云随机颜色效果
value: false
options:
- label: 启用
value: true
- label: 禁用
value: false
- $formkit: group - $formkit: group
name: greeting name: greeting
label: 首页问候语 label: 首页问候语

2
templates/assets/zhheo/zhheoblog.css
View File

@ -10562,7 +10562,7 @@ div#author-info__sayhi:hover {
/* 标签云卡片 */ /* 标签云卡片 */
#aside-content .card-tag-cloud a { #aside-content .card-tag-cloud a {
color: var(--heo-fontcolor) !important; color: var(--heo-fontcolor);
font-size: 0.8rem; font-size: 0.8rem;
border-radius: 8px; border-radius: 8px;
} }

10
templates/modules/widgets/aside/contain/tags-contain.html
View File

@ -1,21 +1,25 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"> <html lang="en" xmlns:th="http://www.thymeleaf.org">
<!-- 标签 --> <!-- 标签 -->
<th:block th:fragment="tags-contain" <th:block th:fragment="tags-contain"
th:with="tags = ${tagFinder.listAll()}, tagQuantity = ${#conversions.convert(theme.config.sidebar.tagQuantity, 'java.lang.Integer')}"> th:with="tags = ${tagFinder.listAll()}, tagQuantity = ${#conversions.convert(theme.config.sidebar.tagQuantity, 'java.lang.Integer')}">
<div class="item-headline"><i class="iconfont icon-tags"></i><span>标签</span></div> <div class="item-headline"><i class="iconfont icon-tags"></i><span>标签</span></div>
<div class="card-tag-cloud"> <div class="card-tag-cloud">
<a style="font-size:1em;color:#d3d3d3" th:each="tag,iterStat : ${tags}" <a class="tag-item" style="font-size:1em" th:each="tag,iterStat : ${tags}"
th:href="@{${tag.status.permalink}}" th:href="@{${tag.status.permalink}}"
th:if="${tagQuantity >= 0 && iterStat.index < tagQuantity || tagQuantity < 0}" th:if="${tagQuantity >= 0 && iterStat.index < tagQuantity || tagQuantity < 0}"
th:title="${tag.spec.displayName}"> th:title="${tag.spec.displayName}">
<!-- 角标 --> <!-- 角标 -->
[[${tag.spec.displayName}]]<sup th:text="${tag.status.visiblePostCount}"></sup> [[${tag.spec.displayName}]]<sup th:text="${tag.status.visiblePostCount}"></sup>
</a> </a>
</div> </div>
<script th:if="${theme.config.other.tagRandomColorEnable}">
for (const tag of document.getElementsByClassName('tag-item')) {
let randomColor ="#"+((1<<24)*Math.random()|0).toString(16);
tag.style.color = randomColor;
}
</script>
</th:block> </th:block>