graham/prop
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(docs/api): use system sans for prose, keep mono for code

Browse source 
The site font defaults to Cascadia Code. Monospace prose with long
bulleted items reads as a wall of text — every list item wraps to
2-3 lines and the eye has nothing to anchor on. Override the body
font for /docs/api to a system sans stack while preserving mono for
inline code, fenced code blocks, and tables of API names.
This commit is contained in:
Graham McIntire 2026-05-09 09:51:26 -05:00
parent 0429c9dbab
commit b18f93be7f
No known key found for this signature in database
GPG key ID: F4ABF488E6029E59
1 changed files with 33 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
assets/css/app.css
View file

@ -327,31 +327,56 @@ select.select {
text-decoration: underline;
}
/* API docs page — narrower reading column, since the site font is
monospace and monospace prose is uncomfortable past ~80ch. */
/* API docs page — readable prose. Override the project's monospace
default with a system sans stack for the body, keep mono for code
spans and pre blocks. Without this the bulleted prose wraps to
2-3 lines per item and is a chore to scan. */
.markdown-content.api-docs {
max-width: 60rem;
font-size: 0.95rem;
max-width: 64rem;
font-family:
-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
font-size: 1rem;
line-height: 1.7;
}
.markdown-content.api-docs code,
.markdown-content.api-docs pre,
.markdown-content.api-docs pre code {
font-family: "Cascadia Code", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.markdown-content.api-docs code {
word-break: break-word;
font-size: 0.875em;
}
.markdown-content.api-docs h1 {
font-size: 1.75rem;
font-size: 2rem;
letter-spacing: -0.01em;
}
.markdown-content.api-docs h2 {
font-size: 1.3rem;
font-size: 1.5rem;
letter-spacing: -0.01em;
margin-top: 2.25rem;
}
.markdown-content.api-docs h3 {
font-size: 1.1rem;
font-size: 1.2rem;
margin-top: 1.75rem;
}
.markdown-content.api-docs h4 {
font-size: 1rem;
}
.markdown-content.api-docs li {
margin: 0.4rem 0;
}
.markdown-content.api-docs table {
font-size: 0.85em;
font-size: 0.95em;
}
.markdown-content.api-docs th,