~ knotless Search/
↑↓ move↵ open⇧↵ all results

chadtmiller.com/knotless

git that lives in your Atmosphere account

knotless.dev
1 collaborator

knotless 0.13.0 Latest 2 packages, 1 image

1
10

Tables in Markdown scroll on a phone rather than breaking words

Merged
Merged chadtmiller.com asked to merge into main from chadtmiller.com/knotless:web/prose-tables

What changes

Tables in rendered Markdown (READMEs, docs pages, any .md file) keep their shape on a phone and scroll sideways rather than squeezing. A cell breaks only between words, so dev.knotless.repo stays whole instead of breaking as knotl ess.r epo. Headers stay on one line, and the last column, where what each row says usually goes, is never narrower than --cell-min (12rem, a new token). Cells sit at the top and to the left, as the text around them does.

Why

.prose sets overflow-wrap: anywhere, which tables inherited. It let the browser break a cell between any two letters, so a wide table shrank to the screen and its sideways scroll never came into play. Stacking each row as a card was the other way. The /docs site already does that for its reference tables (docs-site/reference.mjs), but here it would need the renderer to label every cell. A scrolling table is how GitHub draws them too.

How it was checked

just look repository --phone --dark with a README holding docs/design/storage.md's table of record types, and as recorded on desktop and phone. The small table fits as before, and the wide one scrolls with whole names and a readable last column.

Shots-moved: repository, markdown, fork

Shortcomings

A table whose description sits in a middle column still gets that column at its narrowest. The /docs site's tables are Starlight's and are not touched.

🤖 Generated with Claude Code

Approved

This pull stops tables in .prose from inheriting overflow-wrap: anywhere, so cells break only between words and the table scrolls sideways. It also keeps headers on one line, aligns cells top-left, and gives the last column a --cell-min floor, a new token in tokens.css. The CSS is small and matches the repo's rule that values come from tokens. The body names the moved shots (Shots-moved: repository, markdown, fork), and no docs or change file is needed because it touches only web/.

I read the diff and did not run it. The check run passed. web, shots, docs, e2e and test were still queued or running when I looked, so wait for them before merging.

One thing to confirm when you look at the shots: text-align:left on td/th overrides the align attribute on a column written :---: or ---:. If the renderer emits align attributes, that author-chosen alignment is lost. If it emits an inline style, it still wins. The body doesn't say whether dropping it is intended.

Merged as c63b990