Fix #167: block-level gutline spans so gutter numbers align with wrapped lines
CI / test (pull_request) Successful in 43s
CI / docker (pull_request) Skipped

QA on dev showed .codeline spans wrap correctly but gutter .gutline spans
rendered inline (all at the same top), so numbers 6+ fell off with wrap on.
Add .gutter .gutline { display: block; } so each gutter number occupies its
own visual row, matching the one-number-per-visual-row contract of
paste-lines.js. Verified rendered output in a local build at 1400x900 and
375x812 with a long unbroken token on line 5 and wrap ON.
This commit is contained in:
fen
2026-09-10 11:39:34 -05:00
parent 362a59690f
commit 158c0fe4b6
+2
View File
@@ -299,6 +299,8 @@ html[data-wrap] .float { overflow-x: hidden; }
.codebody { padding: 0 18px; white-space: pre; } .codebody { padding: 0 18px; white-space: pre; }
/* #167: each logical line is its own block so offsetTop identifies its first visual row */ /* #167: each logical line is its own block so offsetTop identifies its first visual row */
.codeline { display: block; } .codeline { display: block; }
/* #167: gutter numbers must each sit on their own visual row so they align with wrapped code lines */
.gutter .gutline { display: block; }
/* syntax highlight tokens (#1) */ /* syntax highlight tokens (#1) */
.tok-kw { color: #c792ea; } .tok-kw { color: #c792ea; }
.tok-str { color: #a5e075; } .tok-str { color: #a5e075; }