mirror of
https://github.com/snapotter-hq/SnapOtter.git
synced 2026-08-03 07:46:42 +02:00
fix(docs): keep the nav within the viewport on tablets and laptops (#570)
The custom nav cluster (theme toggle + Fund + GitHub Star) rendered inline at every width, overriding VitePress's responsive collapse: a horizontal scrollbar at 768-959px and off-screen clipping of the buttons on 1280-1366px laptops. Show the custom cluster only at >=1440px where it fits, defer to VitePress's native nav below that, anchor the flyout menu to the start edge in RTL, and drop the redundant "Home" nav link so the nav fits at 768px. Closes #556
This commit is contained in:
@@ -25,7 +25,6 @@ function prefixLinks(items: any[], locale: string): any[] {
|
||||
// with no mapping (e.g. the version item) pass through unchanged. The nav is a
|
||||
// flat list, so no recursion is needed here.
|
||||
const NAV_KEY: Record<string, string> = {
|
||||
Home: "nav.home",
|
||||
Guide: "nav.guide",
|
||||
Tools: "nav.tools",
|
||||
"API Reference": "nav.apiReference",
|
||||
@@ -286,7 +285,9 @@ function buildBaseTheme() {
|
||||
logo: "/logo.png",
|
||||
|
||||
nav: [
|
||||
{ text: "Home", link: "/" },
|
||||
// No "Home" item: the logo already links home, and dropping it keeps the
|
||||
// nav within the viewport at 768px (see github-stars.css for the wider
|
||||
// responsive-nav fix).
|
||||
{ text: "Guide", link: "/guide/getting-started" },
|
||||
{ text: "Tools", link: "/tools/image/resize" },
|
||||
{ text: "API Reference", link: "/api/rest" },
|
||||
|
||||
Reference in New Issue
Block a user