From 91189dfd2f4cb32e205117b327e0ae7a0c2dd716 Mon Sep 17 00:00:00 2001
From: Emile Bangma <github@emilebangma.com>
Date: Mon, 03 Feb 2025 14:25:42 +0000
Subject: [PATCH] feat(explorer): collapsible mobile explorer (#1471)
---
quartz/components/TableOfContents.tsx | 10 ++++++++--
1 files changed, 8 insertions(+), 2 deletions(-)
diff --git a/quartz/components/TableOfContents.tsx b/quartz/components/TableOfContents.tsx
index 77ff0eb..ec457cf 100644
--- a/quartz/components/TableOfContents.tsx
+++ b/quartz/components/TableOfContents.tsx
@@ -26,7 +26,13 @@
return (
<div class={classNames(displayClass, "toc")}>
- <button type="button" id="toc" class={fileData.collapseToc ? "collapsed" : ""}>
+ <button
+ type="button"
+ id="toc"
+ class={fileData.collapseToc ? "collapsed" : ""}
+ aria-controls="toc-content"
+ aria-expanded={!fileData.collapseToc}
+ >
<h3>{i18n(cfg.locale).components.tableOfContents.title}</h3>
<svg
xmlns="http://www.w3.org/2000/svg"
@@ -43,7 +49,7 @@
<polyline points="6 9 12 15 18 9"></polyline>
</svg>
</button>
- <div id="toc-content">
+ <div id="toc-content" class={fileData.collapseToc ? "collapsed" : ""}>
<ul class="overflow">
{fileData.toc.map((tocEntry) => (
<li key={tocEntry.slug} class={`depth-${tocEntry.depth}`}>
--
Gitblit v1.10.0