liuzhihang
GitHub
commit
b81070059a
|
|
@ -35,7 +35,9 @@
|
|||
|
||||
  [Halo-Theme-Hao](https://github.com/liuzhihang/halo-theme-hao) 是一款适用于 [Halo2.x](https://github.com/halo-dev/halo) 的博客主题。
|
||||
|
||||
  移植自 [Hexo](https://hexo.io/zh-cn/index.html) 社区中 [张洪 Heo](https://blog.zhheo.com/) 对 [Hexo-Theme-Butterfly](https://github.com/liuzhihang/halo-theme-hao) 主题的魔改版本。
|
||||
  移植自 [Hexo](https://hexo.io/zh-cn/index.html) 社区中 [张洪 Heo](https://blog.zhheo.com/)
|
||||
对 [Hexo-Theme-Butterfly](https://github.com/liuzhihang/halo-theme-hao)
|
||||
主题的魔改版本。同步参考 [Hexo-Theme-Acrylic-Next](https://github.com/hexo-theme-Acrylic/Hexo-Theme-Acrylic-Next)
|
||||
|
||||
## 安装
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "halo-theme-hao",
|
||||
"version": "1.1.1",
|
||||
"version": "1.1.2",
|
||||
"dependencies": {
|
||||
}
|
||||
}
|
||||
|
|
|
|||
226
settings.yaml
226
settings.yaml
|
|
@ -162,7 +162,7 @@ spec:
|
|||
name: recommendPostCustom
|
||||
label: 自定义文章
|
||||
help: "建议设置六篇文章"
|
||||
value: []
|
||||
value: [ ]
|
||||
children:
|
||||
- $formkit: url
|
||||
name: url
|
||||
|
|
@ -338,68 +338,68 @@ spec:
|
|||
name: socialMedia
|
||||
label: 社交媒体
|
||||
help: 侧栏社交媒体建议只设置两个
|
||||
value: []
|
||||
value: [ ]
|
||||
children:
|
||||
- $formkit: select
|
||||
name: icon
|
||||
label: 图标
|
||||
options:
|
||||
- label: 电子邮箱
|
||||
value: icon-mail-line
|
||||
value: fa-solid fa-envelope
|
||||
- label: 微信
|
||||
value: icon-wechat2
|
||||
- label: 公众号
|
||||
value: icon-weixingongzhonghao
|
||||
value: fa-brands fa-weixin
|
||||
# - label: 公众号
|
||||
# value:
|
||||
- label: 腾讯 QQ
|
||||
value: icon-qq-line
|
||||
value: fa-brands fa-qq
|
||||
- label: 新浪微博
|
||||
value: icon-weibo-line
|
||||
value: fa-brands fa-weibo
|
||||
- label: 知乎
|
||||
value: icon-zhihu-line
|
||||
- label: 豆瓣
|
||||
value: icon-douban-line
|
||||
value: fa-brands fa-zhihu
|
||||
# - label: 豆瓣
|
||||
# value:
|
||||
- label: 哔哩哔哩
|
||||
value: icon-bilibili-line
|
||||
value: fa-brands fa-bilibili
|
||||
- label: GitHub
|
||||
value: icon-github-line
|
||||
value: fa-brands fa-github
|
||||
- label: GitLab
|
||||
value: icon-gitlab-line
|
||||
- label: 百度
|
||||
value: icon-baidu-line
|
||||
- label: 掘金
|
||||
value: icon-juejin
|
||||
- label: 语雀
|
||||
value: icon-yuque
|
||||
- label: 博客园
|
||||
value: icon-CN_cnblogs
|
||||
- label: CSDN
|
||||
value: icon-csdn1
|
||||
- label: LeetCode
|
||||
value: icon-leetcode
|
||||
- label: 头条
|
||||
value: icon-jinritoutiao
|
||||
value: fa-brands fa-gitlab
|
||||
# - label: 百度
|
||||
# value: icon-baidu-line
|
||||
# - label: 掘金
|
||||
# value: icon-juejin
|
||||
# - label: 语雀
|
||||
# value: icon-yuque
|
||||
# - label: 博客园
|
||||
# value: icon-CN_cnblogs
|
||||
# - label: CSDN
|
||||
# value: icon-csdn1
|
||||
# - label: LeetCode
|
||||
# value: icon-leetcode
|
||||
# - label: 头条
|
||||
# value: icon-jinritoutiao
|
||||
- label: 抖音 / TikTok
|
||||
value: icon-douyin
|
||||
value: fa-brands fa-tiktok
|
||||
- label: Telegram
|
||||
value: icon-telegram-line
|
||||
value: fa-brands fa-telegram
|
||||
- label: Facebook
|
||||
value: icon-facebook-box-line
|
||||
value: fa-brands fa-facebook
|
||||
- label: Instagram
|
||||
value: icon-instagram-line
|
||||
value: fa-brands fa-instagram
|
||||
- label: LinkedIn
|
||||
value: icon-linkedin-box-line
|
||||
value: fa-brands fa-linkedin
|
||||
- label: Twitter
|
||||
value: icon-twitter-line
|
||||
value: fa-brands fa-twitter
|
||||
- label: Slack
|
||||
value: icon-slack-line
|
||||
value: fa-brands fa-slack
|
||||
- label: Discord
|
||||
value: icon-discord-line
|
||||
value: fa-brands fa-discord
|
||||
- label: YouTube
|
||||
value: icon-youtube-line
|
||||
value: fa-brands fa-youtube
|
||||
- label: Steam
|
||||
value: icon-steam-fill
|
||||
value: fa-brands fa-steam
|
||||
- label: Dribbble
|
||||
value: icon-dribbble-line
|
||||
value: fa-brands fa-dribbble
|
||||
- $formkit: text
|
||||
name: name
|
||||
label: 名称
|
||||
|
|
@ -449,7 +449,7 @@ spec:
|
|||
- $formkit: repeater
|
||||
name: socialMedia
|
||||
label: 社交媒体
|
||||
value: []
|
||||
value: [ ]
|
||||
children:
|
||||
- $formkit: select
|
||||
name: icon
|
||||
|
|
@ -578,7 +578,7 @@ spec:
|
|||
name: techStack
|
||||
label: 技术栈
|
||||
help: 个人技术栈
|
||||
value: []
|
||||
value: [ ]
|
||||
children:
|
||||
- $formkit: text
|
||||
name: name
|
||||
|
|
@ -592,6 +592,150 @@ spec:
|
|||
- $formkit: color
|
||||
name: background
|
||||
label: 背景色
|
||||
- $formkit: repeater
|
||||
name: authorInfoLeftTags
|
||||
label: 个人标签-左
|
||||
help: 头像左侧个人标签
|
||||
value: [ ]
|
||||
children:
|
||||
- $formkit: text
|
||||
name: tag
|
||||
label: 标签
|
||||
placeholder: 请输入内容
|
||||
- $formkit: repeater
|
||||
name: authorInfoRightTags
|
||||
label: 个人标签-右
|
||||
help: 头像右侧个人标签
|
||||
value: [ ]
|
||||
children:
|
||||
- $formkit: text
|
||||
name: tag
|
||||
label: 标签
|
||||
placeholder: 请输入内容
|
||||
- $formkit: textarea
|
||||
name: content
|
||||
label: 我的介绍
|
||||
value: <div class="title1">你好，很高兴认识你👋</div> <div class="title2">我叫 <span class="inline-word">程序员小航</span></div> <div class="title1">是一名 前端开发工程师、后端开发工程师、全干工程师</div>
|
||||
|
||||
help: 支持 HTML 语法
|
||||
- $formkit: textarea
|
||||
name: idea
|
||||
label: 我的想法
|
||||
value: <div class="author-content-item-tips">一定</div> <h2>记得<br> 修改这块<span class="inline-word">代码</span> <div class="mask"> <span class="first-tips" data-show="">优秀的产品</span> <span>出色的设计</span> <span>高效的编程</span> <span data-up="">人性化的用户体验</span> </div> </h2>
|
||||
help: 支持 HTML 语法
|
||||
- $formkit: text
|
||||
name: authorCareersTitle
|
||||
label: 职业生涯标题
|
||||
placeholder: 请输入内容
|
||||
- $formkit: repeater
|
||||
name: authorCareersTags
|
||||
label: 职业生涯标签
|
||||
value: [ ]
|
||||
children:
|
||||
- $formkit: color
|
||||
name: background
|
||||
label: 颜色
|
||||
- $formkit: text
|
||||
name: desc
|
||||
label: 描述
|
||||
- $formkit: url
|
||||
name: authorCareersBackground
|
||||
label: 职业生涯背景图
|
||||
placeholder: 建议找个透明图
|
||||
validation: "url"
|
||||
- $formkit: url
|
||||
name: authorCareersPhoto
|
||||
label: 图片
|
||||
validation: "url"
|
||||
value: https://p.zhheo.com/2023788ba3b8739936f844e64f483faacaf1085602.png!cover
|
||||
- $formkit: text
|
||||
name: authorInfoAddress
|
||||
label: 居住地
|
||||
placeholder: 请输入内容
|
||||
- $formkit: text
|
||||
name: authorInfoAddressBackground
|
||||
label: 居住地背景图
|
||||
placeholder: 请输入内容
|
||||
- $formkit: repeater
|
||||
name: authorInfo
|
||||
label: 个人信息
|
||||
value: [ ]
|
||||
children:
|
||||
- $formkit: text
|
||||
name: authorInfoTitle
|
||||
label: 标题
|
||||
placeholder: 请输入内容
|
||||
- $formkit: text
|
||||
name: authorInfoContent
|
||||
label: 内容
|
||||
placeholder: 请输入内容
|
||||
- $formkit: color
|
||||
name: authorInfoColor
|
||||
label: 内容颜色
|
||||
placeholder: 请输入内容
|
||||
|
||||
- $formkit: repeater
|
||||
name: textarea
|
||||
label: 文本块
|
||||
min: 2
|
||||
max: 2
|
||||
help: 左边的一行10字 右面一行19字
|
||||
children:
|
||||
- $formkit: text
|
||||
name: tittle
|
||||
label: 文本块标题
|
||||
value: 座右铭
|
||||
- $formkit: text
|
||||
name: textarea_up
|
||||
label: 文本块(上)
|
||||
value: 生活原本沉闷，
|
||||
- $formkit: text
|
||||
name: textarea_down
|
||||
label: 文本块(下)
|
||||
value: 但跑起来就有风。
|
||||
|
||||
- $formkit: select
|
||||
name: personalities
|
||||
label: 人格
|
||||
help: 选择你的16人格
|
||||
value: infp
|
||||
options:
|
||||
- label: INFP
|
||||
value: infp
|
||||
- label: ENFP
|
||||
value: enfp
|
||||
- label: INFJ
|
||||
value: infj
|
||||
- label: ENFJ
|
||||
value: enfj
|
||||
- label: INTJ
|
||||
value: intj
|
||||
- label: ENTJ
|
||||
value: entj
|
||||
- label: INTP
|
||||
value: intp
|
||||
- label: ENTP
|
||||
value: entp
|
||||
- label: ISFP
|
||||
value: isfp
|
||||
- label: ESFP
|
||||
value: esfp
|
||||
- label: ISTP
|
||||
value: istp
|
||||
- label: ESTP
|
||||
value: estp
|
||||
- label: ISFJ
|
||||
value: isfj
|
||||
- label: ESFJ
|
||||
value: esfj
|
||||
- label: ISTJ
|
||||
value: istj
|
||||
- label: ESTJ
|
||||
value: estj
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
- group: style
|
||||
label: 样式（WIP）
|
||||
|
|
|
|||
|
|
@ -0,0 +1,884 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'about')}"
|
||||
xmlns:th="http://www.thymeleaf.org">
|
||||
|
||||
<th:block th:fragment="content">
|
||||
|
||||
<div class="page" id="body-wrap">
|
||||
|
||||
<!-- 头部导航栏 -->
|
||||
<header class="not-top-img" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
||||
</header>
|
||||
<main class="layout hide-aside" id="content-inner">
|
||||
<div id="page">
|
||||
|
||||
<div id="about-page">
|
||||
|
||||
|
||||
<div class="author-info">
|
||||
<div class="author-tag-left"
|
||||
th:if="${not #lists.isEmpty(theme.config.about.authorInfoLeftTags)}"
|
||||
th:with="authorTags = ${theme.config.about.authorInfoLeftTags}">
|
||||
<span class="author-tag" th:each="authorTag : ${authorTags}"
|
||||
th:text="${authorTag.tag}"></span>
|
||||
</div>
|
||||
<div class="author-img">
|
||||
<img th:src="@{${#strings.isEmpty(site.favicon) ? '/assets/images/hao-logo.jpg' : site.favicon}}">
|
||||
</div>
|
||||
<div class="author-tag-right"
|
||||
th:if="${not #lists.isEmpty(theme.config.about.authorInfoRightTags)}"
|
||||
th:with="authorTags = ${theme.config.about.authorInfoRightTags}">
|
||||
<span class="author-tag" th:each="authorTag : ${authorTags}"
|
||||
th:text="${authorTag.tag}"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="author-title">关于本站</div>
|
||||
|
||||
|
||||
<div class="author-content">
|
||||
<div class="author-content-item myInfoAndSayHello"
|
||||
th:utext="${theme.config.about.content}"></div>
|
||||
<div class="aboutsiteTips author-content-item" th:utext="${theme.config.about.idea}"></div>
|
||||
</div>
|
||||
<script>
|
||||
var pursuitInterval = null;
|
||||
pursuitInterval = setInterval(function () {
|
||||
const show = document.querySelector('span[data-show]')
|
||||
const next = show.nextElementSibling || document.querySelector('.first-tips')
|
||||
const up = document.querySelector('span[data-up]')
|
||||
if (up) {
|
||||
up.removeAttribute('data-up')
|
||||
}
|
||||
show.removeAttribute('data-show')
|
||||
show.setAttribute('data-up', '')
|
||||
next.setAttribute('data-show', '')
|
||||
}, 2000)
|
||||
|
||||
document.addEventListener('pjax:send', function () {
|
||||
clearInterval(pursuitInterval);
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="author-content">
|
||||
|
||||
<div class="author-content-item skills">
|
||||
<div class="card-content">
|
||||
<div class="author-content-item-tips">技能</div>
|
||||
<span class="author-content-item-title">开启创造力</span>
|
||||
<div class="skills-style-group">
|
||||
<div class="tags-group-all">
|
||||
<div class="tags-group-wrapper">
|
||||
<div class="tags-group-all">
|
||||
<!-- banners 使用默认值-->
|
||||
<div class="tags-group-wrapper"
|
||||
th:if="${#strings.equals(theme.config.top.bannersBackground, 'default')}">
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#989bf8">
|
||||
<img th:src="@{/assets/images/icons/AfterEffect.png}"
|
||||
title="AfterEffect">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#fff">
|
||||
<img th:src="@{/assets/images/icons/Sketch.png}"
|
||||
title="Sketch">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#57b6e6">
|
||||
<img th:src="@{/assets/images/icons/Docker.png}"
|
||||
title="Docker">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#4082c3">
|
||||
<img th:src="@{/assets/images/icons/Photoshop.png}"
|
||||
title="Photoshop">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#fff">
|
||||
<img th:src="@{/assets/images/icons/FinalCutPro.png}"
|
||||
title="FinalCutPro">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#fff">
|
||||
<img th:src="@{/assets/images/icons/Python.png}"
|
||||
title="Python">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#eb6840">
|
||||
<img th:src="@{/assets/images/icons/Swift.png}"
|
||||
title="Swift">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#8f55ba">
|
||||
<img th:src="@{/assets/images/icons/Principle.png}"
|
||||
title="Principle">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#f29e39">
|
||||
<img th:src="@{/assets/images/icons/illustrator.png}"
|
||||
title="illustrator">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#2c51db">
|
||||
<img th:src="@{/assets/images/icons/CSS3.png}" title="CSS3">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#f7cb4f">
|
||||
<img th:src="@{/assets/images/icons/JS.png}" title="JS">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#e9572b">
|
||||
<img th:src="@{/assets/images/icons/HTML.png}" title="HTML">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#df5b40">
|
||||
<img th:src="@{/assets/images/icons/Git.webp}" title="Git">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#e65164">
|
||||
<img th:src="@{/assets/images/icons/Apifox.webp}"
|
||||
title="Apifox">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#989bf8">
|
||||
<img th:src="@{/assets/images/icons/AfterEffect.png}"
|
||||
title="AfterEffect">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#fff">
|
||||
<img th:src="@{/assets/images/icons/Sketch.png}"
|
||||
title="Sketch">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#57b6e6">
|
||||
<img th:src="@{/assets/images/icons/Docker.png}"
|
||||
title="Docker">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#4082c3">
|
||||
<img th:src="@{/assets/images/icons/Photoshop.png}"
|
||||
title="Photoshop">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#fff">
|
||||
<img th:src="@{/assets/images/icons/FinalCutPro.png}"
|
||||
title="FinalCutPro">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#fff">
|
||||
<img th:src="@{/assets/images/icons/Python.png}"
|
||||
title="Python">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#eb6840">
|
||||
<img th:src="@{/assets/images/icons/Swift.png}"
|
||||
title="Swift">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#8f55ba">
|
||||
<img th:src="@{/assets/images/icons/Principle.png}"
|
||||
title="Principle">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#f29e39">
|
||||
<img th:src="@{/assets/images/icons/illustrator.png}"
|
||||
title="illustrator">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#2c51db">
|
||||
<img th:src="@{/assets/images/icons/CSS3.png}" title="CSS3">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#f7cb4f">
|
||||
<img th:src="@{/assets/images/icons/JS.png}" title="JS">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#e9572b">
|
||||
<img th:src="@{/assets/images/icons/HTML.png}" title="HTML">
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-group-icon-pair">
|
||||
<div class="tags-group-icon" style="background:#df5b40">
|
||||
<img th:src="@{/assets/images/icons/Git.webp}" title="Git">
|
||||
</div>
|
||||
<div class="tags-group-icon" style="background:#e65164">
|
||||
<img th:src="@{/assets/images/icons/Apifox.webp}"
|
||||
title="Apifox">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- banners 使用默认值-->
|
||||
<div class="tags-group-wrapper"
|
||||
th:if="${#strings.equals(theme.config.top.bannersBackground, 'techStack')}"
|
||||
th:with="techs = ${theme.config.about.techStack}">
|
||||
<th:block th:each="tech,iterStat : ${techs}">
|
||||
<div class="tags-group-icon-pair" th:if="${iterStat.odd}">
|
||||
<div class="tags-group-icon"
|
||||
th:style="'background:' + ${techOdd.background}"
|
||||
th:with="techOdd = ${techs.get(iterStat.index - 1)}">
|
||||
<img th:src="@{${techOdd.url}}"
|
||||
th:title="${techOdd.name}">
|
||||
</div>
|
||||
|
||||
<div class="tags-group-icon"
|
||||
th:style="'background:' + ${techEven.background}"
|
||||
th:with="techEven = ${tech}">
|
||||
<img th:src="@{${techEven.url}}"
|
||||
th:title="${techEven.name}">
|
||||
</div>
|
||||
</div>
|
||||
</th:block>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- banners 使用默认值-->
|
||||
<div class="skills-list"
|
||||
th:if="${#strings.equals(theme.config.top.bannersBackground, 'default')}"
|
||||
th:with="techs = ${theme.config.about.techStack}">
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#989bf8">
|
||||
<img th:src="@{/assets/images/icons/AfterEffect.png}"
|
||||
title="AfterEffect">
|
||||
</div>
|
||||
<div class="skill-name"><span>AfterEffect</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#ffffff">
|
||||
<img th:src="@{/assets/images/icons/Sketch.png}" title="Sketch">
|
||||
</div>
|
||||
<div class="skill-name"><span>Sketch</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#57b6e6">
|
||||
<img th:src="@{/assets/images/icons/Docker.png}" title="Docker">
|
||||
</div>
|
||||
<div class="skill-name"><span>Docker</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#4082c3">
|
||||
<img th:src="@{/assets/images/icons/Photoshop.png}" title="Photoshop">
|
||||
</div>
|
||||
<div class="skill-name"><span>Photoshop</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#ffffff">
|
||||
<img th:src="@{/assets/images/icons/FinalCutPro.png}"
|
||||
title="FinalCutPro">
|
||||
</div>
|
||||
<div class="skill-name"><span>FinalCutPro</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#ffffff">
|
||||
<img th:src="@{/assets/images/icons/Python.png}" title="Python">
|
||||
</div>
|
||||
<div class="skill-name"><span>Python</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#eb6840">
|
||||
<img th:src="@{/assets/images/icons/Swift.png}" title="Swift">
|
||||
</div>
|
||||
<div class="skill-name"><span>Swift</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#8f55ba">
|
||||
<img th:src="@{/assets/images/icons/Principle.png}" title="Principle">
|
||||
</div>
|
||||
<div class="skill-name"><span>Principle</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#f29e39">
|
||||
<img th:src="@{/assets/images/icons/illustrator.png}"
|
||||
title="illustrator">
|
||||
</div>
|
||||
<div class="skill-name"><span>illustrator</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#2c51db">
|
||||
<img th:src="@{/assets/images/icons/CSS3.png}" title="CSS3">
|
||||
</div>
|
||||
<div class="skill-name"><span>CSS3</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#f7cb4f">
|
||||
<img th:src="@{/assets/images/icons/JS.png}" title="JS">
|
||||
</div>
|
||||
<div class="skill-name"><span>JS</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#e9572b">
|
||||
<img th:src="@{/assets/images/icons/HTML.png}" title="HTML">
|
||||
</div>
|
||||
<div class="skill-name"><span>HTML</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#df5b40">
|
||||
<img th:src="@{/assets/images/icons/Git.webp}" title="Git">
|
||||
</div>
|
||||
<div class="skill-name"><span>Git</span></div>
|
||||
</div>
|
||||
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" style="background:#1f1f1f">
|
||||
<img th:src="@{/assets/images/icons/Apifox.webp}" title="Apifox">
|
||||
</div>
|
||||
<div class="skill-name"><span>Apifox</span></div>
|
||||
</div>
|
||||
|
||||
<div class="etc">...</div>
|
||||
</div>
|
||||
<div class="skills-list"
|
||||
th:if="${#strings.equals(theme.config.top.bannersBackground, 'techStack')}"
|
||||
th:with="techs = ${theme.config.about.techStack}">
|
||||
<th:block th:each="tech : ${techs}">
|
||||
<div class="skill-info">
|
||||
<div class="skill-icon" th:style="'background:' + ${tech.background}">
|
||||
<img th:src="@{${tech.url}}" th:title="${tech.name}">
|
||||
</div>
|
||||
<div class="skill-name"><span th:title="${tech.name}"></span></div>
|
||||
</div>
|
||||
</th:block>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="author-content-item careers">
|
||||
<div class="card-content">
|
||||
<div class="author-content-item-tips">生涯</div>
|
||||
<span class="author-content-item-title"
|
||||
th:text="${theme.config.about.authorCareersTitle}">无限进步</span>
|
||||
<div class="careers-group"
|
||||
th:if="${not #lists.isEmpty(theme.config.about.authorCareersTags)}"
|
||||
th:with="careersTags = ${theme.config.about.authorCareersTags}">
|
||||
<div class="careers-item" th:each="tag : ${careersTags}">
|
||||
<div class="circle" th:style="'background:' + ${tag.background}"></div>
|
||||
<div class="name" th:text="${tag.desc}"></div>
|
||||
</div>
|
||||
</div>
|
||||
<img alt="生涯" class="author-content-img"
|
||||
th:src="${#strings.isEmpty(theme.config.about.authorCareersBackground) ? '/assets/images/hao-logo.jpg' : theme.config.about.authorCareersBackground}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- personalities -->
|
||||
<div class="author-content">
|
||||
<div class="author-content-item personalities"
|
||||
th:with="personality = ${theme.config.about.personalities}">
|
||||
<div class="author-content-item-tips">性格</div>
|
||||
|
||||
<th:block th:if="${personality == 'infp'}">
|
||||
<span class="author-content-item-title">调停者</span>
|
||||
<div class="title2" style="color: #56a178;">INFP</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/infp.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/INFP-%E4%BA%BA%E6%A0%BC'}">调停者</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'intj'}">
|
||||
<span class="author-content-item-title">建筑师</span>
|
||||
<div class="title2" style="color: #56a178;">INTJ</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/intj.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/INTJ-%E4%BA%BA%E6%A0%BC'}">建筑师</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'intp'}">
|
||||
<span class="author-content-item-title">逻辑学家</span>
|
||||
<div class="title2" style="color: #56a178;">INTP</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/intp.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/INTP-%E4%BA%BA%E6%A0%BC'}">逻辑学家</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'entj'}">
|
||||
<span class="author-content-item-title">指挥官</span>
|
||||
<div class="title2" style="color: #56a178;">ENTJ</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/entj.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ENTJ-%E4%BA%BA%E6%A0%BC'}">指挥官</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'entp'}">
|
||||
<span class="author-content-item-title">辩论家</span>
|
||||
<div class="title2" style="color: #56a178;">ENTP</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/entp.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ENTP-%E4%BA%BA%E6%A0%BC'}">辩论家</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'enfj'}">
|
||||
<span class="author-content-item-title">主人公</span>
|
||||
<div class="title2" style="color: #56a178;">ENFJ</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/enfj.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ENFJ-%E4%BA%BA%E6%A0%BC'}">主人公</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'enfp'}">
|
||||
<span class="author-content-item-title">竞选者</span>
|
||||
<div class="title2" style="color: #56a178;">ENFP</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/enfp.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ENFP-%E4%BA%BA%E6%A0%BC'}">竞选者</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'estj'}">
|
||||
<span class="author-content-item-title">总经理</span>
|
||||
<div class="title2" style="color: #56a178;">ESTJ</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/estj.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ESTJ-%E4%BA%BA%E6%A0%BC'}">总经理</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'estp'}">
|
||||
<span class="author-content-item-title">企业家</span>
|
||||
<div class="title2" style="color: #56a178;">ESTP</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/estp.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ESTP-%E4%BA%BA%E6%A0%BC'}">企业家</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'esfj'}">
|
||||
<span class="author-content-item-title">执政官</span>
|
||||
<div class="title2" style="color: #56a178;">ESFJ</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/esfj.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ESFJ-%E4%BA%BA%E6%A0%BC'}">执政官</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'esfp'}">
|
||||
<span class="author-content-item-title">表演者</span>
|
||||
<div class="title2" style="color: #56a178;">ESFP</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/esfp.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ESFP-%E4%BA%BA%E6%A0%BC'}">表演者</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'infj'}">
|
||||
<span class="author-content-item-title">提倡者</span>
|
||||
<div class="title2" style="color: #56a178;">INFJ</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/infj.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/INFJ-%E4%BA%BA%E6%A0%BC'}">提倡者</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'istj'}">
|
||||
<span class="author-content-item-title">物流师</span>
|
||||
<div class="title2" style="color: #56a178;">ISTJ</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/istj.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ISTJ-%E4%BA%BA%E6%A0%BC'}">物流师</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'istp'}">
|
||||
<span class="author-content-item-title">鉴赏家</span>
|
||||
<div class="title2" style="color: #56a178;">ISTP</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/istp.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ISTP-%E4%BA%BA%E6%A0%BC'}">鉴赏家</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'isfj'}">
|
||||
<span class="author-content-item-title">守卫者</span>
|
||||
<div class="title2" style="color: #56a178;">ISFJ</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/isfj.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ISFJ-%E4%BA%BA%E6%A0%BC'}">守卫者</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${personality == 'isfp'}">
|
||||
<span class="author-content-item-title">探险家</span>
|
||||
<div class="title2" style="color: #56a178;">ISFP</div>
|
||||
<div class="image"><img src="/themes/theme-hao/assets/images/isfp.svg"
|
||||
style="transform: rotateY(180deg);"></div>
|
||||
<div class="post-tips">在 <a href="https://www.16personalities.com/"
|
||||
rel="noopener nofollow" target="_blank">16personalities</a>
|
||||
了解更多关于 <a
|
||||
rel="noopener external nofollow"
|
||||
target="_blank"
|
||||
th:href="@{'https://www.16personalities.com/ch/ISFP-%E4%BA%BA%E6%A0%BC'}">探险家</a>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
</div>
|
||||
<div class="author-content-item myphoto"><img alt="自拍" class="author-content-img"
|
||||
th:src="${theme.config.about.authorCareersPhoto}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- motto -->
|
||||
<div class="author-content" th:with="texts = ${theme.config.about.textarea}">
|
||||
<div class="author-content-item maxim">
|
||||
<div class="author-content-item-tips" th:text="${texts[0].tittle}">座右铭</div>
|
||||
<span class="maxim-title">
|
||||
<span style="opacity: 0.6;margin-bottom:8px;" th:text="${texts[0].textarea_up}">生活原本沉闷，</span>
|
||||
<span th:text="${texts[0].textarea_down}">但跑起来就有风。</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="author-content-item buff">
|
||||
<div class="card-content">
|
||||
<div class="author-content-item-tips" th:text="${texts[1].tittle}">特长</div>
|
||||
<span class="buff-title">
|
||||
<span style="opacity: 0.6;margin-bottom:8px;" th:text="${texts[1].textarea_up}">玄学流电脑疑难问题解决
|
||||
<span class="inline-word">专家</span>
|
||||
</span>
|
||||
<span th:text="${texts[1].textarea_down}">软件学习能力</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- hobbies -->
|
||||
<!-- <div class="author-content">-->
|
||||
<!-- <div class="author-content-item left-side">-->
|
||||
<!-- <img alt="" src="https://p.zhheo.com/2023788ba3b8739936f844e64f483faacaf1085602.png!cover">-->
|
||||
<!-- <div class="card-content">-->
|
||||
<!-- <div class="author-content-item-tips">英雄联盟</div>-->
|
||||
<!-- <span class="author-content-item-title"></span>-->
|
||||
<!-- <div class="content-bottom">-->
|
||||
<!-- <div class="tips"></div>-->
|
||||
<!-- <div class="tips"></div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="author-content-item right-side">-->
|
||||
<!-- <img alt="" src="https://p.zhheo.com/2023ff56a55649cf81989b9e1f4efc836907085102.png!cover">-->
|
||||
<!-- <div class="card-content">-->
|
||||
<!-- <div class="author-content-item-tips">狼人杀</div>-->
|
||||
<!-- <span class="author-content-item-title"></span>-->
|
||||
<!-- <div class="content-bottom">-->
|
||||
<!-- <div class="tips"></div>-->
|
||||
<!-- <div class="tips"></div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="author-content">-->
|
||||
|
||||
<!-- <div-->
|
||||
<!-- class="author-content-item like-technology"-->
|
||||
<!-- style="background: url(https://p.zhheo.com/2023e6940f5f56f0004af2705c3586d1fdf5190802.png!cover)">-->
|
||||
<!-- <div class="card-content">-->
|
||||
<!-- <div class="author-content-item-tips">关注偏好</div>-->
|
||||
<!-- <span class="author-content-item-title">数码科技</span>-->
|
||||
<!-- <div class="content-bottom">-->
|
||||
<!-- <div class="tips">手机、电脑软硬件</div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div-->
|
||||
<!-- class="author-content-item like-music"-->
|
||||
<!-- style="background: url(https://bu.dusays.com/2023/03/12/640dc6bed6d2d.jpg)">-->
|
||||
<!-- <div class="card-content">-->
|
||||
<!-- <div class="author-content-item-tips">音乐偏好</div>-->
|
||||
<!-- <span class="author-content-item-title">Hiphop、民谣、华语流行</span>-->
|
||||
<!-- <div class="content-bottom">-->
|
||||
<!-- <div class="tips"></div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- </div>-->
|
||||
|
||||
<div class="author-content">
|
||||
<div class="about-statistic author-content-item"
|
||||
style="background: url(https://bu.dusays.com/2023/03/12/640dc8c72f623.webp);">
|
||||
<div class="card-content">
|
||||
<div class="author-content-item-tips">数据</div>
|
||||
<span class="author-content-item-title">访问统计</span>
|
||||
<div id="statistic"></div>
|
||||
<div class="post-tips">统计信息来自 <a href="https://invite.51.la/1NzKqTeb?target=V6"
|
||||
rel="noopener nofollow"
|
||||
target="_blank">51la网站统计</a></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
fetch("https://v6-widget.51.la/v6/K0yfsHaZHpjPWap0/quote.js")
|
||||
.then(res => res.text())
|
||||
.then(data => {
|
||||
let title = ["最近活跃", "今日人数", "今日访问", "昨日人数", "昨日访问", "本月访问", "总访问量"];
|
||||
let num = data.match(/(<\/span><span>).*?(\/span><\/p>)/g);
|
||||
num = num.map(el => {
|
||||
let val = el.replace(/(<\/span><span>)/g, "");
|
||||
let str = val.replace(/(<\/span><\/p>)/g, "");
|
||||
return str;
|
||||
});
|
||||
let s = document.getElementById("statistic");
|
||||
let statistic = [];
|
||||
for (let i = 0; i < num.length; i++) {
|
||||
if (i == 0 || i == num.length - 1) continue;
|
||||
s.innerHTML += "<div><span>" + title[i] + "</span><span id=" + title[i] + ">" + num[i] + "</span></div>";
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<div class="author-content-item-group column mapAndInfo">
|
||||
<div class="author-content-item map single"
|
||||
th:style="'background:' + ${theme.config.about.authorInfoAddressBackground} ">
|
||||
<span class="map-title">我现在住在
|
||||
<b th:text="${theme.config.about.authorInfoAddress}"></b>
|
||||
</span>
|
||||
</div>
|
||||
<div class="author-content-item selfInfo single"
|
||||
th:if="${not #lists.isEmpty(theme.config.about.authorInfo)}"
|
||||
th:with="authorInfo = ${theme.config.about.authorInfo}">
|
||||
<div th:each="info : ${authorInfo}">
|
||||
<span class="selfInfo-title" th:text="${info.authorInfoTitle}"></span>
|
||||
<span class="selfInfo-content" th:style="'color:' + ${info.authorInfoColor} "
|
||||
th:text="${info.authorInfoContent}"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="author-content">
|
||||
<div class="create-site-post author-content-item single">
|
||||
<div class="author-content-item-tips">心路历程</div>
|
||||
<span class="author-content-item-title"
|
||||
th:text="${singlePage.spec.title}">为什么建站？</span>
|
||||
<p th:utext="${singlePage.content.content}"></p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="author-content">-->
|
||||
<!-- <div class="author-content-item single reward">-->
|
||||
<!-- <div class="author-content-item-tips">致谢</div>-->
|
||||
<!-- <span class="author-content-item-title">赞赏名单</span>-->
|
||||
<!-- <div class="author-content-item-description">-->
|
||||
<!-- 感谢赞赏的人，因为你们，让我感受到写博客这件事情能够给你们创造了价值。这会让我在这条路上走得更远。-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="reward-list-all">-->
|
||||
|
||||
<!-- <div class="reward-list-item">-->
|
||||
<!-- <div class="reward-list-item-name">思宁</div>-->
|
||||
<!-- <div class="reward-list-bottom-group">-->
|
||||
<!-- <div class="reward-list-item-money">¥ 1</div>-->
|
||||
<!-- <time class="datatime reward-list-item-time"-->
|
||||
<!-- datetime="2021-05-06T08:00:00+08:00"></time>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="reward-list-item">-->
|
||||
<!-- <div class="reward-list-item-name">小屁卡</div>-->
|
||||
<!-- <div class="reward-list-bottom-group">-->
|
||||
<!-- <div class="reward-list-item-money">¥ 3</div>-->
|
||||
<!-- <time class="datatime reward-list-item-time"-->
|
||||
<!-- datetime="2021-04-20T08:00:00+08:00"></time>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="reward-list-item">-->
|
||||
<!-- <div class="reward-list-item-name">Adil</div>-->
|
||||
<!-- <div class="reward-list-bottom-group">-->
|
||||
<!-- <div class="reward-list-item-money" style="background: var(--heo-vip);">¥ 50-->
|
||||
<!-- </div>-->
|
||||
<!-- <time class="datatime reward-list-item-time"-->
|
||||
<!-- datetime="2021-03-25T08:00:00+08:00"></time>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="reward-list-item">-->
|
||||
<!-- <div class="reward-list-item-name">ғᴏᴜʀʏ</div>-->
|
||||
<!-- <div class="reward-list-bottom-group">-->
|
||||
<!-- <div class="reward-list-item-money">¥ 1</div>-->
|
||||
<!-- <time class="datatime reward-list-item-time"-->
|
||||
<!-- datetime="2021-03-13T08:00:00+08:00"></time>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="reward-list-item">-->
|
||||
<!-- <div class="reward-list-item-name">**才</div>-->
|
||||
<!-- <div class="reward-list-bottom-group">-->
|
||||
<!-- <div class="reward-list-item-money">¥ 2</div>-->
|
||||
<!-- <time class="datatime reward-list-item-time"-->
|
||||
<!-- datetime="2021-02-17T08:00:00+08:00"></time>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="reward-list-item">-->
|
||||
<!-- <div class="reward-list-item-name">ZEvan</div>-->
|
||||
<!-- <div class="reward-list-bottom-group">-->
|
||||
<!-- <div class="reward-list-item-money">¥ 1</div>-->
|
||||
<!-- <time class="datatime reward-list-item-time"-->
|
||||
<!-- datetime="2021-01-11T08:00:00+08:00"></time>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <div class="post-reward">-->
|
||||
<!-- <div class="post-reward" onclick="AddRewardMask()"></div>-->
|
||||
<!-- <div class="reward-button" title="赞赏作者"><i-->
|
||||
<!-- class="heofont icon-hand-heart-fill"></i>-->
|
||||
<!-- 打赏作者-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="reward-main">-->
|
||||
<!-- <ul class="reward-all">-->
|
||||
<!-- <span class="reward-title">感谢你赐予我前进的力量</span>-->
|
||||
<!-- <ul class="reward-group">-->
|
||||
|
||||
|
||||
<!-- <li class="reward-item">-->
|
||||
<!-- <a href="" target="_blank">-->
|
||||
<!-- <img alt="微信" class="post-qr-code-img" src="">-->
|
||||
<!-- </a>-->
|
||||
<!-- <div class="post-qr-code-desc">-->
|
||||
<!-- 微信-->
|
||||
<!-- </div>-->
|
||||
<!-- </li>-->
|
||||
|
||||
<!-- <li class="reward-item">-->
|
||||
<!-- <a href="" target="_blank">-->
|
||||
<!-- <img alt="支付宝" class="post-qr-code-img" src="">-->
|
||||
<!-- </a>-->
|
||||
<!-- <div class="post-qr-code-desc">-->
|
||||
<!-- 支付宝-->
|
||||
<!-- </div>-->
|
||||
<!-- </li>-->
|
||||
|
||||
<!-- </ul>-->
|
||||
<!-- </ul>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 评论模块 -->
|
||||
<div id="post-comment"
|
||||
th:if="${pluginFinder.available('PluginCommentWidget') and singlePage.spec.allowComment}">
|
||||
<div class="comment-head">
|
||||
<div class="comment-headline"><i class="iconfont icon-comment-alt"></i> <span>评论</span></div>
|
||||
<div class="comment-privacy"><a href="#">隐私政策</a></div>
|
||||
<div class="comment-tips" id="comment-tips">
|
||||
<span>你无需删除空行，直接评论以获取最佳展示效果</span>
|
||||
</div>
|
||||
</div>
|
||||
<halo:comment colorScheme="document.documentElement.getAttribute('data-theme')"
|
||||
group="content.halo.run"
|
||||
kind="SinglePage"
|
||||
th:attr="name=${singlePage.metadata.name}"/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 侧栏 -->
|
||||
<div th:replace="~{modules/aside :: aside(${theme.config.sidebar.pageWidgets})}"></div>
|
||||
|
||||
</main>
|
||||
<!-- 底部 -->
|
||||
<footer th:replace="~{modules/footer :: footer}"></footer>
|
||||
</div>
|
||||
|
||||
</th:block>
|
||||
|
||||
</html>
|
||||
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
<div class="page" id="body-wrap">
|
||||
<header class="not-top-img" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav}"></nav>
|
||||
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
||||
</header>
|
||||
<main class="layout" id="content-inner">
|
||||
<!-- archive -->
|
||||
|
|
|
|||
|
|
@ -0,0 +1,559 @@
|
|||
@media screen and (min-width: 900px) {
|
||||
#page-header #nav a:hover .heoicon {
|
||||
transition: .3s;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
#sidebar-menus .menus_item .not-child {
|
||||
padding: 4px 8px !important;
|
||||
width: 100%;
|
||||
background: var(--heo-card-bg);
|
||||
border-radius: 8px;
|
||||
border: var(--style-border-always);
|
||||
align-items: center;
|
||||
font-size: 14px !important;
|
||||
margin: 10px 0;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#sidebar-menus .menus_item .not-child span {
|
||||
color: var(--heo-fontcolor) !important;
|
||||
}
|
||||
|
||||
.meta-secondline > span {
|
||||
opacity: .6;
|
||||
transition: .3s;
|
||||
margin-right: 1.1rem;
|
||||
}
|
||||
|
||||
#category #category-bar {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
/* 侧公众号卡片 */
|
||||
#flip-wrapper .left {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
line-height: 1.3;
|
||||
color: white;
|
||||
}
|
||||
|
||||
#flip-wrapper .left .title {
|
||||
font-size: 1.35rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
#flip-wrapper .left .desc {
|
||||
font-size: small;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
#article-container .highlight-tools {
|
||||
position: relative;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
min-height: 1.2rem;
|
||||
height: 2.15em;
|
||||
background: var(--heo-secondbg);
|
||||
border-bottom: var(--style-border-always);
|
||||
color: var(--heo-fontcolor);
|
||||
font-size: var(--global-font-size);
|
||||
}
|
||||
|
||||
#article-container .highlight-tools .copy-button {
|
||||
position: absolute;
|
||||
right: 0.7rem;
|
||||
cursor: pointer;
|
||||
transition: color .2s;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#article-container .highlight-tools .code-lang {
|
||||
position: absolute;
|
||||
font-weight: 700;
|
||||
font-size: 1.15em;
|
||||
user-select: none;
|
||||
left: 0.6rem;
|
||||
}
|
||||
|
||||
#article-container .code-expand-btn.expand-done {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
||||
#article-container .bilibili_box {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
background: var(--heo-card-bg);
|
||||
border: var(--style-border-always);
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
color: var(--heo-fontcolor) !important;
|
||||
text-decoration: none !important;
|
||||
-webkit-transition: .3s;
|
||||
-moz-transition: .3s;
|
||||
-o-transition: .3s;
|
||||
-ms-transition: .3s;
|
||||
transition: .3s
|
||||
}
|
||||
|
||||
#article-container .bilibili_box:hover {
|
||||
border-color: var(--heo-theme)
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
#article-container .bilibili_box {
|
||||
-webkit-box-orient: vertical;
|
||||
-moz-box-orient: vertical;
|
||||
-o-box-orient: vertical;
|
||||
-webkit-flex-direction: column;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column
|
||||
}
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_cover {
|
||||
width: 200px;
|
||||
position: relative
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
#article-container .bilibili_box .bilibili_cover {
|
||||
width: 100%
|
||||
}
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_cover img {
|
||||
width: 100%;
|
||||
filter: none;
|
||||
margin: 0 !important;
|
||||
border-radius: 0 !important
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_cover .play_icon {
|
||||
position: absolute;
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
opacity: .8;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
-moz-transform: translate(-50%, -50%);
|
||||
-o-transform: translate(-50%, -50%);
|
||||
-ms-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%)
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_cover span {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 5px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_info {
|
||||
padding: 10px 10px 10px 18px;
|
||||
width: calc(100% - 200px);
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-orient: vertical;
|
||||
-moz-box-orient: vertical;
|
||||
-o-box-orient: vertical;
|
||||
-webkit-flex-direction: column;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-box-pack: distribute;
|
||||
-moz-box-pack: distribute;
|
||||
-o-box-pack: distribute;
|
||||
-ms-flex-pack: distribute;
|
||||
-webkit-justify-content: space-around;
|
||||
justify-content: space-around
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
#article-container .bilibili_box .bilibili_info {
|
||||
width: 100%;
|
||||
padding-bottom: 25px
|
||||
}
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_info .title {
|
||||
font-size: 1.2rem;
|
||||
font-weight: 700;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
-o-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 1.7
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_info .stat {
|
||||
font-size: 15px
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_info .stat svg {
|
||||
margin-right: 3px;
|
||||
font-size: 18px;
|
||||
vertical-align: -0.15em;
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_info .stat svg path {
|
||||
fill: #99a9bf
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_info .stat span {
|
||||
margin-right: 10px
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_info .owner {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-moz-box-align: center;
|
||||
-o-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
line-height: 1;
|
||||
font-size: 15px;
|
||||
margin-top: 3px
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_info .owner .tip {
|
||||
color: #f69;
|
||||
border: 1px solid;
|
||||
padding: 4px 7px;
|
||||
font-size: 13px;
|
||||
border-radius: 5px;
|
||||
margin-right: 10px
|
||||
}
|
||||
|
||||
#article-container .bilibili_box .bilibili_info .owner img {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 50% !important;
|
||||
object-fit: cover;
|
||||
margin: 0 5px 0 0 !important
|
||||
}
|
||||
|
||||
[data-theme=dark] #article-container .bilibili_box .bilibili_cover, [data-theme=light] #article-container .bilibili_box .bilibili_info .stat svg {
|
||||
opacity: .8
|
||||
}
|
||||
|
||||
/* 配置相册界面album的CSS */
|
||||
/* 相册顶部那一坨 */
|
||||
.author-content.author-content-item.album {
|
||||
height: 19rem;
|
||||
color: var(--heo-white);
|
||||
overflow: hidden;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/* 移动端那一坨 */
|
||||
@media screen and (max-width: 768px) {
|
||||
.author-content.author-content-item.album {
|
||||
height: 9rem;
|
||||
}
|
||||
}
|
||||
|
||||
#album .card-album {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-around;
|
||||
margin: var(--album-spacing-xxl) 0 0;
|
||||
}
|
||||
|
||||
#album .card-album .album-content-nocover {
|
||||
width: calc(100% / 4 - 40px);
|
||||
}
|
||||
|
||||
#album .card-album .card {
|
||||
list-style: none;
|
||||
position: relative;
|
||||
display: flex;
|
||||
width: calc(100% / 4 - 10px);
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#album .card-album .card:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#album .card_cover {
|
||||
border-radius: var(--album-spacing-l);
|
||||
filter: brightness(0.75) saturate(1.2) contrast(0.85);
|
||||
transform-origin: center;
|
||||
transform: scale(1) translateZ(0);
|
||||
transition: filter 200ms linear, transform 200ms linear;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
height: 550px;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
object-fit: cover;
|
||||
border-radius: var(--album-spacing-l);
|
||||
}
|
||||
|
||||
#album .card:hover .card_cover {
|
||||
transform: scale(1.05) translateZ(0);
|
||||
filter: brightness(0.9) saturate(1.2) contrast(1);
|
||||
}
|
||||
|
||||
#album .card-album:hover > .card:not(:hover) .card_cover {
|
||||
filter: brightness(0.5) saturate(0.9) contrast(1.2) blur(20px);
|
||||
}
|
||||
|
||||
#album .card__content {
|
||||
left: 0;
|
||||
padding: var(--album-spacing-l);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
#album .card__category {
|
||||
color: var(--album-text-light);
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: var(--album-spacing-s);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
#album .card__heading {
|
||||
color: var(--album-text-lighter);
|
||||
font-size: 1.9rem;
|
||||
text-shadow: 2px 2px 20px rgba(0, 0, 0, 0.2);
|
||||
line-height: 1.4;
|
||||
word-spacing: 100vw;
|
||||
}
|
||||
|
||||
@media (min-width: 1300px) {
|
||||
#album img.card_cover {
|
||||
height: 600px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 960px) {
|
||||
#album .card-album .card {
|
||||
width: calc(100% / 2 - 40px);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 540px) {
|
||||
#album .card-album .card {
|
||||
width: calc(100%);
|
||||
}
|
||||
}
|
||||
|
||||
/* 配置相册界面album_detail的CSS */
|
||||
/* 处理页面样式 */
|
||||
#album_detail .album-container-img {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
|
||||
#album_detail .album-container-img .album-content-noimg {
|
||||
width: calc(100% / 2 - 5px);
|
||||
}
|
||||
|
||||
#album_detail .album-content-img img {
|
||||
object-fit: cover;
|
||||
max-width: 100%;
|
||||
border-radius: 12px;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
#album_detail .album-content-img {
|
||||
height: 100%;
|
||||
max-height: 300px;
|
||||
border-radius: 12px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#album_detail .album-content .datacont {
|
||||
order: 0;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
color: var(--heo-fontcolor);
|
||||
width: 100%;
|
||||
line-height: 1.38;
|
||||
border-radius: 12px;
|
||||
margin-bottom: 0.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
#album_detail p {
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
#album_detail div.album-content {
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
border-radius: 12px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#album_detail .timeline ul li.album-item {
|
||||
position: relative;
|
||||
width: 32%;
|
||||
border: var(--style-border-always);
|
||||
border-radius: 12px;
|
||||
padding: 1rem 1rem 0.5rem;
|
||||
transition: all 0.3s ease 0s;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
background: var(--heo-card-bg);
|
||||
box-shadow: var(--heo-shadow-border);
|
||||
margin-right: 2%;
|
||||
}
|
||||
|
||||
#album_detail .timeline #waterfall.show {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#album_detail .timeline #waterfall {
|
||||
opacity: 0;
|
||||
transition: all 0.3s ease 0s;
|
||||
}
|
||||
|
||||
#album_detail ul.list {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#album_detail {
|
||||
margin-top: 1rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#album_detail > section > ul > li.album-item {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
#album-tips {
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
#album_detail .timeline ul li.album-item hr {
|
||||
display: flex;
|
||||
position: relative;
|
||||
margin: 8px 0px;
|
||||
border: 1px dashed var(--heo-theme-op);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#album_detail .album-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#album_detail > section > ul > li > div .album-info-time,
|
||||
#album_detail > section > ul > li > div .album-info-address,
|
||||
#album_detail > section > ul > li > div .album-info-from {
|
||||
color: var(--heo-fontcolor);
|
||||
font-size: 0.7rem;
|
||||
background-color: var(--heo-gray-op);
|
||||
padding: 0px 8px;
|
||||
border-radius: 20px;
|
||||
cursor: default;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#album_detail > section > ul > li > div .album-info-address,
|
||||
#album_detail > section > ul > li > div .album-info-from {
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
#album_detail > section > ul > li > div .album-info-address span,
|
||||
#album_detail > section > ul > li > div .album-info-from span {
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
#album_detail .album-info .fa-brands.fa-instagram {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
#album_detail .album-bottom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
#album_detail .album-bottom .album-reply {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#album_detail .timeline ul li.album-item:hover {
|
||||
border: var(--style-border-hover);
|
||||
}
|
||||
|
||||
#album_detail .album-content-link {
|
||||
display: flex;
|
||||
margin-left: 0.5rem;
|
||||
font-size: 0.7rem;
|
||||
align-items: center;
|
||||
background-color: rgba(245, 108, 108, 0.13);
|
||||
color: rgb(245, 108, 108);
|
||||
padding: 0px 8px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
#album_detail .album-content-link i {
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
#album_detail .album-content-link:hover {
|
||||
background-color: var(--heo-main);
|
||||
color: var(--heo-white);
|
||||
}
|
||||
|
||||
body[data-type="album_detail"] #page .author-content-item .card-content .banner-button-group .banner-button:hover {
|
||||
color: var(--heo-white);
|
||||
border-radius: 20px !important;
|
||||
}
|
||||
|
||||
/* 响应式 */
|
||||
@media screen and (max-width: 1300px) {
|
||||
#album_detail .timeline ul li.album-item {
|
||||
width: 49%;
|
||||
margin-right: 1%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
#album_detail .timeline ul li.album-item {
|
||||
width: 100%;
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,182 @@
|
|||
@charset "UTF-8";
|
||||
|
||||
:root {
|
||||
--heo-white: #fff;
|
||||
--heo-white-op: rgba(255, 255, 255, 0.2);
|
||||
--heo-black: #000;
|
||||
--heo-black-op: rgba(0, 0, 0, 0.2);
|
||||
--heo-none: #00000000;
|
||||
--heo-gray: #999999;
|
||||
--heo-gray-op: #9999992b;
|
||||
--heo-vip: #e5a80d;
|
||||
--heo-main: var(--heo-theme);
|
||||
--heo-main-op: var(--heo-theme-op);
|
||||
--heo-main-op-deep: var(--heo-theme-op-deep);
|
||||
--heo-main-none: var(--heo-theme-none);
|
||||
--heo-shadow-theme: 0 8px 12px -3px var(--heo-theme-op);
|
||||
--heo-shadow-blackdeep: 0 2px 16px -3px rgba(0, 0, 0, .15);
|
||||
--heo-shadow-main: 0 8px 12px -3px var(--heo-main-op);
|
||||
--heo-shadow-blue: 0 8px 12px -3px rgba(40, 109, 234, .20);
|
||||
--heo-shadow-white: 0 8px 12px -3px rgba(255, 255, 255, .20);
|
||||
--heo-shadow-black: 0 0 12px 4px rgba(0, 0, 0, .05);
|
||||
--heo-shadow-yellow: 0px 38px 77px -26px rgba(255, 201, 62, .12);
|
||||
--heo-shadow-red: 0 8px 12px -3px #ee7d7936;
|
||||
--heo-shadow-green: 0 8px 12px -3px #87ee7936;
|
||||
--heo-logo-color: linear-gradient(215deg, #4584ff 0%, #cf0db9 100%);
|
||||
--heo-snackbar-time: 5s;
|
||||
--hl-color: #eff;
|
||||
--hl-bg: #212121;
|
||||
--hltools-bg: #1c1c1c;
|
||||
--hltools-color: rgba(238, 255, 255, 0.8);
|
||||
--hlnumber-bg: #212121;
|
||||
--hlnumber-color: rgba(238, 255, 255, 0.5);
|
||||
--hlscrollbar-bg: #121212;
|
||||
--hlexpand-bg: linear-gradient(180deg, rgba(33, 33, 33, 0.6), rgba(33, 33, 33, 0.9));
|
||||
/* 相册变量定义 */
|
||||
--album-background-dark: #2d3548;
|
||||
--album-text-light: rgba(255, 255, 255, 0.6);
|
||||
--album-text-lighter: rgba(255, 255, 255, 0.9);
|
||||
--album-spacing-s: 8px;
|
||||
--album-spacing-m: 16px;
|
||||
--album-spacing-l: 24px;
|
||||
--album-spacing-xl: 32px;
|
||||
--album-spacing-xxl: 64px;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: var(--heo-fontcolor);
|
||||
color: var(--heo-background);
|
||||
}
|
||||
|
||||
[data-theme=light] {
|
||||
--heo-theme: #425AEF;
|
||||
--heo-theme-op: #4259ef23;
|
||||
--heo-theme-op-deep: #4259efdd;
|
||||
--heo-theme-none: #4259ef01;
|
||||
--heo-blue: #425AEF;
|
||||
--heo-red: #f04a63;
|
||||
--heo-pink: #FF7C7C;
|
||||
--heo-green: #57bd6a;
|
||||
--heo-yellow: #c28b00;
|
||||
--heo-yellow-op: #d99c001a;
|
||||
--heo-orange: #e38100;
|
||||
--heo-fontcolor: #363636;
|
||||
--heo-background: #f7f9fe;
|
||||
--heo-reverse: #000;
|
||||
--heo-maskbg: rgba(255, 255, 255, 0.6);
|
||||
--heo-maskbgdeep: rgba(255, 255, 255, 0.85);
|
||||
--heo-hovertext: var(--heo-main);
|
||||
--heo-ahoverbg: #F7F7FA;
|
||||
--heo-lighttext: var(--heo-main);
|
||||
--heo-secondtext: rgba(60, 60, 67, 0.6);
|
||||
--heo-scrollbar: rgba(60, 60, 67, 0.4);
|
||||
--heo-card-btn-bg: #edf0f7;
|
||||
--heo-post-blockquote-bg: #fafcff;
|
||||
--heo-post-tabs-bg: #f2f5f8;
|
||||
--heo-secondbg: #f1f3f8;
|
||||
--heo-shadow-nav: 0 5px 12px -5px rgba(102, 68, 68, 0.05);
|
||||
--heo-card-bg: #fff;
|
||||
--heo-card-bg-op: var(--heo-black-op);
|
||||
--heo-card-bg-none: rgba(255, 255, 255, 0);
|
||||
--heo-shadow-lightblack: 0 5px 12px -5px rgba(102, 68, 68, 0.00);
|
||||
--heo-shadow-light2black: 0 5px 12px -5px rgba(102, 68, 68, 0.00);
|
||||
--heo-card-border: #e3e8f7;
|
||||
--heo-shadow-border: 0 8px 16px -4px #2c2d300c;
|
||||
--style-border: 1px solid var(--heo-card-border);
|
||||
--style-border-always: 1px solid var(--heo-card-border);
|
||||
--style-border-hover: 1px solid var(--heo-main);
|
||||
--style-border-hover-always: 1px solid var(--heo-main);
|
||||
--style-border-dashed: 1px dashed var(--heo-theme-op);
|
||||
--style-border-forever: 2px solid var(--heo-main);
|
||||
}
|
||||
|
||||
[data-theme=dark] {
|
||||
--heo-theme: #f2b94b;
|
||||
--heo-theme-op: #f2b94b23;
|
||||
--heo-theme-op-deep: #f2b94bdd;
|
||||
--heo-theme-none: #f2b94b00;
|
||||
--heo-blue: #0084FF;
|
||||
--heo-red: #FF3842;
|
||||
--heo-pink: #d44040;
|
||||
--heo-green: #3e9f50;
|
||||
--heo-yellow: #ffc93e;
|
||||
--heo-yellow-op: #ffc93e30;
|
||||
--heo-orange: #ff953e;
|
||||
--heo-fontcolor: #F7F7FA;
|
||||
--heo-background: #18171d;
|
||||
--heo-reverse: #fff;
|
||||
--heo-maskbg: rgba(0, 0, 0, 0.6);
|
||||
--heo-maskbgdeep: rgba(0, 0, 0, 0.85);
|
||||
--heo-hovertext: #0A84FF;
|
||||
--heo-ahoverbg: #fff;
|
||||
--heo-lighttext: var(--heo-theme);
|
||||
--heo-secondtext: #a1a2b8;
|
||||
--heo-scrollbar: rgba(200, 200, 223, 0.4);
|
||||
--heo-card-btn-bg: #30343f;
|
||||
--heo-post-blockquote-bg: #000;
|
||||
--heo-post-tabs-bg: #121212;
|
||||
--heo-secondbg: #30343f;
|
||||
--heo-shadow-nav: 0 5px 20px 0px rgba(28, 28, 28, 0.4);
|
||||
--heo-card-bg: #1d1e22;
|
||||
--heo-card-bg-op: var(--heo-white-op);
|
||||
--heo-card-bg-none: #1d1b2600;
|
||||
--heo-shadow-lightblack: 0 5px 12px -5px rgba(102, 68, 68, 0.0);
|
||||
--heo-shadow-light2black: 0 5px 12px -5px rgba(102, 68, 68, 0.0);
|
||||
--heo-card-border: #3d3d3f;
|
||||
--heo-shadow-border: 0 8px 16px -4px #00000050;
|
||||
--style-border: 1px solid var(--heo-card-border);
|
||||
--style-border-always: 1px solid var(--heo-card-border);
|
||||
--style-border-hover: 1px solid var(--heo-theme);
|
||||
--style-border-hover-always: 1px solid var(--heo-theme);
|
||||
--style-border-dashed: 1px dashed var(--heo-theme-op);
|
||||
--style-border-forever: 2px solid var(--heo-lighttext);
|
||||
}
|
||||
|
||||
[data-theme="dark"] #footer::before, [data-theme="dark"] #page-header::before, [data-theme="dark"] #web_bg::before {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.4);
|
||||
content: "";
|
||||
}
|
||||
|
||||
[data-theme="dark"] #article-container pre > code {
|
||||
background: rgb(23, 23, 23);
|
||||
}
|
||||
|
||||
[data-theme="dark"] #article-container figure.highlight {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
[data-theme="dark"] #article-container .note code {
|
||||
background: rgba(27, 31, 35, 0.05);
|
||||
}
|
||||
|
||||
[data-theme="dark"] #article-container .aplayer {
|
||||
filter: brightness(0.8);
|
||||
}
|
||||
|
||||
[data-theme="dark"] #article-container kbd {
|
||||
border-color: rgb(105, 105, 105);
|
||||
background-color: rgb(82, 82, 82);
|
||||
color: rgb(226, 241, 255);
|
||||
}
|
||||
|
||||
[data-theme="dark"] .note {
|
||||
filter: brightness(0.9);
|
||||
}
|
||||
|
||||
[data-theme="dark"] img {
|
||||
filter: brightness(0.8);
|
||||
}
|
||||
|
||||
[data-theme="dark"] #aside-content .aside-list > .aside-list-item:not(:last-child) {
|
||||
border-bottom: 1px dashed rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
:root {
|
||||
--style-border: 0px solid var(--heo-card-border);
|
||||
--style-border-hover: 0px solid var(--heo-main);
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 6.3 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 6.6 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 6.4 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 5.4 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.0 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.8 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.1 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 512 B |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.5 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.7 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.2 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.5 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 5.1 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 9.3 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 7.6 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 8.9 KiB |
|
|
@ -0,0 +1,146 @@
|
|||
function coverColor() {
|
||||
var path = document.getElementById("post-cover")?.src;
|
||||
if (path !== undefined) {
|
||||
var img = new Image();
|
||||
img.crossOrigin = "Anonymous";
|
||||
img.src = path;
|
||||
img.onload = function () {
|
||||
var canvas = document.createElement("canvas");
|
||||
canvas.width = this.width;
|
||||
canvas.height = this.height;
|
||||
var ctx = canvas.getContext("2d");
|
||||
ctx.drawImage(this, 0, 0);
|
||||
var data = ctx.getImageData(0, 0, this.width, this.height).data;
|
||||
var r = 0, g = 0, b = 0;
|
||||
var step = 5;
|
||||
for (var i = 0; i < data.length; i += 4 * step) {
|
||||
r += data[i];
|
||||
g += data[i + 1];
|
||||
b += data[i + 2];
|
||||
}
|
||||
r = Math.floor(r / (data.length / 4 / step));
|
||||
g = Math.floor(g / (data.length / 4 / step));
|
||||
b = Math.floor(b / (data.length / 4 / step));
|
||||
var value = "#" + r.toString(16) + g.toString(16) + b.toString(16);
|
||||
if (getContrastYIQ(value) == "light") {
|
||||
value = LightenDarkenColor(colorHex(value), -50)
|
||||
}
|
||||
|
||||
document.documentElement.style.setProperty('--heo-main', value);
|
||||
document.documentElement.style.setProperty('--heo-main-op', value + '23');
|
||||
document.documentElement.style.setProperty('--heo-main-op-deep', value + 'dd');
|
||||
document.documentElement.style.setProperty('--heo-main-none', value + '00');
|
||||
initThemeColor()
|
||||
document.getElementById("coverdiv").classList.add("loaded");
|
||||
}
|
||||
} else {
|
||||
document.documentElement.style.setProperty('--heo-main', 'var(--heo-theme)');
|
||||
document.documentElement.style.setProperty('--heo-main-op', 'var(--heo-theme-op)');
|
||||
document.documentElement.style.setProperty('--heo-main-op-deep', 'var(--heo-theme-op-deep)');
|
||||
document.documentElement.style.setProperty('--heo-main-none', 'var(--heo-theme-none)');
|
||||
initThemeColor()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function colorHex(colorString) {
|
||||
const hexRegex = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
|
||||
let color = colorString;
|
||||
|
||||
if (/^(rgb|RGB)/.test(color)) {
|
||||
const colorArr = color.replace(/(?:\(|\)|rgb|RGB)*/g, "").split(",");
|
||||
const hexArr = colorArr.map(c => {
|
||||
const hex = Number(c).toString(16);
|
||||
return hex.length === 1 ? "0" + hex : hex;
|
||||
});
|
||||
return "#" + hexArr.join("");
|
||||
} else if (hexRegex.test(color)) {
|
||||
const hexDigits = color.replace(/#/, "").split("");
|
||||
if (hexDigits.length === 6) {
|
||||
return color;
|
||||
} else if (hexDigits.length === 3) {
|
||||
const hexArr = hexDigits.map(c => c + c);
|
||||
return "#" + hexArr.join("");
|
||||
}
|
||||
}
|
||||
return color;
|
||||
}
|
||||
|
||||
|
||||
function colorRgb(str) {
|
||||
const HEX_SHORT_REGEX = /^#([0-9a-fA-f]{3})$/;
|
||||
const HEX_LONG_REGEX = /^#([0-9a-fA-f]{6})$/;
|
||||
const HEX_SHORT_LENGTH = 4;
|
||||
|
||||
const sColor = str.toLowerCase();
|
||||
let hexValue = "";
|
||||
|
||||
if (sColor && (HEX_SHORT_REGEX.test(sColor) || HEX_LONG_REGEX.test(sColor))) {
|
||||
hexValue = sColor.length === HEX_SHORT_LENGTH ?
|
||||
sColor.replace(/^#(.)/g, "#$1$1") :
|
||||
sColor;
|
||||
|
||||
const rgbValue = hexValue.slice(1)
|
||||
.match(/.{2}/g)
|
||||
.map(val => parseInt(val, 16))
|
||||
.join(",");
|
||||
|
||||
return `rgb(${rgbValue})`;
|
||||
} else {
|
||||
return sColor;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function LightenDarkenColor(col, amt) {
|
||||
let usePound = false;
|
||||
|
||||
if (col[0] === "#") {
|
||||
col = col.slice(1);
|
||||
usePound = true;
|
||||
}
|
||||
|
||||
const num = parseInt(col, 16);
|
||||
const r = Math.min(255, Math.max(0, (num >> 16) + amt));
|
||||
const b = Math.min(255, Math.max(0, ((num >> 8) & 0xff) + amt));
|
||||
const g = Math.min(255, Math.max(0, (num & 0xff) + amt));
|
||||
|
||||
return `${usePound ? "#" : ""}${(g | (b << 8) | (r << 16)).toString(16).padStart(6, "0")}`;
|
||||
}
|
||||
|
||||
|
||||
function getContrastYIQ(hexcolor) {
|
||||
var colorrgb = colorRgb(hexcolor);
|
||||
var colors = colorrgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
|
||||
var red = colors[1];
|
||||
var green = colors[2];
|
||||
var blue = colors[3];
|
||||
var brightness;
|
||||
brightness = (red * 299) + (green * 587) + (blue * 114);
|
||||
brightness = brightness / 255000;
|
||||
if (brightness >= 0.5) {
|
||||
return "light";
|
||||
} else {
|
||||
return "dark";
|
||||
}
|
||||
}
|
||||
|
||||
function initThemeColor() {
|
||||
const currentTop = window.scrollY || document.documentElement.scrollTop;
|
||||
let themeColor;
|
||||
if (currentTop > 0) {
|
||||
themeColor = getComputedStyle(document.documentElement).getPropertyValue('--heo-card-bg');
|
||||
} else if (PAGECONFIG.is_post) {
|
||||
themeColor = getComputedStyle(document.documentElement).getPropertyValue('--heo-main');
|
||||
} else {
|
||||
themeColor = getComputedStyle(document.documentElement).getPropertyValue('--heo-background');
|
||||
}
|
||||
changeThemeColor(themeColor);
|
||||
}
|
||||
|
||||
function changeThemeColor(color) {
|
||||
const meta = document.querySelector('meta[name="theme-color"]');
|
||||
if (meta) {
|
||||
meta.setAttribute('content', color);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,135 @@
|
|||
function coverColor() {
|
||||
var path = document.getElementById("post-cover")?.src;
|
||||
if (path !== undefined) {
|
||||
var httpRequest = new XMLHttpRequest();
|
||||
httpRequest.open('GET', path + '?imageAve', true);
|
||||
httpRequest.send();
|
||||
httpRequest.onreadystatechange = function () {
|
||||
if (httpRequest.readyState == 4 && httpRequest.status == 200) {
|
||||
var json = httpRequest.responseText;
|
||||
var obj = eval('(' + json + ')');
|
||||
var value = obj.RGB;
|
||||
value = "#" + value.slice(2)
|
||||
if (getContrastYIQ(value) == "light") {
|
||||
value = LightenDarkenColor(colorHex(value), -50)
|
||||
}
|
||||
|
||||
document.documentElement.style.setProperty('--heo-main', value);
|
||||
document.documentElement.style.setProperty('--heo-main-op', value + '23');
|
||||
document.documentElement.style.setProperty('--heo-main-op-deep', value + 'dd');
|
||||
document.documentElement.style.setProperty('--heo-main-none', value + '00');
|
||||
initThemeColor()
|
||||
document.getElementById("coverdiv").classList.add("loaded");
|
||||
}
|
||||
};
|
||||
} else {
|
||||
document.documentElement.style.setProperty('--heo-main', 'var(--heo-theme)');
|
||||
document.documentElement.style.setProperty('--heo-main-op', 'var(--heo-theme-op)');
|
||||
document.documentElement.style.setProperty('--heo-main-op-deep', 'var(--heo-theme-op-deep)');
|
||||
document.documentElement.style.setProperty('--heo-main-none', 'var(--heo-theme-none)');
|
||||
initThemeColor()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function colorHex(colorString) {
|
||||
const hexRegex = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
|
||||
let color = colorString;
|
||||
|
||||
if (/^(rgb|RGB)/.test(color)) {
|
||||
const colorArr = color.replace(/(?:\(|\)|rgb|RGB)*/g, "").split(",");
|
||||
const hexArr = colorArr.map(c => {
|
||||
const hex = Number(c).toString(16);
|
||||
return hex.length === 1 ? "0" + hex : hex;
|
||||
});
|
||||
return "#" + hexArr.join("");
|
||||
} else if (hexRegex.test(color)) {
|
||||
const hexDigits = color.replace(/#/, "").split("");
|
||||
if (hexDigits.length === 6) {
|
||||
return color;
|
||||
} else if (hexDigits.length === 3) {
|
||||
const hexArr = hexDigits.map(c => c + c);
|
||||
return "#" + hexArr.join("");
|
||||
}
|
||||
}
|
||||
return color;
|
||||
}
|
||||
|
||||
|
||||
function colorRgb(str) {
|
||||
const HEX_SHORT_REGEX = /^#([0-9a-fA-f]{3})$/;
|
||||
const HEX_LONG_REGEX = /^#([0-9a-fA-f]{6})$/;
|
||||
const HEX_SHORT_LENGTH = 4;
|
||||
|
||||
const sColor = str.toLowerCase();
|
||||
let hexValue = "";
|
||||
|
||||
if (sColor && (HEX_SHORT_REGEX.test(sColor) || HEX_LONG_REGEX.test(sColor))) {
|
||||
hexValue = sColor.length === HEX_SHORT_LENGTH ?
|
||||
sColor.replace(/^#(.)/g, "#$1$1") :
|
||||
sColor;
|
||||
|
||||
const rgbValue = hexValue.slice(1)
|
||||
.match(/.{2}/g)
|
||||
.map(val => parseInt(val, 16))
|
||||
.join(",");
|
||||
|
||||
return `rgb(${rgbValue})`;
|
||||
} else {
|
||||
return sColor;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function LightenDarkenColor(col, amt) {
|
||||
let usePound = false;
|
||||
|
||||
if (col[0] === "#") {
|
||||
col = col.slice(1);
|
||||
usePound = true;
|
||||
}
|
||||
|
||||
const num = parseInt(col, 16);
|
||||
const r = Math.min(255, Math.max(0, (num >> 16) + amt));
|
||||
const b = Math.min(255, Math.max(0, ((num >> 8) & 0xff) + amt));
|
||||
const g = Math.min(255, Math.max(0, (num & 0xff) + amt));
|
||||
|
||||
return `${usePound ? "#" : ""}${(g | (b << 8) | (r << 16)).toString(16).padStart(6, "0")}`;
|
||||
}
|
||||
|
||||
|
||||
function getContrastYIQ(hexcolor) {
|
||||
var colorrgb = colorRgb(hexcolor);
|
||||
var colors = colorrgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
|
||||
var red = colors[1];
|
||||
var green = colors[2];
|
||||
var blue = colors[3];
|
||||
var brightness;
|
||||
brightness = (red * 299) + (green * 587) + (blue * 114);
|
||||
brightness = brightness / 255000;
|
||||
if (brightness >= 0.5) {
|
||||
return "light";
|
||||
} else {
|
||||
return "dark";
|
||||
}
|
||||
}
|
||||
|
||||
function initThemeColor() {
|
||||
const currentTop = window.scrollY || document.documentElement.scrollTop;
|
||||
let themeColor;
|
||||
if (currentTop > 0) {
|
||||
themeColor = getComputedStyle(document.documentElement).getPropertyValue('--heo-card-bg');
|
||||
} else if (PAGECONFIG.is_post) {
|
||||
themeColor = getComputedStyle(document.documentElement).getPropertyValue('--heo-main');
|
||||
} else {
|
||||
themeColor = getComputedStyle(document.documentElement).getPropertyValue('--heo-background');
|
||||
}
|
||||
changeThemeColor(themeColor);
|
||||
}
|
||||
|
||||
function changeThemeColor(color) {
|
||||
const meta = document.querySelector('meta[name="theme-color"]');
|
||||
if (meta) {
|
||||
meta.setAttribute('content', color);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,140 @@
|
|||
const $searchMask = document.getElementById('search-mask'),
|
||||
$searchDialog = document.querySelector('#algolia-search .search-dialog')
|
||||
|
||||
class search {
|
||||
static openSearch() {
|
||||
utils.fadeIn($searchMask, '0.5')
|
||||
utils.fadeIn($searchDialog, '0.5')
|
||||
document.addEventListener('keydown', function f(event) {
|
||||
if (event.code === 'Escape') {
|
||||
closeSearch()
|
||||
document.removeEventListener('keydown', f)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
static closeSearch() {
|
||||
utils.fadeOut($searchDialog, '0.5')
|
||||
utils.fadeOut($searchMask, '0.5')
|
||||
}
|
||||
|
||||
static cutContent(content) {
|
||||
if (content === '') return ''
|
||||
|
||||
const firstOccur = content.indexOf('<mark>')
|
||||
|
||||
let start = firstOccur - 30
|
||||
let end = firstOccur + 120
|
||||
let pre = ''
|
||||
let post = ''
|
||||
|
||||
if (start <= 0) {
|
||||
start = 0
|
||||
end = 140
|
||||
} else {
|
||||
pre = '...'
|
||||
}
|
||||
|
||||
if (end > content.length) {
|
||||
end = content.length
|
||||
} else {
|
||||
post = '...'
|
||||
}
|
||||
|
||||
const matchContent = pre + content.substring(start, end) + post
|
||||
return matchContent
|
||||
}
|
||||
|
||||
static search() {
|
||||
const algolia = GLOBALCONFIG.algolia, that = this
|
||||
const isAlgoliaValid = algolia.appId && algolia.apiKey && algolia.indexName
|
||||
if (!isAlgoliaValid) {
|
||||
return console.error('Algolia setting is invalid!')
|
||||
}
|
||||
|
||||
const init = instantsearch({
|
||||
indexName: algolia.indexName,
|
||||
searchClient: algoliasearch(algolia.appId, algolia.apiKey),
|
||||
searchFunction(helper) {
|
||||
helper.state.query && helper.search()
|
||||
}
|
||||
})
|
||||
|
||||
const searchBox = instantsearch.widgets.searchBox({
|
||||
container: '#search-input',
|
||||
showReset: false,
|
||||
showSubmit: false,
|
||||
autofocus: true,
|
||||
placeholder: GLOBALCONFIG.lang.search.placeholder,
|
||||
showLoadingIndicator: false
|
||||
})
|
||||
|
||||
const hits = instantsearch.widgets.hits({
|
||||
container: '#algolia-hits',
|
||||
templates: {
|
||||
item(data) {
|
||||
const link = '/' + data.path
|
||||
const result = data._highlightResult
|
||||
const content = result.contentStripTruncate
|
||||
? that.cutContent(result.contentStripTruncate.value)
|
||||
: result.contentStrip
|
||||
? that.cutContent(result.contentStrip.value)
|
||||
: result.content
|
||||
? that.cutContent(result.content.value)
|
||||
: ''
|
||||
return `
|
||||
<a href="${link}" class="algolia-hit-item-link">
|
||||
${result.title.value}
|
||||
</a>
|
||||
<p class="algolia-hit-item-content">${content}</p>`
|
||||
},
|
||||
empty: function (data) {
|
||||
return (
|
||||
`<div id="algolia-hits-empty">${GLOBALCONFIG.lang.search.empty}</div>`
|
||||
)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const stats = instantsearch.widgets.stats({
|
||||
container: '.algolia-stats',
|
||||
templates: {
|
||||
text: function (data) {
|
||||
const stats = GLOBALCONFIG.lang.search.hit.replace('${query}', `<mark>${data.nbHits}</mark>`)
|
||||
return (
|
||||
stats
|
||||
)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const powerBy = instantsearch.widgets.poweredBy({
|
||||
container: '.algolia-poweredBy'
|
||||
})
|
||||
|
||||
init.addWidgets([searchBox, hits, stats, powerBy]) // add the widgets to the instantsearch instance
|
||||
init.start()
|
||||
init.on('render', () => {
|
||||
pjax.refresh(document.getElementById('algolia-hits'))
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const searchClickFn = () => {
|
||||
document.querySelector('#search-button > .search').addEventListener('click', search.openSearch)
|
||||
}
|
||||
|
||||
const searchClickFnOnce = () => {
|
||||
document.querySelector('#algolia-search .search-close-button').addEventListener('click', search.closeSearch)
|
||||
$searchMask.addEventListener('click', search.closeSearch)
|
||||
}
|
||||
|
||||
window.addEventListener('load', () => {
|
||||
searchClickFn()
|
||||
searchClickFnOnce()
|
||||
search.search()
|
||||
})
|
||||
|
||||
window.addEventListener('pjax:complete', () => {
|
||||
searchClickFn()
|
||||
})
|
||||
|
|
@ -0,0 +1,162 @@
|
|||
const $searchMask = document.getElementById('search-mask'),
|
||||
$searchDialog = document.querySelector('#local-search .search-dialog'),
|
||||
$input = document.querySelector('#search-input'),
|
||||
$resultContent = document.getElementById('search-results'),
|
||||
$loadingStatus = document.getElementById('loading-status')
|
||||
let dataObj = null
|
||||
|
||||
class search {
|
||||
static openSearch() {
|
||||
utils.fadeIn($searchMask, '0.5')
|
||||
utils.fadeIn($searchDialog, '0.5')
|
||||
setTimeout(() => {
|
||||
document.querySelector('#search-input').focus()
|
||||
}, 100)
|
||||
search.search()
|
||||
document.addEventListener('keydown', function f(event) {
|
||||
if (event.code === 'Escape') {
|
||||
closeSearch()
|
||||
document.removeEventListener('keydown', f)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
static closeSearch() {
|
||||
utils.fadeOut($searchDialog, '0.5')
|
||||
utils.fadeOut($searchMask, '0.5')
|
||||
}
|
||||
|
||||
static async fetchData(path) {
|
||||
let data = []
|
||||
const response = await fetch(path)
|
||||
const res = await new window.DOMParser().parseFromString(await response.text(), 'text/xml')
|
||||
data = [...res.querySelectorAll('entry')].map(item => {
|
||||
return {
|
||||
title: item.querySelector('title').textContent,
|
||||
content: item.querySelector('content') && item.querySelector('content').textContent,
|
||||
url: item.querySelector('url').textContent
|
||||
}
|
||||
})
|
||||
if (response.ok) {
|
||||
const $loadDataItem = document.getElementById('loading-database')
|
||||
$loadDataItem.nextElementSibling.style.display = 'block'
|
||||
$loadDataItem.remove()
|
||||
}
|
||||
return data
|
||||
}
|
||||
|
||||
static search() {
|
||||
if (!GLOBALCONFIG.localsearch.preload && dataObj === null) dataObj = this.fetchData(GLOBALCONFIG.localsearch.path)
|
||||
$input.addEventListener('input', function type() {
|
||||
const keywords = this.value.trim().toLowerCase().split(/[\s]+/)
|
||||
if (keywords[0] !== '') $loadingStatus.innerHTML = '<i class="fas fa-spinner fa-pulse"></i><span>加载中</span>'
|
||||
else {
|
||||
$resultContent.innerHTML = ''
|
||||
return
|
||||
}
|
||||
|
||||
if (keywords.length <= 0) return
|
||||
let count = 0, str = '<div class="search-result-list">'
|
||||
// perform local searching
|
||||
dataObj.then(data => {
|
||||
data.forEach(data => {
|
||||
let isMatch = true
|
||||
let dataTitle = data.title ? data.title.trim().toLowerCase() : ''
|
||||
const dataContent = data.content ? data.content.trim().replace(/<[^>]+>/g, '').toLowerCase() : ''
|
||||
const dataUrl = data.url.startsWith('/') ? data.url : GLOBALCONFIG.root + data.url
|
||||
let indexTitle = -1
|
||||
let indexContent = -1
|
||||
let firstOccur = -1
|
||||
// only match articles with not empty titles and contents
|
||||
if (dataTitle !== '' || dataContent !== '') {
|
||||
keywords.forEach((keyword, i) => {
|
||||
indexTitle = dataTitle.indexOf(keyword)
|
||||
indexContent = dataContent.indexOf(keyword)
|
||||
if (indexTitle < 0 && indexContent < 0) {
|
||||
isMatch = false
|
||||
} else {
|
||||
if (indexContent < 0) {
|
||||
indexContent = 0
|
||||
}
|
||||
if (i === 0) {
|
||||
firstOccur = indexContent
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
isMatch = false
|
||||
}
|
||||
|
||||
// show search results
|
||||
if (isMatch) {
|
||||
if (firstOccur >= 0) {
|
||||
// cut out 130 characters
|
||||
let start = firstOccur - 30
|
||||
let end = firstOccur + 100
|
||||
let pre = ''
|
||||
let post = ''
|
||||
|
||||
if (start < 0) {
|
||||
start = 0
|
||||
}
|
||||
|
||||
if (start === 0) {
|
||||
end = 100
|
||||
} else {
|
||||
pre = '...'
|
||||
}
|
||||
|
||||
if (end > dataContent.length) {
|
||||
end = dataContent.length
|
||||
} else {
|
||||
post = '...'
|
||||
}
|
||||
|
||||
let matchContent = dataContent.substring(start, end)
|
||||
// highlight all keywords
|
||||
keywords.forEach(keyword => {
|
||||
const regex = new RegExp(`(?!<[^>]*?)(${keyword})(?![^<]*?>)`, 'gi')
|
||||
matchContent = matchContent.replaceAll(regex, '<span class="search-keyword">$1</span>')
|
||||
dataTitle = dataTitle.replaceAll(regex, '<span class="search-keyword">$1</span>')
|
||||
})
|
||||
|
||||
str += '<div class="search__hit-item"><a href="' + dataUrl + '"><span class="search-result-title">' + dataTitle + '</span>'
|
||||
count += 1
|
||||
if (dataContent !== '') {
|
||||
str += '<div class="search-result">' + pre + matchContent + post + '</div>'
|
||||
}
|
||||
}
|
||||
str += '</a></div>'
|
||||
}
|
||||
})
|
||||
if (count === 0) {
|
||||
str += `<div id="search__hits-empty">${GLOBALCONFIG.lang.search.empty}</div>`
|
||||
} else {
|
||||
str += `<div class="search__hits-count">${GLOBALCONFIG.lang.search.hit.replace('${query}', '<span class="search-keyword">' + count + '</span>')}</div>`
|
||||
}
|
||||
str += '</div>'
|
||||
$resultContent.innerHTML = str
|
||||
if (keywords[0] !== '') $loadingStatus.innerHTML = ''
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const searchClickFn = () => {
|
||||
document.querySelector('#search-button > .search').addEventListener('click', search.openSearch)
|
||||
}
|
||||
|
||||
const searchClickFnOnce = () => {
|
||||
document.querySelector('#local-search .search-close-button').addEventListener('click', search.closeSearch)
|
||||
$searchMask.addEventListener('click', search.closeSearch)
|
||||
if (GLOBALCONFIG.localsearch.preload) dataObj = search.fetchData(GLOBALCONFIG.localsearch.path)
|
||||
}
|
||||
|
||||
window.addEventListener('load', () => {
|
||||
searchClickFn()
|
||||
searchClickFnOnce()
|
||||
})
|
||||
|
||||
window.addEventListener('pjax:complete', () => {
|
||||
searchClickFn()
|
||||
})
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
let halo = {
|
||||
darkComment : ()=>{
|
||||
if(document.querySelector('#comment div').shadowRoot.querySelector('.halo-comment-widget').classList != null){
|
||||
let commentDOMclass = document.querySelector('#comment div').shadowRoot.querySelector('.halo-comment-widget').classList
|
||||
if(commentDOMclass.contains('light'))
|
||||
commentDOMclass.replace('light','dark')
|
||||
else
|
||||
commentDOMclass.replace('dark','light')
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -1,460 +0,0 @@
|
|||
let heo_cookiesTime = null;
|
||||
let heo_musicPlaying = false;
|
||||
let heo_keyboard = false;
|
||||
let heo_intype = false;
|
||||
// 私有函数
|
||||
var heo = {
|
||||
// 检测显示模式
|
||||
darkModeStatus: function () {
|
||||
let theme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'
|
||||
if (theme == 'light') {
|
||||
$(".menu-darkmode-text").text("深色模式");
|
||||
} else {
|
||||
$(".menu-darkmode-text").text("浅色模式");
|
||||
}
|
||||
},
|
||||
|
||||
// //bb添加时间
|
||||
// changeTimeInEssay: function () {
|
||||
// const relativeDate = function (selector) {
|
||||
// selector.forEach(item => {
|
||||
// const $this = item
|
||||
// const timeVal = $this.getAttribute('datetime')
|
||||
// $this.innerText = btf.diffDate(timeVal, true)
|
||||
// $this.style.display = 'inline'
|
||||
// })
|
||||
// }
|
||||
//
|
||||
// if (document.querySelector('#comment')) {
|
||||
// relativeDate(document.querySelectorAll('#comment time'))
|
||||
// }
|
||||
// },
|
||||
|
||||
// 首页bb
|
||||
initIndexEssay: function () {
|
||||
if (document.querySelector('#bber-talk')) {
|
||||
var swiper = new Swiper('.swiper-container', {
|
||||
direction: 'vertical', // 垂直切换选项
|
||||
loop: true,
|
||||
autoplay: {
|
||||
delay: 3000,
|
||||
pauseOnMouseEnter: true
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
// 只在首页显示
|
||||
onlyHome: function () {
|
||||
var urlinfo = window.location.pathname;
|
||||
urlinfo = decodeURIComponent(urlinfo);
|
||||
if (urlinfo == '/') {
|
||||
$('.only-home').attr('style', 'display: flex');
|
||||
} else {
|
||||
$('.only-home').attr('style', 'display: none');
|
||||
}
|
||||
},
|
||||
|
||||
//是否在首页
|
||||
is_Post: function () {
|
||||
var url = window.location.href; //获取url
|
||||
if (url.indexOf("/p/") >= 0) { //判断url地址中是否包含code字符串
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
//监测是否在页面开头
|
||||
addNavBackgroundInit: function () {
|
||||
var scrollTop = 0, bodyScrollTop = 0, documentScrollTop = 0;
|
||||
if (document.body) {
|
||||
bodyScrollTop = document.body.scrollTop;
|
||||
}
|
||||
if (document.documentElement) {
|
||||
documentScrollTop = document.documentElement.scrollTop;
|
||||
}
|
||||
scrollTop = (bodyScrollTop - documentScrollTop > 0) ? bodyScrollTop : documentScrollTop;
|
||||
// console.log("滚动高度"+ scrollTop)
|
||||
|
||||
if (scrollTop != 0) {
|
||||
document.getElementById("page-header").classList.add("nav-fixed");
|
||||
document.getElementById("page-header").classList.add("nav-visible");
|
||||
$('#introduction-window').hide()
|
||||
console.log("已添加class")
|
||||
}
|
||||
},
|
||||
|
||||
// 标签页面
|
||||
//分类条
|
||||
// tagPageActive: function () {
|
||||
// var urlinfo = window.location.pathname;
|
||||
// urlinfo = decodeURIComponent(urlinfo)
|
||||
// // console.log(urlinfo);
|
||||
// // 验证是否是分类链接
|
||||
// var pattern = /\/tags\/.*?\//;
|
||||
// var patbool = pattern.test(urlinfo);
|
||||
// // console.log(patbool);
|
||||
// // 获取当前的分类
|
||||
// if (patbool) {
|
||||
// var valuegroup = urlinfo.split("/");
|
||||
// // console.log(valuegroup[2]);
|
||||
// // 获取当前分类
|
||||
// var nowCategorie = valuegroup[2];
|
||||
// if (document.querySelector('#tag-page-tags')) {
|
||||
// $('a').removeClass('select')
|
||||
// document.getElementById(nowCategorie).classList.add("select");
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
|
||||
//分类条
|
||||
// categoriesBarActive: function () {
|
||||
// if (document.querySelector('#category-bar')) {
|
||||
// $(".category-bar-item").removeClass("select")
|
||||
// }
|
||||
// var urlinfo = window.location.pathname;
|
||||
// urlinfo = decodeURIComponent(urlinfo);
|
||||
// // console.log(urlinfo);
|
||||
// //判断是否是首页
|
||||
// if (urlinfo == '/') {
|
||||
// if (document.querySelector('#category-bar')) {
|
||||
// document.getElementById('category-bar-home').classList.add("select");
|
||||
// }
|
||||
// } else {
|
||||
// // 验证是否是分类链接
|
||||
// var pattern = /\/categories\/.*?\//;
|
||||
// var patbool = pattern.test(urlinfo);
|
||||
// // console.log(patbool);
|
||||
// // 获取当前的分类
|
||||
// if (patbool) {
|
||||
// var valuegroup = urlinfo.split("/");
|
||||
// // console.log(valuegroup[2]);
|
||||
// // 获取当前分类
|
||||
// var nowCategorie = valuegroup[2];
|
||||
// if (document.querySelector('#category-bar')) {
|
||||
// document.getElementById(nowCategorie).classList.add("select");
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
|
||||
// 页脚友链
|
||||
addFriendLinksInFooter: function () {
|
||||
var fetchUrl = "https://moments.zhheo.com/randomfriend?num=3"
|
||||
fetch(fetchUrl)
|
||||
.then(res => res.json())
|
||||
.then(json => {
|
||||
var randomFriendLinks = getArrayItems(json, 3);
|
||||
|
||||
var htmlText = '';
|
||||
for (let i = 0; i < randomFriendLinks.length; ++i) {
|
||||
var item = randomFriendLinks[i]
|
||||
htmlText += `<a class='footer-item' href='${item.link}' target="_blank" rel="noopener nofollow">${item.name}</a>`;
|
||||
}
|
||||
htmlText += `<a class='footer-item' href='/link/'>更多</a>`
|
||||
document.getElementById("friend-links-in-footer").innerHTML = htmlText;
|
||||
})
|
||||
},
|
||||
|
||||
//禁止图片右键单击
|
||||
stopImgRightDrag: function () {
|
||||
var img = $("img");
|
||||
img.on("dragstart", function () {
|
||||
return false;
|
||||
});
|
||||
},
|
||||
|
||||
//置顶文章横向滚动
|
||||
topPostScroll: function () {
|
||||
if (document.getElementById("recent-post-top")) {
|
||||
let xscroll = document.getElementById("recent-post-top");
|
||||
xscroll.addEventListener("mousewheel", function (e) {
|
||||
//计算鼠标滚轮滚动的距离
|
||||
let v = -e.wheelDelta / 2;
|
||||
xscroll.scrollLeft += v;
|
||||
//阻止浏览器默认方法
|
||||
if (document.body.clientWidth < 1300) {
|
||||
e.preventDefault();
|
||||
}
|
||||
}, false);
|
||||
}
|
||||
},
|
||||
|
||||
topCategoriesBarScroll: function () {
|
||||
if (document.getElementById("category-bar-items")) {
|
||||
let xscroll = document.getElementById("category-bar-items");
|
||||
xscroll.addEventListener("mousewheel", function (e) {
|
||||
//计算鼠标滚轮滚动的距离
|
||||
let v = -e.wheelDelta / 2;
|
||||
xscroll.scrollLeft += v;
|
||||
//阻止浏览器默认方法
|
||||
e.preventDefault();
|
||||
}, false);
|
||||
}
|
||||
},
|
||||
|
||||
//作者卡片问好
|
||||
sayhi: function () {
|
||||
if (document.querySelector('#author-info__sayhi')) {
|
||||
document.getElementById("author-info__sayhi").innerHTML = getTimeState() + "！我是";
|
||||
}
|
||||
},
|
||||
|
||||
// 添加标签
|
||||
addTag: function () {
|
||||
//添加new标签
|
||||
if (document.querySelector('.heo-tag-new')) {
|
||||
$(".heo-tag-new").append(`<sup class="heo-tag heo-tag-new-view">N</sup>`)
|
||||
}
|
||||
//添加hot标签
|
||||
if (document.querySelector('.heo-tag-hot')) {
|
||||
$(".heo-tag-hot").append(`<sup class="heo-tag heo-tag-hot-view">H</sup>`)
|
||||
}
|
||||
},
|
||||
|
||||
// 二维码
|
||||
qrcodeCreate: function () {
|
||||
if (document.getElementById('qrcode')) {
|
||||
document.getElementById("qrcode").innerHTML = "";
|
||||
var qrcode = new QRCode(document.getElementById("qrcode"), {
|
||||
text: window.location.href,
|
||||
width: 250,
|
||||
height: 250,
|
||||
colorDark: "#000",
|
||||
colorLight: "#ffffff",
|
||||
correctLevel: QRCode.CorrectLevel.H
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
// 刷新即刻短文瀑布流
|
||||
reflashEssayWaterFall: function () {
|
||||
if (document.querySelector('#waterfall')) {
|
||||
setTimeout(function () {
|
||||
waterfall('#waterfall');
|
||||
document.getElementById("waterfall").classList.add('show');
|
||||
}, 500);
|
||||
}
|
||||
},
|
||||
|
||||
// 即刻短文添加灯箱
|
||||
addMediumInEssay: function () {
|
||||
if (document.querySelector('#waterfall')) {
|
||||
mediumZoom(document.querySelectorAll('[data-zoomable]'))
|
||||
}
|
||||
},
|
||||
|
||||
// 下载图片
|
||||
downloadImage: function (imgsrc, name) { //下载图片地址和图片名
|
||||
rm.hideRightMenu();
|
||||
if (rm.downloadimging == false) {
|
||||
rm.downloadimging = true;
|
||||
btf.snackbarShow('正在下载中，请稍后', false, 10000)
|
||||
setTimeout(function () {
|
||||
let image = new Image();
|
||||
// 解决跨域 Canvas 污染问题
|
||||
image.setAttribute("crossOrigin", "anonymous");
|
||||
image.onload = function () {
|
||||
let canvas = document.createElement("canvas");
|
||||
canvas.width = image.width;
|
||||
canvas.height = image.height;
|
||||
let context = canvas.getContext("2d");
|
||||
context.drawImage(image, 0, 0, image.width, image.height);
|
||||
let url = canvas.toDataURL("image/png"); //得到图片的base64编码数据
|
||||
let a = document.createElement("a"); // 生成一个a元素
|
||||
let event = new MouseEvent("click"); // 创建一个单击事件
|
||||
a.download = name || "photo"; // 设置图片名称
|
||||
a.href = url; // 将生成的URL设置为a.href属性
|
||||
a.dispatchEvent(event); // 触发a的单击事件
|
||||
};
|
||||
image.src = imgsrc;
|
||||
btf.snackbarShow('图片已添加盲水印，请遵守版权协议');
|
||||
rm.downloadimging = false;
|
||||
}, "10000");
|
||||
} else {
|
||||
btf.snackbarShow('有正在进行中的下载，请稍后再试');
|
||||
}
|
||||
},
|
||||
|
||||
//控制评论弹幕
|
||||
switchCommentBarrage: function () {
|
||||
let commentBarrage = document.querySelector('.comment-barrage');
|
||||
if (commentBarrage) {
|
||||
if ($(".comment-barrage").is(":visible")) {
|
||||
$(".comment-barrage").hide();
|
||||
$(".menu-commentBarrage-text").text("显示热评");
|
||||
document.querySelector("#consoleCommentBarrage").classList.remove("on");
|
||||
localStorage.setItem('commentBarrageSwitch', 'false');
|
||||
} else if ($(".comment-barrage").is(":hidden")) {
|
||||
$(".comment-barrage").show();
|
||||
$(".menu-commentBarrage-text").text("关闭热评");
|
||||
document.querySelector("#consoleCommentBarrage").classList.add("on");
|
||||
localStorage.removeItem('commentBarrageSwitch');
|
||||
}
|
||||
}
|
||||
rm.hideRightMenu();
|
||||
},
|
||||
|
||||
//隐藏cookie窗口
|
||||
hidecookie: function () {
|
||||
heo_cookiesTime = setTimeout(() => {
|
||||
document.getElementById("introduction-window").classList.add('cw-hide');
|
||||
setTimeout(() => {
|
||||
$('#introduction-window').hide()
|
||||
}, 1000)
|
||||
}, 3000)
|
||||
},
|
||||
|
||||
//隐藏今日推荐
|
||||
hideTodayCard: function () {
|
||||
if (document.getElementById("todayCard")) {
|
||||
document.getElementById("todayCard").classList.add('hide');
|
||||
}
|
||||
},
|
||||
|
||||
//更改主题色
|
||||
changeThemeColor: function (color) {
|
||||
if (document.querySelector('meta[name="theme-color"]') !== null) {
|
||||
document.querySelector('meta[name="theme-color"]').setAttribute('content', color)
|
||||
}
|
||||
},
|
||||
|
||||
//自适应主题色
|
||||
initThemeColor: function () {
|
||||
if (heo.is_Post()) {
|
||||
const currentTop = window.scrollY || document.documentElement.scrollTop
|
||||
if (currentTop === 0) {
|
||||
let themeColor = getComputedStyle(document.documentElement).getPropertyValue('--heo-main');
|
||||
heo.changeThemeColor(themeColor);
|
||||
} else {
|
||||
let themeColor = getComputedStyle(document.documentElement).getPropertyValue('--heo-background');
|
||||
heo.changeThemeColor(themeColor);
|
||||
}
|
||||
} else {
|
||||
let themeColor = getComputedStyle(document.documentElement).getPropertyValue('--heo-background');
|
||||
heo.changeThemeColor(themeColor);
|
||||
}
|
||||
},
|
||||
|
||||
//跳转到指定位置
|
||||
jumpTo: function (dom) {
|
||||
$(document).ready(function () {
|
||||
$("html,body").animate({
|
||||
scrollTop: $(dom).eq(i).offset().top
|
||||
}, 500 /*scroll实现定位滚动*/); /*让整个页面可以滚动*/
|
||||
});
|
||||
},
|
||||
|
||||
//显示加载动画
|
||||
showLoading: function () {
|
||||
document.querySelector("#loading-box").classList.remove("loaded");
|
||||
let cardColor = getComputedStyle(document.documentElement).getPropertyValue('--heo-card-bg');
|
||||
heo.changeThemeColor(cardColor);
|
||||
},
|
||||
|
||||
//隐藏加载动画
|
||||
hideLoading: function () {
|
||||
document.querySelector("#loading-box").classList.add("loaded");
|
||||
},
|
||||
|
||||
//切换音乐播放状态
|
||||
musicToggle: function () {
|
||||
let msgPlay = '<i class="fa-solid fa-play"></i><span>播放音乐</span>' // 此處可以更改為你想要顯示的文字
|
||||
let msgPause = '<i class="fa-solid fa-pause"></i><span>暂停音乐</span>' // 同上，但兩處均不建議更改
|
||||
if (heo_musicPlaying) {
|
||||
document.querySelector("#nav-music").classList.remove("playing");
|
||||
document.getElementById("menu-music-toggle").innerHTML = msgPlay;
|
||||
document.getElementById("nav-music-hoverTips").innerHTML = "音乐已暂停";
|
||||
document.querySelector("#consoleMusic").classList.remove("on");
|
||||
heo_musicPlaying = false;
|
||||
} else {
|
||||
document.querySelector("#nav-music").classList.add("playing");
|
||||
document.getElementById("menu-music-toggle").innerHTML = msgPause;
|
||||
document.querySelector("#consoleMusic").classList.add("on");
|
||||
heo_musicPlaying = true;
|
||||
}
|
||||
document.querySelector('meting-js').aplayer.toggle();
|
||||
rm.hideRightMenu();
|
||||
},
|
||||
|
||||
//音乐上一曲
|
||||
musicSkipBack: function () {
|
||||
document.querySelector('meting-js').aplayer.skipBack();
|
||||
rm.hideRightMenu();
|
||||
},
|
||||
|
||||
//音乐下一曲
|
||||
musicSkipForward: function () {
|
||||
document.querySelector('meting-js').aplayer.skipForward();
|
||||
rm.hideRightMenu();
|
||||
},
|
||||
|
||||
//获取音乐中的名称
|
||||
musicGetName: function () {
|
||||
var x = $('.aplayer-title')
|
||||
// var x = document.getElementsByClassName('txt');
|
||||
// for (var i = x.length - 1; i >= 0; i--) {
|
||||
// console.log(x[i].innerText)
|
||||
// }
|
||||
var arr = []
|
||||
for (var i = x.length - 1; i >= 0; i--) {
|
||||
arr[i] = x[i].innerText
|
||||
// console.log(x[i].innerText)
|
||||
}
|
||||
return arr[0]
|
||||
},
|
||||
|
||||
//显示中控台
|
||||
showConsole: function () {
|
||||
document.querySelector("#console").classList.add("show");
|
||||
heo.initConsoleState();
|
||||
},
|
||||
|
||||
//隐藏中控台
|
||||
hideConsole: function () {
|
||||
document.querySelector("#console").classList.remove("show");
|
||||
},
|
||||
|
||||
//快捷键功能开关
|
||||
keyboardToggle: function () {
|
||||
if (heo_keyboard) {
|
||||
heo_keyboard = false;
|
||||
document.querySelector("#consoleKeyboard").classList.remove("on");
|
||||
localStorage.setItem('keyboardToggle', 'false');
|
||||
} else {
|
||||
heo_keyboard = true;
|
||||
document.querySelector("#consoleKeyboard").classList.add("on");
|
||||
localStorage.setItem('keyboardToggle', 'true');
|
||||
}
|
||||
},
|
||||
|
||||
//滚动到指定id
|
||||
scrollTo: function (id) {
|
||||
var domTop = document.querySelector(id).offsetTop;
|
||||
window.scrollTo(0, domTop - 80);
|
||||
},
|
||||
|
||||
//隐藏侧边栏
|
||||
hideAsideBtn: () => { // Hide aside
|
||||
const $htmlDom = document.documentElement.classList
|
||||
$htmlDom.contains('hide-aside')
|
||||
? saveToLocal.set('aside-status', 'show', 2)
|
||||
: saveToLocal.set('aside-status', 'hide', 2)
|
||||
$htmlDom.toggle('hide-aside')
|
||||
$htmlDom.contains('hide-aside')
|
||||
? document.querySelector("#consoleHideAside").classList.add("on")
|
||||
: document.querySelector("#consoleHideAside").classList.remove("on")
|
||||
},
|
||||
|
||||
//初始化console图标
|
||||
initConsoleState: function () {
|
||||
//初始化隐藏边栏
|
||||
const $htmlDom = document.documentElement.classList
|
||||
$htmlDom.contains('hide-aside')
|
||||
? document.querySelector("#consoleHideAside").classList.add("on")
|
||||
: document.querySelector("#consoleHideAside").classList.remove("on")
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,4 +1,4 @@
|
|||
var btf = {
|
||||
const utils = {
|
||||
debounce: function (func, wait, immediate) {
|
||||
let timeout
|
||||
return function () {
|
||||
|
|
@ -49,139 +49,6 @@ var btf = {
|
|||
return throttled
|
||||
},
|
||||
|
||||
sidebarPaddingR: () => {
|
||||
const innerWidth = window.innerWidth
|
||||
const clientWidth = document.body.clientWidth
|
||||
const paddingRight = innerWidth - clientWidth
|
||||
if (innerWidth !== clientWidth) {
|
||||
document.body.style.paddingRight = paddingRight + 'px'
|
||||
}
|
||||
},
|
||||
|
||||
snackbarShow: (text, showAction, duration) => {
|
||||
const sa = (typeof showAction !== 'undefined') ? showAction : false
|
||||
const dur = (typeof duration !== 'undefined') ? duration : 5000
|
||||
const position = GLOBAL_CONFIG.Snackbar.position
|
||||
const bg = document.documentElement.getAttribute('data-theme') === 'light' ? GLOBAL_CONFIG.Snackbar.bgLight : GLOBAL_CONFIG.Snackbar.bgDark
|
||||
document.styleSheets[0].addRule(':root', '--heo-snackbar-time:' + dur + 'ms!important')
|
||||
Snackbar.show({
|
||||
text: text,
|
||||
backgroundColor: bg,
|
||||
showAction: sa,
|
||||
duration: dur,
|
||||
pos: position
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
initJustifiedGallery: function (selector) {
|
||||
if (!(selector instanceof jQuery)) {
|
||||
selector = $(selector)
|
||||
}
|
||||
selector.each(function (i, o) {
|
||||
if ($(this).is(':visible')) {
|
||||
$(this).justifiedGallery({
|
||||
rowHeight: 220,
|
||||
margins: 4
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
diffDate: (d, more = false) => {
|
||||
const dateNow = new Date()
|
||||
const datePost = new Date(d)
|
||||
const dateDiff = dateNow.getTime() - datePost.getTime()
|
||||
const minute = 1000 * 60
|
||||
const hour = minute * 60
|
||||
const day = hour * 24
|
||||
const month = day * 30
|
||||
|
||||
let result
|
||||
if (more) {
|
||||
const monthCount = dateDiff / month
|
||||
const dayCount = dateDiff / day
|
||||
const hourCount = dateDiff / hour
|
||||
const minuteCount = dateDiff / minute
|
||||
|
||||
if (monthCount > 12) {
|
||||
// result = datePost.toLocaleDateString().replace(/\//g, '-')
|
||||
result = datePost.toLocaleDateString()
|
||||
} else if (dayCount >= 7) {
|
||||
// } else if (monthCount >= 1) {
|
||||
result = datePost.toLocaleDateString().substr(5)
|
||||
// result = parseInt(monthCount) + ' ' + GLOBAL_CONFIG.date_suffix.month
|
||||
} else if (dayCount >= 1) {
|
||||
result = parseInt(dayCount) + '' + GLOBAL_CONFIG.date_suffix.day
|
||||
} else if (hourCount >= 1) {
|
||||
result = '最近'
|
||||
// result = parseInt(hourCount) + ' ' + GLOBAL_CONFIG.date_suffix.hour
|
||||
} else if (minuteCount >= 1) {
|
||||
result = '最近'
|
||||
// result = parseInt(minuteCount) + ' ' + GLOBAL_CONFIG.date_suffix.min
|
||||
} else {
|
||||
result = GLOBAL_CONFIG.date_suffix.just
|
||||
}
|
||||
} else {
|
||||
result = parseInt(dateDiff / day)
|
||||
}
|
||||
return result
|
||||
},
|
||||
|
||||
loadComment: (dom, callback) => {
|
||||
if ('IntersectionObserver' in window) {
|
||||
const observerItem = new IntersectionObserver((entries) => {
|
||||
if (entries[0].isIntersecting) {
|
||||
callback()
|
||||
observerItem.disconnect()
|
||||
}
|
||||
}, {threshold: [0]})
|
||||
observerItem.observe(dom)
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
|
||||
scrollToDest: (pos, time) => {
|
||||
if (pos < 0 || time < 0) {
|
||||
return
|
||||
}
|
||||
|
||||
const currentPos = window.scrollY || window.screenTop
|
||||
pos = pos - 70
|
||||
|
||||
if ('CSS' in window && CSS.supports('scroll-behavior', 'smooth')) {
|
||||
window.scrollTo({
|
||||
top: pos,
|
||||
behavior: 'smooth'
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
let start = null
|
||||
time = time || 500
|
||||
window.requestAnimationFrame(function step(currentTime) {
|
||||
start = !start ? currentTime : start
|
||||
if (currentPos < pos) {
|
||||
const progress = currentTime - start
|
||||
window.scrollTo(0, ((pos - currentPos) * progress / time) + currentPos)
|
||||
if (progress < time) {
|
||||
window.requestAnimationFrame(step)
|
||||
} else {
|
||||
window.scrollTo(0, pos)
|
||||
}
|
||||
} else {
|
||||
const progress = currentTime - start
|
||||
window.scrollTo(0, currentPos - ((currentPos - pos) * progress / time))
|
||||
if (progress < time) {
|
||||
window.requestAnimationFrame(step)
|
||||
} else {
|
||||
window.scrollTo(0, pos)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
fadeIn: (ele, time) => {
|
||||
ele.style.cssText = `display:block;animation: to_show ${time}s`
|
||||
},
|
||||
|
|
@ -194,11 +61,84 @@ var btf = {
|
|||
ele.style.animation = `to_hide ${time}s`
|
||||
},
|
||||
|
||||
getParents: (elem, selector) => {
|
||||
for (; elem && elem !== document; elem = elem.parentNode) {
|
||||
if (elem.matches(selector)) return elem
|
||||
sidebarPaddingR: () => {
|
||||
const innerWidth = window.innerWidth
|
||||
const clientWidth = document.body.clientWidth
|
||||
const paddingRight = innerWidth - clientWidth
|
||||
if (innerWidth !== clientWidth) {
|
||||
document.body.style.paddingRight = paddingRight + 'px'
|
||||
}
|
||||
return null
|
||||
},
|
||||
|
||||
snackbarShow: (text, showAction, duration) => {
|
||||
const sa = (typeof showAction !== 'undefined') ? showAction : false
|
||||
const dur = (typeof duration !== 'undefined') ? duration : 5000
|
||||
document.styleSheets[0].addRule(':root', '--heo-snackbar-time:' + dur + 'ms!important')
|
||||
Snackbar.show({
|
||||
text: text,
|
||||
showAction: sa,
|
||||
duration: dur,
|
||||
pos: 'top-center'
|
||||
})
|
||||
},
|
||||
|
||||
copy: async (text) => {
|
||||
try {
|
||||
await navigator.clipboard.writeText(text)
|
||||
utils.snackbarShow(GLOBALCONFIG.lang.copy.success, false, 2000)
|
||||
} catch (err) {
|
||||
utils.snackbarShow(GLOBALCONFIG.lang.copy.error, false, 2000)
|
||||
}
|
||||
},
|
||||
|
||||
getEleTop: ele => {
|
||||
let actualTop = ele.offsetTop
|
||||
let current = ele.offsetParent
|
||||
|
||||
while (current !== null) {
|
||||
actualTop += current.offsetTop
|
||||
current = current.offsetParent
|
||||
}
|
||||
|
||||
return actualTop
|
||||
},
|
||||
|
||||
randomNum: (length) => {
|
||||
return Math.floor(Math.random() * length)
|
||||
},
|
||||
|
||||
timeDiff: (timeObj, today) => {
|
||||
var timeDiff = today.getTime() - timeObj.getTime();
|
||||
return Math.floor(timeDiff / (1000 * 3600 * 24));
|
||||
},
|
||||
|
||||
scrollToDest: (pos, time = 500) => {
|
||||
const currentPos = window.pageYOffset
|
||||
const isNavFixed = document.getElementById('page-header').classList.contains('nav-fixed')
|
||||
if (currentPos > pos || isNavFixed) pos = pos - 70
|
||||
if ('scrollBehavior' in document.documentElement.style) {
|
||||
window.scrollTo({
|
||||
top: pos,
|
||||
behavior: 'smooth'
|
||||
})
|
||||
return
|
||||
}
|
||||
let start = null
|
||||
pos = +pos
|
||||
window.requestAnimationFrame(function step(currentTime) {
|
||||
start = !start ? currentTime : start
|
||||
const progress = currentTime - start
|
||||
if (currentPos < pos) {
|
||||
window.scrollTo(0, ((pos - currentPos) * progress / time) + currentPos)
|
||||
} else {
|
||||
window.scrollTo(0, currentPos - ((currentPos - pos) * progress / time))
|
||||
}
|
||||
if (progress < time) {
|
||||
window.requestAnimationFrame(step)
|
||||
} else {
|
||||
window.scrollTo(0, pos)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
siblings: (ele, selector) => {
|
||||
|
|
@ -209,50 +149,5 @@ var btf = {
|
|||
return child !== ele
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {*} selector
|
||||
* @param {*} eleType the type of create element
|
||||
* @param {*} id id
|
||||
* @param {*} cn class name
|
||||
*/
|
||||
wrap: function (selector, eleType, id = '', cn = '') {
|
||||
const creatEle = document.createElement(eleType)
|
||||
if (id) creatEle.id = id
|
||||
if (cn) creatEle.className = cn
|
||||
selector.parentNode.insertBefore(creatEle, selector)
|
||||
creatEle.appendChild(selector)
|
||||
},
|
||||
|
||||
unwrap: function (el) {
|
||||
const elParentNode = el.parentNode
|
||||
if (elParentNode !== document.body) {
|
||||
elParentNode.parentNode.insertBefore(el, elParentNode)
|
||||
elParentNode.parentNode.removeChild(elParentNode)
|
||||
}
|
||||
},
|
||||
|
||||
isJqueryLoad: (fn) => {
|
||||
if (typeof jQuery === 'undefined') {
|
||||
getScript(GLOBAL_CONFIG.source.jQuery).then(fn)
|
||||
} else {
|
||||
fn()
|
||||
}
|
||||
},
|
||||
|
||||
isHidden: (ele) => ele.offsetHeight === 0 && ele.offsetWidth === 0,
|
||||
|
||||
getEleTop: (ele) => {
|
||||
let actualTop = ele.offsetTop
|
||||
let current = ele.offsetParent
|
||||
|
||||
while (current !== null) {
|
||||
actualTop += current.offsetTop
|
||||
current = current.offsetParent
|
||||
}
|
||||
|
||||
return actualTop
|
||||
}
|
||||
|
||||
isMobile: () => /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent),
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1 @@
|
|||
!function(n){"use strict";var t=function(){return document.createElement("canvas").getContext("2d")},e=function(n,e){var a=new Image,o=n.src||n;"data:"!==o.substring(0,5)&&(a.crossOrigin="Anonymous"),a.onload=function(){var n=t("2d");n.drawImage(a,0,0);var o=n.getImageData(0,0,a.width,a.height);e&&e(o.data)},a.src=o},a=function(n){return["rgb(",n,")"].join("")},o=function(n){return n.map(function(n){return a(n.name)})},r=5,i=10,c={};c.colors=function(n,t){t=t||{};var c=t.exclude||[],u=t.paletteSize||i;e(n,function(e){for(var i=n.width*n.height||e.length,m={},s="",d=[],f={dominant:{name:"",count:0},palette:Array.apply(null,new Array(u)).map(Boolean).map(function(){return{name:"0,0,0",count:0}})},l=0;i>l;){if(d[0]=e[l],d[1]=e[l+1],d[2]=e[l+2],s=d.join(","),m[s]=s in m?m[s]+1:1,-1===c.indexOf(a(s))){var g=m[s];g>f.dominant.count?(f.dominant.name=s,f.dominant.count=g):f.palette.some(function(n){return g>n.count?(n.name=s,n.count=g,!0):void 0})}l+=4*r}if(t.success){var p=o(f.palette);t.success({dominant:a(f.dominant.name),secondary:p[0],palette:p})}})},n.RGBaster=n.RGBaster||c}(window);
|
||||
|
|
@ -0,0 +1 @@
|
|||
.snackbar-container{transition:all .5s ease;transition-property:top,right,bottom,left,opacity;font-family:Roboto,sans-serif;font-size:14px;min-height:14px;background-color:#070b0e;position:fixed;display:flex;justify-content:space-between;align-items:center;color:#fff;line-height:22px;padding:18px 24px;bottom:-100px;top:-100px;opacity:0;z-index:9999}.snackbar-container .action{background:inherit;display:inline-block;border:none;font-size:inherit;text-transform:uppercase;color:#4caf50;margin:0 0 0 24px;padding:0;min-width:min-content;cursor:pointer}@media (min-width:640px){.snackbar-container{min-width:288px;max-width:568px;display:inline-flex;border-radius:2px;margin:24px}}@media (max-width:640px){.snackbar-container{left:0;right:0;width:100%}}.snackbar-pos.bottom-center{top:auto!important;bottom:0;left:50%;transform:translate(-50%,0)}.snackbar-pos.bottom-left{top:auto!important;bottom:0;left:0}.snackbar-pos.bottom-right{top:auto!important;bottom:0;right:0}.snackbar-pos.top-left{bottom:auto!important;top:0;left:0}.snackbar-pos.top-center{bottom:auto!important;top:0;left:50%;transform:translate(-50%,0)}.snackbar-pos.top-right{bottom:auto!important;top:0;right:0}@media (max-width:640px){.snackbar-pos.bottom-center,.snackbar-pos.top-center{left:0;transform:none}}
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
/*!
|
||||
* Snackbar v0.1.14
|
||||
* http://polonel.com/Snackbar
|
||||
*
|
||||
* Copyright 2018 Chris Brame and other contributors
|
||||
* Released under the MIT license
|
||||
* https://github.com/polonel/Snackbar/blob/master/LICENSE
|
||||
*/
|
||||
!function(a,b){"use strict";"function"==typeof define&&define.amd?define([],function(){return a.Snackbar=b()}):"object"==typeof module&&module.exports?module.exports=a.Snackbar=b():a.Snackbar=b()}(this,function(){var a={};a.current=null;var b={text:"Default Text",textColor:"#FFFFFF",width:"auto",showAction:!0,actionText:"Dismiss",actionTextAria:"Dismiss, Description for Screen Readers",alertScreenReader:!1,actionTextColor:"#4CAF50",showSecondButton:!1,secondButtonText:"",secondButtonAria:"Description for Screen Readers",secondButtonTextColor:"#4CAF50",backgroundColor:"#323232",pos:"bottom-left",duration:5e3,customClass:"",onActionClick:function(a){a.style.opacity=0},onSecondButtonClick:function(a){},onClose:function(a){}};a.show=function(d){var e=c(!0,b,d);a.current&&(a.current.style.opacity=0,setTimeout(function(){var a=this.parentElement;a&&
|
||||
// possible null if too many/fast Snackbars
|
||||
a.removeChild(this)}.bind(a.current),500)),a.snackbar=document.createElement("div"),a.snackbar.className="snackbar-container "+e.customClass,a.snackbar.style.width=e.width;var f=document.createElement("p");if(f.style.margin=0,f.style.padding=0,f.style.color=e.textColor,f.style.fontSize="14px",f.style.fontWeight=300,f.style.lineHeight="1em",f.innerHTML=e.text,a.snackbar.appendChild(f),a.snackbar.style.background=e.backgroundColor,e.showSecondButton){var g=document.createElement("button");g.className="action",g.innerHTML=e.secondButtonText,g.setAttribute("aria-label",e.secondButtonAria),g.style.color=e.secondButtonTextColor,g.addEventListener("click",function(){e.onSecondButtonClick(a.snackbar)}),a.snackbar.appendChild(g)}if(e.showAction){var h=document.createElement("button");h.className="action",h.innerHTML=e.actionText,h.setAttribute("aria-label",e.actionTextAria),h.style.color=e.actionTextColor,h.addEventListener("click",function(){e.onActionClick(a.snackbar)}),a.snackbar.appendChild(h)}e.duration&&setTimeout(function(){a.current===this&&(a.current.style.opacity=0,
|
||||
// When natural remove event occurs let's move the snackbar to its origins
|
||||
a.current.style.top="-100px",a.current.style.bottom="-100px")}.bind(a.snackbar),e.duration),e.alertScreenReader&&a.snackbar.setAttribute("role","alert"),a.snackbar.addEventListener("transitionend",function(b,c){"opacity"===b.propertyName&&"0"===this.style.opacity&&("function"==typeof e.onClose&&e.onClose(this),this.parentElement.removeChild(this),a.current===this&&(a.current=null))}.bind(a.snackbar)),a.current=a.snackbar,document.body.appendChild(a.snackbar);getComputedStyle(a.snackbar).bottom,getComputedStyle(a.snackbar).top;a.snackbar.style.opacity=1,a.snackbar.className="snackbar-container "+e.customClass+" snackbar-pos "+e.pos},a.close=function(){a.current&&(a.current.style.opacity=0)};
|
||||
// Pure JS Extend
|
||||
// http://gomakethings.com/vanilla-javascript-version-of-jquery-extend/
|
||||
var c=function(){var a={},b=!1,d=0,e=arguments.length;"[object Boolean]"===Object.prototype.toString.call(arguments[0])&&(b=arguments[0],d++);for(var f=function(d){for(var e in d)Object.prototype.hasOwnProperty.call(d,e)&&(b&&"[object Object]"===Object.prototype.toString.call(d[e])?a[e]=c(!0,a[e],d[e]):a[e]=d[e])};d<e;d++){var g=arguments[d];f(g)}return a};return a});
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,13 @@
|
|||
/**
|
||||
* ViewImage.min.js 2.0.2
|
||||
* MIT License - http://www.opensource.org/licenses/mit-license.php
|
||||
* https://tokinx.github.io/ViewImage/
|
||||
*/
|
||||
var $jscomp=$jscomp||{};$jscomp.scope={};$jscomp.createTemplateTagFirstArg=function(b){return b.raw=b};$jscomp.createTemplateTagFirstArgWithRaw=function(b,a){b.raw=a;return b};$jscomp.arrayIteratorImpl=function(b){var a=0;return function(){return a<b.length?{done:!1,value:b[a++]}:{done:!0}}};$jscomp.arrayIterator=function(b){return{next:$jscomp.arrayIteratorImpl(b)}};$jscomp.makeIterator=function(b){var a="undefined"!=typeof Symbol&&Symbol.iterator&&b[Symbol.iterator];return a?a.call(b):$jscomp.arrayIterator(b)};
|
||||
$jscomp.arrayFromIterator=function(b){for(var a,d=[];!(a=b.next()).done;)d.push(a.value);return d};$jscomp.arrayFromIterable=function(b){return b instanceof Array?b:$jscomp.arrayFromIterator($jscomp.makeIterator(b))};
|
||||
(function(){window.ViewImage=new function(){var b=this;this.target="[view-image] img";this.listener=function(a){if(!(a.ctrlKey||a.metaKey||a.shiftKey||a.altKey)){var d=String(b.target.split(",").map(function(g){return g.trim()+":not([no-view])"})),c=a.target.closest(d);if(c){var e=c.closest("[view-image]")||document.body;d=[].concat($jscomp.arrayFromIterable(e.querySelectorAll(d))).map(function(g){return g.href||g.src});b.display(d,c.href||c.src);a.stopPropagation();a.preventDefault()}}};this.init=
|
||||
function(a){a&&(b.target=a);["removeEventListener","addEventListener"].forEach(function(d){document[d]("click",b.listener,!1)})};this.display=function(a,d){var c=a.indexOf(d),e=(new DOMParser).parseFromString('\n <div class="view-image">\n <style>.view-image{position:fixed;inset:0;z-index:500;padding:1rem;display:flex;flex-direction:column;animation:view-image-in 300ms;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.view-image__out{animation:view-image-out 300ms}@keyframes view-image-in{0%{opacity:0}}@keyframes view-image-out{100%{opacity:0}}.view-image-btn{width:32px;height:32px;display:flex;justify-content:center;align-items:center;cursor:pointer;border-radius:3px;background-color:rgba(255,255,255,0.2)}.view-image-btn:hover{background-color:rgba(255,255,255,0.5)}.view-image-close__full{position:absolute;inset:0;background-color:rgba(48,55,66,0.3);z-index:unset;cursor:zoom-out;margin:0}.view-image-container{height:0;flex:1;display:flex;align-items:center;justify-content:center;}.view-image-lead{display:contents}.view-image-lead img{position:relative;z-index:1;max-width:100%;max-height:100%;object-fit:contain;border-radius:3px}.view-image-lead__in img{animation:view-image-lead-in 300ms}.view-image-lead__out img{animation:view-image-lead-out 300ms forwards}@keyframes view-image-lead-in{0%{opacity:0;transform:translateY(-20px)}}@keyframes view-image-lead-out{100%{opacity:0;transform:translateY(20px)}}[class*=__out] ~ .view-image-loading{display:block}.view-image-loading{position:absolute;inset:50%;width:8rem;height:2rem;color:#aab2bd;overflow:hidden;text-align:center;margin:-1rem -4rem;z-index:1;display:none}.view-image-loading::after{content:"";position:absolute;inset:50% 0;width:100%;height:3px;background:rgba(255,255,255,0.5);transform:translateX(-100%) translateY(-50%);animation:view-image-loading 800ms -100ms ease-in-out infinite}@keyframes view-image-loading{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}.view-image-tools{position:relative;display:flex;justify-content:space-between;align-content:center;color:#fff;max-width:600px;position: absolute; bottom: 5%; left: 1rem; right: 1rem; backdrop-filter: blur(10px);margin:0 auto;padding:10px;border-radius:5px;background:rgba(0,0,0,0.1);margin-bottom:constant(safe-area-inset-bottom);margin-bottom:env(safe-area-inset-bottom);z-index:1}.view-image-tools__count{width:60px;display:flex;align-items:center;justify-content:center}.view-image-tools__flip{display:flex;gap:10px}.view-image-tools [class*=-close]{margin:0 10px}</style>\n <div class="view-image-container">\n <div class="view-image-lead"></div>\n <div class="view-image-loading"></div>\n <div class="view-image-close view-image-close__full"></div>\n </div>\n <div class="view-image-tools">\n <div class="view-image-tools__count">\n <span><b class="view-image-index">'+
|
||||
(c+1)+"</b>/"+a.length+'</span>\n </div>\n <div class="view-image-tools__flip">\n <div class="view-image-btn view-image-tools__flip-prev">\n <svg width="20" height="20" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="48" height="48" fill="white" fill-opacity="0.01"/><path d="M31 36L19 24L31 12" stroke="white" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/></svg>\n </div>\n <div class="view-image-btn view-image-tools__flip-next">\n <svg width="20" height="20" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="48" height="48" fill="white" fill-opacity="0.01"/><path d="M19 12L31 24L19 36" stroke="white" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/></svg>\n </div>\n </div>\n <div class="view-image-btn view-image-close">\n <svg width="16" height="16" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="48" height="48" fill="white" fill-opacity="0.01"/><path d="M8 8L40 40" stroke="white" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/><path d="M8 40L40 8" stroke="white" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/></svg>\n </div>\n </div>\n </div>\n ',
|
||||
"text/html").body.firstChild,g=function(f){var h={Escape:"close",ArrowLeft:"tools__flip-prev",ArrowRight:"tools__flip-next"};h[f.key]&&e.querySelector(".view-image-"+h[f.key]).click()},l=function(f){var h=new Image,k=e.querySelector(".view-image-lead");k.className="view-image-lead view-image-lead__out";setTimeout(function(){k.innerHTML="";h.onload=function(){setTimeout(function(){k.innerHTML='<img src="'+h.src+'" alt="ViewImage" no-view/>';k.className="view-image-lead view-image-lead__in"},100)};
|
||||
h.src=f},300)};document.body.appendChild(e);l(d);window.addEventListener("keydown",g);e.onclick=function(f){f.target.closest(".view-image-close")?(window.removeEventListener("keydown",g),e.onclick=null,e.classList.add("view-image__out"),setTimeout(function(){return e.remove()},290)):f.target.closest(".view-image-tools__flip")&&(c=f.target.closest(".view-image-tools__flip-prev")?0===c?a.length-1:c-1:c===a.length-1?0:c+1,l(a[c]),e.querySelector(".view-image-index").innerHTML=c+1)}}}})();
|
||||
|
||||
|
|
@ -0,0 +1 @@
|
|||
function waterfall(a){function b(a,b){var c=window.getComputedStyle(b);return parseFloat(c["margin"+a])||0}function c(a){return a+"px"}function d(a){return parseFloat(a.style.top)}function e(a){return parseFloat(a.style.left)}function f(a){return a.clientWidth}function g(a){return a.clientHeight}function h(a){return d(a)+g(a)+b("Bottom",a)}function i(a){return e(a)+f(a)+b("Right",a)}function j(a){a=a.sort(function(a,b){return h(a)===h(b)?e(b)-e(a):h(b)-h(a)})}function k(b){f(a)!=t&&(b.target.removeEventListener(b.type,arguments.callee),waterfall(a))}"string"==typeof a&&(a=document.querySelector(a));var l=[].map.call(a.children,function(a){return a.style.position="absolute",a});a.style.position="relative";var m=[];l.length&&(l[0].style.top="0px",l[0].style.left=c(b("Left",l[0])),m.push(l[0]));for(var n=1;n<l.length;n++){var o=l[n-1],p=l[n],q=i(o)+f(p)<=f(a);if(!q)break;p.style.top=o.style.top,p.style.left=c(i(o)+b("Left",p)),m.push(p)}for(;n<l.length;n++){j(m);var p=l[n],r=m.pop();p.style.top=c(h(r)+b("Top",p)),p.style.left=c(e(r)),m.push(p)}j(m);var s=m[0];a.style.height=c(h(s)+b("Bottom",s));var t=f(a);window.addEventListener?window.addEventListener("resize",k):document.body.onresize=k}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,479 +0,0 @@
|
|||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 3736806 */
|
||||
src: url('iconfont.woff2?t=1675495619599') format('woff2'),
|
||||
url('iconfont.woff?t=1675495619599') format('woff'),
|
||||
url('iconfont.ttf?t=1675495619599') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-arrows-alt-h:before {
|
||||
content: "\ef28";
|
||||
}
|
||||
|
||||
.icon-plus-circle:before {
|
||||
content: "\f082";
|
||||
}
|
||||
|
||||
.icon-csdn1:before {
|
||||
content: "\e608";
|
||||
}
|
||||
|
||||
.icon-CN_cnblogs:before {
|
||||
content: "\e64d";
|
||||
}
|
||||
|
||||
.icon-leetcode:before {
|
||||
content: "\ebf2";
|
||||
}
|
||||
|
||||
.icon-juejin:before {
|
||||
content: "\e606";
|
||||
}
|
||||
|
||||
.icon-weibiaoti-1:before {
|
||||
content: "\e607";
|
||||
}
|
||||
|
||||
.icon-csdn:before {
|
||||
content: "\e60a";
|
||||
}
|
||||
|
||||
.icon-bokeyuan:before {
|
||||
content: "\e623";
|
||||
}
|
||||
|
||||
.icon-yuque:before {
|
||||
content: "\e880";
|
||||
}
|
||||
|
||||
.icon-jinritoutiao:before {
|
||||
content: "\e68d";
|
||||
}
|
||||
|
||||
.icon-weixingongzhonghao:before {
|
||||
content: "\e605";
|
||||
}
|
||||
|
||||
.icon-steam-line:before {
|
||||
content: "\e75f";
|
||||
}
|
||||
|
||||
.icon-steam-fill:before {
|
||||
content: "\e763";
|
||||
}
|
||||
|
||||
.icon-slack-line:before {
|
||||
content: "\e75c";
|
||||
}
|
||||
|
||||
.icon-linkedin-box-line:before {
|
||||
content: "\e750";
|
||||
}
|
||||
|
||||
.icon-telegram-line:before {
|
||||
content: "\e761";
|
||||
}
|
||||
|
||||
.icon-douyin:before {
|
||||
content: "\e673";
|
||||
}
|
||||
|
||||
.icon-wechat2:before {
|
||||
content: "\e632";
|
||||
}
|
||||
|
||||
.icon-phone-line:before {
|
||||
content: "\e6ac";
|
||||
}
|
||||
|
||||
.icon-alipay-line:before {
|
||||
content: "\e73c";
|
||||
}
|
||||
|
||||
.icon-app-store-line:before {
|
||||
content: "\e73e";
|
||||
}
|
||||
|
||||
.icon-baidu-line:before {
|
||||
content: "\e73f";
|
||||
}
|
||||
|
||||
.icon-bilibili-line:before {
|
||||
content: "\e740";
|
||||
}
|
||||
|
||||
.icon-dingding-line:before {
|
||||
content: "\e743";
|
||||
}
|
||||
|
||||
.icon-douban-line:before {
|
||||
content: "\e744";
|
||||
}
|
||||
|
||||
.icon-disqus-line:before {
|
||||
content: "\e745";
|
||||
}
|
||||
|
||||
.icon-discord-line:before {
|
||||
content: "\e746";
|
||||
}
|
||||
|
||||
.icon-dribbble-line:before {
|
||||
content: "\e747";
|
||||
}
|
||||
|
||||
.icon-drive-line:before {
|
||||
content: "\e748";
|
||||
}
|
||||
|
||||
.icon-facebook-box-line:before {
|
||||
content: "\e749";
|
||||
}
|
||||
|
||||
.icon-dropbox-line:before {
|
||||
content: "\e74a";
|
||||
}
|
||||
|
||||
.icon-evernote-line:before {
|
||||
content: "\e74b";
|
||||
}
|
||||
|
||||
.icon-gitlab-line:before {
|
||||
content: "\e74d";
|
||||
}
|
||||
|
||||
.icon-google-line:before {
|
||||
content: "\e74e";
|
||||
}
|
||||
|
||||
.icon-google-play-line:before {
|
||||
content: "\e74f";
|
||||
}
|
||||
|
||||
.icon-instagram-line:before {
|
||||
content: "\e751";
|
||||
}
|
||||
|
||||
.icon-line-fill:before {
|
||||
content: "\e752";
|
||||
}
|
||||
|
||||
.icon-paypal-line:before {
|
||||
content: "\e757";
|
||||
}
|
||||
|
||||
.icon-qq-line:before {
|
||||
content: "\e759";
|
||||
}
|
||||
|
||||
.icon-reddit-line:before {
|
||||
content: "\e75a";
|
||||
}
|
||||
|
||||
.icon-spotify-line:before {
|
||||
content: "\e75d";
|
||||
}
|
||||
|
||||
.icon-stack-overflow-line:before {
|
||||
content: "\e75e";
|
||||
}
|
||||
|
||||
.icon-snapchat-line:before {
|
||||
content: "\e75b";
|
||||
}
|
||||
|
||||
.icon-taobao-line:before {
|
||||
content: "\e760";
|
||||
}
|
||||
|
||||
.icon-twitter-line:before {
|
||||
content: "\e762";
|
||||
}
|
||||
|
||||
.icon-wechat-2-line:before {
|
||||
content: "\e766";
|
||||
}
|
||||
|
||||
.icon-wechat-fill:before {
|
||||
content: "\e768";
|
||||
}
|
||||
|
||||
.icon-wechat-line:before {
|
||||
content: "\e769";
|
||||
}
|
||||
|
||||
.icon-weibo-line:before {
|
||||
content: "\e76a";
|
||||
}
|
||||
|
||||
.icon-whatsapp-line:before {
|
||||
content: "\e76b";
|
||||
}
|
||||
|
||||
.icon-youtube-line:before {
|
||||
content: "\e76c";
|
||||
}
|
||||
|
||||
.icon-zhihu-line:before {
|
||||
content: "\e76d";
|
||||
}
|
||||
|
||||
.icon-wechat-2-fill:before {
|
||||
content: "\e76e";
|
||||
}
|
||||
|
||||
.icon-by:before {
|
||||
content: "\e601";
|
||||
}
|
||||
|
||||
.icon-cc:before {
|
||||
content: "\e602";
|
||||
}
|
||||
|
||||
.icon-nc:before {
|
||||
content: "\e603";
|
||||
}
|
||||
|
||||
.icon-nd:before {
|
||||
content: "\e604";
|
||||
}
|
||||
|
||||
.icon-HAO:before {
|
||||
content: "\e60e";
|
||||
}
|
||||
|
||||
.icon-logo-hao-pro:before {
|
||||
content: "\f290";
|
||||
}
|
||||
|
||||
.icon-logo-hao:before {
|
||||
content: "\e609";
|
||||
}
|
||||
|
||||
.icon-logo-moment:before {
|
||||
content: "\e6af";
|
||||
}
|
||||
|
||||
.icon-indent:before {
|
||||
content: "\f027";
|
||||
}
|
||||
|
||||
.icon-bars:before {
|
||||
content: "\ef34";
|
||||
}
|
||||
|
||||
.icon-mail-line:before {
|
||||
content: "\e668";
|
||||
}
|
||||
|
||||
.icon-github-line:before {
|
||||
content: "\e74c";
|
||||
}
|
||||
|
||||
.icon-moon:before {
|
||||
content: "\f057";
|
||||
}
|
||||
|
||||
.icon-closed-captioning:before {
|
||||
content: "\ef76";
|
||||
}
|
||||
|
||||
.icon-hand-holding:before {
|
||||
content: "\f000";
|
||||
}
|
||||
|
||||
.icon-dice:before {
|
||||
content: "\ef94";
|
||||
}
|
||||
|
||||
.icon-list-ul:before {
|
||||
content: "\f039";
|
||||
}
|
||||
|
||||
.icon-baidu:before {
|
||||
content: "\e6b6";
|
||||
}
|
||||
|
||||
.icon-search:before {
|
||||
content: "\f0a8";
|
||||
}
|
||||
|
||||
.icon-download:before {
|
||||
content: "\efa5";
|
||||
}
|
||||
|
||||
.icon-image:before {
|
||||
content: "\f024";
|
||||
}
|
||||
|
||||
.icon-window-restore:before {
|
||||
content: "\f159";
|
||||
}
|
||||
|
||||
.icon-comment-dots1:before {
|
||||
content: "\f288";
|
||||
}
|
||||
|
||||
.icon-copy:before {
|
||||
content: "\ef86";
|
||||
}
|
||||
|
||||
.icon-bus:before {
|
||||
content: "\ef58";
|
||||
}
|
||||
|
||||
.icon-hotjar:before {
|
||||
content: "\f1cf";
|
||||
}
|
||||
|
||||
.icon-weibo:before {
|
||||
content: "\f261";
|
||||
}
|
||||
|
||||
.icon-robot:before {
|
||||
content: "\f09a";
|
||||
}
|
||||
|
||||
.icon-paste:before {
|
||||
content: "\f068";
|
||||
}
|
||||
|
||||
.icon-link:before {
|
||||
content: "\f037";
|
||||
}
|
||||
|
||||
.icon-qrcode:before {
|
||||
content: "\f08d";
|
||||
}
|
||||
|
||||
.icon-calendar-alt:before {
|
||||
content: "\ef5a";
|
||||
}
|
||||
|
||||
.icon-clock:before {
|
||||
content: "\ef75";
|
||||
}
|
||||
|
||||
.icon-file-word:before {
|
||||
content: "\efd1";
|
||||
}
|
||||
|
||||
.icon-chevron-down:before {
|
||||
content: "\ef6d";
|
||||
}
|
||||
|
||||
.icon-times-circle:before {
|
||||
content: "\f10a";
|
||||
}
|
||||
|
||||
.icon-grip-vertical:before {
|
||||
content: "\efff";
|
||||
}
|
||||
|
||||
.icon-book:before {
|
||||
content: "\ef46";
|
||||
}
|
||||
|
||||
.icon-burn:before {
|
||||
content: "\ef57";
|
||||
}
|
||||
|
||||
.icon-dove:before {
|
||||
content: "\efa4";
|
||||
}
|
||||
|
||||
.icon-arrow-circle-right:before {
|
||||
content: "\ef23";
|
||||
}
|
||||
|
||||
.icon-comment-dots:before {
|
||||
content: "\ef7e";
|
||||
}
|
||||
|
||||
.icon-folder-open:before {
|
||||
content: "\efdc";
|
||||
}
|
||||
|
||||
.icon-file-alt:before {
|
||||
content: "\efc1";
|
||||
}
|
||||
|
||||
.icon-bullseye:before {
|
||||
content: "\ef56";
|
||||
}
|
||||
|
||||
.icon-sliders:before {
|
||||
content: "\f0bf";
|
||||
}
|
||||
|
||||
.icon-tags:before {
|
||||
content: "\f0f3";
|
||||
}
|
||||
|
||||
.icon-comment-alt:before {
|
||||
content: "\f287";
|
||||
}
|
||||
|
||||
.icon-eye:before {
|
||||
content: "\f28f";
|
||||
}
|
||||
|
||||
.icon-arrow-left:before {
|
||||
content: "\ef26";
|
||||
}
|
||||
|
||||
.icon-arrow-right:before {
|
||||
content: "\ef27";
|
||||
}
|
||||
|
||||
.icon-arrow-up:before {
|
||||
content: "\ef2a";
|
||||
}
|
||||
|
||||
.icon-chevron-left:before {
|
||||
content: "\ef6e";
|
||||
}
|
||||
|
||||
.icon-chevron-right:before {
|
||||
content: "\ef6f";
|
||||
}
|
||||
|
||||
.icon-redo-alt:before {
|
||||
content: "\f094";
|
||||
}
|
||||
|
||||
.icon-listol:before {
|
||||
content: "\e767";
|
||||
}
|
||||
|
||||
.icon-arrowup:before {
|
||||
content: "\e64c";
|
||||
}
|
||||
|
||||
.icon-icon-sidebar-scxmtj:before {
|
||||
content: "\e643";
|
||||
}
|
||||
|
||||
.icon-train-public-transport:before {
|
||||
content: "\e600";
|
||||
}
|
||||
|
||||
.icon-a-theconsole-fill:before {
|
||||
content: "\ea32";
|
||||
}
|
||||
|
||||
.icon-shuffle:before {
|
||||
content: "\e67e";
|
||||
}
|
||||
|
||||
.icon-md-train:before {
|
||||
content: "\e77d";
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,821 +0,0 @@
|
|||
{
|
||||
"id": "3736806",
|
||||
"name": "hao",
|
||||
"font_family": "iconfont",
|
||||
"css_prefix_text": "icon-",
|
||||
"description": "",
|
||||
"glyphs": [
|
||||
{
|
||||
"icon_id": "5633818",
|
||||
"name": "arrows-alt-h",
|
||||
"font_class": "arrows-alt-h",
|
||||
"unicode": "ef28",
|
||||
"unicode_decimal": 61224
|
||||
},
|
||||
{
|
||||
"icon_id": "5634298",
|
||||
"name": "plus-circle",
|
||||
"font_class": "plus-circle",
|
||||
"unicode": "f082",
|
||||
"unicode_decimal": 61570
|
||||
},
|
||||
{
|
||||
"icon_id": "3506983",
|
||||
"name": "csdn",
|
||||
"font_class": "csdn1",
|
||||
"unicode": "e608",
|
||||
"unicode_decimal": 58888
|
||||
},
|
||||
{
|
||||
"icon_id": "2041684",
|
||||
"name": "CN_cnblogs",
|
||||
"font_class": "CN_cnblogs",
|
||||
"unicode": "e64d",
|
||||
"unicode_decimal": 58957
|
||||
},
|
||||
{
|
||||
"icon_id": "15378535",
|
||||
"name": "leetcode",
|
||||
"font_class": "leetcode",
|
||||
"unicode": "ebf2",
|
||||
"unicode_decimal": 60402
|
||||
},
|
||||
{
|
||||
"icon_id": "18422914",
|
||||
"name": "juejin",
|
||||
"font_class": "juejin",
|
||||
"unicode": "e606",
|
||||
"unicode_decimal": 58886
|
||||
},
|
||||
{
|
||||
"icon_id": "18458782",
|
||||
"name": "infoQ",
|
||||
"font_class": "weibiaoti-1",
|
||||
"unicode": "e607",
|
||||
"unicode_decimal": 58887
|
||||
},
|
||||
{
|
||||
"icon_id": "829865",
|
||||
"name": "csdn",
|
||||
"font_class": "csdn",
|
||||
"unicode": "e60a",
|
||||
"unicode_decimal": 58890
|
||||
},
|
||||
{
|
||||
"icon_id": "833511",
|
||||
"name": "博客园",
|
||||
"font_class": "bokeyuan",
|
||||
"unicode": "e623",
|
||||
"unicode_decimal": 58915
|
||||
},
|
||||
{
|
||||
"icon_id": "4936975",
|
||||
"name": "yuque",
|
||||
"font_class": "yuque",
|
||||
"unicode": "e880",
|
||||
"unicode_decimal": 59520
|
||||
},
|
||||
{
|
||||
"icon_id": "13743995",
|
||||
"name": "jinritoutiao",
|
||||
"font_class": "jinritoutiao",
|
||||
"unicode": "e68d",
|
||||
"unicode_decimal": 59021
|
||||
},
|
||||
{
|
||||
"icon_id": "28650243",
|
||||
"name": "微信公众号",
|
||||
"font_class": "weixingongzhonghao",
|
||||
"unicode": "e605",
|
||||
"unicode_decimal": 58885
|
||||
},
|
||||
{
|
||||
"icon_id": "20818171",
|
||||
"name": "steam-line",
|
||||
"font_class": "steam-line",
|
||||
"unicode": "e75f",
|
||||
"unicode_decimal": 59231
|
||||
},
|
||||
{
|
||||
"icon_id": "20818172",
|
||||
"name": "steam-fill",
|
||||
"font_class": "steam-fill",
|
||||
"unicode": "e763",
|
||||
"unicode_decimal": 59235
|
||||
},
|
||||
{
|
||||
"icon_id": "20818156",
|
||||
"name": "slack-line",
|
||||
"font_class": "slack-line",
|
||||
"unicode": "e75c",
|
||||
"unicode_decimal": 59228
|
||||
},
|
||||
{
|
||||
"icon_id": "20818112",
|
||||
"name": "linkedin-box-line",
|
||||
"font_class": "linkedin-box-line",
|
||||
"unicode": "e750",
|
||||
"unicode_decimal": 59216
|
||||
},
|
||||
{
|
||||
"icon_id": "20818178",
|
||||
"name": "telegram-line",
|
||||
"font_class": "telegram-line",
|
||||
"unicode": "e761",
|
||||
"unicode_decimal": 59233
|
||||
},
|
||||
{
|
||||
"icon_id": "22273028",
|
||||
"name": "douyin",
|
||||
"font_class": "douyin",
|
||||
"unicode": "e673",
|
||||
"unicode_decimal": 58995
|
||||
},
|
||||
{
|
||||
"icon_id": "14629289",
|
||||
"name": "wechat2",
|
||||
"font_class": "wechat2",
|
||||
"unicode": "e632",
|
||||
"unicode_decimal": 58930
|
||||
},
|
||||
{
|
||||
"icon_id": "20817466",
|
||||
"name": "phone-line",
|
||||
"font_class": "phone-line",
|
||||
"unicode": "e6ac",
|
||||
"unicode_decimal": 59052
|
||||
},
|
||||
{
|
||||
"icon_id": "20818029",
|
||||
"name": "alipay-line",
|
||||
"font_class": "alipay-line",
|
||||
"unicode": "e73c",
|
||||
"unicode_decimal": 59196
|
||||
},
|
||||
{
|
||||
"icon_id": "20818039",
|
||||
"name": "app-store-line",
|
||||
"font_class": "app-store-line",
|
||||
"unicode": "e73e",
|
||||
"unicode_decimal": 59198
|
||||
},
|
||||
{
|
||||
"icon_id": "20818044",
|
||||
"name": "baidu-line",
|
||||
"font_class": "baidu-line",
|
||||
"unicode": "e73f",
|
||||
"unicode_decimal": 59199
|
||||
},
|
||||
{
|
||||
"icon_id": "20818045",
|
||||
"name": "bilibili-line",
|
||||
"font_class": "bilibili-line",
|
||||
"unicode": "e740",
|
||||
"unicode_decimal": 59200
|
||||
},
|
||||
{
|
||||
"icon_id": "20818057",
|
||||
"name": "dingding-line",
|
||||
"font_class": "dingding-line",
|
||||
"unicode": "e743",
|
||||
"unicode_decimal": 59203
|
||||
},
|
||||
{
|
||||
"icon_id": "20818060",
|
||||
"name": "douban-line",
|
||||
"font_class": "douban-line",
|
||||
"unicode": "e744",
|
||||
"unicode_decimal": 59204
|
||||
},
|
||||
{
|
||||
"icon_id": "20818061",
|
||||
"name": "disqus-line",
|
||||
"font_class": "disqus-line",
|
||||
"unicode": "e745",
|
||||
"unicode_decimal": 59205
|
||||
},
|
||||
{
|
||||
"icon_id": "20818062",
|
||||
"name": "discord-line",
|
||||
"font_class": "discord-line",
|
||||
"unicode": "e746",
|
||||
"unicode_decimal": 59206
|
||||
},
|
||||
{
|
||||
"icon_id": "20818064",
|
||||
"name": "dribbble-line",
|
||||
"font_class": "dribbble-line",
|
||||
"unicode": "e747",
|
||||
"unicode_decimal": 59207
|
||||
},
|
||||
{
|
||||
"icon_id": "20818065",
|
||||
"name": "drive-line",
|
||||
"font_class": "drive-line",
|
||||
"unicode": "e748",
|
||||
"unicode_decimal": 59208
|
||||
},
|
||||
{
|
||||
"icon_id": "20818068",
|
||||
"name": "facebook-box-line",
|
||||
"font_class": "facebook-box-line",
|
||||
"unicode": "e749",
|
||||
"unicode_decimal": 59209
|
||||
},
|
||||
{
|
||||
"icon_id": "20818074",
|
||||
"name": "dropbox-line",
|
||||
"font_class": "dropbox-line",
|
||||
"unicode": "e74a",
|
||||
"unicode_decimal": 59210
|
||||
},
|
||||
{
|
||||
"icon_id": "20818085",
|
||||
"name": "evernote-line",
|
||||
"font_class": "evernote-line",
|
||||
"unicode": "e74b",
|
||||
"unicode_decimal": 59211
|
||||
},
|
||||
{
|
||||
"icon_id": "20818088",
|
||||
"name": "gitlab-line",
|
||||
"font_class": "gitlab-line",
|
||||
"unicode": "e74d",
|
||||
"unicode_decimal": 59213
|
||||
},
|
||||
{
|
||||
"icon_id": "20818092",
|
||||
"name": "google-line",
|
||||
"font_class": "google-line",
|
||||
"unicode": "e74e",
|
||||
"unicode_decimal": 59214
|
||||
},
|
||||
{
|
||||
"icon_id": "20818094",
|
||||
"name": "google-play-line",
|
||||
"font_class": "google-play-line",
|
||||
"unicode": "e74f",
|
||||
"unicode_decimal": 59215
|
||||
},
|
||||
{
|
||||
"icon_id": "20818106",
|
||||
"name": "instagram-line",
|
||||
"font_class": "instagram-line",
|
||||
"unicode": "e751",
|
||||
"unicode_decimal": 59217
|
||||
},
|
||||
{
|
||||
"icon_id": "20818121",
|
||||
"name": "line-fill",
|
||||
"font_class": "line-fill",
|
||||
"unicode": "e752",
|
||||
"unicode_decimal": 59218
|
||||
},
|
||||
{
|
||||
"icon_id": "20818138",
|
||||
"name": "paypal-line",
|
||||
"font_class": "paypal-line",
|
||||
"unicode": "e757",
|
||||
"unicode_decimal": 59223
|
||||
},
|
||||
{
|
||||
"icon_id": "20818146",
|
||||
"name": "qq-line",
|
||||
"font_class": "qq-line",
|
||||
"unicode": "e759",
|
||||
"unicode_decimal": 59225
|
||||
},
|
||||
{
|
||||
"icon_id": "20818153",
|
||||
"name": "reddit-line",
|
||||
"font_class": "reddit-line",
|
||||
"unicode": "e75a",
|
||||
"unicode_decimal": 59226
|
||||
},
|
||||
{
|
||||
"icon_id": "20818162",
|
||||
"name": "spotify-line",
|
||||
"font_class": "spotify-line",
|
||||
"unicode": "e75d",
|
||||
"unicode_decimal": 59229
|
||||
},
|
||||
{
|
||||
"icon_id": "20818166",
|
||||
"name": "stack-overflow-line",
|
||||
"font_class": "stack-overflow-line",
|
||||
"unicode": "e75e",
|
||||
"unicode_decimal": 59230
|
||||
},
|
||||
{
|
||||
"icon_id": "20818168",
|
||||
"name": "snapchat-line",
|
||||
"font_class": "snapchat-line",
|
||||
"unicode": "e75b",
|
||||
"unicode_decimal": 59227
|
||||
},
|
||||
{
|
||||
"icon_id": "20818175",
|
||||
"name": "taobao-line",
|
||||
"font_class": "taobao-line",
|
||||
"unicode": "e760",
|
||||
"unicode_decimal": 59232
|
||||
},
|
||||
{
|
||||
"icon_id": "20818181",
|
||||
"name": "twitter-line",
|
||||
"font_class": "twitter-line",
|
||||
"unicode": "e762",
|
||||
"unicode_decimal": 59234
|
||||
},
|
||||
{
|
||||
"icon_id": "20818193",
|
||||
"name": "wechat-2-line",
|
||||
"font_class": "wechat-2-line",
|
||||
"unicode": "e766",
|
||||
"unicode_decimal": 59238
|
||||
},
|
||||
{
|
||||
"icon_id": "20818195",
|
||||
"name": "wechat-fill",
|
||||
"font_class": "wechat-fill",
|
||||
"unicode": "e768",
|
||||
"unicode_decimal": 59240
|
||||
},
|
||||
{
|
||||
"icon_id": "20818198",
|
||||
"name": "wechat-line",
|
||||
"font_class": "wechat-line",
|
||||
"unicode": "e769",
|
||||
"unicode_decimal": 59241
|
||||
},
|
||||
{
|
||||
"icon_id": "20818200",
|
||||
"name": "weibo-line",
|
||||
"font_class": "weibo-line",
|
||||
"unicode": "e76a",
|
||||
"unicode_decimal": 59242
|
||||
},
|
||||
{
|
||||
"icon_id": "20818206",
|
||||
"name": "whatsapp-line",
|
||||
"font_class": "whatsapp-line",
|
||||
"unicode": "e76b",
|
||||
"unicode_decimal": 59243
|
||||
},
|
||||
{
|
||||
"icon_id": "20818213",
|
||||
"name": "youtube-line",
|
||||
"font_class": "youtube-line",
|
||||
"unicode": "e76c",
|
||||
"unicode_decimal": 59244
|
||||
},
|
||||
{
|
||||
"icon_id": "20818220",
|
||||
"name": "zhihu-line",
|
||||
"font_class": "zhihu-line",
|
||||
"unicode": "e76d",
|
||||
"unicode_decimal": 59245
|
||||
},
|
||||
{
|
||||
"icon_id": "20818226",
|
||||
"name": "wechat-2-fill",
|
||||
"font_class": "wechat-2-fill",
|
||||
"unicode": "e76e",
|
||||
"unicode_decimal": 59246
|
||||
},
|
||||
{
|
||||
"icon_id": "12095053",
|
||||
"name": "by",
|
||||
"font_class": "by",
|
||||
"unicode": "e601",
|
||||
"unicode_decimal": 58881
|
||||
},
|
||||
{
|
||||
"icon_id": "12095056",
|
||||
"name": "cc",
|
||||
"font_class": "cc",
|
||||
"unicode": "e602",
|
||||
"unicode_decimal": 58882
|
||||
},
|
||||
{
|
||||
"icon_id": "12095063",
|
||||
"name": "nc",
|
||||
"font_class": "nc",
|
||||
"unicode": "e603",
|
||||
"unicode_decimal": 58883
|
||||
},
|
||||
{
|
||||
"icon_id": "12095066",
|
||||
"name": "nd",
|
||||
"font_class": "nd",
|
||||
"unicode": "e604",
|
||||
"unicode_decimal": 58884
|
||||
},
|
||||
{
|
||||
"icon_id": "32816778",
|
||||
"name": "HAO",
|
||||
"font_class": "HAO",
|
||||
"unicode": "e60e",
|
||||
"unicode_decimal": 58894
|
||||
},
|
||||
{
|
||||
"icon_id": "32796142",
|
||||
"name": "logo-hao-copy",
|
||||
"font_class": "logo-hao-pro",
|
||||
"unicode": "f290",
|
||||
"unicode_decimal": 62096
|
||||
},
|
||||
{
|
||||
"icon_id": "32787589",
|
||||
"name": "logo-hao",
|
||||
"font_class": "logo-hao",
|
||||
"unicode": "e609",
|
||||
"unicode_decimal": 58889
|
||||
},
|
||||
{
|
||||
"icon_id": "16440935",
|
||||
"name": "logo-moment",
|
||||
"font_class": "logo-moment",
|
||||
"unicode": "e6af",
|
||||
"unicode_decimal": 59055
|
||||
},
|
||||
{
|
||||
"icon_id": "5634161",
|
||||
"name": "indent",
|
||||
"font_class": "indent",
|
||||
"unicode": "f027",
|
||||
"unicode_decimal": 61479
|
||||
},
|
||||
{
|
||||
"icon_id": "5633834",
|
||||
"name": "bars",
|
||||
"font_class": "bars",
|
||||
"unicode": "ef34",
|
||||
"unicode_decimal": 61236
|
||||
},
|
||||
{
|
||||
"icon_id": "20817029",
|
||||
"name": "mail-line",
|
||||
"font_class": "mail-line",
|
||||
"unicode": "e668",
|
||||
"unicode_decimal": 58984
|
||||
},
|
||||
{
|
||||
"icon_id": "20818096",
|
||||
"name": "github-line",
|
||||
"font_class": "github-line",
|
||||
"unicode": "e74c",
|
||||
"unicode_decimal": 59212
|
||||
},
|
||||
{
|
||||
"icon_id": "5634247",
|
||||
"name": "moon",
|
||||
"font_class": "moon",
|
||||
"unicode": "f057",
|
||||
"unicode_decimal": 61527
|
||||
},
|
||||
{
|
||||
"icon_id": "5633944",
|
||||
"name": "closed-captioning",
|
||||
"font_class": "closed-captioning",
|
||||
"unicode": "ef76",
|
||||
"unicode_decimal": 61302
|
||||
},
|
||||
{
|
||||
"icon_id": "5634114",
|
||||
"name": "hand-holding",
|
||||
"font_class": "hand-holding",
|
||||
"unicode": "f000",
|
||||
"unicode_decimal": 61440
|
||||
},
|
||||
{
|
||||
"icon_id": "5633983",
|
||||
"name": "dice",
|
||||
"font_class": "dice",
|
||||
"unicode": "ef94",
|
||||
"unicode_decimal": 61332
|
||||
},
|
||||
{
|
||||
"icon_id": "5634194",
|
||||
"name": "list-ul",
|
||||
"font_class": "list-ul",
|
||||
"unicode": "f039",
|
||||
"unicode_decimal": 61497
|
||||
},
|
||||
{
|
||||
"icon_id": "386278",
|
||||
"name": "baidu",
|
||||
"font_class": "baidu",
|
||||
"unicode": "e6b6",
|
||||
"unicode_decimal": 59062
|
||||
},
|
||||
{
|
||||
"icon_id": "5634346",
|
||||
"name": "search",
|
||||
"font_class": "search",
|
||||
"unicode": "f0a8",
|
||||
"unicode_decimal": 61608
|
||||
},
|
||||
{
|
||||
"icon_id": "5634003",
|
||||
"name": "download",
|
||||
"font_class": "download",
|
||||
"unicode": "efa5",
|
||||
"unicode_decimal": 61349
|
||||
},
|
||||
{
|
||||
"icon_id": "5634158",
|
||||
"name": "image",
|
||||
"font_class": "image",
|
||||
"unicode": "f024",
|
||||
"unicode_decimal": 61476
|
||||
},
|
||||
{
|
||||
"icon_id": "5634542",
|
||||
"name": "window-restore",
|
||||
"font_class": "window-restore",
|
||||
"unicode": "f159",
|
||||
"unicode_decimal": 61785
|
||||
},
|
||||
{
|
||||
"icon_id": "5634960",
|
||||
"name": "comment-dots",
|
||||
"font_class": "comment-dots1",
|
||||
"unicode": "f288",
|
||||
"unicode_decimal": 62088
|
||||
},
|
||||
{
|
||||
"icon_id": "5633967",
|
||||
"name": "copy",
|
||||
"font_class": "copy",
|
||||
"unicode": "ef86",
|
||||
"unicode_decimal": 61318
|
||||
},
|
||||
{
|
||||
"icon_id": "5633878",
|
||||
"name": "bus",
|
||||
"font_class": "bus",
|
||||
"unicode": "ef58",
|
||||
"unicode_decimal": 61272
|
||||
},
|
||||
{
|
||||
"icon_id": "5634718",
|
||||
"name": "hotjar",
|
||||
"font_class": "hotjar",
|
||||
"unicode": "f1cf",
|
||||
"unicode_decimal": 61903
|
||||
},
|
||||
{
|
||||
"icon_id": "5634903",
|
||||
"name": "weibo",
|
||||
"font_class": "weibo",
|
||||
"unicode": "f261",
|
||||
"unicode_decimal": 62049
|
||||
},
|
||||
{
|
||||
"icon_id": "5634330",
|
||||
"name": "robot",
|
||||
"font_class": "robot",
|
||||
"unicode": "f09a",
|
||||
"unicode_decimal": 61594
|
||||
},
|
||||
{
|
||||
"icon_id": "5634271",
|
||||
"name": "paste",
|
||||
"font_class": "paste",
|
||||
"unicode": "f068",
|
||||
"unicode_decimal": 61544
|
||||
},
|
||||
{
|
||||
"icon_id": "5634192",
|
||||
"name": "link",
|
||||
"font_class": "link",
|
||||
"unicode": "f037",
|
||||
"unicode_decimal": 61495
|
||||
},
|
||||
{
|
||||
"icon_id": "5634313",
|
||||
"name": "qrcode",
|
||||
"font_class": "qrcode",
|
||||
"unicode": "f08d",
|
||||
"unicode_decimal": 61581
|
||||
},
|
||||
{
|
||||
"icon_id": "5633882",
|
||||
"name": "calendar-alt",
|
||||
"font_class": "calendar-alt",
|
||||
"unicode": "ef5a",
|
||||
"unicode_decimal": 61274
|
||||
},
|
||||
{
|
||||
"icon_id": "5633943",
|
||||
"name": "clock",
|
||||
"font_class": "clock",
|
||||
"unicode": "ef75",
|
||||
"unicode_decimal": 61301
|
||||
},
|
||||
{
|
||||
"icon_id": "5634058",
|
||||
"name": "file-word",
|
||||
"font_class": "file-word",
|
||||
"unicode": "efd1",
|
||||
"unicode_decimal": 61393
|
||||
},
|
||||
{
|
||||
"icon_id": "5633931",
|
||||
"name": "chevron-down",
|
||||
"font_class": "chevron-down",
|
||||
"unicode": "ef6d",
|
||||
"unicode_decimal": 61293
|
||||
},
|
||||
{
|
||||
"icon_id": "5634458",
|
||||
"name": "times-circle",
|
||||
"font_class": "times-circle",
|
||||
"unicode": "f10a",
|
||||
"unicode_decimal": 61706
|
||||
},
|
||||
{
|
||||
"icon_id": "5634113",
|
||||
"name": "grip-vertical",
|
||||
"font_class": "grip-vertical",
|
||||
"unicode": "efff",
|
||||
"unicode_decimal": 61439
|
||||
},
|
||||
{
|
||||
"icon_id": "5633858",
|
||||
"name": "book",
|
||||
"font_class": "book",
|
||||
"unicode": "ef46",
|
||||
"unicode_decimal": 61254
|
||||
},
|
||||
{
|
||||
"icon_id": "5633877",
|
||||
"name": "burn",
|
||||
"font_class": "burn",
|
||||
"unicode": "ef57",
|
||||
"unicode_decimal": 61271
|
||||
},
|
||||
{
|
||||
"icon_id": "5634002",
|
||||
"name": "dove",
|
||||
"font_class": "dove",
|
||||
"unicode": "efa4",
|
||||
"unicode_decimal": 61348
|
||||
},
|
||||
{
|
||||
"icon_id": "5633812",
|
||||
"name": "arrow-circle-right",
|
||||
"font_class": "arrow-circle-right",
|
||||
"unicode": "ef23",
|
||||
"unicode_decimal": 61219
|
||||
},
|
||||
{
|
||||
"icon_id": "5633958",
|
||||
"name": "comment-dots",
|
||||
"font_class": "comment-dots",
|
||||
"unicode": "ef7e",
|
||||
"unicode_decimal": 61310
|
||||
},
|
||||
{
|
||||
"icon_id": "5634073",
|
||||
"name": "folder-open",
|
||||
"font_class": "folder-open",
|
||||
"unicode": "efdc",
|
||||
"unicode_decimal": 61404
|
||||
},
|
||||
{
|
||||
"icon_id": "5634038",
|
||||
"name": "file-alt",
|
||||
"font_class": "file-alt",
|
||||
"unicode": "efc1",
|
||||
"unicode_decimal": 61377
|
||||
},
|
||||
{
|
||||
"icon_id": "5633876",
|
||||
"name": "bullseye",
|
||||
"font_class": "bullseye",
|
||||
"unicode": "ef56",
|
||||
"unicode_decimal": 61270
|
||||
},
|
||||
{
|
||||
"icon_id": "5634373",
|
||||
"name": "sliders-h",
|
||||
"font_class": "sliders",
|
||||
"unicode": "f0bf",
|
||||
"unicode_decimal": 61631
|
||||
},
|
||||
{
|
||||
"icon_id": "5634433",
|
||||
"name": "tags",
|
||||
"font_class": "tags",
|
||||
"unicode": "f0f3",
|
||||
"unicode_decimal": 61683
|
||||
},
|
||||
{
|
||||
"icon_id": "5634959",
|
||||
"name": "comment-alt",
|
||||
"font_class": "comment-alt",
|
||||
"unicode": "f287",
|
||||
"unicode_decimal": 62087
|
||||
},
|
||||
{
|
||||
"icon_id": "5634971",
|
||||
"name": "eye",
|
||||
"font_class": "eye",
|
||||
"unicode": "f28f",
|
||||
"unicode_decimal": 62095
|
||||
},
|
||||
{
|
||||
"icon_id": "5633815",
|
||||
"name": "arrow-left",
|
||||
"font_class": "arrow-left",
|
||||
"unicode": "ef26",
|
||||
"unicode_decimal": 61222
|
||||
},
|
||||
{
|
||||
"icon_id": "5633816",
|
||||
"name": "arrow-right",
|
||||
"font_class": "arrow-right",
|
||||
"unicode": "ef27",
|
||||
"unicode_decimal": 61223
|
||||
},
|
||||
{
|
||||
"icon_id": "5633820",
|
||||
"name": "arrow-up",
|
||||
"font_class": "arrow-up",
|
||||
"unicode": "ef2a",
|
||||
"unicode_decimal": 61226
|
||||
},
|
||||
{
|
||||
"icon_id": "5633932",
|
||||
"name": "chevron-left",
|
||||
"font_class": "chevron-left",
|
||||
"unicode": "ef6e",
|
||||
"unicode_decimal": 61294
|
||||
},
|
||||
{
|
||||
"icon_id": "5633933",
|
||||
"name": "chevron-right",
|
||||
"font_class": "chevron-right",
|
||||
"unicode": "ef6f",
|
||||
"unicode_decimal": 61295
|
||||
},
|
||||
{
|
||||
"icon_id": "5634323",
|
||||
"name": "redo-alt",
|
||||
"font_class": "redo-alt",
|
||||
"unicode": "f094",
|
||||
"unicode_decimal": 61588
|
||||
},
|
||||
{
|
||||
"icon_id": "836718",
|
||||
"name": "list-ol",
|
||||
"font_class": "listol",
|
||||
"unicode": "e767",
|
||||
"unicode_decimal": 59239
|
||||
},
|
||||
{
|
||||
"icon_id": "433860",
|
||||
"name": "arrow-up",
|
||||
"font_class": "arrowup",
|
||||
"unicode": "e64c",
|
||||
"unicode_decimal": 58956
|
||||
},
|
||||
{
|
||||
"icon_id": "5652805",
|
||||
"name": "icon-side bar-scxmtj",
|
||||
"font_class": "icon-sidebar-scxmtj",
|
||||
"unicode": "e643",
|
||||
"unicode_decimal": 58947
|
||||
},
|
||||
{
|
||||
"icon_id": "21169476",
|
||||
"name": "train-public-transport",
|
||||
"font_class": "train-public-transport",
|
||||
"unicode": "e600",
|
||||
"unicode_decimal": 58880
|
||||
},
|
||||
{
|
||||
"icon_id": "24342573",
|
||||
"name": "the console-fill",
|
||||
"font_class": "a-theconsole-fill",
|
||||
"unicode": "ea32",
|
||||
"unicode_decimal": 59954
|
||||
},
|
||||
{
|
||||
"icon_id": "1251292",
|
||||
"name": "shuffle",
|
||||
"font_class": "shuffle",
|
||||
"unicode": "e67e",
|
||||
"unicode_decimal": 59006
|
||||
},
|
||||
{
|
||||
"icon_id": "11102802",
|
||||
"name": "md-train",
|
||||
"font_class": "md-train",
|
||||
"unicode": "e77d",
|
||||
"unicode_decimal": 59261
|
||||
}
|
||||
]
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -1,2 +0,0 @@
|
|||
/*! instant.page v5.1.1 - (C) 2019-2020 Alexandre Dieulot - https://instant.page/license */
|
||||
let t,e;const n=new Set,o=document.createElement("link"),i=o.relList&&o.relList.supports&&o.relList.supports("prefetch")&&window.IntersectionObserver&&"isIntersecting"in IntersectionObserverEntry.prototype,s="instantAllowQueryString"in document.body.dataset,a="instantAllowExternalLinks"in document.body.dataset,r="instantWhitelist"in document.body.dataset,c="instantMousedownShortcut"in document.body.dataset,d=1111;let l=65,u=!1,f=!1,m=!1;if("instantIntensity"in document.body.dataset){const t=document.body.dataset.instantIntensity;if("mousedown"==t.substr(0,"mousedown".length))u=!0,"mousedown-only"==t&&(f=!0);else if("viewport"==t.substr(0,"viewport".length))navigator.connection&&(navigator.connection.saveData||navigator.connection.effectiveType&&navigator.connection.effectiveType.includes("2g"))||("viewport"==t?document.documentElement.clientWidth*document.documentElement.clientHeight<45e4&&(m=!0):"viewport-all"==t&&(m=!0));else{const e=parseInt(t);isNaN(e)||(l=e)}}if(i){const n={capture:!0,passive:!0};if(f||document.addEventListener("touchstart",function(t){e=performance.now();const n=t.target.closest("a");if(!h(n))return;v(n.href)},n),u?c||document.addEventListener("mousedown",function(t){const e=t.target.closest("a");if(!h(e))return;v(e.href)},n):document.addEventListener("mouseover",function(n){if(performance.now()-e<d)return;if(!("closest"in n.target))return;const o=n.target.closest("a");if(!h(o))return;o.addEventListener("mouseout",p,{passive:!0}),t=setTimeout(()=>{v(o.href),t=void 0},l)},n),c&&document.addEventListener("mousedown",function(t){if(performance.now()-e<d)return;const n=t.target.closest("a");if(t.which>1||t.metaKey||t.ctrlKey)return;if(!n)return;n.addEventListener("click",function(t){1337!=t.detail&&t.preventDefault()},{capture:!0,passive:!1,once:!0});const o=new MouseEvent("click",{view:window,bubbles:!0,cancelable:!1,detail:1337});n.dispatchEvent(o)},n),m){let t;(t=window.requestIdleCallback?t=>{requestIdleCallback(t,{timeout:1500})}:t=>{t()})(()=>{const t=new IntersectionObserver(e=>{e.forEach(e=>{if(e.isIntersecting){const n=e.target;t.unobserve(n),v(n.href)}})});document.querySelectorAll("a").forEach(e=>{h(e)&&t.observe(e)})})}}function p(e){e.relatedTarget&&e.target.closest("a")==e.relatedTarget.closest("a")||t&&(clearTimeout(t),t=void 0)}function h(t){if(t&&t.href&&(!r||"instant"in t.dataset)&&(a||t.origin==location.origin||"instant"in t.dataset)&&["http:","https:"].includes(t.protocol)&&("http:"!=t.protocol||"https:"!=location.protocol)&&(s||!t.search||"instant"in t.dataset)&&!(t.hash&&t.pathname+t.search==location.pathname+location.search||"noInstant"in t.dataset))return!0}function v(t){if(n.has(t))return;const e=document.createElement("link");e.rel="prefetch",e.href=t,document.head.appendChild(e),n.add(t)}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1 +0,0 @@
|
|||
!function(a,b){"function"==typeof define&&define.amd?define("waterfall",function(){return b}):"object"==typeof module&&module.exports?module.exports=b:a.waterfall=b}(this,function(a){function b(a){return window.getComputedStyle(a)}function c(a,c){return parseFloat(b(c)["margin"+a])||0}function d(a){return parseFloat(a)+"px"}function e(a){return parseFloat(a.style.top)}function f(a){return parseFloat(a.style.left)}function g(a){return parseFloat(b(a).width)}function h(a){return parseFloat(b(a).height)}function i(a){return e(a)+h(a)+c("Bottom",a)}function j(a){return f(a)+g(a)+c("Right",a)}function k(a){a=a.sort(function(a,b){var c=i(b)-i(a);return c||f(b)-f(a)})}function l(a){var b=a;k(b),this.add=function(a){b.push(a),k(b),b.pop()},this.min=function(){return b[b.length-1]},this.max=function(){return b[0]}}function m(a,b,c){a.style.position="absolute",a.style.top=d(b),a.style.left=d(c)}function n(a){m(a,0,c("Left",a))}function o(a,b){m(b,a.style.top,j(a)+c("Left",b))}function p(a,b){m(b,i(a)+c("Top",b),f(a))}function q(a,b){a.style.position="relative",a.style.height=d(i(b)+c("Bottom",b))}function r(b,c){return j(b[c-1])+g(b[c])<=g(a)}"string"==typeof a&&(a=document.querySelector(a));var s=a.children;s.length&&n(s[0]);for(var t=1;t<s.length&&r(s,t);t++)o(s[t-1],s[t]);for(var u=[].slice.call(s,0,t),v=new l(u);t<s.length;t++)p(v.min(),s[t]),v.add(s[t]);q(a,v.max())});
|
||||
|
|
@ -1,789 +0,0 @@
|
|||
// var full_page = document.getElementsByClassName("full_page");
|
||||
// if (full_page.length != 0) {
|
||||
// full_page[0].style.background = "transparent";
|
||||
// }
|
||||
|
||||
|
||||
function checkOpen() {
|
||||
}
|
||||
|
||||
checkOpen.toString = function () {
|
||||
this.opened = true;
|
||||
};
|
||||
|
||||
//封面纯色
|
||||
function coverColor() {
|
||||
var path = document.getElementById("post-cover")?.src;
|
||||
// console.log(path);
|
||||
if (path !== undefined) {
|
||||
|
||||
// 获取颜色 https://github.com/fast-average-color/fast-average-color
|
||||
const fac = new FastAverageColor();
|
||||
|
||||
fac.getColorAsync(path,{
|
||||
// 忽略白色
|
||||
ignoredColor: [255, 255, 255, 255]
|
||||
})
|
||||
.then(color => {
|
||||
/**
|
||||
* 获取数据后的处理程序
|
||||
*/
|
||||
var value = color.hex;
|
||||
// console.log(value);
|
||||
// document.getElementById('page-header').style.backgroundColor=value;
|
||||
// document.styleSheets[0].addRule('#page-header:before','background: '+ value +'!important');
|
||||
|
||||
if (getContrastYIQ(value) === "light") {
|
||||
value = LightenDarkenColor(colorHex(value), -40)
|
||||
}
|
||||
|
||||
document.styleSheets[0].addRule(':root', '--heo-main:' + value + '!important');
|
||||
document.styleSheets[0].addRule(':root', '--heo-main-op:' + value + '23!important');
|
||||
document.styleSheets[0].addRule(':root', '--heo-main-op-deep:' + value + 'dd!important');
|
||||
document.styleSheets[0].addRule(':root', '--heo-main-none:' + value + '00!important');
|
||||
heo.initThemeColor()
|
||||
document.getElementById("coverdiv").classList.add("loaded");
|
||||
})
|
||||
.catch(e => {
|
||||
console.log(e);
|
||||
});
|
||||
|
||||
} else {
|
||||
// document.styleSheets[0].addRule('#page-header:before','background: none!important');
|
||||
document.styleSheets[0].addRule(':root', '--heo-main: var(--heo-theme)!important');
|
||||
document.styleSheets[0].addRule(':root', '--heo-main-op: var(--heo-theme-op)!important');
|
||||
document.styleSheets[0].addRule(':root', '--heo-main-op-deep:var(--heo-theme-op-deep)!important');
|
||||
document.styleSheets[0].addRule(':root', '--heo-main-none: var(--heo-theme-none)!important');
|
||||
heo.initThemeColor()
|
||||
}
|
||||
}
|
||||
|
||||
//RGB颜色转化为16进制颜色
|
||||
function colorHex(str) {
|
||||
var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
|
||||
var that = str;
|
||||
if (/^(rgb|RGB)/.test(that)) {
|
||||
var aColor = that.replace(/(?:\(|\)|rgb|RGB)*/g, "").split(",");
|
||||
var strHex = "#";
|
||||
for (var i = 0; i < aColor.length; i++) {
|
||||
var hex = Number(aColor[i]).toString(16);
|
||||
if (hex === "0") {
|
||||
hex += hex;
|
||||
}
|
||||
strHex += hex;
|
||||
}
|
||||
if (strHex.length !== 7) {
|
||||
strHex = that;
|
||||
}
|
||||
return strHex;
|
||||
} else if (reg.test(that)) {
|
||||
var aNum = that.replace(/#/, "").split("");
|
||||
if (aNum.length === 6) {
|
||||
return that;
|
||||
} else if (aNum.length === 3) {
|
||||
var numHex = "#";
|
||||
for (var i = 0; i < aNum.length; i += 1) {
|
||||
numHex += (aNum[i] + aNum[i]);
|
||||
}
|
||||
return numHex;
|
||||
}
|
||||
} else {
|
||||
return that;
|
||||
}
|
||||
}
|
||||
|
||||
//16进制颜色转化为RGB颜色
|
||||
function colorRgb(str) {
|
||||
var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
|
||||
var sColor = str.toLowerCase();
|
||||
if (sColor && reg.test(sColor)) {
|
||||
if (sColor.length === 4) {
|
||||
var sColorNew = "#";
|
||||
for (var i = 1; i < 4; i += 1) {
|
||||
sColorNew += sColor.slice(i, i + 1).concat(sColor.slice(i, i + 1));
|
||||
}
|
||||
sColor = sColorNew;
|
||||
}
|
||||
//处理六位的颜色值
|
||||
var sColorChange = [];
|
||||
for (var i = 1; i < 7; i += 2) {
|
||||
sColorChange.push(parseInt("0x" + sColor.slice(i, i + 2)));
|
||||
}
|
||||
return "rgb(" + sColorChange.join(",") + ")";
|
||||
} else {
|
||||
return sColor;
|
||||
}
|
||||
}
|
||||
|
||||
//变暗变亮主方法
|
||||
function LightenDarkenColor(col, amt) {
|
||||
var usePound = false;
|
||||
|
||||
if (col[0] == "#") {
|
||||
col = col.slice(1);
|
||||
usePound = true;
|
||||
}
|
||||
|
||||
var num = parseInt(col, 16);
|
||||
|
||||
var r = (num >> 16) + amt;
|
||||
|
||||
if (r > 255) r = 255;
|
||||
else if (r < 0) r = 0;
|
||||
|
||||
var b = ((num >> 8) & 0x00FF) + amt;
|
||||
|
||||
if (b > 255) b = 255;
|
||||
else if (b < 0) b = 0;
|
||||
|
||||
var g = (num & 0x0000FF) + amt;
|
||||
|
||||
if (g > 255) g = 255;
|
||||
else if (g < 0) g = 0;
|
||||
|
||||
|
||||
return (usePound ? "#" : "") + String("000000" + (g | (b << 8) | (r << 16)).toString(16)).slice(-6);
|
||||
}
|
||||
|
||||
//判断是否为亮色
|
||||
function getContrastYIQ(hexcolor) {
|
||||
var colorrgb = colorRgb(hexcolor);
|
||||
var colors = colorrgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
|
||||
var red = colors[1];
|
||||
var green = colors[2];
|
||||
var blue = colors[3];
|
||||
var brightness;
|
||||
brightness = (red * 299) + (green * 587) + (blue * 114);
|
||||
brightness = brightness / 255000;
|
||||
if (brightness >= 0.5) {
|
||||
return "light";
|
||||
} else {
|
||||
return "dark";
|
||||
}
|
||||
}
|
||||
|
||||
//导航栏文章
|
||||
function navTitle() {
|
||||
var titlevalue = document.title;
|
||||
var postName = document.getElementsByClassName("post-title")[0];
|
||||
document.getElementById("page-name-text").innerHTML = postName?.innerText;
|
||||
}
|
||||
|
||||
window.onload = function () {
|
||||
var copybtnlist = document.getElementsByClassName("copybtn")
|
||||
for (var i = 0; i < copybtnlist.length; i++) {
|
||||
document.getElementsByClassName("copybtn")[i].addEventListener("click", function () {
|
||||
showcopy();
|
||||
});
|
||||
}
|
||||
heo.initThemeColor();
|
||||
}
|
||||
|
||||
function showcopy() {
|
||||
if (GLOBAL_CONFIG.Snackbar !== undefined) {
|
||||
btf.snackbarShow(GLOBAL_CONFIG.copy.success)
|
||||
} else {
|
||||
const prevEle = ctx.previousElementSibling
|
||||
prevEle.innerText = GLOBAL_CONFIG.copy.success
|
||||
prevEle.style.opacity = 1
|
||||
setTimeout(() => {
|
||||
prevEle.style.opacity = 0
|
||||
}, 700)
|
||||
}
|
||||
}
|
||||
|
||||
//导航栏上显示标题
|
||||
// var OriginTitile = document.title;
|
||||
// var titleTime;
|
||||
// document.addEventListener('visibilitychange', function () {
|
||||
// if (document.hidden) {
|
||||
// // $('[rel="shortcut icon"]').attr('href', "https://cdn.jsdelivr.net/gh/Akilarlxh/Akilarlxh.github.io@v3.3.3_3/img/siteicon/favicon.png");
|
||||
// document.title = '张洪Heo';
|
||||
// clearTimeout(titleTime);
|
||||
// }
|
||||
// else {
|
||||
// // $('[rel="shortcut icon"]').attr('href', "https://cdn.jsdelivr.net/gh/Akilarlxh/Akilarlxh.github.io@v3.3.3_3/img/siteicon/favicon.png");
|
||||
// document.title = OriginTitile;
|
||||
// // titleTime = setTimeout(function () {
|
||||
// // document.title = OriginTitile;
|
||||
// // }, 2000);
|
||||
// }
|
||||
// });
|
||||
|
||||
// 早上好问好
|
||||
// 获取时间
|
||||
var getTimeState = () => {
|
||||
// 获取当前时间
|
||||
var timeNow = new Date();
|
||||
// 获取当前小时
|
||||
var hours = timeNow.getHours();
|
||||
// 设置默认文字
|
||||
var text = ``;
|
||||
// 判断当前时间段
|
||||
if (hours >= 0 && hours <= 5) {
|
||||
text = `晚安`;
|
||||
} else if (hours > 5 && hours <= 10) {
|
||||
text = `早上好`;
|
||||
} else if (hours > 10 && hours <= 14) {
|
||||
text = `中午好`;
|
||||
} else if (hours > 14 && hours <= 18) {
|
||||
text = `下午好`;
|
||||
} else if (hours > 18 && hours <= 24) {
|
||||
text = `晚上好`;
|
||||
}
|
||||
// console.log(`hours >>>>>`, hours);
|
||||
// console.log(`text >>>>`, text);
|
||||
// 返回当前时间段对应的状态
|
||||
return text;
|
||||
};
|
||||
|
||||
function fly_to_top() {
|
||||
document.getElementById("guli_top").classList.add("open_wing");
|
||||
setTimeout(function () {
|
||||
document.getElementById("guli_top").classList.add("flying");
|
||||
btf.scrollToDest(0, 300);
|
||||
}, 300);
|
||||
setTimeout(function () {
|
||||
// 这里就是处理的事件
|
||||
document.getElementById("guli_top").classList.remove("flying");
|
||||
document.getElementById("guli_top").classList.remove("open_wing");
|
||||
document.getElementById("guli_top").style.cssText = "opacity: ''; transform: ''";
|
||||
}, 600)
|
||||
}
|
||||
|
||||
//深色模式切换
|
||||
var navFn = {
|
||||
switchDarkMode: () => { // Switch Between Light And Dark Mode
|
||||
const nowMode = document.documentElement.getAttribute('data-theme') === 'dark' ? 'dark' : 'light'
|
||||
if (nowMode === 'light') {
|
||||
activateDarkMode()
|
||||
saveToLocal.set('theme', 'dark', 2)
|
||||
GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.day_to_night, false, 2000)
|
||||
} else {
|
||||
activateLightMode()
|
||||
saveToLocal.set('theme', 'light', 2)
|
||||
GLOBAL_CONFIG.Snackbar !== undefined && btf.snackbarShow(GLOBAL_CONFIG.Snackbar.night_to_day, false, 2000)
|
||||
}
|
||||
// handle some cases
|
||||
typeof utterancesTheme === 'function' && utterancesTheme();
|
||||
typeof FB === 'object' && window.loadFBComment();
|
||||
window.DISQUS && document.getElementById('disqus_thread').children.length && setTimeout(() => window.disqusReset(), 200)
|
||||
|
||||
//统计图
|
||||
let color = document.documentElement.getAttribute('data-theme') === 'light' ? '#363636' : '#F7F7FA'
|
||||
if (document.getElementById('posts-chart')) {
|
||||
let postsOptionNew = postsOption
|
||||
postsOptionNew.textStyle.color = color
|
||||
postsOptionNew.title.textStyle.color = color
|
||||
postsOptionNew.xAxis.axisLine.lineStyle.color = color
|
||||
postsOptionNew.yAxis.axisLine.lineStyle.color = color
|
||||
postsChart.setOption(postsOptionNew)
|
||||
}
|
||||
if (document.getElementById('tags-chart')) {
|
||||
let tagsOptionNew = tagsOption
|
||||
tagsOptionNew.textStyle.color = color
|
||||
tagsOptionNew.title.textStyle.color = color
|
||||
tagsOptionNew.xAxis.axisLine.lineStyle.color = color
|
||||
tagsOptionNew.yAxis.axisLine.lineStyle.color = color
|
||||
tagsChart.setOption(tagsOptionNew)
|
||||
}
|
||||
if (document.getElementById('categories-chart')) {
|
||||
let categoriesOptionNew = categoriesOption
|
||||
categoriesOptionNew.textStyle.color = color
|
||||
categoriesOptionNew.title.textStyle.color = color
|
||||
categoriesOptionNew.legend.textStyle.color = color
|
||||
categoriesChart.setOption(categoriesOptionNew)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 移除赞赏蒙版
|
||||
function RemoveRewardMask() {
|
||||
$('.reward-main').attr('style', 'display: none');
|
||||
$('#quit-box').attr('style', 'display: none');
|
||||
}
|
||||
|
||||
//添加赞赏蒙版
|
||||
function AddRewardMask() {
|
||||
$('.reward-main').attr('style', 'display: flex');
|
||||
}
|
||||
|
||||
//监听蒙版关闭
|
||||
document.addEventListener('touchstart', e => {
|
||||
RemoveRewardMask()
|
||||
}, false)
|
||||
|
||||
//监听ctrl+C
|
||||
$(document).unbind('keydown').bind('keydown', function (e) {
|
||||
if ((e.ctrlKey || e.metaKey) && (e.keyCode == 67) && (selectTextNow != '')) {
|
||||
btf.snackbarShow('复制成功，复制和转载请标注本文地址');
|
||||
rm.rightmenuCopyText(selectTextNow);
|
||||
return false;
|
||||
}
|
||||
})
|
||||
|
||||
//判断国内国外
|
||||
// var foreignTips = (function () {
|
||||
// var fetchUrl = "https://api.ooomn.com/api/ip"
|
||||
// fetch(fetchUrl)
|
||||
// .then(res => res.json())
|
||||
// .then(json =>{
|
||||
// var country = json.country;
|
||||
// console.log(country);
|
||||
// if (country != '中国'){
|
||||
// btf.snackbarShow('使用国外网络访问可能无法访问文章图片，敬请谅解。Blog pictures only serve mainland China.')
|
||||
// }
|
||||
// })
|
||||
// });
|
||||
|
||||
//颜色
|
||||
document.addEventListener('scroll', btf.throttle(function () {
|
||||
heo.initThemeColor()
|
||||
}, 200))
|
||||
|
||||
//友链随机传送
|
||||
function travelling() {
|
||||
var fetchUrl = "https://moments.zhheo.com/randomfriend"
|
||||
fetch(fetchUrl)
|
||||
.then(res => res.json())
|
||||
.then(json => {
|
||||
var name = json.name;
|
||||
var link = json.link;
|
||||
var msg = "点击前往按钮进入随机一个友链，不保证跳转网站的安全性和可用性。本次随机到的是本站友链：「" + name + "」";
|
||||
document.styleSheets[0].addRule(':root', '--heo-snackbar-time:' + 8000 + 'ms!important');
|
||||
Snackbar.show({
|
||||
text: msg,
|
||||
duration: 8000,
|
||||
pos: 'top-center',
|
||||
actionText: '前往',
|
||||
onActionClick: function (element) {
|
||||
//Set opacity of element to 0 to close Snackbar
|
||||
$(element).css('opacity', 0);
|
||||
window.open(link, '_blank');
|
||||
}
|
||||
});
|
||||
})
|
||||
}
|
||||
|
||||
//前往黑洞
|
||||
function toforeverblog() {
|
||||
var msg = "点击前往按钮进入「十年之约」项目中的成员博客，不保证跳转网站的安全性和可用性";
|
||||
Snackbar.show({
|
||||
text: msg,
|
||||
duration: 8000,
|
||||
pos: 'top-center',
|
||||
actionText: '前往',
|
||||
onActionClick: function (element) {
|
||||
//Set opacity of element to 0 to close Snackbar
|
||||
$(element).css('opacity', 0);
|
||||
window.open(link, 'https://www.foreverblog.cn/go.html');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//前往开往项目
|
||||
function totraveling() {
|
||||
btf.snackbarShow('即将跳转到「开往」项目的成员博客，不保证跳转网站的安全性和可用性', false, 5000);
|
||||
setTimeout(function () {
|
||||
window.open('https://travellings.link/');
|
||||
}, "5000");
|
||||
}
|
||||
|
||||
// 移除加载动画
|
||||
function removeLoading() {
|
||||
setTimeout(function () {
|
||||
preloader.endLoading();
|
||||
}, 3000)
|
||||
}
|
||||
|
||||
//移除pwa
|
||||
navigator.serviceWorker.getRegistrations().then(function (registrations) {
|
||||
for (let registration of registrations) {
|
||||
registration.unregister()
|
||||
}
|
||||
})
|
||||
|
||||
function addFriendLink() {
|
||||
var input = document.getElementsByClassName('el-textarea__inner')[0];
|
||||
let evt = document.createEvent('HTMLEvents');
|
||||
evt.initEvent('input', true, true);
|
||||
input.value = '昵称（请勿包含博客等字样）：\n网站地址（要求博客地址，请勿提交个人主页）：\n头像图片url（请提供尽可能清晰的图片，我会上传到我自己的图床）：\n描述：\n';
|
||||
input.dispatchEvent(evt);
|
||||
heo.scrollTo("#post-comment");
|
||||
input.focus();
|
||||
input.setSelectionRange(-1, -1);
|
||||
}
|
||||
|
||||
//从一个给定的数组arr中,随机返回num个不重复项
|
||||
function getArrayItems(arr, num) {
|
||||
//新建一个数组,将传入的数组复制过来,用于运算,而不要直接操作传入的数组;
|
||||
var temp_array = new Array();
|
||||
for (var index in arr) {
|
||||
temp_array.push(arr[index]);
|
||||
}
|
||||
//取出的数值项,保存在此数组
|
||||
var return_array = new Array();
|
||||
for (var i = 0; i < num; i++) {
|
||||
//判断如果数组还有可以取出的元素,以防下标越界
|
||||
if (temp_array.length > 0) {
|
||||
//在数组中产生一个随机索引
|
||||
var arrIndex = Math.floor(Math.random() * temp_array.length);
|
||||
//将此随机索引的对应的数组元素值复制出来
|
||||
return_array[i] = temp_array[arrIndex];
|
||||
//然后删掉此索引的数组元素,这时候temp_array变为新的数组
|
||||
temp_array.splice(arrIndex, 1);
|
||||
} else {
|
||||
//数组中数据项取完后,退出循环,比如数组本来只有10项,但要求取出20项.
|
||||
break;
|
||||
}
|
||||
}
|
||||
return return_array;
|
||||
}
|
||||
|
||||
// 检测按键
|
||||
window.onkeydown = function (e) {
|
||||
if (e.keyCode === 123) {
|
||||
btf.snackbarShow('开发者模式已打开，请遵循GPL协议', false, 3000)
|
||||
}
|
||||
}
|
||||
|
||||
// 阻止搜索滚动
|
||||
// document.querySelector('#algolia-search').addEventListener('wheel', (e) => {
|
||||
// e.preventDefault()
|
||||
// })
|
||||
document.querySelector('#console').addEventListener('wheel', (e) => {
|
||||
e.preventDefault()
|
||||
})
|
||||
// document.querySelector('#loading-box').addEventListener('wheel', (e) => {
|
||||
// e.preventDefault()
|
||||
// })
|
||||
|
||||
//自动调整即刻短文尺寸
|
||||
window.addEventListener('resize', function () {
|
||||
if (document.querySelector('#waterfall')) {
|
||||
heo.reflashEssayWaterFall();
|
||||
}
|
||||
});
|
||||
|
||||
//首页大卡片恢复显示
|
||||
$(".topGroup").hover(function () {
|
||||
// console.log("卡片悬浮");
|
||||
}, function () {
|
||||
hoverOnCommentBarrage = false;
|
||||
|
||||
if (document.getElementById("todayCard")) {
|
||||
document.getElementById("todayCard").classList.remove('hide');
|
||||
document.getElementById('todayCard').style.zIndex = 1;
|
||||
// console.log("卡片停止悬浮");
|
||||
}
|
||||
});
|
||||
|
||||
//评论增加放大功能
|
||||
// 如果当前页有评论就执行函数
|
||||
if (document.getElementById('post-comment')) owoBig();
|
||||
|
||||
function owoBig() {
|
||||
// 监听dom插入
|
||||
document.getElementById('post-comment').addEventListener('DOMNodeInserted', (dom) => {
|
||||
// 如果有class且值为OwO-body
|
||||
if (dom.target.classList && dom.target.classList.value == 'OwO-body') {
|
||||
let owo_body = dom.target
|
||||
if (owo_body) {
|
||||
let owo_time = ''
|
||||
let flag = true;
|
||||
// 创建盒子
|
||||
let div = document.createElement('div')
|
||||
div.id = 'owo-big'
|
||||
document.querySelector('body').appendChild(div)
|
||||
|
||||
// 禁用右键（手机端长按会出现右键菜单，为了体验给禁用掉）
|
||||
owo_body.addEventListener('contextmenu', e => e.preventDefault())
|
||||
|
||||
// 鼠标移入
|
||||
owo_body.addEventListener('mouseover', (e) => {
|
||||
if (e.target.tagName == 'LI' && flag) {
|
||||
flag = false;
|
||||
// 移入300毫秒后显示盒子
|
||||
owo_time = setTimeout(() => {
|
||||
let m = 3 // 设置倍数
|
||||
let height = e.path[0].clientHeight * m // 盒子高
|
||||
let width = e.path[0].clientWidth * m // 盒子宽
|
||||
let left = (e.x - e.offsetX) - (width - e.path[0].clientWidth) / 2 // 盒子与屏幕左边距离
|
||||
let top = e.y - e.offsetY // 盒子与屏幕顶部距离
|
||||
|
||||
div.style.height = height + 'px'
|
||||
div.style.width = width + 'px'
|
||||
div.style.left = left + 'px'
|
||||
div.style.top = top + 'px'
|
||||
div.style.display = 'flex'
|
||||
div.innerHTML = `<img src="${e.target.querySelector('img').src}">`
|
||||
}, 300);
|
||||
}
|
||||
})
|
||||
|
||||
// 鼠标移出
|
||||
owo_body.addEventListener('mouseout', (e) => {
|
||||
div.style.display = 'none';
|
||||
flag = true
|
||||
clearTimeout(owo_time)
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//文章页面上一篇下一篇
|
||||
document.addEventListener('scroll', btf.throttle(function () {
|
||||
//滚动条高度+视窗高度 = 可见区域底部高度
|
||||
var visibleBottom = window.scrollY + document.documentElement.clientHeight;
|
||||
//可见区域顶部高度
|
||||
var visibleTop = window.scrollY;
|
||||
// 获取翻页按钮容器
|
||||
var pagination = document.getElementById('pagination');
|
||||
// 获取位置监测容器，此处采用评论区
|
||||
var eventlistner = document.getElementById('post-tools');
|
||||
if (eventlistner && pagination) {
|
||||
var centerY = eventlistner.offsetTop + (eventlistner.offsetHeight / 2);
|
||||
if (document.body.clientWidth > 1300) {
|
||||
if (centerY < visibleTop) {
|
||||
pagination.classList.add("show-window");
|
||||
} else {
|
||||
pagination.classList.remove("show-window");
|
||||
}
|
||||
}
|
||||
}
|
||||
}, 200));
|
||||
|
||||
|
||||
// 页面百分比
|
||||
function percent() {
|
||||
let a = document.documentElement.scrollTop || window.pageYOffset, // 卷去高度
|
||||
b = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight, document.body.offsetHeight, document.documentElement.offsetHeight, document.body.clientHeight, document.documentElement.clientHeight) - document.documentElement.clientHeight, // 整个网页高度
|
||||
result = Math.round(a / b * 100), // 计算百分比
|
||||
btn = document.querySelector("#percent"); // 获取按钮
|
||||
//滚动条高度+视窗高度 = 可见区域底部高度
|
||||
var visibleBottom = window.scrollY + document.documentElement.clientHeight;
|
||||
// 获取位置监测容器，此处采用评论区
|
||||
var eventlistner = document.getElementById('post-tools') || document.getElementById('footer');
|
||||
var centerY = eventlistner.offsetTop + (eventlistner.offsetHeight / 2);
|
||||
if ((centerY < visibleBottom) || (result > 90)) {
|
||||
document.querySelector("#nav-totop").classList.add("long");
|
||||
btn.innerHTML = "返回顶部";
|
||||
} else {
|
||||
document.querySelector("#nav-totop").classList.remove("long");
|
||||
btn.innerHTML = result;
|
||||
}
|
||||
window.onscroll = percent;
|
||||
}
|
||||
|
||||
//检查是否开启快捷键
|
||||
// if (localStorage.getItem('keyboardToggle') !== 'false') {
|
||||
// document.querySelector("#consoleKeyboard").classList.add("on");
|
||||
// } else {
|
||||
// document.querySelector("#consoleKeyboard").classList.remove("on");
|
||||
// }
|
||||
|
||||
//响应esc键
|
||||
$(window).on('keydown', function (ev) {
|
||||
|
||||
// Escape
|
||||
if (ev.keyCode == 27) {
|
||||
heo.hideLoading();
|
||||
heo.hideConsole();
|
||||
rm.hideRightMenu();
|
||||
}
|
||||
|
||||
if (heo_keyboard && ev.shiftKey && !heo_intype) {
|
||||
|
||||
// 显示快捷键面板 shift键
|
||||
// if (ev.keyCode == 16) {
|
||||
// document.querySelector("#keyboard-tips").classList.add("show");
|
||||
// }
|
||||
|
||||
//关闭快捷键 shift+K
|
||||
if (ev.keyCode == 75) {
|
||||
heo.keyboardToggle();
|
||||
return false;
|
||||
}
|
||||
|
||||
//响应打开控制台键 shift+A
|
||||
if (ev.keyCode == 65) {
|
||||
heo.showConsole();
|
||||
return false;
|
||||
}
|
||||
|
||||
//音乐控制 shift+M
|
||||
if (ev.keyCode == 77) {
|
||||
heo.musicToggle();
|
||||
return false;
|
||||
}
|
||||
|
||||
//随机文章 shift+R
|
||||
if (ev.keyCode == 82) {
|
||||
toRandomPost();
|
||||
return false;
|
||||
}
|
||||
|
||||
//回到首页 shift+H
|
||||
if (ev.keyCode == 72) {
|
||||
pjax.loadUrl("/");
|
||||
return false;
|
||||
}
|
||||
|
||||
//深色模式 shift+D
|
||||
if (ev.keyCode == 68) {
|
||||
rm.switchDarkMode();
|
||||
return false;
|
||||
}
|
||||
|
||||
//友链鱼塘 shift+F
|
||||
if (ev.keyCode == 70) {
|
||||
pjax.loadUrl("/moments/");
|
||||
return false;
|
||||
}
|
||||
|
||||
//友情链接页面 shift+L
|
||||
if (ev.keyCode == 76) {
|
||||
pjax.loadUrl("/link/");
|
||||
return false;
|
||||
}
|
||||
|
||||
//关于本站 shift+P
|
||||
if (ev.keyCode == 80) {
|
||||
pjax.loadUrl("/about/");
|
||||
return false;
|
||||
}
|
||||
|
||||
//在线工具 shift+T
|
||||
if (ev.keyCode == 84) {
|
||||
pjax.loadUrl("/tlink/");
|
||||
return false;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// $(window).on('keyup', function (ev) {
|
||||
// // 显示快捷键面板
|
||||
// if (ev.keyCode == 16) {
|
||||
// document.querySelector("#keyboard-tips").classList.remove("show");
|
||||
// }
|
||||
// });
|
||||
|
||||
//输入状态检测
|
||||
$("input").focus(function () {
|
||||
heo_intype = true;
|
||||
});
|
||||
$("textarea").focus(function () {
|
||||
heo_intype = true;
|
||||
});
|
||||
$("input").focusout(function () {
|
||||
heo_intype = false;
|
||||
});
|
||||
$("textarea").focusout(function () {
|
||||
heo_intype = false;
|
||||
});
|
||||
|
||||
//老旧浏览器检测
|
||||
function browserTC() {
|
||||
btf.snackbarShow("");
|
||||
Snackbar.show({
|
||||
text: '为了保护访客访问安全，本站已停止对你正在使用的过低版本浏览器的支持',
|
||||
actionText: '关闭',
|
||||
duration: '6000',
|
||||
pos: 'bottom-right'
|
||||
});
|
||||
}
|
||||
|
||||
function browserVersion() {
|
||||
var userAgent = navigator.userAgent;
|
||||
var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1;
|
||||
var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
|
||||
var isEdge = userAgent.indexOf("Edge") > -1 && !isIE;
|
||||
var isFirefox = userAgent.indexOf("Firefox") > -1;
|
||||
var isOpera = userAgent.indexOf("Opera") > -1 || userAgent.indexOf("OPR") > -1;
|
||||
var isChrome = userAgent.indexOf("Chrome") > -1 && userAgent.indexOf("Safari") > -1 && userAgent.indexOf("Edge") == -1 && userAgent.indexOf("OPR") == -1;
|
||||
var isSafari = userAgent.indexOf("Safari") > -1 && userAgent.indexOf("Chrome") == -1 && userAgent.indexOf("Edge") == -1 && userAgent.indexOf("OPR") == -1;
|
||||
if (isEdge) {
|
||||
if (userAgent.split('Edge/')[1].split('.')[0] < 90) {
|
||||
browserTC()
|
||||
}
|
||||
} else if (isFirefox) {
|
||||
if (userAgent.split('Firefox/')[1].split('.')[0] < 90) {
|
||||
browserTC()
|
||||
}
|
||||
} else if (isOpera) {
|
||||
if (userAgent.split('OPR/')[1].split('.')[0] < 80) {
|
||||
browserTC()
|
||||
}
|
||||
} else if (isChrome) {
|
||||
if (userAgent.split('Chrome/')[1].split('.')[0] < 90) {
|
||||
browserTC()
|
||||
}
|
||||
} else if (isSafari) {
|
||||
//不知道Safari多少版本才算老旧
|
||||
}
|
||||
}
|
||||
|
||||
function setCookies(obj, limitTime) {
|
||||
let data = new Date(new Date().getTime() + limitTime * 24 * 60 * 60 * 1000).toUTCString()
|
||||
for (let i in obj) {
|
||||
document.cookie = i + '=' + obj[i] + ';expires=' + data
|
||||
}
|
||||
}
|
||||
|
||||
function getCookie(name) {
|
||||
var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
|
||||
if (arr = document.cookie.match(reg))
|
||||
return unescape(arr[2]);
|
||||
else
|
||||
return null;
|
||||
}
|
||||
|
||||
if (getCookie('browsertc') != 1) {
|
||||
setCookies({
|
||||
browsertc: 1,
|
||||
}, 1); //设置cookie缓存一天，即一天弹一次
|
||||
browserVersion();
|
||||
}
|
||||
|
||||
//当前窗口得到焦点
|
||||
// window.onfocus = function () {
|
||||
// document.querySelector("#keyboard-tips").classList.remove("show");
|
||||
// };
|
||||
|
||||
//注入函数
|
||||
document.addEventListener('pjax:send', function () {
|
||||
console.clear();
|
||||
Pace.restart();
|
||||
heo.showLoading();
|
||||
})
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
// coverColor()
|
||||
navTitle()
|
||||
percent()
|
||||
heo.topPostScroll()
|
||||
heo.topCategoriesBarScroll()
|
||||
heo.sayhi()
|
||||
heo.addTag()
|
||||
heo.stopImgRightDrag()
|
||||
// heo.addFriendLinksInFooter()
|
||||
heo.qrcodeCreate()
|
||||
heo.hidecookie()
|
||||
heo.onlyHome()
|
||||
heo.addNavBackgroundInit()
|
||||
heo.initIndexEssay()
|
||||
// heo.changeTimeInEssay()
|
||||
heo.reflashEssayWaterFall()
|
||||
heo.addMediumInEssay()
|
||||
heo.darkModeStatus()
|
||||
// heo.categoriesBarActive()
|
||||
heo.initThemeColor()
|
||||
heo.hideLoading()
|
||||
// heo.tagPageActive()
|
||||
})
|
||||
window.onscroll = function () {
|
||||
percent();
|
||||
};
|
||||
|
|
@ -1,165 +0,0 @@
|
|||
.comment-barrage {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 20px;
|
||||
padding: 0 0 20px 10px;
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: end;
|
||||
align-items: flex-end;
|
||||
z-index: 999;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.comment-barrage {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.comment-barrage-item {
|
||||
min-width: 300px;
|
||||
max-width: 300px;
|
||||
width: fit-content;
|
||||
min-height: 80px;
|
||||
max-height: 150px;
|
||||
margin: 4px;
|
||||
padding: 8px 14px;
|
||||
background: var(--heo-maskbgdeep);
|
||||
border-radius: 8px;
|
||||
color: var(--heo-fontcolor);
|
||||
animation: barrageIn 0.6s cubic-bezier(0.42, 0, 0.3, 1.11);
|
||||
transition: 0.3s;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: var(--style-border);
|
||||
backdrop-filter: saturate(180%) blur(20px);
|
||||
-webkit-backdrop-filter: blur(20px);
|
||||
position: fixed;
|
||||
box-shadow: var(--heo-shadow-border);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.comment-barrage-item:hover {
|
||||
border: var(--style-border-hover);
|
||||
box-shadow: var(--heo-shadow-main);
|
||||
}
|
||||
|
||||
.comment-barrage-item.out {
|
||||
opacity: 0;
|
||||
animation: barrageOut 0.6s cubic-bezier(0.42, 0, 0.3, 1.11);
|
||||
}
|
||||
|
||||
.comment-barrage-item.hovered {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.comment-barrage-item .comment-barrage-close {
|
||||
color: var(--heo-secondtext);
|
||||
cursor: pointer;
|
||||
line-height: 1;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.comment-barrage-item .comment-barrage-close:hover {
|
||||
color: var(--heo-main);
|
||||
}
|
||||
|
||||
.comment-barrage-item pre {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.comment-barrage-item p img:not(.tk-owo-emotion) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.comment-barrage-item p img.tk-owo-emotion {
|
||||
width: 16px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
transform: translateY(2px);
|
||||
}
|
||||
|
||||
.comment-barrage-item blockquote {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.comment-barrage-item br {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.comment-barrage-item .barrageHead {
|
||||
height: 30px;
|
||||
padding: 0;
|
||||
line-height: 30px;
|
||||
font-size: 12px;
|
||||
border-bottom: var(--style-border);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-weight: bold;
|
||||
padding-bottom: 6px;
|
||||
}
|
||||
|
||||
.comment-barrage-item .barrageHead .barrageTitle {
|
||||
color: var(--heo-card-bg);
|
||||
margin-right: 8px;
|
||||
background: var(--heo-fontcolor);
|
||||
line-height: 1;
|
||||
padding: 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.comment-barrage-item .barrageHead .barrageTitle:hover {
|
||||
background: var(--heo-main);
|
||||
color: var(--heo-white);
|
||||
}
|
||||
|
||||
.comment-barrage-item .barrageAvatar {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin: 0;
|
||||
margin-left: auto;
|
||||
margin-right: 8px;
|
||||
border-radius: 50%;
|
||||
background: var(--heo-secondbg);
|
||||
}
|
||||
|
||||
.comment-barrage-item .barrageContent {
|
||||
font-size: 14px !important;
|
||||
font-weight: normal !important;
|
||||
height: calc(100% - 30px);
|
||||
overflow: hidden;
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.comment-barrage-item .barrageContent a {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.comment-barrage-item .barrageContent::-webkit-scrollbar {
|
||||
height: 0;
|
||||
width: 4px;
|
||||
}
|
||||
|
||||
.comment-barrage-item .barrageContent::-webkit-scrollbar-button {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.comment-barrage-item p {
|
||||
margin: 8px 0;
|
||||
line-height: 1.3;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 2;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
font-size: 14;
|
||||
}
|
||||
|
||||
.comment-barrage-item .barrageContent h1, .comment-barrage-item .barrageContent h2, .comment-barrage-item .barrageContent h3, .comment-barrage-item .barrageContent h4 {
|
||||
font-size: 14px !important;
|
||||
font-weight: normal !important;
|
||||
margin: 8px 0 !important;
|
||||
}
|
||||
|
|
@ -1,150 +0,0 @@
|
|||
var commentBarrageConfig = {
|
||||
//同时最多显示弹幕数
|
||||
maxBarrage: 1,
|
||||
//弹幕显示间隔时间ms
|
||||
barrageTime: 4000,
|
||||
//twikoo部署地址腾讯云的为环境ID
|
||||
twikooUrl: "xxxx",
|
||||
//token获取见上方
|
||||
accessToken: "xxxx",
|
||||
pageUrl: window.location.pathname,
|
||||
barrageTimer: [],
|
||||
barrageList: [],
|
||||
barrageIndex: 0,
|
||||
dom: document.querySelector('.comment-barrage'),
|
||||
}
|
||||
|
||||
var commentInterval = null;
|
||||
var hoverOnCommentBarrage = false;
|
||||
|
||||
$(".comment-barrage").hover(function () {
|
||||
hoverOnCommentBarrage = true;
|
||||
console.log("热评悬浮");
|
||||
}, function () {
|
||||
hoverOnCommentBarrage = false;
|
||||
console.log("停止悬浮");
|
||||
});
|
||||
|
||||
function initCommentBarrage() {
|
||||
// console.log("开始创建热评")
|
||||
|
||||
var data = JSON.stringify({
|
||||
"event": "COMMENT_GET",
|
||||
"commentBarrageConfig.accessToken": commentBarrageConfig.accessToken,
|
||||
"url": commentBarrageConfig.pageUrl
|
||||
});
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.withCredentials = true;
|
||||
xhr.addEventListener("readystatechange", function () {
|
||||
if (this.readyState === 4) {
|
||||
commentBarrageConfig.barrageList = commentLinkFilter(JSON.parse(this.responseText).data);
|
||||
commentBarrageConfig.dom.innerHTML = '';
|
||||
}
|
||||
});
|
||||
xhr.open("POST", commentBarrageConfig.twikooUrl);
|
||||
xhr.setRequestHeader("Content-Type", "application/json");
|
||||
xhr.send(data);
|
||||
|
||||
|
||||
clearInterval(commentInterval);
|
||||
commentInterval = null;
|
||||
|
||||
commentInterval = setInterval(() => {
|
||||
if (commentBarrageConfig.barrageList.length && !hoverOnCommentBarrage) {
|
||||
popCommentBarrage(commentBarrageConfig.barrageList[commentBarrageConfig.barrageIndex]);
|
||||
commentBarrageConfig.barrageIndex += 1;
|
||||
commentBarrageConfig.barrageIndex %= commentBarrageConfig.barrageList.length;
|
||||
}
|
||||
if ((commentBarrageConfig.barrageTimer.length > (commentBarrageConfig.barrageList.length > commentBarrageConfig.maxBarrage ? commentBarrageConfig.maxBarrage : commentBarrageConfig.barrageList.length)) && !hoverOnCommentBarrage) {
|
||||
removeCommentBarrage(commentBarrageConfig.barrageTimer.shift())
|
||||
}
|
||||
}, commentBarrageConfig.barrageTime)
|
||||
}
|
||||
|
||||
function commentLinkFilter(data) {
|
||||
data.sort((a, b) => {
|
||||
return a.created - b.created;
|
||||
})
|
||||
let newData = [];
|
||||
data.forEach(item => {
|
||||
newData.push(...getCommentReplies(item));
|
||||
});
|
||||
return newData;
|
||||
}
|
||||
|
||||
function getCommentReplies(item) {
|
||||
if (item.replies) {
|
||||
let replies = [item];
|
||||
item.replies.forEach(item => {
|
||||
replies.push(...getCommentReplies(item));
|
||||
})
|
||||
return replies;
|
||||
} else {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
function popCommentBarrage(data) {
|
||||
let barrage = document.createElement('div');
|
||||
let width = commentBarrageConfig.dom.clientWidth;
|
||||
let height = commentBarrageConfig.dom.clientHeight;
|
||||
barrage.className = 'comment-barrage-item'
|
||||
barrage.innerHTML = `
|
||||
<div class="barrageHead">
|
||||
<a class="barrageTitle" href="javascript:heo.scrollTo('#post-comment')"">热评</a>
|
||||
<div class="barrageNick">${data.nick}</div>
|
||||
<img class="barrageAvatar" src="https://cravatar.cn/avatar/${data.mailMd5}"/>
|
||||
<a class="comment-barrage-close" href="javascript:heo.switchCommentBarrage()"><i class="fa-solid fa-xmark"></i></a>
|
||||
</div>
|
||||
<a class="barrageContent" href="#${data.id}">${data.comment}</a>
|
||||
`
|
||||
commentBarrageConfig.barrageTimer.push(barrage);
|
||||
commentBarrageConfig.dom.append(barrage);
|
||||
}
|
||||
|
||||
function removeCommentBarrage(barrage) {
|
||||
barrage.className = 'comment-barrage-item out';
|
||||
setTimeout(() => {
|
||||
commentBarrageConfig.dom.removeChild(barrage);
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
|
||||
// 自动隐藏
|
||||
document.addEventListener('scroll', btf.throttle(function () {
|
||||
//滚动条高度+视窗高度 = 可见区域底部高度
|
||||
var visibleBottom = window.scrollY + document.documentElement.clientHeight;
|
||||
//可见区域顶部高度
|
||||
var visibleTop = window.scrollY;
|
||||
// 获取翻页按钮容器
|
||||
var pagination = document.querySelector('.comment-barrage');
|
||||
// 获取位置监测容器，此处采用评论区
|
||||
var eventlistner = document.getElementById('post-tools');
|
||||
if (eventlistner && pagination) {
|
||||
var centerY = eventlistner.offsetTop + (eventlistner.offsetHeight / 2);
|
||||
if (document.body.clientWidth > 768) {
|
||||
if (centerY > visibleBottom) {
|
||||
pagination.style.bottom = '0';
|
||||
} else {
|
||||
pagination.style.bottom = '-200px';
|
||||
}
|
||||
}
|
||||
}
|
||||
}, 200))
|
||||
|
||||
initCommentBarrage();
|
||||
|
||||
if (localStorage.getItem('commentBarrageSwitch') !== 'false') {
|
||||
$(".comment-barrage").show();
|
||||
$(".menu-commentBarrage-text").text("关闭热评");
|
||||
document.querySelector("#consoleCommentBarrage").classList.add("on");
|
||||
} else {
|
||||
$(".comment-barrage").hide();
|
||||
$(".menu-commentBarrage-text").text("显示热评");
|
||||
document.querySelector("#consoleCommentBarrage").classList.remove("on");
|
||||
}
|
||||
|
||||
|
||||
document.addEventListener('pjax:send', function () {
|
||||
clearInterval(commentInterval);
|
||||
});
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
/* 首行缩进 */
|
||||
/* .post-content p {
|
||||
text-indent: 2em;
|
||||
} */
|
||||
|
||||
/* 代码块纯黑色背景 */
|
||||
code[class*=" language-"], pre[class*=" language-"]{
|
||||
background: #18171d;
|
||||
}
|
||||
|
||||
/* banner 字体图标大小及位置 */
|
||||
i.iconfont.icon-arrow-right.banner-righticon{
|
||||
font-size: 66px;
|
||||
}
|
||||
|
||||
span.bannerText{
|
||||
display: block;
|
||||
margin-top: 35px;
|
||||
}
|
||||
|
||||
/* 自我介绍渐变色背景 */
|
||||
#aside-content > .card-widget.card-info::before {
|
||||
background: linear-gradient(-25deg,#0084ff,#031764,#67044d);
|
||||
background-size: 400%;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
content: '';
|
||||
animation: gradient 15s ease infinite;
|
||||
}
|
||||
|
||||
/* 列表样式及缩进 */
|
||||
ul li {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
#article-container ol li:not(.tab), #article-container ul li:not(.tab){
|
||||
margin-left: 2em;
|
||||
}
|
||||
|
||||
#article-container pre > code {
|
||||
background: transparent !important;
|
||||
/* 解决文章界面代码超长时溢出问题 */
|
||||
display: block;
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
@ -1,420 +0,0 @@
|
|||
// 初始化函数
|
||||
let rm = {};
|
||||
|
||||
//禁止图片拖拽
|
||||
rm.stopdragimg = $("img");
|
||||
rm.stopdragimg.on("dragstart", function () {
|
||||
return false;
|
||||
});
|
||||
|
||||
// 显示菜单
|
||||
rm.showRightMenu = function (isTrue, x = 0, y = 0) {
|
||||
let $rightMenu = $('#rightMenu');
|
||||
$rightMenu.css('top', x + 'px').css('left', y + 'px');
|
||||
if (isTrue) {
|
||||
$rightMenu.show();
|
||||
stopMaskScroll()
|
||||
} else {
|
||||
$rightMenu.hide();
|
||||
}
|
||||
}
|
||||
|
||||
// 隐藏菜单
|
||||
rm.hideRightMenu = function () {
|
||||
rm.showRightMenu(false);
|
||||
$('#rightmenu-mask').attr('style', 'display: none');
|
||||
}
|
||||
|
||||
// 尺寸
|
||||
let rmWidth = $('#rightMenu').width();
|
||||
let rmHeight = $('#rightMenu').height();
|
||||
|
||||
// 重新定义尺寸
|
||||
rm.reloadrmSize = function () {
|
||||
rmWidth = $('#rightMenu').width();
|
||||
rmHeight = $('#rightMenu').height();
|
||||
}
|
||||
|
||||
// 获取点击的href
|
||||
let domhref = '';
|
||||
let domImgSrc = '';
|
||||
let globalEvent = null;
|
||||
|
||||
// 监听右键初始化
|
||||
window.oncontextmenu = function (event) {
|
||||
if (document.body.clientWidth > 768) {
|
||||
let pageX = event.clientX + 10; //加10是为了防止显示时鼠标遮在菜单上
|
||||
let pageY = event.clientY;
|
||||
// console.log(event);
|
||||
|
||||
//其他额外菜单
|
||||
let $rightMenuOther = $('.rightMenuOther');
|
||||
let $rightMenuPlugin = $('.rightMenuPlugin');
|
||||
let $rightMenuCopyText = $('#menu-copytext');
|
||||
let $rightMenuPasteText = $('#menu-pastetext');
|
||||
let $rightMenuCommentText = $('#menu-commenttext');
|
||||
let $rightMenuNewWindow = $('#menu-newwindow');
|
||||
let $rightMenuCopyLink = $('#menu-copylink');
|
||||
let $rightMenuCopyImg = $('#menu-copyimg');
|
||||
let $rightMenuDownloadImg = $('#menu-downloadimg');
|
||||
let $rightMenuSearch = $('#menu-search');
|
||||
let $rightMenuSearchBaidu = $('#menu-searchBaidu');
|
||||
let $rightMenuMusicToggle = $('#menu-music-toggle');
|
||||
let $rightMenuMusicBack = $('#menu-music-back');
|
||||
let $rightMenuMusicForward = $('#menu-music-forward');
|
||||
let $rightMenuMusicPlaylist = $('#menu-music-playlist');
|
||||
let $rightMenuMusicCopyMusicName = $('#menu-music-copyMusicName');
|
||||
let href = event.target.href;
|
||||
let imgsrc = event.target.currentSrc;
|
||||
|
||||
// 判断模式 扩展模式为有事件
|
||||
let pluginMode = false;
|
||||
$rightMenuOther.show();
|
||||
globalEvent = event;
|
||||
|
||||
// 检查是否需要复制 是否有选中文本
|
||||
if (selectTextNow && window.getSelection()) {
|
||||
pluginMode = true;
|
||||
$rightMenuCopyText.show();
|
||||
$rightMenuCommentText.show();
|
||||
$rightMenuSearch.show();
|
||||
$rightMenuSearchBaidu.show();
|
||||
} else {
|
||||
$rightMenuCopyText.hide();
|
||||
$rightMenuCommentText.hide();
|
||||
$rightMenuSearchBaidu.hide();
|
||||
$rightMenuSearch.hide();
|
||||
}
|
||||
|
||||
//检查是否右键点击了链接a标签
|
||||
if (href) {
|
||||
pluginMode = true;
|
||||
$rightMenuNewWindow.show();
|
||||
$rightMenuCopyLink.show();
|
||||
domhref = href;
|
||||
} else {
|
||||
$rightMenuNewWindow.hide();
|
||||
$rightMenuCopyLink.hide();
|
||||
}
|
||||
|
||||
//检查是否需要复制图片
|
||||
if (imgsrc) {
|
||||
pluginMode = true;
|
||||
$rightMenuCopyImg.show();
|
||||
$rightMenuDownloadImg.show();
|
||||
domImgSrc = imgsrc;
|
||||
} else {
|
||||
$rightMenuCopyImg.hide();
|
||||
$rightMenuDownloadImg.hide();
|
||||
}
|
||||
|
||||
// 判断是否为输入框
|
||||
if (event.target.tagName.toLowerCase() === 'input' || event.target.tagName.toLowerCase() === 'textarea') {
|
||||
console.log('这是一个输入框')
|
||||
pluginMode = true;
|
||||
$rightMenuPasteText.show();
|
||||
} else {
|
||||
$rightMenuPasteText.hide();
|
||||
}
|
||||
|
||||
//判断是否是音乐
|
||||
if (event.target.nodeName == "METING-JS") {
|
||||
console.log('这是一个音乐');
|
||||
pluginMode = true;
|
||||
$rightMenuMusicToggle.show();
|
||||
$rightMenuMusicBack.show();
|
||||
$rightMenuMusicForward.show();
|
||||
$rightMenuMusicPlaylist.show();
|
||||
$rightMenuMusicCopyMusicName.show();
|
||||
} else {
|
||||
$rightMenuMusicToggle.hide();
|
||||
$rightMenuMusicBack.hide();
|
||||
$rightMenuMusicForward.hide();
|
||||
$rightMenuMusicPlaylist.hide();
|
||||
$rightMenuMusicCopyMusicName.hide()
|
||||
}
|
||||
|
||||
// 如果不是扩展模式则隐藏扩展模块
|
||||
if (pluginMode) {
|
||||
$rightMenuOther.hide();
|
||||
$rightMenuPlugin.show();
|
||||
} else {
|
||||
$rightMenuPlugin.hide()
|
||||
}
|
||||
|
||||
rm.reloadrmSize()
|
||||
|
||||
// 鼠标默认显示在鼠标右下方，当鼠标靠右或考下时，将菜单显示在鼠标左方\上方
|
||||
if (pageX + rmWidth > window.innerWidth) {
|
||||
pageX -= rmWidth + 10;
|
||||
}
|
||||
if (pageY + rmHeight > window.innerHeight) {
|
||||
pageY -= pageY + rmHeight - window.innerHeight;
|
||||
}
|
||||
|
||||
rm.showRightMenu(true, pageY, pageX);
|
||||
$('#rightmenu-mask').attr('style', 'display: flex');
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
// 下载图片状态
|
||||
rm.downloadimging = false;
|
||||
|
||||
// 复制图片到剪贴板
|
||||
rm.writeClipImg = function (imgsrc) {
|
||||
console.log('按下复制');
|
||||
rm.hideRightMenu();
|
||||
btf.snackbarShow('正在下载中，请稍后', false, 10000)
|
||||
if (rm.downloadimging == false) {
|
||||
rm.downloadimging = true;
|
||||
setTimeout(function () {
|
||||
copyImage(imgsrc);
|
||||
btf.snackbarShow('复制成功！图片已添加盲水印，请遵守版权协议');
|
||||
rm.downloadimging = false;
|
||||
}, "10000")
|
||||
}
|
||||
}
|
||||
|
||||
function imageToBlob(imageURL) {
|
||||
const img = new Image;
|
||||
const c = document.createElement("canvas");
|
||||
const ctx = c.getContext("2d");
|
||||
img.crossOrigin = "";
|
||||
img.src = imageURL;
|
||||
return new Promise(resolve => {
|
||||
img.onload = function () {
|
||||
c.width = this.naturalWidth;
|
||||
c.height = this.naturalHeight;
|
||||
ctx.drawImage(this, 0, 0);
|
||||
c.toBlob((blob) => {
|
||||
// here the image is a blob
|
||||
resolve(blob)
|
||||
}, "image/png", 0.75);
|
||||
};
|
||||
})
|
||||
}
|
||||
|
||||
async function copyImage(imageURL) {
|
||||
const blob = await imageToBlob(imageURL)
|
||||
const item = new ClipboardItem({"image/png": blob});
|
||||
navigator.clipboard.write([item]);
|
||||
}
|
||||
|
||||
rm.switchDarkMode = function () {
|
||||
navFn.switchDarkMode();
|
||||
rm.hideRightMenu();
|
||||
heo.darkModeStatus();
|
||||
halo.darkComment();
|
||||
}
|
||||
|
||||
rm.copyUrl = function (id) {
|
||||
$("body").after("<input id='copyVal'></input>");
|
||||
var text = id;
|
||||
var input = document.getElementById("copyVal");
|
||||
input.value = text;
|
||||
input.select();
|
||||
input.setSelectionRange(0, input.value.length);
|
||||
document.execCommand("copy");
|
||||
$("#copyVal").remove();
|
||||
}
|
||||
|
||||
function stopMaskScroll() {
|
||||
if (document.getElementById("rightmenu-mask")) {
|
||||
let xscroll = document.getElementById("rightmenu-mask");
|
||||
xscroll.addEventListener("mousewheel", function (e) {
|
||||
//阻止浏览器默认方法
|
||||
rm.hideRightMenu();
|
||||
// e.preventDefault();
|
||||
}, false);
|
||||
}
|
||||
if (document.getElementById("rightMenu")) {
|
||||
let xscroll = document.getElementById("rightMenu");
|
||||
xscroll.addEventListener("mousewheel", function (e) {
|
||||
//阻止浏览器默认方法
|
||||
rm.hideRightMenu();
|
||||
// e.preventDefault();
|
||||
}, false);
|
||||
}
|
||||
}
|
||||
|
||||
rm.rightmenuCopyText = function (txt) {
|
||||
if (navigator.clipboard) {
|
||||
navigator.clipboard.writeText(txt);
|
||||
}
|
||||
rm.hideRightMenu();
|
||||
}
|
||||
|
||||
rm.copyPageUrl = function () {
|
||||
var url = window.location.href;
|
||||
rm.copyUrl(url);
|
||||
btf.snackbarShow('复制本页链接地址成功', false, 2000);
|
||||
rm.hideRightMenu();
|
||||
}
|
||||
|
||||
rm.sharePage = function () {
|
||||
var content = window.location.href;
|
||||
rm.copyUrl(url);
|
||||
btf.snackbarShow('复制本页链接地址成功', false, 2000);
|
||||
rm.hideRightMenu();
|
||||
}
|
||||
|
||||
// 复制当前选中文本
|
||||
var selectTextNow = '';
|
||||
document.onmouseup = document.ondbclick = selceText;
|
||||
|
||||
function selceText() {
|
||||
var txt;
|
||||
if (document.selection) {
|
||||
txt = document.selection.createRange().text;
|
||||
} else {
|
||||
txt = window.getSelection() + '';
|
||||
}
|
||||
if (txt) {
|
||||
selectTextNow = txt;
|
||||
// console.log(selectTextNow);
|
||||
} else {
|
||||
selectTextNow = '';
|
||||
}
|
||||
}
|
||||
|
||||
// 读取剪切板
|
||||
rm.readClipboard = function () {
|
||||
if (navigator.clipboard) {
|
||||
navigator.clipboard.readText().then(clipText => rm.insertAtCaret(globalEvent.target, clipText));
|
||||
}
|
||||
}
|
||||
|
||||
// 粘贴文本到焦点
|
||||
rm.insertAtCaret = function (elemt, value) {
|
||||
const startPos = elemt.selectionStart,
|
||||
endPos = elemt.selectionEnd;
|
||||
if (document.selection) {
|
||||
elemt.focus();
|
||||
var sel = document.selection.createRange();
|
||||
sel.text = value;
|
||||
elemt.focus();
|
||||
} else {
|
||||
if (startPos || startPos == '0') {
|
||||
var scrollTop = elemt.scrollTop;
|
||||
elemt.value = elemt.value.substring(0, startPos) + value + elemt.value.substring(endPos, elemt.value.length);
|
||||
elemt.focus();
|
||||
elemt.selectionStart = startPos + value.length;
|
||||
elemt.selectionEnd = startPos + value.length;
|
||||
elemt.scrollTop = scrollTop;
|
||||
} else {
|
||||
elemt.value += value;
|
||||
elemt.focus();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//粘贴文本
|
||||
rm.pasteText = function () {
|
||||
const result = rm.readClipboard() || '';
|
||||
rm.hideRightMenu();
|
||||
}
|
||||
|
||||
//引用到评论
|
||||
rm.rightMenuCommentText = function (txt) {
|
||||
rm.hideRightMenu();
|
||||
var input = document.getElementsByClassName('el-textarea__inner')[0];
|
||||
let evt = document.createEvent('HTMLEvents');
|
||||
evt.initEvent('input', true, true);
|
||||
let inputValue = replaceAll(txt, '\n', '\n> ')
|
||||
input.value = '> ' + inputValue + '\n\n';
|
||||
input.dispatchEvent(evt);
|
||||
var domTop = document.querySelector("#post-comment").offsetTop;
|
||||
window.scrollTo(0, domTop - 80);
|
||||
input.focus();
|
||||
input.setSelectionRange(-1, -1);
|
||||
if (document.getElementById("comment-tips")) {
|
||||
document.getElementById("comment-tips").classList.add("show");
|
||||
}
|
||||
}
|
||||
|
||||
//替换所有内容
|
||||
function replaceAll(string, search, replace) {
|
||||
return string.split(search).join(replace);
|
||||
}
|
||||
|
||||
// 百度搜索
|
||||
rm.searchBaidu = function () {
|
||||
btf.snackbarShow('即将跳转到百度搜索', false, 2000);
|
||||
setTimeout(function () {
|
||||
window.open('https://www.baidu.com/s?wd=' + selectTextNow);
|
||||
}, "2000");
|
||||
rm.hideRightMenu();
|
||||
}
|
||||
|
||||
//分享链接
|
||||
rm.copyLink = function () {
|
||||
rm.rightmenuCopyText(domhref);
|
||||
btf.snackbarShow('已复制链接地址');
|
||||
}
|
||||
|
||||
function addRightMenuClickEvent() {
|
||||
// 添加点击事件
|
||||
$('#menu-backward').on('click', function () {
|
||||
window.history.back();
|
||||
rm.hideRightMenu();
|
||||
});
|
||||
$('#menu-forward').on('click', function () {
|
||||
window.history.forward();
|
||||
rm.hideRightMenu();
|
||||
});
|
||||
$('#menu-refresh').on('click', function () {
|
||||
window.location.reload();
|
||||
});
|
||||
$('#menu-top').on('click', function () {
|
||||
btf.scrollToDest(0, 500);
|
||||
rm.hideRightMenu();
|
||||
});
|
||||
$('.menu-link').on('click', rm.hideRightMenu);
|
||||
$('#menu-darkmode').on('click', rm.switchDarkMode);
|
||||
$('#menu-home').on('click', function () {
|
||||
window.location.href = window.location.origin;
|
||||
});
|
||||
$('#menu-randomPost').on('click', function () {
|
||||
toRandomPost()
|
||||
});
|
||||
$('#menu-commentBarrage').on('click', heo.switchCommentBarrage);
|
||||
$('#rightmenu-mask').on('click', rm.hideRightMenu);
|
||||
$('#rightmenu-mask').contextmenu(function () {
|
||||
rm.hideRightMenu();
|
||||
return false;
|
||||
});
|
||||
$('#menu-translate').on('click', function () {
|
||||
rm.hideRightMenu();
|
||||
translateInitialization();
|
||||
});
|
||||
$('#menu-copy').on('click', rm.copyPageUrl);
|
||||
$('#menu-pastetext').on('click', rm.pasteText);
|
||||
$('#menu-copytext').on('click', function () {
|
||||
rm.rightmenuCopyText(selectTextNow);
|
||||
btf.snackbarShow('复制成功，复制和转载请标注本文地址');
|
||||
});
|
||||
$('#menu-commenttext').on('click', function () {
|
||||
rm.rightMenuCommentText(selectTextNow);
|
||||
});
|
||||
$('#menu-newwindow').on('click', function () {
|
||||
window.open(domhref);
|
||||
rm.hideRightMenu();
|
||||
});
|
||||
$('#menu-copylink').on('click', rm.copyLink);
|
||||
$('#menu-downloadimg').on('click', function () {
|
||||
heo.downloadImage(domImgSrc, 'zhheo');
|
||||
});
|
||||
$('#menu-copyimg').on('click', function () {
|
||||
rm.writeClipImg(domImgSrc);
|
||||
});
|
||||
$('#menu-searchBaidu').on('click', rm.searchBaidu);
|
||||
//音乐
|
||||
$('#menu-music-toggle').on('click', heo.musicToggle);
|
||||
$('#menu-music-back').on('click', heo.musicSkipBack);
|
||||
$('#menu-music-forward').on('click', heo.musicSkipForward);
|
||||
$('#menu-music-copyMusicName').on('click', function () {
|
||||
rm.rightmenuCopyText(heo.musicGetName());
|
||||
btf.snackbarShow('复制歌曲名称成功', false, 3000);
|
||||
});
|
||||
}
|
||||
|
|
@ -6,14 +6,13 @@
|
|||
|
||||
<div class="page" id="body-wrap">
|
||||
<header class="not-top-img" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav}"></nav>
|
||||
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
||||
</header>
|
||||
<main class="layout hide-aside" id="content-inner">
|
||||
|
||||
<div id="page">
|
||||
<h1 class="page-title" style="display: inline;">分类</h1>
|
||||
<div class="category-lists">
|
||||
<div class="category-title is-center">分类 - <span class="category-amount">11</span></div>
|
||||
<div class="tag-cloud-list is-center">
|
||||
<a style="font-size: 1em;"
|
||||
th:each="categoryItem : ${categoryFinder.listAll()}"
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
|
||||
<div class="page" id="body-wrap">
|
||||
<header class="not-top-img" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav}"></nav>
|
||||
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
||||
</header>
|
||||
<main class="layout" id="content-inner">
|
||||
<div id="category">
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<!-- 头部导航栏 -->
|
||||
|
||||
<header class="not-top-img" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav}"></nav>
|
||||
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
||||
</header>
|
||||
<div id="home_top">
|
||||
<!-- 每日说说 -->
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
|
||||
<div class="page" id="body-wrap">
|
||||
<header class="not-top-img" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav}"></nav>
|
||||
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
||||
</header>
|
||||
<main class="layout hide-aside" id="content-inner">
|
||||
<div id="page">
|
||||
|
|
@ -15,10 +15,10 @@
|
|||
<div class="banners-title-big">[[${theme.config.link.bigTitle}]]</div>
|
||||
</div>
|
||||
<div class="banner-button-group">
|
||||
<!--<a class="banner-button secondary" onclick="travelling()">-->
|
||||
<!-- <i class="fas fa-shuffle"></i>-->
|
||||
<!-- <span class="banner-button-text">随机访问</span>-->
|
||||
<!--</a>-->
|
||||
<a class="banner-button secondary" data-pjax-state="" onclick="travelling()">
|
||||
<i class="fas fa-shuffle"></i>
|
||||
<span class="banner-button-text">随机访问</span>
|
||||
</a>
|
||||
<a class="banner-button" href="#post-comment" rel="external nofollow">
|
||||
<i class="iconfont icon-link"></i>
|
||||
<span class="banner-button-text">申请友链</span>
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
|
||||
</th:block>
|
||||
</div>
|
||||
<a th:replace="~{modules/bar/more :: more}">更多</a>
|
||||
<a class="category-bar-more" th:replace="~{modules/bar/more :: more}">更多</a>
|
||||
</div>
|
||||
|
||||
</html>
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
</th:block>
|
||||
|
||||
</div>
|
||||
<a th:replace="~{modules/bar/more :: more}">更多</a>
|
||||
<a class="category-bar-more" th:replace="~{modules/bar/more :: more}">更多</a>
|
||||
</div>
|
||||
|
||||
</html>
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
</th:block>
|
||||
|
||||
</div>
|
||||
<a th:replace="~{modules/bar/more :: more}">更多</a>
|
||||
<a class="category-bar-more" th:replace="~{modules/bar/more :: more}">更多</a>
|
||||
</div>
|
||||
|
||||
</html>
|
||||
|
|
@ -17,7 +17,7 @@
|
|||
|
||||
</th:block>
|
||||
</div>
|
||||
<a th:replace="~{modules/bar/more :: more}">更多</a>
|
||||
<a class="category-bar-more" th:replace="~{modules/bar/more :: more}">更多</a>
|
||||
</div>
|
||||
|
||||
</html>
|
||||
|
|
@ -17,7 +17,7 @@
|
|||
|
||||
</th:block>
|
||||
</div>
|
||||
<a th:replace="~{modules/bar/more :: more}">更多</a>
|
||||
<a class="category-bar-more" th:replace="~{modules/bar/more :: more}">更多</a>
|
||||
</div>
|
||||
|
||||
</html>
|
||||
|
|
@ -4,6 +4,8 @@
|
|||
<footer id="footer" th:fragment="footer">
|
||||
|
||||
<!-- 社交链接，需要填入 href class title -->
|
||||
<!-- todo 在 中间位置要插入 <img class="footer_mini_logo" onclick="acrylic.toTop()"
|
||||
src="/img/avatar.webp" title="返回顶部"> -->
|
||||
<div id="footer_deal"
|
||||
th:if="${not #lists.isEmpty(theme.config.footer.socialMedia)}"
|
||||
th:with="socialMedias = ${theme.config.footer.socialMedia}">
|
||||
|
|
@ -32,59 +34,54 @@
|
|||
|
||||
</th:block>
|
||||
<!-- 底部 banner -->
|
||||
<div id="footer-section">
|
||||
<div class="footer-section-links">
|
||||
<div class="footer-section-left">
|
||||
<div id="footer-section-tips">
|
||||
|
||||
<div id="footer-banner">
|
||||
<div class="footer-banner-links">
|
||||
<div class="footer-banner-left">
|
||||
<div id="footer-banner-tips">
|
||||
<div class="copyright" th:if="${not #strings.isEmpty(theme.config.basics.siteStartTime)}">
|
||||
©[[${#strings.arraySplit(theme.config.basics.siteStartTime, '-')[0]}]] - [[${#dates.format(new java.util.Date(), 'yyyy')}]] [[${site.title}]].
|
||||
©[[${#strings.arraySplit(theme.config.basics.siteStartTime, '-')[0]}]] - [[${#dates.format(new java.util.Date(),
|
||||
'yyyy')}]] [[${site.title}]].
|
||||
<a class="footer-section-link" href="https://halo.run" rel="external nofollow">Power by Halo</a>
|
||||
<a class="footer-section-link" href="https://github.com/liuzhihang/halo-theme-hao"
|
||||
rel="external nofollow" target="_blank"> Theme By Hao</a>
|
||||
</div>
|
||||
<div class="copyright" th:if="${#strings.isEmpty(theme.config.basics.siteStartTime)}">
|
||||
©[[${#dates.format(new java.util.Date(), 'yyyy')}]] [[${site.title}]].
|
||||
<a class="footer-section-link" href="https://halo.run" rel="external nofollow">Power by Halo</a>
|
||||
<a class="footer-section-link" href="https://github.com/liuzhihang/halo-theme-hao"
|
||||
rel="external nofollow" target="_blank"> Theme By Hao</a>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div>
|
||||
|
||||
Powered by <a class="hover:underline" href="https://halo.run" target="_blank">Halo</a>.
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-banner-right">
|
||||
<!-- 订阅 需要 RSS 插件支持 -->
|
||||
<a class="footer-banner-link" href="/sitemap.xml"
|
||||
th:if="${pluginFinder.available('PluginSitemap')}">订阅</a>
|
||||
<a class="footer-banner-link" href="https://github.com/liuzhihang/halo-theme-hao">主题</a>
|
||||
<a class="footer-banner-link" href="/about">关于</a>
|
||||
<a class="footer-banner-link" href="https://beian.miit.gov.cn/#/Integrated/index"
|
||||
rel="noopener external nofollow noreferrer noopener" target="_blank">[[${theme.config.basics.icp}]]
|
||||
<div class="footer-section-right">
|
||||
<a class="footer-section-link" href="/rss/">订阅</a>
|
||||
|
||||
<a class="footer-banner-link" href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">
|
||||
[[${theme.config.basics.icp}]]
|
||||
</a>
|
||||
<a class="footer-banner-link" th:href="@{'http://www.beian.gov.cn/portal/registerSystemInfo'}"
|
||||
rel="noopener external nofollow noreferrer noopener" target="_blank">[[${theme.config.basics.gongan}]]
|
||||
|
||||
<a class="footer-banner-link" target="_blank"
|
||||
th:href="@{'http://www.beian.gov.cn/portal/registerSystemInfo'}"> [[${theme.config.basics.gongan}]]
|
||||
</a>
|
||||
<a class="footer-banner-link cc"
|
||||
th:href="${theme.config.basics.copyrightAgreement}"
|
||||
th:if="${not #strings.isEmpty(theme.config.basics.copyrightAgreement)}"
|
||||
title="cc协议">
|
||||
<i class="iconfont icon-cc"></i>
|
||||
<i class="iconfont icon-by"></i>
|
||||
<i class="iconfont icon-nc"></i>
|
||||
<i class="iconfont icon-nd"></i>
|
||||
|
||||
<a class="footer-section-link cc" href="https://creativecommons.org/licenses/by/4.0/" target="_blank" title="cc协议">
|
||||
<i class="fa-solid fa-closed-captioning"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 暂时不需要弹窗 -->
|
||||
<div id="introduction-window">
|
||||
<div class="introduction-window-title" th:text="${theme.config.snackbar.introductionTitle}"></div>
|
||||
<div class="introduction-window-content">
|
||||
<span class="introduction-tip" th:text="${theme.config.snackbar.introductionTip}"></span>
|
||||
<a class="introduction-link" target="_blank" title="点击查看"
|
||||
th:href="@{${theme.config.snackbar.introductionUrl}}">
|
||||
<i class="iconfont icon-arrow-circle-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div id="quit-box" onclick="RemoveRewardMask()"></div>
|
||||
<!--<div id="introduction-window">-->
|
||||
<!-- <div class="introduction-window-title" th:text="${theme.config.snackbar.introductionTitle}"></div>-->
|
||||
<!-- <div class="introduction-window-content">-->
|
||||
<!-- <span class="introduction-tip" th:text="${theme.config.snackbar.introductionTip}"></span>-->
|
||||
<!-- <a class="introduction-link" target="_blank" title="点击查看"-->
|
||||
<!-- th:href="@{${theme.config.snackbar.introductionUrl}}">-->
|
||||
<!-- <i class="iconfont icon-arrow-circle-right"></i>-->
|
||||
<!-- </a>-->
|
||||
<!-- </div>-->
|
||||
<!--</div>-->
|
||||
<!--<div id="quit-box" onclick="RemoveRewardMask()"></div>-->
|
||||
</footer>
|
||||
</html>
|
||||
|
|
@ -1,158 +1,67 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" xmlns:th="http://www.thymeleaf.org">
|
||||
<html data-theme="light" lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
|
||||
<!-- 公共的 head 部分，可以定义部分 links,scripts,styles -->
|
||||
<head th:fragment="head(metas,links,scripts)">
|
||||
<head th:fragment="head(htmlType)">
|
||||
<meta charset="UTF-8">
|
||||
<meta content="IE=edge" http-equiv="X-UA-Compatible">
|
||||
<meta content="width=device-width,initial-scale=1" name="viewport">
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport">
|
||||
<title th:text="${site.title}"></title>
|
||||
<meta content="telephone=no" name="format-detection">
|
||||
<meta content="var(--heo-card-bg)" name="theme-color">
|
||||
<noscript>开启Javascript是必要的</noscript>
|
||||
|
||||
<link rel="shortcut icon"
|
||||
th:href="@{${#strings.isEmpty(site.favicon) ? '/assets/images/hao-logo.jpg' : site.favicon}}"/>
|
||||
|
||||
<script th:src="@{/assets/js/heo.js}"></script>
|
||||
<link rel="icon" th:href="@{${#strings.isEmpty(site.favicon) ? '/assets/images/hao-logo.jpg' : site.favicon}}" type="image/x-icon">
|
||||
<link rel="apple-touch-icon" th:href="@{${#strings.isEmpty(site.favicon) ? '/assets/images/hao-logo.jpg' : site.favicon}}">
|
||||
<meta content="程序员小航" name="apple-mobile-web-app-title">
|
||||
<link rel="bookmark" th:href="@{${#strings.isEmpty(site.favicon) ? '/assets/images/hao-logo.jpg' : site.favicon}}">
|
||||
<link rel="apple-touch-icon-precomposed" sizes="180x180"
|
||||
th:href="@{${#strings.isEmpty(site.favicon) ? '/assets/images/hao-logo.jpg' : site.favicon}}">
|
||||
|
||||
<script th:src="@{/assets/js/halo.js}"></script>
|
||||
<meta content="学，然后知不足；教，然后知困。" name="description">
|
||||
<meta content="#1C1C1F" name="theme-color">
|
||||
<link rel="stylesheet" th:href="@{/assets/css/var.css}">
|
||||
<link rel="stylesheet" th:href="@{/assets/css/main.css}">
|
||||
<link rel="stylesheet" th:href="@{/assets/css/custom.css}">
|
||||
|
||||
<link rel="stylesheet" th:href="@{/assets/zhheo/zhheoblog.css}">
|
||||
|
||||
<link rel="stylesheet" th:href="@{/assets/zhheo/custom.css}">
|
||||
|
||||
<link media="print"
|
||||
onload='this.media="all"'
|
||||
rel="stylesheet"
|
||||
th:href="@{/assets/libs/iconfont/iconfont.css}">
|
||||
<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.3.0/css/all.min.css" rel="stylesheet">
|
||||
|
||||
<!-- 右下角通知 -->
|
||||
<link href="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/node-snackbar/0.1.16/snackbar.min.css"
|
||||
media="print"
|
||||
onload='this.media="all"'
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<link rel="stylesheet" th:href="@{/assets/lib/snackbar.min.css}">
|
||||
|
||||
<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/6.2.0/css/all.min.css" media="all" onload="this.media='all'">
|
||||
<script th:src="@{/assets/lib/qrcode.min.js}"></script>
|
||||
|
||||
<script>
|
||||
(win => {
|
||||
win.saveToLocal = {
|
||||
set: function setWithExpiry(key, value, ttl) {
|
||||
if (ttl === 0) return
|
||||
const now = new Date()
|
||||
const expiryDay = ttl * 86400000
|
||||
const item = {
|
||||
value: value,
|
||||
expiry: now.getTime() + expiryDay,
|
||||
}
|
||||
localStorage.setItem(key, JSON.stringify(item))
|
||||
<script th:inline="javascript">
|
||||
var GLOBALCONFIG = {
|
||||
"root": "/",
|
||||
"runtime": "2021-12-12 00:00:00",
|
||||
"lazyload": {"enable": false, "error": "/img/acrylic.png"},
|
||||
"hightlight": {"enable": false, "limit": 200},
|
||||
"lightbox": true,
|
||||
"randomlinks": false,
|
||||
"lang": {
|
||||
"theme": {"dark": "已切换至深色模式", "light": "已切换至浅色模式"},
|
||||
"copy": {"success": "复制成功", "error": "复制失败"},
|
||||
"backtop": "返回顶部",
|
||||
"time": {"recent": "最近", "yesterday": "昨天", "berforeyesterday": "前天", "daybefore": "天前", "runtime": "天"},
|
||||
"sayhello": {
|
||||
"morning": "早上好",
|
||||
"noon": "中午好",
|
||||
"afternoon": "下午好",
|
||||
"night": "晚上好",
|
||||
"goodnight": "晚安",
|
||||
"iam": "! 我是"
|
||||
},
|
||||
|
||||
get: function getWithExpiry(key) {
|
||||
const itemStr = localStorage.getItem(key)
|
||||
|
||||
if (!itemStr) {
|
||||
return undefined
|
||||
}
|
||||
const item = JSON.parse(itemStr)
|
||||
const now = new Date()
|
||||
|
||||
if (now.getTime() > item.expiry) {
|
||||
localStorage.removeItem(key)
|
||||
return undefined
|
||||
}
|
||||
return item.value
|
||||
}
|
||||
}
|
||||
|
||||
win.getScript = url => new Promise((resolve, reject) => {
|
||||
const script = document.createElement('script')
|
||||
script.src = url
|
||||
script.async = true
|
||||
script.onerror = reject
|
||||
script.onload = script.onreadystatechange = function () {
|
||||
const loadState = this.readyState
|
||||
if (loadState && loadState !== 'loaded' && loadState !== 'complete') return
|
||||
script.onload = script.onreadystatechange = null
|
||||
resolve()
|
||||
}
|
||||
document.head.appendChild(script)
|
||||
})
|
||||
|
||||
win.activateDarkMode = function () {
|
||||
document.documentElement.setAttribute('data-theme', 'dark')
|
||||
heo.initThemeColor()
|
||||
}
|
||||
win.activateLightMode = function () {
|
||||
document.documentElement.setAttribute('data-theme', 'light')
|
||||
heo.initThemeColor()
|
||||
}
|
||||
const t = saveToLocal.get('theme')
|
||||
|
||||
const isDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches
|
||||
const isLightMode = window.matchMedia('(prefers-color-scheme: light)').matches
|
||||
const isNotSpecified = window.matchMedia('(prefers-color-scheme: no-preference)').matches
|
||||
const hasNoSupport = !isDarkMode && !isLightMode && !isNotSpecified
|
||||
|
||||
if (t === undefined) {
|
||||
if (isLightMode) activateLightMode()
|
||||
else if (isDarkMode) activateDarkMode()
|
||||
else if (isNotSpecified || hasNoSupport) {
|
||||
const now = new Date()
|
||||
const hour = now.getHours()
|
||||
const isNight = hour <= 6 || hour >= 18
|
||||
isNight ? activateDarkMode() : activateLightMode()
|
||||
}
|
||||
window.matchMedia('(prefers-color-scheme: dark)').addListener(function (e) {
|
||||
if (saveToLocal.get('theme') === undefined) {
|
||||
e.matches ? activateDarkMode() : activateLightMode()
|
||||
}
|
||||
})
|
||||
} else if (t === 'light') activateLightMode()
|
||||
else activateDarkMode()
|
||||
|
||||
if("[[${theme.config.style.colorScheme}]]" === 'dark')
|
||||
activateDarkMode()
|
||||
if("[[${theme.config.style.colorScheme}]]" === 'light')
|
||||
activateLightMode()
|
||||
|
||||
const asideStatus = saveToLocal.get('aside-status')
|
||||
if (asideStatus !== undefined) {
|
||||
if (asideStatus === 'hide') {
|
||||
document.documentElement.classList.add('hide-aside')
|
||||
} else {
|
||||
document.documentElement.classList.remove('hide-aside')
|
||||
}
|
||||
}
|
||||
})(window)
|
||||
"search": {"empty": "搜索结果为空", "hit": "已为您找到 ${query} 条结果", "placeholder": "输入关键词快速查找"}
|
||||
},
|
||||
"covercolor": true
|
||||
};</script>
|
||||
<script id="site-config">
|
||||
// 页面类型 index,page,post,tag,category
|
||||
var PAGECONFIG = {
|
||||
"is_home": [[${htmlType == 'index'}]],
|
||||
"is_post": [[${htmlType == 'post'}]],
|
||||
"is_page": [[${htmlType == 'page'}]],
|
||||
"page": false
|
||||
};
|
||||
</script>
|
||||
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.6.0/jquery.min.js"></script>
|
||||
|
||||
<!-- 动态加载条 -->
|
||||
<script data-pace-options='{ "restartOnRequestAfter":false,"eventLag":false}'
|
||||
src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/pace/1.2.4/pace.min.js"
|
||||
th:if="${theme.config.other.loadProgressBar}">
|
||||
</script>
|
||||
|
||||
<!-- 复制 https://github.com/zenorocha/clipboard.js -->
|
||||
<script th:src="@{/assets/libs/clipboard/clipboard.min.js}"></script>
|
||||
|
||||
<!-- swiper 在瞬间滚动时会使用 -->
|
||||
<link rel="stylesheet" th:href="@{/assets/libs/swiper/swiper-bundle.min.css}"/>
|
||||
<script th:src="@{/assets/libs/swiper/swiper-bundle.min.js}"></script>
|
||||
|
||||
<!-- 补充部分 -->
|
||||
<th:block th:if="${metas != null}">
|
||||
<th:block th:replace="${metas}"/>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${links != null}">
|
||||
<th:block th:replace="${links}"/>
|
||||
</th:block>
|
||||
|
||||
<th:block th:if="${scripts != null}">
|
||||
<th:block th:replace="${scripts}"/>
|
||||
</th:block>
|
||||
</head>
|
||||
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -2,157 +2,79 @@
|
|||
<html lang="en" th:fragment="layout(content, htmlType)" xmlns:th="http://www.thymeleaf.org">
|
||||
|
||||
<!-- head 中自定义的 -->
|
||||
<head th:replace="~{modules/head :: head(metas = null, links = null, scripts = ~{::head/script})}">
|
||||
|
||||
<!-- 声明一些公共信息 -->
|
||||
<script th:inline="javascript">
|
||||
const GLOBAL_CONFIG = {
|
||||
siteTitle : [[${site.title}]],
|
||||
// 页面类型 index,page,post,tag,category
|
||||
htmlType: [[${htmlType}]],
|
||||
postTitle: [[${htmlType == 'post' ? post.spec.title : ''}]],
|
||||
isanchor: true,
|
||||
isPost: [[${htmlType == 'post'}]],
|
||||
isHome: [[${htmlType == 'index'}]],
|
||||
isHighlightShrink: false,
|
||||
isToc: [[${htmlType == 'post'}]] && document.getElementById("card-toc"),
|
||||
postUpdate: '2022-11-04 20:08:15',
|
||||
Snackbar: {
|
||||
chs_to_cht: "你已切换为繁体",
|
||||
cht_to_chs: "你已切换为简体",
|
||||
day_to_night: "你已切换为深色模式",
|
||||
night_to_day: "你已切换为浅色模式",
|
||||
bgLight: "#49b1f5",
|
||||
bgDark: "#121212",
|
||||
position: "top-center",
|
||||
},
|
||||
|
||||
};
|
||||
|
||||
// 根据htmlType设置页面title
|
||||
let setTitle = ()=>{
|
||||
let title = ''
|
||||
|
||||
switch([[${htmlType}]]){
|
||||
case 'post':
|
||||
if(GLOBAL_CONFIG.postTitle != '')
|
||||
title = GLOBAL_CONFIG.postTitle
|
||||
break;
|
||||
case 'archive':
|
||||
title = '归档'
|
||||
break;
|
||||
case 'category':
|
||||
title = '分类'
|
||||
break;
|
||||
case 'links':
|
||||
title = '友链'
|
||||
break;
|
||||
case 'tag':
|
||||
title = '标签'
|
||||
break;
|
||||
case 'moments':
|
||||
title = '瞬间'
|
||||
break;
|
||||
}
|
||||
if(title != '')
|
||||
document.title = title + ' - ' + [[${site.title}]]
|
||||
}
|
||||
|
||||
(() => {
|
||||
setTitle()
|
||||
})()
|
||||
|
||||
</script>
|
||||
|
||||
<head th:replace="~{modules/head :: head(htmlType = ${htmlType})}">
|
||||
<title th:text="${site.title}"></title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<!-- loading 页面 -->
|
||||
<div th:replace="~{modules/loading-box :: loading-box}"></div>
|
||||
|
||||
<!-- 网站背景 -->
|
||||
<div id="web_bg"></div>
|
||||
<body id="body">
|
||||
|
||||
<!-- 控制台 -->
|
||||
<div th:replace="~{modules/widgets/console :: console}"></div>
|
||||
|
||||
<!-- sidebar -->
|
||||
<div th:replace="~{modules/sidebar :: sidebar}"></div>
|
||||
|
||||
|
||||
<!-- loading 页面 -->
|
||||
<div th:replace="~{modules/loading-box :: loading-box}"></div>
|
||||
|
||||
<!-- 内容 -->
|
||||
<th:block th:replace="${content}"></th:block>
|
||||
|
||||
<!-- todo 暂时没显示，是右下角悬浮操作按钮 -->
|
||||
<!--<div id="rightside">-->
|
||||
<!-- <div id="rightside-config-hide">-->
|
||||
<!-- <button id="translateLink" title="简繁转换" type="button">简</button>-->
|
||||
<!-- <button id="darkmode" title="浅色和深色模式转换" type="button"><i class="fas fa-adjust"></i></button>-->
|
||||
<!-- <button id="hide-aside-btn" title="单栏和双栏切换" type="button"><i class="fas fa-arrows-alt-h"></i></button>-->
|
||||
<!-- </div>-->
|
||||
<!-- <div id="rightside-config-show">-->
|
||||
<!-- <button id="rightside_config" title="设置" type="button"><i class="fas fa-cog fa-spin"></i></button>-->
|
||||
<!-- <button id="go-up" title="回到顶部" type="button"><i class="fas fa-arrow-up"></i></button>-->
|
||||
<!-- </div>-->
|
||||
<!--</div>-->
|
||||
|
||||
<div th:replace="~{modules/right-menu :: right-menu}"></div>
|
||||
|
||||
<div>
|
||||
<script th:src="@{/assets/js/utils.js}"></script>
|
||||
<script th:src="@{/assets/js/main.js}"></script>
|
||||
<script charset="utf-8" data-pjax="" th:src="@{/assets/zhheo/blogex.js}"></script>
|
||||
<script th:src="@{/assets/js/utils.js}" type="text/javascript"></script>
|
||||
<script th:src="@{/assets/js/main.js}" type="text/javascript"></script>
|
||||
<script th:src="@{/assets/lib/pjax.min.js}"></script>
|
||||
<script th:src="@{/assets/lib/snackbar.min.js}"></script>
|
||||
<script th:src="@{/assets/lib/view-image.min.js}"></script>
|
||||
<div id="js-pjax"></div>
|
||||
<script th:src="@{/assets/js/extend/covercolor/web.js}"></script>
|
||||
<script>
|
||||
let pjaxSelectors = [
|
||||
'title',
|
||||
'#body-wrap',
|
||||
'#site-config',
|
||||
'meta[name="description"]',
|
||||
'#js-pjax'
|
||||
]
|
||||
|
||||
<!-- https://instant.page/ 网站预加载， 放在 </body> 之前 -->
|
||||
<script th:src="@{/assets/libs/instantpage/instantpage.min.js}" type="module"></script>
|
||||
const pjax = new Pjax({
|
||||
elements: 'a:not([target="_blank"])',
|
||||
selectors: pjaxSelectors,
|
||||
cacheBust: false,
|
||||
analytics: false,
|
||||
scrollRestoration: false
|
||||
})
|
||||
|
||||
<!-- 右下角通知 https://www.polonel.com/snackbar/ -->
|
||||
<!-- todo head 中有它的 css，应该可以写一块，并改成后台可配置的功能，代码中应该还有他的 js -->
|
||||
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/node-snackbar/0.1.16/snackbar.min.js"></script>
|
||||
document.querySelectorAll('script[data-pjax]').forEach(item => {
|
||||
const newScript = document.createElement('script')
|
||||
const content = item.text || item.textContent || item.innerHTML || ""
|
||||
Array.from(item.attributes).forEach(attr => newScript.setAttribute(attr.name, attr.value))
|
||||
newScript.appendChild(document.createTextNode(content))
|
||||
item.parentNode.replaceChild(newScript, item)
|
||||
})
|
||||
|
||||
<!-- https://davidshimjs.github.io/qrcodejs/ 生成二维码 -->
|
||||
<!-- 应该是文章页分享使用 -->
|
||||
<script src="https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/qrcodejs/1.0.0/qrcode.min.js"></script>
|
||||
|
||||
<!-- https://raphamorim.io/waterfall.js/ 应该是这个 还有相关的 js 代码 是否可以调整-->
|
||||
<script th:src="@{/assets/libs/waterfall/waterfall.min.js}"></script>
|
||||
|
||||
<!-- 获取主色 https://lokeshdhakar.com/projects/color-thief/ -->
|
||||
<!--<script th:src="@{/assets/libs/color-thief/color-thief.umd.js}"></script>-->
|
||||
<script th:src="@{/assets/libs/fast-average-color/index.browser.min.js}"></script>
|
||||
document.addEventListener('pjax:error', (e) => {
|
||||
if (e.request.status === 404) {
|
||||
pjax.loadUrl('/404.html')
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
<script th:inline="javascript">
|
||||
|
||||
|
||||
if ([[${theme.config.post.dynamicBackground}]]) {
|
||||
// 图片主色
|
||||
coverColor();
|
||||
}
|
||||
|
||||
if ([[${theme.config.other.loadingBox}]]) {
|
||||
// 移除加载动画
|
||||
removeLoading();
|
||||
}
|
||||
navTitle();
|
||||
heo.topPostScroll();
|
||||
heo.topCategoriesBarScroll();
|
||||
heo.sayhi();
|
||||
heo.addTag();
|
||||
heo.stopImgRightDrag();
|
||||
heo.qrcodeCreate();
|
||||
heo.onlyHome();
|
||||
heo.addNavBackgroundInit();
|
||||
heo.reflashEssayWaterFall();
|
||||
heo.addMediumInEssay();
|
||||
heo.darkModeStatus();
|
||||
// heo.categoriesBarActive();
|
||||
heo.initThemeColor();
|
||||
|
||||
</script>
|
||||
<div class="needEndHide" id="nav-music" onclick="acrylic.musicToggle()">
|
||||
<div id="nav-music-hoverTips">音乐已暂停</div>
|
||||
<meting-js data-lrctype="0" id="1708664797" mutex="true" order="random" preload="none" server="tencent" theme="var(--heo-main)"
|
||||
type="playlist">
|
||||
</meting-js>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
<!-- 所有文章路径 -->
|
||||
<script>const posts = [];
|
||||
|
||||
function toRandomPost() {
|
||||
window.pjax ? pjax.loadUrl('/' + posts[Math.floor(Math.random() * posts.length)]) : window.open('/' + posts[Math.floor(Math.random() * posts.length)], "_self");
|
||||
}</script>
|
||||
|
|
|
|||
|
|
@ -3,23 +3,28 @@
|
|||
|
||||
<div class="bbTimeList container" id="bbTimeList" th:fragment="moment" th:if="!${pluginFinder.available('PluginMoments')}">
|
||||
<!-- 未安装插件 -->
|
||||
<i class="iconfont icon-logo-moment" onclick="" style="font-size: 1.3rem;" title="瞬间"></i>
|
||||
<div class="swiper-container swiper-no-swiping" id="bbtalk" tabindex="-1">
|
||||
<i class="bber-logo fa-regular fa-bell icon-bblogo" onclick="" title="瞬间"></i>
|
||||
<div class="swiper-container swiper-no-swiping swiper-container-initialized swiper-container-vertical swiper-container-pointer-events"
|
||||
id="bbtalk" tabindex="-1">
|
||||
<div class="swiper-wrapper" id="bber-talk" onclick="location.href=location.href='https\:\/\/github.com/halo-sigs/plugin-moments'">
|
||||
<div class="li-style swiper-slide">这里需要安装瞬间的插件</div>
|
||||
<div class="li-style swiper-slide">去安装吧！</div>
|
||||
</div>
|
||||
</div>
|
||||
<i class="bber-gotobb fas fa-arrow-circle-right" onclick="location.href=location.href='https\:\/\/github.com/halo-sigs/plugin-moments'" title="下载插件"></i>
|
||||
<i class="bber-gotobb fas fa-arrow-circle-right" onclick="location.href=location.href='https\:\/\/github.com/halo-sigs/plugin-moments'"
|
||||
title="下载插件"></i>
|
||||
</div>
|
||||
|
||||
<div class="bbTimeList container" id="bbTimeList" th:fragment="moment" th:if="${theme.config.top.moment} and ${pluginFinder.available('PluginMoments')}">
|
||||
<div class="bbTimeList container" id="bbTimeList" th:fragment="moment"
|
||||
th:if="${theme.config.top.moment} and ${pluginFinder.available('PluginMoments')}">
|
||||
<!-- 瞬间插件 -->
|
||||
<i class="iconfont icon-logo-moment" onclick="" style="font-size: 1.3rem;" title="瞬间"></i>
|
||||
<div class="swiper-container swiper-no-swiping" id="bbtalk" tabindex="-1">
|
||||
<div class="swiper-wrapper" id="bber-talk" onclick="location.href='/moments'" th:if="${momentFinder}">
|
||||
<i class="bber-logo fa-regular fa-bell icon-bblogo" onclick="" title="瞬间"></i>
|
||||
<div class="swiper-container swiper-no-swiping swiper-container-initialized swiper-container-vertical swiper-container-pointer-events"
|
||||
id="bbtalk" tabindex="-1">
|
||||
<div class="swiper-wrapper" id="bber-talk" onclick="location.href='/moments'" th:if="${momentFinder}">
|
||||
<th:block th:each="moment : ${momentFinder.listAll()}" th:with="content=${moment.spec.content}">
|
||||
<div class="li-style swiper-slide" th:if="${not #strings.isEmpty(content.html)}" th:text="${#strings.substringBefore(#strings.substringAfter(content.html,'<p>'),'</p>')}"></div>
|
||||
<div class="li-style swiper-slide" th:if="${not #strings.isEmpty(content.html)}"
|
||||
th:text="${#strings.substringBefore(#strings.substringAfter(content.html,'<p>'),'</p>')}"></div>
|
||||
</th:block>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,13 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" xmlns:th="http://www.thymeleaf.org">
|
||||
<nav id="nav" th:fragment="nav">
|
||||
<nav class="show" id="nav" th:fragment="nav(title)">
|
||||
<div id="nav-group">
|
||||
|
||||
<!-- 导航栏左侧 -->
|
||||
<div th:replace="~{modules/widgets/nav-left :: nav-left}"></div>
|
||||
|
||||
<div id="page-name-mask">
|
||||
<div id="page-name"><a id="page-name-text" onclick="btf.scrollToDest(0,500)"></a></div>
|
||||
<div id="page-name">
|
||||
<a id="page-name-text" onclick="acrylic.toTop()" th:text="${#strings.isEmpty(title) ? site.title : title}"></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 导航栏中间 -->
|
||||
|
|
@ -16,6 +18,7 @@
|
|||
<!-- 导航栏右侧 -->
|
||||
<div th:replace="~{modules/widgets/nav-right :: nav-right}"></div>
|
||||
|
||||
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
|
|
|||
|
|
@ -13,27 +13,26 @@
|
|||
(${post.spec.pinned} ? 'pinned-post-item' : '')"
|
||||
th:each="post,iStat : ${postItems}">
|
||||
|
||||
<div class="post_cover cover_radius">
|
||||
<div class="post_cover left_radius">
|
||||
<a th:attr="title=${post.spec.title}" th:href="@{${post.status.permalink}}">
|
||||
<img class="post_bg entered loaded" loading="lazy"
|
||||
th:alt="${post.status.excerpt}"
|
||||
<img class="post_bg" th:alt="${post.status.excerpt}"
|
||||
th:src='${#strings.isEmpty(post.spec.cover) ? postRandomImg+","+post.spec.title : post.spec.cover}'>
|
||||
</a>
|
||||
</div>
|
||||
<!-- 类别非空时 -->
|
||||
<th:block th:if="${not #lists.isEmpty(post.categories)}">
|
||||
<span class="article-meta__categories">
|
||||
<a class="article-meta__category"
|
||||
th:each="category : ${post.categories}"
|
||||
th:href="@{${category.status.permalink}}"
|
||||
th:text="${category.spec.displayName}"
|
||||
th:title="${category.spec.displayName}">
|
||||
</a>
|
||||
</span>
|
||||
</th:block>
|
||||
|
||||
<div class="recent-post-info">
|
||||
<div class="recent-post-info-top">
|
||||
<span class="pinned-post" th:if="${post.spec.pinned}">置顶</span>
|
||||
<!-- 类别非空时 -->
|
||||
<div class="recent-post-info-top-tips">
|
||||
<th:block th:if="${not #lists.isEmpty(post.categories)}">
|
||||
<span class="original" th:each="category : ${post.categories}"
|
||||
th:text="${category.spec.displayName}"
|
||||
th:title="${category.spec.displayName}">
|
||||
</span>
|
||||
</th:block>
|
||||
</div>
|
||||
|
||||
<a class="article-title"
|
||||
th:attr="title=${post.spec.title}"
|
||||
th:href="@{${post.status.permalink}}"
|
||||
|
|
@ -47,8 +46,7 @@
|
|||
<!-- tag -->
|
||||
<th:block th:if="${not #lists.isEmpty(post.tags)}">
|
||||
<span class="article-meta tags">
|
||||
<a class="article-meta__tags" event.cancelbubble
|
||||
onclick="window.event.cancelBubble=!0"
|
||||
<a class="article-meta__tags" onclick="window.event.cancelBubble=true;"
|
||||
th:each="tag : ${post.tags}"
|
||||
th:href="@{${tag.status.permalink}}"
|
||||
th:title="${tag.spec.displayName}">
|
||||
|
|
@ -57,25 +55,26 @@
|
|||
</span>
|
||||
</th:block>
|
||||
<!-- 创建时间 -->
|
||||
<span class="post-meta-date" th:with="days=${(new java.util.Date().getTime()-post.spec.publishTime.toEpochMilli())/86400000}">
|
||||
<span class="post-meta-date"
|
||||
th:with="days=${(new java.util.Date().getTime()-post.spec.publishTime.toEpochMilli())/86400000}">
|
||||
<i class="far fa-calendar-alt"></i>
|
||||
<span class="article-meta-label">创建</span>
|
||||
<time style="display: inline;"
|
||||
th:datetime="${post.spec.publishTime}"
|
||||
th:if="${days > 30}"
|
||||
th:text="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}"
|
||||
th:datetime="${post.spec.publishTime}"
|
||||
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
|
||||
</time>
|
||||
<time style="display: inline;"
|
||||
th:datetime="${post.spec.publishTime}"
|
||||
th:if="${days <= 30 && days > 0}"
|
||||
th:text="${days}+天前"
|
||||
th:datetime="${post.spec.publishTime}"
|
||||
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
|
||||
</time>
|
||||
<time style="display: inline;"
|
||||
th:datetime="${post.spec.publishTime}"
|
||||
th:if="${days == 0}"
|
||||
th:text="最近"
|
||||
th:datetime="${post.spec.publishTime}"
|
||||
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}+创建">
|
||||
</time>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -2,113 +2,33 @@
|
|||
<html lang="en" xmlns:th="http://www.thymeleaf.org">
|
||||
|
||||
<!-- 侧栏，主要是手机端时会使用 -->
|
||||
<div id="sidebar" th:fragment="sidebar">
|
||||
<div id="sidebar" style="zoom: 1;" th:fragment="sidebar">
|
||||
|
||||
<div id="menu-mask"></div>
|
||||
<div id="menu-mask" style="display: none;"></div>
|
||||
<div id="sidebar-menus">
|
||||
<span class="sidebar-menu-item-title">功能</span>
|
||||
<div class="sidebar-menu-item">
|
||||
<a class="darkmode_switchbutton menu-child" href="javascript:void(0);" onclick="rm.switchDarkMode()"
|
||||
<a class="darkmode_switchbutton menu-child" href="javascript:void(0);" onclick="acrylic.switchDarkMode()"
|
||||
rel="external nofollow" title="显示模式切换">
|
||||
<i class="iconfont icon-moon" style="font-size: 1rem;"></i>
|
||||
<i class="fas fa-moon" style="font-size: 1rem;"></i>
|
||||
<span>显示模式</span>
|
||||
</a>
|
||||
</div>
|
||||
<th:block th:if="${not #strings.isEmpty(theme.config.nav.leftMenu)}"
|
||||
th:with="leftMenu = ${menuFinder.getByName(theme.config.nav.leftMenu)}">
|
||||
<div class="back-menu-list-groups">
|
||||
<div class="back-menu-list-group" th:each="menuItem : ${leftMenu.menuItems}">
|
||||
|
||||
<th:block th:if="${not #lists.isEmpty(menuItem.children)}">
|
||||
<!-- 菜单必须有子项才会展示 -->
|
||||
<div class="back-menu-list-title" th:text="${menuItem.status.displayName}"></div>
|
||||
<div class="back-menu-list">
|
||||
<th:block th:each="childMenu : ${menuItem.children}">
|
||||
<a class="back-menu-item" rel="external nofollow"
|
||||
target="_blank" th:href="@{${childMenu.status.href}}">
|
||||
<!-- icon 预留 -->
|
||||
<!--<img class="back-menu-item-icon" th:src="@{图片地址}">-->
|
||||
<span class="back-menu-item-text" th:text="${childMenu.status.displayName}"></span>
|
||||
</a>
|
||||
</th:block>
|
||||
</div>
|
||||
<div class="back-menu-list-groups">
|
||||
|
||||
</th:block>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</th:block>
|
||||
<div class="menus_items">
|
||||
<div class="menus_item">
|
||||
<a class="site-page" href="javascript:void(0);" rel="external nofollow">
|
||||
<span>文章</span><i class="iconfont icon-chevron-down"></i>
|
||||
</a>
|
||||
<ul class="menus_item_child">
|
||||
<li>
|
||||
<a class="site-page child" href="/archives">
|
||||
<i class="iconfont icon-list-ul"></i>
|
||||
<span>文章归档</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="site-page child" href="/categories">
|
||||
<i class="iconfont icon-folder-open"></i>
|
||||
<span>全部分类</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="site-page child" href="/tags">
|
||||
<i class="iconfont icon-tags"></i>
|
||||
<span>全部标签</span>
|
||||
</a>
|
||||
</li>
|
||||
<!--<li>-->
|
||||
<!-- <a class="site-page child" href="essay/index.html">-->
|
||||
<!-- <i class="fa-fw fas fa-bars-staggered"></i>-->
|
||||
<!-- <span> 即刻短文</span></a>-->
|
||||
<!--</li>-->
|
||||
</ul>
|
||||
</div>
|
||||
<div class="menus_item">
|
||||
<a class="site-page" href="javascript:void(0);" rel="external nofollow">
|
||||
<span>分类</span><i class="iconfont icon-chevron-down"></i>
|
||||
</a>
|
||||
<ul class="menus_item_child" th:with="categories = ${categoryFinder.listAll()}">
|
||||
<li th:each="category : ${categories}">
|
||||
<a class="site-page child" th:href="@{${category.status.permalink}}">
|
||||
<!--<i class="fa-fw fas fa-swatchbook"></i>-->
|
||||
<span th:title="${category.spec.displayName}">[[${category.spec.displayName}]]</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<!--<div class="menus_item"><a class="site-page" href="javascript:void(0);" rel="external nofollow"><span>-->
|
||||
<!-- 友链</span><i class="fas fa-chevron-down expand"></i></a>-->
|
||||
<!-- <ul class="menus_item_child">-->
|
||||
<!-- <li><a class="site-page child" href="moments/index.html"><i-->
|
||||
<!-- class="fa-fw fas fa-fish-fins"></i><span> 友链鱼塘</span></a></li>-->
|
||||
<!-- <li><a class="site-page child" href="link/index.html"><i-->
|
||||
<!-- class="fa-fw fas fa-user-group"></i><span> 友情链接</span></a></li>-->
|
||||
<!-- <li><a class="site-page child" href="javascript:travelling()" rel="external nofollow"><i-->
|
||||
<!-- class="fa-fw fas fa-bus"></i><span> 宝藏博主</span></a></li>-->
|
||||
<!-- </ul>-->
|
||||
<!--</div>-->
|
||||
<!--<div class="menus_item"><a class="site-page" href="javascript:void(0);" rel="external nofollow"><span>-->
|
||||
<!-- 我的</span><i class="fas fa-chevron-down expand"></i></a>-->
|
||||
<!-- <ul class="menus_item_child">-->
|
||||
<!-- <li><a class="site-page child" href="tlink/index.html"><i-->
|
||||
<!-- class="fa-fw fas fa-screwdriver-wrench"></i><span> 在线工具</span></a></li>-->
|
||||
<!-- <li><a class="site-page child" href="movies/index.html"><i-->
|
||||
<!-- class="fa-fw fas fa-clapperboard"></i><span> 电影推荐</span></a></li>-->
|
||||
<!-- <li><a class="site-page child" href="about/index.html"><i-->
|
||||
<!-- class="fa-fw fas fa-sailboat"></i><span> 关于本站</span></a></li>-->
|
||||
<!-- </ul>-->
|
||||
<!--</div>-->
|
||||
</div>
|
||||
|
||||
<div class="menus_items">
|
||||
|
||||
</div>
|
||||
|
||||
<span class="sidebar-menu-item-title">标签</span>
|
||||
<div class="card-widget card-tags card-archives card-webinfo card-allinfo"
|
||||
th:with="tags = ${tagFinder.listAll()}">
|
||||
<div class="item-headline"><i class="iconfont icon-tags"></i><span>标签</span></div>
|
||||
<div class="card-widget card-tags card-archives card-webinfo card-allinfo" th:with="tags = ${tagFinder.listAll()}">
|
||||
<div class="item-headline">
|
||||
<i class="iconfont icon-tags"></i>
|
||||
<span>标签</span>
|
||||
</div>
|
||||
<div class="card-tag-cloud">
|
||||
<a style="font-size:1em;color:#d3d3d3" th:each="tag : ${tags}"
|
||||
th:href="@{${tag.status.permalink}}"
|
||||
|
|
|
|||
|
|
@ -14,7 +14,6 @@
|
|||
th:if="${not #strings.isEmpty(theme.config.sidebar.profile.profileName)}"
|
||||
th:text="${theme.config.sidebar.profile.profileName}"></div>
|
||||
<div class="author-info__description" th:utext="${theme.config.sidebar.profile.profileDesc}">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -22,7 +21,7 @@
|
|||
<!-- 跳转信息 -->
|
||||
<div class="banner-button-group">
|
||||
<a class="banner-button" href="/about">
|
||||
<i class="iconfont icon-arrow-circle-right"></i>
|
||||
<i class="fas fa-circle-chevron-right"></i>
|
||||
<span class="banner-button-text">了解更多</span>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -31,11 +30,11 @@
|
|||
th:if="${not #lists.isEmpty(theme.config.sidebar.profile.socialMedia)}"
|
||||
th:with="socialMedias = ${theme.config.sidebar.profile.socialMedia}">
|
||||
|
||||
<a class="social-icon" rel="external nofollow" target="_blank"
|
||||
<a class="social-icon" rel="noopener" target="_blank"
|
||||
th:each="socialMedia : ${socialMedias}"
|
||||
th:href="${socialMedia.url}"
|
||||
th:title="${socialMedia.name}">
|
||||
<i class="iconfont " th:classappend="${socialMedia.icon}"></i>
|
||||
<i th:class="${socialMedia.icon}"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -153,30 +153,30 @@
|
|||
</div>
|
||||
</div>
|
||||
<!-- 随机前往一篇文章 -->
|
||||
<a id="banner-hover" onclick="randomPost()">
|
||||
<a data-pjax-state="" id="banner-hover" onclick="randomPost()">
|
||||
<span class="bannerText">随便逛逛</span>
|
||||
<i class="iconfont icon-arrow-right banner-righticon"></i>
|
||||
<i class="fas fa-arrow-right banner-righticon"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- category -->
|
||||
<div class="categoryGroup">
|
||||
<div class="categoryItem" style="box-shadow:var(--heo-shadow-blue)">
|
||||
<a class="categoryButton CB1 bikan"
|
||||
th:href="@{${theme.config.top.bikan}}">
|
||||
<span class="categoryButtonText">必看精选</span><i class="iconfont icon-book"></i>
|
||||
<a class="categoryButton CB1 bikan" th:href="@{${theme.config.top.bikan}}">
|
||||
<span class="categoryButtonText">必看精选</span>
|
||||
<i class="fas fa-dove"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="categoryItem" style="box-shadow:var(--heo-shadow-red)">
|
||||
<a class="categoryButton remen"
|
||||
th:href="@{${theme.config.top.remen}}">
|
||||
<span class="categoryButtonText">热门文章</span><i class="iconfont icon-burn"></i>
|
||||
<a class="categoryButton remen" th:href="@{${theme.config.top.remen}}">
|
||||
<span class="categoryButtonText">热门文章</span>
|
||||
<i class="fas fa-burn"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="categoryItem" style="box-shadow:var(--heo-shadow-green)">
|
||||
<a class="categoryButton shiyong"
|
||||
th:href="@{${theme.config.top.shiyong}}">
|
||||
<span class="categoryButtonText">实用教程</span><i class="iconfont icon-book"></i>
|
||||
<a class="categoryButton shiyong" th:href="@{${theme.config.top.shiyong}}">
|
||||
<span class="categoryButtonText">实用教程</span>
|
||||
<i class="fas fa-book"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,73 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<!-- 控制台，右上角点击的时候会显示 -->
|
||||
<html lang="en" xmlns:th="http://www.thymeleaf.org">
|
||||
<!-- TODO 控制台功能 -->
|
||||
<div id="console" th:fragment="console">
|
||||
<div class="close-btn" href="javascript:void(0);" onclick="heo.hideConsole()">
|
||||
<i class="iconfont icon-times-circle"></i>
|
||||
</div>
|
||||
<div class="console-card-group">
|
||||
<!-- 评论，需要使用评论插件，获取最近评论 -->
|
||||
<div class="console-card-group-left">
|
||||
<div class="console-card" id="card-newest-comments" onclick="heo.hideConsole()">
|
||||
<div class="card-content">
|
||||
<div class="author-content-item-tips">互动</div>
|
||||
<span class="author-content-item-title">最近评论</span></div>
|
||||
<div class="aside-list">
|
||||
<span>最近评论内容 TODO</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 右侧展示 tag -->
|
||||
<div class="console-card-group-right">
|
||||
<div class="console-card tags" onclick="heo.hideConsole()">
|
||||
<div class="card-content">
|
||||
<div class="author-content-item-tips">标签</div>
|
||||
<span class="author-content-item-title">寻找感兴趣的领域</span></div>
|
||||
<div class="card-tag-cloud" th:with="tags = ${tagFinder.listAll()}">
|
||||
<a style="font-size:1em;color:#d3d3d3"
|
||||
th:each="tag : ${tags}"
|
||||
th:href="@{${tag.status.permalink}}"
|
||||
th:text="${tag.spec.displayName}">
|
||||
<sup th:text="${tag.status.visiblePostCount}"> </sup>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 底部展示时间归档 -->
|
||||
<!--<div class="console-card history" onclick="heo.hideConsole()">-->
|
||||
<!-- <div class="item-headline"><i class="fas fa-archive"></i><span>文章</span></div>-->
|
||||
<!-- <ul class="card-archive-list">-->
|
||||
<!-- <li class="card-archive-list-item" th:each="categoryItem : ${categoryFinder.listAll()}">-->
|
||||
<!-- <a class="card-archive-list-link" th:href="${categoryItem.status.permalink}">-->
|
||||
<!-- <span class="card-archive-list-date" th:text="">2022</span>-->
|
||||
<!-- <div class="card-archive-list-count-group">-->
|
||||
<!-- <span class="card-archive-list-count" th:text="${category.status.postCount}"></span>-->
|
||||
<!-- <span class="card-archive-list-count-unit">篇</span>-->
|
||||
<!-- </div>-->
|
||||
<!-- </a>-->
|
||||
<!-- </li>-->
|
||||
<!-- </ul>-->
|
||||
<!--</div>-->
|
||||
</div>
|
||||
<div class="" id="console" style="zoom: 1;" th:fragment="console">
|
||||
<div class="close-btn" href="javascript:void(0);" onclick="acrylic.hideConsole()">
|
||||
<i class="fas fa-circle-xmark"></i>
|
||||
</div>
|
||||
<div class="button-group">
|
||||
<div class="console-btn-item">
|
||||
<!-- 用到了 rightmenu.js 的功能，还需要调整 -->
|
||||
<a class="darkmode_switchbutton" href="javascript:void(0);" onclick="rm.switchDarkMode()" rel="external nofollow" title="显示模式切换"><i
|
||||
class="iconfont icon-moon" style="font-size:1rem"></i>
|
||||
<a class="darkmode_switchbutton" data-pjax-state="" href="javascript:void(0);"
|
||||
onclick="acrylic.switchDarkMode()" rel="external nofollow" title="显示模式切换">
|
||||
<i class="fas fa-moon" style="font-size: 1rem;"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="console-btn-item" id="consoleFPS" onclick="acrylic.FPSToggle()" title="帧率显示开关">
|
||||
<a class="FPS-switch" data-pjax-state="">
|
||||
<i class="fas fa-gauge"></i>
|
||||
</a>
|
||||
</div>
|
||||
<!--<div class="console-btn-item" id="consoleKeyboard" onclick="heo.keyboardToggle()" title="快捷键开关"><a-->
|
||||
<!-- class="keyboard-switch"><i class="fa-duotone fa-keyboard"></i></a>-->
|
||||
<!--</div>-->
|
||||
<!--<div class="console-btn-item" id="assist-open" onclick="heo.hideConsole()" title="无障碍工具栏"><a-->
|
||||
<!-- class="assist-btn"><i class="fa-duotone fa-wheelchair"></i></a>-->
|
||||
<!--</div>-->
|
||||
<!--<div class="console-btn-item" id="consoleMusic" onclick="heo.musicToggle()" title="音乐开关"><a-->
|
||||
<!-- class="music-switch"><i class="fa-duotone fa-music"></i></a>-->
|
||||
<!--</div>-->
|
||||
</div>
|
||||
<div class="console-mask" href="javascript:void(0);" onclick="heo.hideConsole()" rel="external nofollow">
|
||||
</div>
|
||||
<div class="console-mask" href="javascript:void(0);" onclick="acrylic.hideConsole()" rel="external nofollow"></div>
|
||||
</div>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -3,14 +3,11 @@
|
|||
|
||||
<!-- 导航栏左侧 -->
|
||||
<div id="blog_name" th:fragment="nav-left">
|
||||
|
||||
<th:block th:if="${not #strings.isEmpty(theme.config.nav.leftMenu)}"
|
||||
th:with="leftMenu = ${menuFinder.getByName(theme.config.nav.leftMenu)}">
|
||||
<!-- 菜单栏左侧按钮，没有配置时，则不展示-->
|
||||
<div class="back-home-button" tabindex="-1"
|
||||
th:if="${not #lists.isEmpty(leftMenu)}">
|
||||
|
||||
<i class="back-home-button-icon iconfont icon-grip-vertical" style="font-size: 1rem"></i>
|
||||
<div class="back-home-button" tabindex="-1" th:if="${not #lists.isEmpty(leftMenu)}">
|
||||
<i class="back-home-button-icon fas fa-grip-vertical"></i>
|
||||
<div class="back-menu-list-groups">
|
||||
<div class="back-menu-list-group" th:each="menuItem : ${leftMenu.menuItems}">
|
||||
<!-- 菜单必须有子项才会展示 -->
|
||||
|
|
@ -18,8 +15,7 @@
|
|||
<div class="back-menu-list-title" th:text="${menuItem.status.displayName}"></div>
|
||||
<div class="back-menu-list">
|
||||
<th:block th:each="childMenu : ${menuItem.children}">
|
||||
<a class="back-menu-item" rel="external nofollow"
|
||||
target="_blank" th:href="@{${childMenu.status.href}}">
|
||||
<a class="back-menu-item" rel="external nofollow" th:href="@{${childMenu.status.href}}">
|
||||
<!-- icon 预留 -->
|
||||
<!--<img class="back-menu-item-icon" th:src="@{图片地址}">-->
|
||||
<span class="back-menu-item-text" th:text="${childMenu.status.displayName}"></span>
|
||||
|
|
@ -27,7 +23,6 @@
|
|||
</th:block>
|
||||
</div>
|
||||
</th:block>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -35,7 +30,8 @@
|
|||
<!-- 返回主页 -->
|
||||
<!-- 这里可以指定使用什么作为图标，默认使用站点名称 -->
|
||||
<a href="/" id="site-name" title="返回博客主页">
|
||||
<span th:utext="${#strings.isEmpty(theme.config.nav.siteTitle)} ? ${site.title} : ${theme.config.nav.siteTitle}"></span>
|
||||
<span class="heoicon"
|
||||
th:utext="${#strings.isEmpty(theme.config.nav.siteTitle)} ? ${site.title} : ${theme.config.nav.siteTitle}"></span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@
|
|||
<!-- 第一层仅展示使用，不做跳转 -->
|
||||
<div class="menus_item" th:each="menuItem : ${menuFinder.getPrimary().menuItems}">
|
||||
|
||||
<!-- javascript:void(0);" -->
|
||||
<a class="site-page" rel="external nofollow" th:href="@{${menuItem.status.href}}">
|
||||
<span th:text="${menuItem.status.displayName}"></span>
|
||||
</a>
|
||||
|
|
@ -20,7 +19,7 @@
|
|||
<li th:each="childMenu : ${menuItem.children}">
|
||||
<a class="site-page child" th:href="@{${childMenu.status.href}}">
|
||||
<!-- 这里应该有一个 icon 暂时还不支持 -->
|
||||
<!--<i class="fa-fw fa-duotone fa-list-timeline"></i>-->
|
||||
<!--<i class="fas fa-box-archive"></i>-->
|
||||
<span th:text="${childMenu.status.displayName}"></span>
|
||||
</a>
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -6,44 +6,44 @@
|
|||
|
||||
<!-- 功能都需要添加开关 -->
|
||||
|
||||
<!-- 随机友链 -->
|
||||
<!--<div class="nav-button only-home" id="travellings_button">-->
|
||||
<!-- <a class="site-page" href="javascript:void(0);" rel="external nofollow"-->
|
||||
<!-- title="友链">-->
|
||||
<!-- <i class="iconfont icon-bus" style="font-size:1rem"></i>-->
|
||||
<!-- </a>-->
|
||||
<!--</div>-->
|
||||
<div class="nav-button only-home" id="travellings_button">
|
||||
<a class="site-page" href="https://www.travellings.cn/go.html" rel="noopener external nofollow" target="_blank"
|
||||
title="开往-友链接力" width="120">
|
||||
<i class="fa-solid fa-train-subway" style="font-size: 1rem;"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!--<div class="nav-button">-->
|
||||
<!-- <a class="site-page" href="javascript:void(0);" title="随机文章">-->
|
||||
<!-- <i class="iconfont icon-shuffle" style="font-size:1rem"></i>-->
|
||||
<!-- </a>-->
|
||||
<!--</div>-->
|
||||
<div class="nav-button" id="randomPost_button">
|
||||
<a class="site-page" onclick="toRandomPost()"
|
||||
title="随机前往一个文章">
|
||||
<i class="fas fa-shuffle" style="font-size: 1rem;"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- 搜索使用搜索插件 -->
|
||||
<div class="nav-button" id="search-button" th:if="${pluginFinder.available('PluginSearchWidget')}">
|
||||
<a class="site-page social-icon search" href="javascript:SearchWidget.open();" rel="external nofollow" title="站内搜索">
|
||||
<i class="iconfont icon-search" style="font-size:1rem"></i>
|
||||
<i class="fas fa-magnifying-glass" style="font-size: 1rem;"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- 控制台 -->
|
||||
<!--<div class="nav-button">-->
|
||||
<!-- <a class="console_switchbutton" href="javascript:void(0);" onclick="heo.showConsole()" rel="external nofollow"-->
|
||||
<!-- title="控制台">-->
|
||||
<!-- <i class="iconfont icon-a-theconsole-fill" style="font-size:1rem"></i>-->
|
||||
<!-- </a>-->
|
||||
<!--</div>-->
|
||||
<div class="nav-button" id="nav-console">
|
||||
<a class="console_switchbutton" href="javascript:void(0);"
|
||||
onclick="acrylic.showConsole()" rel="external nofollow" title="显示中控台">
|
||||
<i class="fas fa-bars-progress" style="font-size: 1rem;"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="nav-button" id="nav-totop" onclick="btf.scrollToDest(0,500)">
|
||||
|
||||
<div class="nav-button" id="nav-totop" onclick="acrylic.toTop()">
|
||||
<a class="totopbtn">
|
||||
<i class="iconfont icon-arrowup"></i><span id="percent">0</span>
|
||||
<i class="fas fa-arrow-up"></i>
|
||||
<span id="percent">0</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div id="toggle-menu">
|
||||
<a class="site-page">
|
||||
<i class="iconfont icon-bars"></i>
|
||||
<i class="fas fa-bars fa-fw" style="font-size: 1rem;"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
|
||||
<!-- 头部导航栏 -->
|
||||
<header class="not-top-img" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav}"></nav>
|
||||
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
||||
</header>
|
||||
<main class="layout hide-aside" id="content-inner">
|
||||
<div id="page">
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
|
||||
<!-- 头部导航栏 -->
|
||||
<header class="not-top-img" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav}"></nav>
|
||||
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
||||
</header>
|
||||
<main class="layout hide-aside" id="content-inner">
|
||||
<div id="page">
|
||||
|
|
|
|||
|
|
@ -5,11 +5,10 @@
|
|||
<th:block th:fragment="content">
|
||||
<div class="post" id="body-wrap">
|
||||
|
||||
<header class="post-bg" id="page-header"
|
||||
th:style="'background-image:url(' + (${#strings.isEmpty(post.spec.cover) ? theme.config.layout.postRandomImg : post.spec.cover}) + ')'">
|
||||
<nav th:replace="~{modules/nav :: nav}"></nav>
|
||||
<header class="post-bg" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav(title = ${post.spec.title})}"></nav>
|
||||
<div class="coverdiv" id="coverdiv">
|
||||
<img crossorigin="anonymous" id="post-cover"
|
||||
<img alt="cover" class="nolazyload" id="post-cover"
|
||||
th:src="${#strings.isEmpty(post.spec.cover) ? theme.config.layout.postRandomImg : post.spec.cover}">
|
||||
</div>
|
||||
|
||||
|
|
@ -42,104 +41,98 @@
|
|||
<div id="post-meta">
|
||||
<div class="meta-secondline">
|
||||
<span class="post-meta-date">
|
||||
<i class="iconfont icon-calendar-alt post-meta-icon"></i>
|
||||
<i class="post-meta-icon fa-fw fas fa-calendar"></i>
|
||||
<time th:attr="datetime=${#dates.format(post.spec.publishTime, 'yyyy-MM-dd')}"
|
||||
th:text="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}"
|
||||
th:title="${#dates.format(post.spec.publishTime,'yyyy-MM-dd')}">
|
||||
</time>
|
||||
</span>
|
||||
|
||||
<span class="post-meta-wordcount"
|
||||
th:with="wordCount = ${#strings.length(post.content.content)}">
|
||||
<i class="iconfont icon-file-word post-meta-icon" title="字数"></i>
|
||||
<span class="post-meta-label">字数:</span>
|
||||
<span class="word-count" th:text="${{wordCount}}"></span>
|
||||
<span class="post-meta-separator"></span>
|
||||
<i class="iconfont icon-clock post-meta-icon" title="阅读耗时"></i>
|
||||
<span class="post-meta-label">阅读耗时:</span>
|
||||
<span>[[${wordCount / 400}]] 分钟</span>
|
||||
<span class="post-meta-position" title="作者IP归属地为中国">
|
||||
<i class="fas fa-location-dot post-meta-icon"></i>
|
||||
<span>中国</span>
|
||||
</span>
|
||||
|
||||
<!--<span class="post-meta-wechat" title="该文章已在公众号中更新"><i-->
|
||||
<!-- class="fab fa-weixin post-meta-icon"></i>公众号同步</span>-->
|
||||
<span class="post-meta-pv" data-flag-title="热度">
|
||||
<i class="iconfont icon-hotjar post-meta-icon"></i>
|
||||
<span class="post-meta-label">热度:</span>
|
||||
<span id="visit" th:text="${post.stats.visit}"></span>
|
||||
<span class="post-meta-wordcount" th:with="wordCount = ${#strings.length(post.content.content)}">
|
||||
<i class="fas fa-file-word fa-fw post-meta-icon" title="文章字数"></i></i>
|
||||
<span class="word-count" th:text="${{wordCount}}"></span>
|
||||
</span>
|
||||
<span class="post-meta-time" th:with="wordCount = ${#strings.length(post.content.content)}">
|
||||
<i class="fas fa-clock post-meta-icon" title="阅读耗时"></i>
|
||||
<span>[[${wordCount / 400}]] min</span>
|
||||
</span>
|
||||
|
||||
<span class="post-meta-pv" title="文章热度">
|
||||
<i class="fab fa-hotjar fa-fw post-meta-icon"></i>
|
||||
<span id="twikoo_visitors" th:text="${post.stats.visit}"></span>
|
||||
</span>
|
||||
<span class="post-meta-commentcount" onclick="heo.scrollTo('#post-comment');" title="评论数">
|
||||
<i class="iconfont icon-comment-alt"></i>
|
||||
<span class="post-meta-label">评论:</span>
|
||||
<a href="#post-comment"><span id="comment-count" th:text="${post.stats.comment}"></span></a>
|
||||
<i class="fa-solid fa-message"></i>
|
||||
<a data-pjax-state="" href="#post-comment">
|
||||
<span id="twikoo-count" th:text="${post.stats.comment}"></span>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<section class="main-hero-waves-area waves-area">
|
||||
<svg class="waves-svg" preserveAspectRatio="none"
|
||||
shape-rendering="auto" viewBox="0 24 150 28" xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg">
|
||||
<defs>
|
||||
<path d="M -160 44 c 30 0 58 -18 88 -18 s 58 18 88 18 s 58 -18 88 -18 s 58 18 88 18 v 44 h -352 Z"
|
||||
id="gentle-wave"></path>
|
||||
</defs>
|
||||
<g class="parallax">
|
||||
<use href="#gentle-wave" x="48" y="0"></use>
|
||||
<use href="#gentle-wave" x="48" y="3"></use>
|
||||
<use href="#gentle-wave" x="48" y="5"></use>
|
||||
<use href="#gentle-wave" x="48" y="7"></use>
|
||||
</g>
|
||||
</svg>
|
||||
</section>
|
||||
</header>
|
||||
<main class="layout" id="content-inner" th:classappend="${theme.config.sidebar.location}">
|
||||
<div id="post">
|
||||
<!-- 文章内容 -->
|
||||
<article class="post-content line-numbers" id="article-container"
|
||||
th:utext="${post.content.content}"></article>
|
||||
<article class="post-content line-numbers" id="article-container" th:utext="${post.content.content}"></article>
|
||||
|
||||
|
||||
<div class="post-tools" id="post-tools">
|
||||
<div class="post-tools-left">
|
||||
|
||||
<!-- 打赏 -->
|
||||
<!--<div class="post-reward" onclick="AddRewardMask()">-->
|
||||
<!-- <div class="reward-button button--animated" title="赞赏作者"><i class="fas fa-hamburger"></i>-->
|
||||
<!-- 打赏作者-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="reward-main">-->
|
||||
<!-- <ul class="reward-all"><span class="reward-title">感谢你赐予我前进的力量</span>-->
|
||||
<!-- <ul class="reward-group">-->
|
||||
<!-- <li class="reward-item"><a href="../img/wechat.png" target="_blank"><img-->
|
||||
<!-- alt="微信" class="post-qr-code-img" data-lazy-src="/img/wechat.png"></a>-->
|
||||
<!-- <div class="post-qr-code-desc">微信</div>-->
|
||||
<!-- </li>-->
|
||||
<!-- <li class="reward-item"><a href="../img/alipay.png" target="_blank"><img-->
|
||||
<!-- alt="支付宝" class="post-qr-code-img" data-lazy-src="/img/alipay.png"></a>-->
|
||||
<!-- <div class="post-qr-code-desc">支付宝</div>-->
|
||||
<!-- </li>-->
|
||||
<!-- </ul>-->
|
||||
<!-- <a class="reward-main-btn" href="../about/index.html" target="_blank">-->
|
||||
<!-- <div class="reward-text">赞赏者名单</div>-->
|
||||
<!-- <div class="reward-dec">因为你们的支持让我意识到写文章的价值🙏</div>-->
|
||||
<!-- </a></ul>-->
|
||||
<!-- </div>-->
|
||||
<!--</div>-->
|
||||
|
||||
<!-- 说明 -->
|
||||
<!--<div class="reward-link mode"><a class="reward-link-button" href="../wechat/index.html">-->
|
||||
<!-- <i class="fas fa-seedling"></i>运营模式与责任</a>-->
|
||||
<!--</div>-->
|
||||
|
||||
<!-- 分享 -->
|
||||
<div class="share-link mobile">
|
||||
<div class="share-qrcode">
|
||||
<div class="share-button" title="使用手机访问这篇文章"><i
|
||||
class="iconfont icon-qrcode"></i>
|
||||
<div class="share-button" title="使用手机访问这篇文章">
|
||||
<i class="fas fa-qrcode"></i>
|
||||
</div>
|
||||
<div class="share-main">
|
||||
<div class="share-main-all">
|
||||
<div id="qrcode"></div>
|
||||
<div id="qrcode" th:title="${post.status.permalink}">
|
||||
</div>
|
||||
<div class="reward-dec">使用手机访问这篇文章</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
new QRCode(document.getElementById("qrcode"), [[${post.status.permalink}]]);
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="share-link weibo">
|
||||
<a class="share-button"
|
||||
rel="noopener external nofollow noreferrer noopener"
|
||||
target="_blank"
|
||||
th:href="'https://service.weibo.com/share/share.php?title=' + ${post.spec.title}"
|
||||
th:href="'https://service.weibo.com/share/share.php?title=' + ${post.spec.title} + 'url=' + ${post.status.permalink} + 'pic=' + ${post.spec.cover}"
|
||||
title="分享到微博">
|
||||
<i class="iconfont icon-weibo" style="font-size:22px"></i></a></div>
|
||||
<i class="fab fa-weibo" style="font-size:22px"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="share-link copyurl">
|
||||
<div class="share-button" id="post-share-url" onclick="rm.copyPageUrl()" title="复制链接"><i
|
||||
class="iconfont icon-link"></i></div>
|
||||
<div class="share-button" id="post-share-url" onclick="acrylic.copyPageUrl()" title="复制链接">
|
||||
<i class="fas fa-link"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="post-tools-right">
|
||||
|
|
@ -169,45 +162,48 @@
|
|||
<span class="post-copyright-info" id="post-copyright-url">
|
||||
<a href="javascript:window.location.href;">[[${post.spec.title}]]</a>
|
||||
</span>
|
||||
<button class="post-copyright-copybtn" onclick="rm.copyPageUrl()">
|
||||
<i class="iconfont icon-paste"></i>
|
||||
<button class="post-copyright-copybtn" onclick="acrylic.copyPageUrl()">
|
||||
<i class="fas fa-paste copy-btn"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="post-copyright__notice">
|
||||
<span class="post-copyright-info" th:utext="${theme.config.post.copyrightInfo}"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav class="pagination-post" id="pagination"
|
||||
th:with="postCursor = ${postFinder.cursor(post.metadata.name)}">
|
||||
<a th:if="${postCursor.hasPrevious()}" th:href="@{${postCursor.previous.status.permalink}}">
|
||||
<div class="prev-post pull-left">
|
||||
|
||||
<div class="prev-post pull-left">
|
||||
<a th:href="@{${postCursor.previous.status.permalink}}" th:if="${postCursor.hasPrevious()}">
|
||||
<div class="pagination-info">
|
||||
<div class="label">上一篇</div>
|
||||
<div class="prev_info" th:text="${postCursor.previous.spec.title}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<a th:if="${postCursor.hasNext()}" th:href="@{${postCursor.next.status.permalink}}">
|
||||
<div class="next-post pull-right">
|
||||
</a>
|
||||
</div>
|
||||
<div class="next-post pull-right">
|
||||
<a th:href="@{${postCursor.next.status.permalink}}" th:if="${postCursor.hasNext()}">
|
||||
<div class="pagination-info">
|
||||
<div class="label">下一篇</div>
|
||||
<div class="next_info" th:text="${postCursor.next.spec.title}"></div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
<div class="relatedPosts" th:if="${not #lists.isEmpty(post.categories)}">
|
||||
|
||||
<div class="headline">
|
||||
<i class="iconfont icon-robot"></i>
|
||||
<i class="fa-solid fa-robot"></i>
|
||||
<span>阅读建议</span>
|
||||
</div>
|
||||
<div class="relatedPosts-list"
|
||||
th:with="recommandPosts = ${postFinder.listByCategory(1, theme.config.post.recommendQuantity, post.categories.get(0).metadata.name)}">
|
||||
|
||||
<!-- 建议阅读，这里可以自定义文章数量，然后遍历展示 -->
|
||||
<div th:each="recommandPost :${recommandPosts}">
|
||||
<a th:href="@{${recommandPost.status.permalink}}" th:title="${recommandPost.spec.title}">
|
||||
<img alt="cover" class="cover" loading="lazy"
|
||||
<img alt="cover" class="cover entered loading" loading="lazy"
|
||||
th:src="${#strings.isEmpty(recommandPost.spec.cover) ? theme.config.layout.postRandomImg : recommandPost.spec.cover}">
|
||||
<div class="content is-center">
|
||||
<div class="date"><i class="far fa-calendar-alt fa-fw"></i>
|
||||
|
|
@ -223,13 +219,17 @@
|
|||
<!-- 评论模块 -->
|
||||
<div id="post-comment" th:if="${pluginFinder.available('PluginCommentWidget')}">
|
||||
<div class="comment-head">
|
||||
<div class="comment-headline"><i class="iconfont icon-comment-alt"></i> <span>评论</span></div>
|
||||
<div class="comment-headline">
|
||||
<i class="fa-sharp fa-regular fa-comment"></i>
|
||||
<span>评论</span>
|
||||
</div>
|
||||
<div class="comment-privacy"><a href="#">隐私政策</a></div>
|
||||
<div class="comment-tips" id="comment-tips">
|
||||
<span>你无需删除空行，直接评论以获取最佳展示效果</span>
|
||||
</div>
|
||||
</div>
|
||||
<halo:comment group="content.halo.run" kind="Post" th:attr="name=${post.metadata.name}" colorScheme="document.documentElement.getAttribute('data-theme')" />
|
||||
<halo:comment colorScheme="document.documentElement.getAttribute('data-theme')" group="content.halo.run" kind="Post"
|
||||
th:attr="name=${post.metadata.name}"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
<div class="page" id="body-wrap">
|
||||
<header class="not-top-img" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav}"></nav>
|
||||
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
||||
</header>
|
||||
<main class="layout" id="content-inner">
|
||||
<div id="tag">
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
<div class="page" id="body-wrap">
|
||||
<header class="not-top-img" id="page-header">
|
||||
<nav th:replace="~{modules/nav :: nav}"></nav>
|
||||
<nav th:replace="~{modules/nav :: nav(title = null)}"></nav>
|
||||
</header>
|
||||
<main class="layout hide-aside" id="content-inner">
|
||||
<div id="page"><h1 class="page-title" style="display: inline;">标签</h1>
|
||||
|
|
|
|||
|
|
@ -7,11 +7,17 @@ spec:
|
|||
author:
|
||||
name: 程序员小航
|
||||
website: 'https://liuzhihang.com'
|
||||
customTemplates:
|
||||
page:
|
||||
- name: 关于
|
||||
description: 关于页面
|
||||
screenshot:
|
||||
file: about.html
|
||||
description: Halo 2.0 Theme base on Thymeleaf, Referring to Butterfly and Heo
|
||||
logo: 'https://liuzhihang.com/themes/theme-hao/assets/images/hao-logo.jpg'
|
||||
website: 'https://liuzhihang.com'
|
||||
repo: 'https://github.com/liuzhihang/halo-theme-hao'
|
||||
settingName: "theme-hao-setting"
|
||||
configMapName: "theme-hao-configMap"
|
||||
version: 1.1.1
|
||||
version: 1.1.2
|
||||
require: 2.0.0
|
||||
|
|
|
|||
Loading…
Reference in New Issue