xaoxuu
/
hexo-theme-stellar
mirror of https://github.com/xaoxuu/hexo-theme-stellar
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[opt] toc collapse config

This commit is contained in:
xaoxuu 2024-01-02 19:50:42 +08:00
parent f348f94b79
commit dc0e43688f
3 changed files with 26 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
_data/widgets.yml
View File

@ -34,6 +34,7 @@ recent:
layout: recent layout: recent
rss: # /atom.xml # npm i hexo-generator-feed rss: # /atom.xml # npm i hexo-generator-feed
limit: 5 # Count of posts limit: 5 # Count of posts
# TOC (valid only in layout:post/wiki) # TOC (valid only in layout:post/wiki)
toc: toc:
layout: toc layout: toc
@ -41,6 +42,8 @@ toc:
min_depth: 2 min_depth: 2
max_depth: 5 max_depth: 5
fallback: recent # Use a backup widget when toc does not exist. fallback: recent # Use a backup widget when toc does not exist.
collapse: false # true / false / auto
# github user info # github user info
ghuser: ghuser:
layout: ghuser layout: ghuser

2
layout/_partial/widgets/toc.ejs
View File

@ -66,7 +66,7 @@ function layoutDiv(fallback) {
var el = ''; var el = '';
if (type.length > 0) { if (type.length > 0) {
el += '<widget class="widget-wrapper toc ' + type + '" id="data-toc">'; el += `<widget class="widget-wrapper toc ${type}" id="data-toc" collapse="${item.collapse}">`;
if (page.layout !== 'wiki') { if (page.layout !== 'wiki') {
// post 布局 // post 布局
el += layoutTocHeader(page.toc_title); el += layoutTocHeader(page.toc_title);

28
source/css/_layout/widgets/toc_common.styl
View File

@ -70,13 +70,27 @@
&:before &:before
visibility: visible visibility: visible
// 始终折叠
.widget-wrapper.toc[collapse='true']
.toc-item a.toc-link+ol
display: none
// 激活上级目录时显示子目录
.toc a.toc-link.active+ol
display: block
// 激活上级目录时显示子目录 // 自动折叠
.toc-item a.toc-link+ol .widget-wrapper.toc[collapse='auto']
display: none .toc-item a.toc-link+ol
.toc a.toc-link.active+ol display: none
// 激活上级目录时显示子目录
.toc a.toc-link.active+ol
display: block
// 鼠标放上去时显示子目录
&:hover a.toc-link+ol
display: block
// 子目录激活时显示
.widget-wrapper.toc[collapse='true'] ol:has(> .toc-item a.active)
display: block display: block
ol:has(> .toc-item a.active) .widget-wrapper.toc[collapse='auto'] ol:has(> .toc-item a.active)
display: block
.doc-tree:hover a.toc-link+ol
display: block display: block