chadtmiller.com/knotless
git that lives in your Atmosphere account
1
10
Tables in Markdown scroll on a phone rather than breaking words
web/src/app.css+4−2
| @@ -567,8 +567,10 @@ a.row:hover{background:var(--hover)} | ||
.prose img{max-width:100%;height:auto} | ||
.prose pre{background:var(--soft);border-radius:var(--radius-md);padding:var(--space-3) var(--pad-x);overflow:auto;line-height:1.5} | ||
.prose :not(pre)>code{background:var(--soft);padding:var(--space-0-5) var(--space-1-5);border-radius:var(--radius-sm);font-size:.85em} | ||
.prose table{border-collapse:collapse;display:block;overflow-x:auto} | ||
.prose td,.prose th{border:var(--border);padding:var(--space-1-5) var(--space-3)} | ||
.prose table{border-collapse:collapse;display:block;overflow-x:auto;overflow-wrap:normal} | ||
.prose td,.prose th{border:var(--border);padding:var(--space-1-5) var(--space-3);vertical-align:top;text-align:left} | ||
.prose th{white-space:nowrap} | ||
.prose td:last-child{min-width:var(--cell-min)} | ||
.prose blockquote{color:var(--mute);border-left:3px solid var(--line);padding-left:var(--space-4);margin-left:0} | ||
.prose .diagram{margin:0 0 var(--space-4);line-height:normal;--pele-bg:var(--bg);--pele-fg:var(--fg);--pele-muted:var(--mute);--pele-line:var(--mute);--pele-surface:var(--soft);--pele-surface-alt:var(--panel);--pele-border:var(--faint);--pele-accent:var(--primary);--pele-critical:var(--rem);--pele-error:var(--rem);--pele-font:var(--font-sans);--pele-font-mono:var(--font-mono)} | ||
| ||
web/src/tokens.css+4−0
| @@ -120,6 +120,10 @@ | ||
--pin: 40px; | ||
--pin-lg: 56px; | ||
--badge-card: 20rem; | ||
/* The narrowest the last column of a table in prose gets, where what | ||
each row says usually goes: a phrase per line, not a word, the table | ||
scrolling sideways instead. */ | ||
--cell-min: 12rem; | ||
/* Behind a dialog, over the page. */ | ||
--scrim: rgb(0 0 0 / 0.4); | ||
--ring: 0 0 0 3px var(--ring-color); | ||