feat:
1. 开关控制导航栏右侧按钮和日志模块 2. 改变被选中内容颜色 3. 目录的初步构建 4. 代码高亮使用代码高亮highlight
This commit is contained in:
shy
parent
ec2526e065
commit
16ef799914
|
|
@ -12,6 +12,15 @@ spec:
|
||||||
label: 导航栏左侧相关链接
|
label: 导航栏左侧相关链接
|
||||||
placeholder: 请填写 metadata name
|
placeholder: 请填写 metadata name
|
||||||
help: "需要通过开发者模式获取菜单对应的 metadata name"
|
help: "需要通过开发者模式获取菜单对应的 metadata name"
|
||||||
|
- $formkit: radio
|
||||||
|
name: right_menu
|
||||||
|
label: 右侧四个按钮
|
||||||
|
value: true
|
||||||
|
options:
|
||||||
|
- label: 显示
|
||||||
|
value: true
|
||||||
|
- label: 隐藏
|
||||||
|
value: false
|
||||||
- $formkit: text
|
- $formkit: text
|
||||||
name: site_title
|
name: site_title
|
||||||
label: 标题
|
label: 标题
|
||||||
|
|
|
||||||
|
|
@ -732,9 +732,9 @@ table td, table th {
|
||||||
vertical-align: middle
|
vertical-align: middle
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 选中内容的颜色 */
|
||||||
::selection {
|
::selection {
|
||||||
background: #0079ff;
|
color: #b5b8ef
|
||||||
color: #f7f7f7
|
|
||||||
}
|
}
|
||||||
|
|
||||||
button {
|
button {
|
||||||
|
|
@ -10392,7 +10392,6 @@ b, strong {
|
||||||
}
|
}
|
||||||
|
|
||||||
#article-container.post-content h1, #article-container.post-content h2, #article-container.post-content h3, #article-container.post-content h4 {
|
#article-container.post-content h1, #article-container.post-content h2, #article-container.post-content h3, #article-container.post-content h4 {
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
flex-direction: row-reverse
|
flex-direction: row-reverse
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<html lang="en" xmlns:th="http://www.thymeleaf.org">
|
<html lang="en" xmlns:th="http://www.thymeleaf.org">
|
||||||
|
|
||||||
<!-- 导航栏菜单栏 -->
|
<!-- 导航栏菜单栏 -->
|
||||||
<div id="nav-right" th:fragment="nav-right">
|
<div id="nav-right" th:fragment="nav-right" th:if="${theme.config.nav.right_menu}" >
|
||||||
|
|
||||||
<!-- 功能都需要添加开关 -->
|
<!-- 功能都需要添加开关 -->
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,43 @@
|
||||||
<meta content="telephone=no" name="format-detection">
|
<meta content="telephone=no" name="format-detection">
|
||||||
<meta content="var(--heo-main)" name="theme-color">
|
<meta content="var(--heo-main)" name="theme-color">
|
||||||
<script th:src="@{/assets/js/heo.js}"></script>
|
<script th:src="@{/assets/js/heo.js}"></script>
|
||||||
|
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/styles/default.min.css">
|
||||||
|
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"></script>
|
||||||
|
<script script src="https://code.jquery.com/jquery-3.6.1.min.js" integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script>
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/tocbot/4.5.0/tocbot.min.js"></script>
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tocbot/4.5.0/tocbot.css">
|
||||||
|
<script>
|
||||||
|
//目录使用tocbot来生成
|
||||||
|
window.addEventListener('load', () => {
|
||||||
|
var headerEl = 'h1,h2,h3,h4,h5,h6', // headers
|
||||||
|
content = '.post-content', // 文章容器
|
||||||
|
idArr = {};
|
||||||
|
$(content).children(headerEl).each(function () { // 去除空格以及多余标点
|
||||||
|
var headerId = $(this).text().replace(/[\s|\~|`|\!|\@|\#|\$|\%|\^|\&|\*|\(|\)|\_|\+|\=|\||\|\[|\]|\{|\}|\;|\:|\"|\'|\,|\<|\.|\>|\/|\?|\：|\，|\。]/g, '');
|
||||||
|
|
||||||
|
headerId = headerId.toLowerCase();
|
||||||
|
if (idArr[headerId]) { // id已经存在
|
||||||
|
$(this).attr('id', headerId + '-' + idArr[headerId]);
|
||||||
|
idArr[headerId]++;
|
||||||
|
} else { // id未存在
|
||||||
|
idArr[headerId] = 1;
|
||||||
|
$(this).attr('id', headerId);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
tocbot.init({
|
||||||
|
// 添加到哪里
|
||||||
|
tocSelector: '.toc-item toc-level',
|
||||||
|
// 针对那个id标签
|
||||||
|
contentSelector: content,
|
||||||
|
// 滚动跟随
|
||||||
|
positionFixedClass: 'is-position-fixed',
|
||||||
|
positionFixedSelector: '.toc',
|
||||||
|
// 需要解析的标题
|
||||||
|
headingSelector: headerEl
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
||||||
|
</script>
|
||||||
<link rel="stylesheet" th:href="@{/assets/zhheo/zhheoblog.css}">
|
<link rel="stylesheet" th:href="@{/assets/zhheo/zhheoblog.css}">
|
||||||
<!-- fontawesome-pro https://github.com/duyplus/fontawesome-pro -->
|
<!-- fontawesome-pro https://github.com/duyplus/fontawesome-pro -->
|
||||||
<link href="https://cdn.jsdelivr.net/gh/duyplus/fontawesome-pro/css/all.min.css"
|
<link href="https://cdn.jsdelivr.net/gh/duyplus/fontawesome-pro/css/all.min.css"
|
||||||
|
|
@ -838,5 +874,7 @@
|
||||||
heo.initThemeColor()
|
heo.initThemeColor()
|
||||||
</script>
|
</script>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- 代码高亮highlight.js -->
|
||||||
|
<script>hljs.highlightAll();</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
Loading…
Reference in New Issue