The page
What the browser gets: the page's frame, its stylesheet and its scripts. They're written as ordinary HTML, CSS and JS, so the editor, the formatter and the linter treat them as code.
The build imports each one with ?built, which strips its comments and formats it (vite.config.ts). So the prose stays in the repository, and the browser gets clean, readable code. Nothing is minified (assets.ts).
Code
- live.js
Only
prose .sends this script, so a built page never asks for it. The server tells a page when something it shows has changed (server.ts), and the page reloads, keeping its scroll position. - mode.js
Inline in
<head>, so a page set to Prose only never flashes its code first.page.jssaves the mode when the reader switches it. - page.html
The frame every page shares. render.ts fills each
{{slot}}with the page's own parts, and says what goes in each. - page.js
One script for every page, sent as a shared file. It runs the mode switch and each code run's fold, brings back the scroll position after a live reload, and marks the section being read.
- rail.js
Inline, straight after the rail and before the page paints. So the rail's open folders and its scroll come back on the first frame, instead of jumping after it. If the current file is out of view, it's scrolled to the middle. The rail saves its state as the page is left.
- style.css
One stylesheet for every page. A readable column is on the left and the file tree on the right, in light or dark from the reader's setting. Prose is the page and code is the aside, in a quieter panel, so a file reads as its prose first.