夜间模式
This commit is contained in:
@@ -57,52 +57,54 @@ const tocSections = toc.reduce<TocSection[]>((sections, item) => {
|
||||
</section>
|
||||
)}
|
||||
|
||||
{toc.length > 0 && (
|
||||
<section class="sidebar-card toc-card">
|
||||
<h2>
|
||||
<span aria-hidden="true">☰</span>
|
||||
文章目录
|
||||
<em>{toc.length}</em>
|
||||
</h2>
|
||||
<nav class="toc-list toc-tree" aria-label="文章目录" data-toc-tree>
|
||||
{tocSections.map((section, index) => (
|
||||
<div class:list={['toc-group', index === 0 && 'is-open']} data-toc-group data-heading-id={section.heading.id}>
|
||||
<a class="toc-link toc-link-main" href={`#${section.heading.id}`} data-toc-link data-toc-top>
|
||||
<span class="toc-marker" aria-hidden="true"></span>
|
||||
<span>{section.heading.text}</span>
|
||||
</a>
|
||||
{section.children.length > 0 && (
|
||||
<div class="toc-children" data-toc-children>
|
||||
{section.children.map((item) => (
|
||||
<a class={`toc-link toc-link-child toc-depth-${item.depth}`} href={`#${item.id}`} data-toc-link>
|
||||
<span>{item.text}</span>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</nav>
|
||||
</section>
|
||||
)}
|
||||
|
||||
<section class="sidebar-card same-category-card">
|
||||
<h2>
|
||||
<span aria-hidden="true">▣</span>
|
||||
同类文章
|
||||
<em>{relatedPosts.length}</em>
|
||||
</h2>
|
||||
{relatedPosts.length > 0 ? (
|
||||
<div class="same-category-list">
|
||||
{relatedPosts.map((item) => (
|
||||
<a href={item.href}>
|
||||
<strong>{item.title}</strong>
|
||||
<time datetime={item.date.toISOString()}>{item.dateText}</time>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
) : (
|
||||
<p class="sidebar-empty">这个分类下暂时没有其他文章。</p>
|
||||
<div class="article-sticky-sidebar">
|
||||
{toc.length > 0 && (
|
||||
<section class="sidebar-card toc-card">
|
||||
<h2>
|
||||
<span aria-hidden="true">☰</span>
|
||||
文章目录
|
||||
<em>{toc.length}</em>
|
||||
</h2>
|
||||
<nav class="toc-list toc-tree" aria-label="文章目录" data-toc-tree>
|
||||
{tocSections.map((section, index) => (
|
||||
<div class:list={['toc-group', index === 0 && 'is-open']} data-toc-group data-heading-id={section.heading.id}>
|
||||
<a class="toc-link toc-link-main" href={`#${section.heading.id}`} data-toc-link data-toc-top>
|
||||
<span class="toc-marker" aria-hidden="true"></span>
|
||||
<span>{section.heading.text}</span>
|
||||
</a>
|
||||
{section.children.length > 0 && (
|
||||
<div class="toc-children" data-toc-children>
|
||||
{section.children.map((item) => (
|
||||
<a class={`toc-link toc-link-child toc-depth-${item.depth}`} href={`#${item.id}`} data-toc-link>
|
||||
<span>{item.text}</span>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</nav>
|
||||
</section>
|
||||
)}
|
||||
</section>
|
||||
|
||||
<section class="sidebar-card same-category-card">
|
||||
<h2>
|
||||
<span aria-hidden="true">▣</span>
|
||||
同类文章
|
||||
<em>{relatedPosts.length}</em>
|
||||
</h2>
|
||||
{relatedPosts.length > 0 ? (
|
||||
<div class="same-category-list">
|
||||
{relatedPosts.map((item) => (
|
||||
<a href={item.href}>
|
||||
<strong>{item.title}</strong>
|
||||
<time datetime={item.date.toISOString()}>{item.dateText}</time>
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
) : (
|
||||
<p class="sidebar-empty">这个分类下暂时没有其他文章。</p>
|
||||
)}
|
||||
</section>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
Reference in New Issue
Block a user