feat(web): collapse reader toc/bookmark buttons into single 导航 toolbar button

This commit is contained in:
2026-09-08 21:11:16 +08:00
parent 65e07a0890
commit 9c2b7e2074
5 changed files with 13 additions and 29 deletions
+3 -11
View File
@@ -360,22 +360,14 @@ export default function CbzReader({ book, initialLocator, initialPercent, chrome
)}
<button
className="rd-btn"
aria-expanded={nav === "bm"}
aria-expanded={!!nav}
aria-controls="reader-nav"
onClick={() => setNav(nav === "bm" ? null : "bm")}
onClick={() => setNav(nav ? null : chapters ? "toc" : "bm")}
>
书签
导航
</button>
{chapters && (
<>
<button
className="rd-btn"
aria-expanded={nav === "toc"}
aria-controls="reader-nav"
onClick={() => setNav(nav === "toc" ? null : "toc")}
>
目录
</button>
<span className="text-xs tabular-nums opacity-60">
{ci + 1}/{chapters.length}
</span>
+1 -1
View File
@@ -107,7 +107,7 @@ export default function EpubReader({ book, initialLocator, initialPercent }: Rea
下一页
</button>
<button className="rd-btn" aria-expanded={nav} aria-controls="reader-nav" onClick={() => setNav((v) => !v)}>
书签
导航
</button>
</div>
{nav && (
+1 -1
View File
@@ -155,7 +155,7 @@ export default function PdfReader({ book, initialLocator, initialPercent }: Read
末页
</button>
<button className="rd-btn" aria-expanded={nav} aria-controls="reader-nav" onClick={() => setNav((v) => !v)}>
书签
导航
</button>
</div>
{nav && (
+4 -12
View File
@@ -192,7 +192,7 @@ function MdView({ book, initialLocator, initialPercent, chrome }: ReaderProps) {
aria-controls="reader-nav"
onClick={() => setNav((v) => !v)}
>
书签
导航
</button>
</ReaderSheet>
)}
@@ -311,22 +311,14 @@ function TxtView({ book, initialLocator, initialPercent, chrome }: ReaderProps)
<ReaderSheet pr={pr} frac={total} onSeek={seek}>
<button
className="rd-btn"
aria-expanded={nav === "bm"}
aria-expanded={!!nav}
aria-controls="reader-nav"
onClick={() => setNav(nav === "bm" ? null : "bm")}
onClick={() => setNav(nav ? null : chapters.length > 1 ? "toc" : "bm")}
>
书签
导航
</button>
{chapters.length > 1 && (
<>
<button
className="rd-btn"
aria-expanded={nav === "toc"}
aria-controls="reader-nav"
onClick={() => setNav(nav === "toc" ? null : "toc")}
>
目录
</button>
<span className="text-xs opacity-60 tabular-nums">
{ci + 1}/{chapters.length}
</span>