hexo-theme-stellar/source/css/_layout/widgets/toc_common.styl

96 lines
2.1 KiB
Stylus

.widget-wrapper.toc .widget-header
margin-top: 1rem
.widget-wrapper.toc.single .widget-header
font-weight: 500
font-size: $fs-12
>span
margin: 0.5rem 0
.widget-wrapper.toc .widget-body
margin-top: 0
ul ul, ul ol
padding-left: 0
ol ul, ol ol
padding-left: 0
.doc-tree
margin: 4px 0
.toc
padding: 0
margin: 0
padding-left: 0.25rem
.toc-item .toc-link
padding: 0.5rem
font-weight: 500
font-size: $fs-13
color: var(--text-p1)
.toc-child .toc-item .toc-link
padding: 0.25rem 0.5rem 0.25rem 1.3rem
font-weight: 400
color: var(--text-p2)
.toc-child .toc-child .toc-item .toc-link
padding-left: 2.1rem
font-size: $fs-12
color: var(--text-p3)
.toc-child .toc-child .toc-child .toc-item .toc-link
padding-left: 2.9rem
.widget-wrapper.toc .toc-item
color: var(--text-p2)
font-size: $fs-12
padding: 0
list-style: none
&.active
color: $color-theme
border-left-color: @color
.toc-child .toc-item
padding: 0
.widget-wrapper.toc a.toc-link
color: inherit
display: block
line-height: 1.2
border-radius: 4px
position: relative
&:before
content: ''
position: absolute
left: -6px
top: 'calc(50% - %s)' % 6px
bottom: 'calc(50% - %s)' % 6px
width: 2px
border-radius: 2px
background: $color-theme
visibility: hidden
&:hover
background: var(--block-hover)
&.active
color: $color-theme !important
&:before
visibility: visible
//
.widget-wrapper.toc[collapse='true']
.toc-item a.toc-link+ol
display: none
//
.toc a.toc-link.active+ol
display: block
//
.widget-wrapper.toc[collapse='auto']
.toc-item a.toc-link+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
.widget-wrapper.toc[collapse='auto'] ol:has(> .toc-item a.active)
display: block