diff --git a/AGENTS.md b/AGENTS.md index c1163df..8188f18 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -20,5 +20,6 @@ - `Delvehold/` contains the published Markdown source. - `site/` contains only Delvehold-specific Quartz configuration and presentation. +- The masthead owns global section routes. Desktop and mobile within-section navigation are projections of the same Quartz content tree and active-section filters; do not maintain separate route lists. - Shared Quartz machinery remains owned by `GameCult/GameCult-Quartz`; do not vendor it here. - Generated output under `quartz-site/public/` is disposable and must not become source truth. diff --git a/site/quartz.layout.ts b/site/quartz.layout.ts index 7736195..0b6b3f4 100644 --- a/site/quartz.layout.ts +++ b/site/quartz.layout.ts @@ -3,43 +3,37 @@ import * as Component from "./quartz/components" import DelveholdMasthead from "./quartz/components/DelveholdMasthead" const documentationExplorer = Component.ConditionalRender({ - component: Component.DesktopOnly( - Component.Explorer({ - title: "Documentation", - folderDefaultState: "collapsed", - folderClickBehavior: "link", - useSavedState: false, - filterFn: (node) => node.slug.startsWith("Documentation"), - }), - ), + component: Component.Explorer({ + title: "Documentation", + folderDefaultState: "collapsed", + folderClickBehavior: "link", + useSavedState: false, + filterFn: (node) => node.slug.startsWith("Documentation"), + }), condition: (page) => page.fileData.slug === "Documentation" || page.fileData.slug?.startsWith("Documentation/"), }) const gameDesignExplorer = Component.ConditionalRender({ - component: Component.DesktopOnly( - Component.Explorer({ - title: "Game Design", - folderDefaultState: "collapsed", - folderClickBehavior: "link", - useSavedState: false, - filterFn: (node) => node.slug.startsWith("Game-Design"), - }), - ), + component: Component.Explorer({ + title: "Game Design", + folderDefaultState: "collapsed", + folderClickBehavior: "link", + useSavedState: false, + filterFn: (node) => node.slug.startsWith("Game-Design"), + }), condition: (page) => page.fileData.slug === "Game-Design" || page.fileData.slug?.startsWith("Game-Design/"), }) const loreExplorer = Component.ConditionalRender({ - component: Component.DesktopOnly( - Component.Explorer({ - title: "Lore", - folderDefaultState: "collapsed", - folderClickBehavior: "link", - useSavedState: false, - filterFn: (node) => node.slug.startsWith("Lore"), - }), - ), + component: Component.Explorer({ + title: "Lore", + folderDefaultState: "collapsed", + folderClickBehavior: "link", + useSavedState: false, + filterFn: (node) => node.slug.startsWith("Lore"), + }), condition: (page) => page.fileData.slug === "Lore" || page.fileData.slug?.startsWith("Lore/"), }) diff --git a/site/quartz/styles/custom.scss b/site/quartz/styles/custom.scss index 35ed9ab..5677539 100644 --- a/site/quartz/styles/custom.scss +++ b/site/quartz/styles/custom.scss @@ -39,32 +39,32 @@ body { height: calc(100vh - 8.2rem); padding-top: 2rem; } +} - .page > #quartz-body .explorer-content, - .page > #quartz-body .explorer-content > .explorer-ul { - scrollbar-color: var(--secondary) transparent; - scrollbar-width: thin; +.page > #quartz-body .explorer-content, +.page > #quartz-body .explorer-content > .explorer-ul { + scrollbar-color: var(--secondary) transparent; + scrollbar-width: thin; - &::-webkit-scrollbar { - width: 5px; - } + &::-webkit-scrollbar { + width: 5px; + } - &::-webkit-scrollbar-track, - &::-webkit-scrollbar-corner { - background: transparent; - } + &::-webkit-scrollbar-track, + &::-webkit-scrollbar-corner { + background: transparent; + } - &::-webkit-scrollbar-thumb { - min-height: 2rem; - border-radius: 999px; - background: var(--secondary); - } + &::-webkit-scrollbar-thumb { + min-height: 2rem; + border-radius: 999px; + background: var(--secondary); + } - &::-webkit-scrollbar-button { - display: none; - width: 0; - height: 0; - } + &::-webkit-scrollbar-button { + display: none; + width: 0; + height: 0; } } @@ -131,6 +131,10 @@ article > h3 { } @media (max-width: 800px) { + .page > #quartz-body .sidebar.left:has(.explorer) { + z-index: 30; + } + .delvehold-masthead { flex-direction: column; align-items: center;