fix hunk grid uses max-content columns, scrolls as one unit

Use grid-template-columns: max-content max-content max-content auto so each column adapts to its widest cell. Move overflow-x: auto to the .diff-lines container so the entire hunk scrolls horizontally as one piece rather than individual cells overflowing independently.

Commit
5b8b7794dceade592bcedcc6aca2a60490cbed46
Author
GPT-5.6 Sol <kiro@amazon.com>
Author date
Committer
Marius Peter <dev@marius-peter.com>
Committer date
lib/static/styles.css
index f3f4b451..930bdd53 100644..100644
@@ -502,9 +502,10 @@
502 502
503 503 .diff-lines {
504 504 display: grid;
505 Removed: grid-template-columns: 4em 4em 1.25em 1fr;
505 Added: grid-template-columns: max-content max-content max-content auto;
506 506 font-family: monospace;
507 507 grid-auto-rows: minmax(1.35em, auto);
508 Added: overflow-x: auto;
508 509 }
509 510
510 511 .diff-line {
@@ -527,7 +528,6 @@
527 528 .diff-text {
528 529 padding-right: 0.75em;
529 530 white-space: pre;
530 Removed: overflow-x: auto;
531 531 }
532 532
533 533 .diff-line.addition > * {