Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
54 changes: 33 additions & 21 deletions app/docs/page.tsx
Original file line number Diff line number Diff line change
@@ -1,27 +1,39 @@
"use client";
import { Footer, Navbar } from "../../layout";
import type { Metadata } from "next";
import { Navbar } from "../../layout";

export const metadata: Metadata = {
title: "VoxKit API Documentation",
description:
"Generated API reference for the VoxKit Python package: storage, analyzers, engines, and configuration.",
};

/**
* The pdoc bundle in `public/docs` is already a complete documentation site,
* with a sidebar pane and a content pane that scroll independently. This route
* hands it the whole viewport below the navbar instead of insetting it in a
* card, so those two are the only scrollbars on the page.
*
* `Footer` is deliberately absent. As a sibling of a viewport-height region it
* put a third, outer scrollbar on the window, and scrolling it slid the entire
* docs pane out of view.
*/
export default function DocsPage() {
return (
<>
<div className="h-screen flex flex-col bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 text-white overflow-hidden">
<Navbar view="Docs" />

{/* Documentation iframe container */}
<div className="flex-1 px-4 sm:px-6 lg:px-8 pt-24 pb-8 overflow-hidden">
<div className="max-w-7xl w-full h-full mx-auto">
{/* Iframe wrapper with styling */}
<div className="h-full rounded-lg overflow-hidden shadow-2xl border border-slate-700 bg-white">
<iframe
src="/docs/index.html"
className="w-full h-full border-none"
title="VoxKit API Documentation"
/>
</div>
</div>
</div>
<div data-full-viewport className="h-dvh overflow-hidden bg-slate-900">
<Navbar view="Docs" />
{/* Navbar is `fixed` but sets no `top`, so it renders wherever its static
position falls. It has to stay the first child of an unpadded parent;
the clearance for it belongs on this sibling instead. */}
<div className="h-full pt-16">
{/* Straight to voxkit.html. /docs/index.html is only a meta-refresh
stub, and in a frame that hop becomes a session history entry, so
pressing Back once just bounces the visitor into the docs again. */}
<iframe
src="/docs/voxkit.html"
title="VoxKit API documentation"
className="block h-full w-full border-none"
/>
</div>
<Footer />
</>
</div>
);
}
11 changes: 11 additions & 0 deletions app/globals.css
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,17 @@ body {
overflow-y: scroll;
}

/*
* Opt-out for pages that fill the viewport exactly and delegate scrolling to a
* child (see app/docs/page.tsx). There is nothing for the window to scroll, so
* the forced scrollbar above would render as a second, dead track beside the
* child's real one. No layout shift to guard against here either: the page
* cannot grow past the viewport.
*/
body:has([data-full-viewport]) {
overflow-y: hidden;
}

/* Hero fall-in animation for headings */
@keyframes fallIn {
0% {
Expand Down
Loading