System-default font stack ('-apple-system, BlinkMacSystemFont, Segoe UI,
…') is the textbook generic admin-tool look. The tools have a real point
of view (engineering documents, traceability, immutability); the
typography should reflect that.
Picks:
--font → IBM Plex Sans (400 + 600). UI body text. Distinctive
engineering sans with tabular nums and proper figures.
--font-display → Source Serif 4 (600). Headings, page titles,
.app-header__title. Reads as "document" not "UI label."
--font-mono → unchanged. Platform mono fonts are already excellent
and engineering tools rarely benefit from a custom mono.
Wiring:
- Raw .woff2 files live in shared/fonts/ (~60 KB total, latin subset,
SIL OFL 1.1 — both families)
- shared/fonts.css is base64-inlined data URIs for those three fonts
(~80 KB after b64 overhead). Generated once from the snippet in
shared/fonts/README.md.
- Every tool's build.sh prepends shared/fonts.css before shared/base.css
so @font-face is parsed before any rule references the family names.
- Headings (h1-h6) and .app-header__title now use var(--font-display);
.app-header__title bumped 17→18px and letter-spacing reset since the
serif doesn't need the original sans-text tightening.
- table/code/.tabular-nums get font-variant-numeric: tabular-nums so
tracking-number columns align vertically.
"Ship the record player with the record": zero CDN dependency at render
time. Tools render identically offline and online. Per-tool dist sizes
grew by ~80 KB.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
|
||
|---|---|---|
| .. | ||
| css | ||
| js | ||
| build.sh | ||
| README.md | ||
| template.html | ||
browse — directory listing tool
Generic file browser for any directory. Designed to work with ZDDC archives but useful for any folder. Single-file HTML, no install.
How it's used
Two modes, auto-detected at page load:
-
Online (zddc-server backed). When this HTML is served by zddc-server at a folder URL — which it is by default for any directory under
ZDDC_ROOTthat doesn't have anindex.html— the JS queries the same URL withAccept: application/jsonto load the directory's listing and renders it as a sortable, filterable table. -
Local (FileSystemAccessAPI). Click "Select Directory" in the header to pick any folder on your computer. Works in Chromium-based browsers (Chrome, Edge, Brave, etc.). No server required; the directory is read directly from disk.
What it does
- Lists files and folders with name, size, type (extension), and modified date.
- Click a folder to expand inline. Children load lazily on first expand.
- Click a column header to sort by that column. Click again to reverse.
- Type in the filter to narrow to entries whose name contains the substring.
- Click any file to open it in a new tab — for server-backed pages,
this routes through zddc-server's normal handler (so an
.archiveredirect, an apps cascade override, etc. all work as expected).
Design notes
- No ZDDC-specific filtering. This tool is intentionally
domain-agnostic. The companion
archivetool layers ZDDC parsing (project / status / revision filters, tracking-number resolution) on top of the same listing API. Usearchivewhen you want ZDDC semantics; usebrowsewhen you just want to see what's in a folder. - Default at directory URLs. zddc-server's
directory.goserves the embedded browse.html bytes for any directory request withAccept: text/htmland noindex.htmlpresent. This means a user navigating to any folder underZDDC_ROOTgets a usable browser without anyone having to drop a file into the archive. - Apps cascade override. Like every other ZDDC tool, the
served
browse.htmlcan be overridden per-folder via a.zddc apps:entry. The default is the embedded copy from the binary; operators can pin a specific version or URL if they want.