Repository navigation
Default the site chrome to a readable system sans font - #31
Closed
ulziibay-kernel wants to merge 2 commits into
Closed
ulziibay-kernel wants to merge 2 commits into
ulziibay-kernel wants to merge 2 commits into
Conversation
The man-page chrome rendered all prose in 14px monospace, which is hard to read on desktop and mobile. Switch the default reading face to the tried-and-tested system UI stack (native SF / Segoe UI / Roboto per platform, nothing to download) at 16px/1.6, and convert the pre-based prose to real paragraphs. Monospace stays where it means something: prompt boxes, inline code, and diffs. The space-padded footer becomes a flex row so it stays flush at any width. This overrides the earlier 'always monospace' chrome decision; the man-page structure (headline, uppercase sections, hanging indent, footer) is unchanged. Auth emails and the OG preview image keep their own fonts.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
ulziibay-kernel
marked this pull request as ready for review
October 28, 2026 19:28
A doc's HTML renders byte-pristine in the sandboxed iframe, so a doc with no font-family of its own fell back to the browser default serif — noticeably different from the site's sans chrome. In the shell-embedded render (the /d/:slug viewer), inject the system sans stack as a last-resort default when the doc has no authored font rule (inline <style> blocks and style attributes; prose or code samples that merely mention font-family don't count). The injected rules use :where() so any author CSS wins, and direct /raw fetches stay byte-pristine like the comment overlay.
| // or a style="" attribute. Prose or code samples that merely mention | ||
| // "font-family" must not count — a doc about CSS is not a styled doc. | ||
| function hasAuthoredFont(html: string): boolean { | ||
| const blocks = html.match(/<style[^>]*>[\s\S]*?<\/style>/gi) ?? []; |
This branch was successfully deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
The whole site chrome (homepage, /docs, /bookmarks, /login, verify pages, 404s, viewer shell + comments rail, history viewer, in-doc comment overlay) rendered every word in
ui-monospaceat 14px — the locked "man-page brand". That's hard to read, especially on mobile.The default is now the tried-and-tested system UI stack —
-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif(the GitHub/Bootstrap lineage) at 16px / 1.6:code, and the history diff pane<pre>(hard-wrapped at ~70 chars) is now real<p>paragraphs, so text reflows properly instead of breaking mid-linespace-betweenrow, so it stays flush at any viewport widthDocs that set no font now fall back to the same sans stack
Doc HTML renders byte-pristine in the sandboxed iframe, so a doc with no
font-familyof its own fell back to the browser default serif — visibly different from the chrome. In the shell-embedded render (the/d/:slugviewer), we now inject the system sans stack as a last-resort default when the doc has no authored font rule (lib/docs/font-fallback.ts):<style>blocks andstyle=""attributes; prose or code samples that merely mentionfont-familydon't count:where()(zero specificity), so any author CSS wins anyway/rawfetches stay byte-pristine (the fallback rides the shell variant, like the comment overlay)Intentionally not changed
Note
This overrides the earlier "always light, monospace" chrome decision documented in the code comments (the man-page layout itself is kept). Happy to revert if the mono look was load-bearing.
Verification
npm test: 220/220 pass;tsc --noEmitclean;next buildclean-apple-system), and a Georgia-styled doc keeps Georgia with no injectionNote
Low Risk
Presentation and optional iframe font injection only; auth and
/rawbyte-pristine behavior are explicitly preserved and tested.Overview
Replaces the locked monospace man-page brand (14px everywhere) with the system UI sans stack at 16px / 1.6 across shared chrome:
lib/page.tsexportsSANS/MONO,manPage()and the homepage, login/docs/bookmarks/404 surfaces, root layout, verify pages, and React not-found/history shells.Prose markup moves from hard-wrapped
<pre>to<p>so copy reflows; monospace stays on prompt boxes, inlinecode, and the history diff pane. Footers switch from character-padded<pre>lines to a flexspace-betweenrow. List rows on/docsand/bookmarksdrop<pre>wrappers in favor of normal inline links + tails.Viewer shell (
CommentsShell, overlay chips/popover, history chrome) uses sans for UI; comment bodies remain serif.lib/docs/font-fallback.tsinjects a low-specificity default sans (and mono for code elements) into fontless published HTML only when served as/d/:slug/raw?overlay=1; direct/rawresponses stay byte-identical. Vitest covers fallback detection and raw-route injection behavior.Reviewed by Cursor Bugbot for commit b633fb9. Bugbot is set up for automated code reviews on this repo. Configure here.