Changelog 7365e1ftree, with Claude Opus 5.5
Context chips follow the title on its line, or move to the next line as a group
1 file of code, design or docs +6 −5 lines
Code, design and documents 1 file
src/styles/global.css +6 −5
@@ -1426,9 +1426,10 @@ details.segrow .segrow-top > span, .segrow:not(details) .segrow-top > span { fon .segrow.ctx-tile { break-inside: avoid; padding: 16px 0 18px; border-bottom: 0; border-top: 1px solid var(--border); } .ctx-grid > .ctx-tile:first-child { border-top: 0; padding-top: 6px; } -/* a section's status chips sit on its title line, to the right; several wrap there */ -.ctx-grid > .ctx-tile { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 14px; align-items: start; } -.ctx-grid > .ctx-tile > * { grid-column: 1 / -1; } -.ctx-grid > .ctx-tile > .segrow-top { grid-column: 1; margin-bottom: 4px; } -.ctx-grid > .ctx-tile > .d-chips { grid-column: 2; grid-row: 1; justify-content: flex-end; max-width: 300px; margin: 2px 0 6px; } +/* a section's status chips follow its title on the same line; when they do not fit there, the + whole group moves to the next line (flex items wrap as a block) */ +.ctx-grid > .ctx-tile { display: flex; flex-wrap: wrap; align-items: center; column-gap: 14px; } +.ctx-grid > .ctx-tile > * { flex: 1 1 100%; min-width: 0; } +.ctx-grid > .ctx-tile > .segrow-top { flex: 0 1 auto; margin-bottom: 4px; } +.ctx-grid > .ctx-tile > .d-chips { flex: 0 1 auto; margin: 0 0 6px; } .ctx-wide { margin-top: 18px; } .ctx-wide > .ctx-tile { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 0 clamp(32px, 4vw, 64px); border-top: 1px solid var(--text); }