fix(term): flex layout for details summary, fix thinking brain icon column

This commit is contained in:
damocles 2026-07-05 12:10:24 +02:00
commit 758f5ae5a8
2 changed files with 42 additions and 3 deletions

View file

@ -216,11 +216,44 @@
details.row {
white-space: normal;
}
/* Two-column layout for expandable summary rows.
Left col: fixed-width icon cell. Right col: disclosure chevron +
text, wrapping within itself so no continuation line bleeds under
the icon. Overrides the flat-row hanging-indent metrics (.live .row
sets padding-left: 1.9em; text-indent: -1.4em) with explicit flex
geometry. The negative margin-left on summary cancels the details
container's inherited padding-left so the icon lands at the same
horizontal position as flat-row icons. */
details.row > summary {
cursor: pointer;
list-style: none;
white-space: pre-wrap;
word-break: break-word;
display: flex;
align-items: baseline;
margin-left: -1.9em;
padding-left: 0.5em;
text-indent: 0;
}
/* Icon column: 2em accommodates wide emoji without ink bleeding into
the chevron column. Overrides the inline-block + width: 1.4em set
on .live .row-glyph for the shared flat-row context. */
details.row > summary > .row-glyph {
flex: 0 0 2em;
width: auto;
text-align: center;
}
/* Content column: chevron (::before) + text, wraps within the cell. */
details.row > summary > .summary-text {
flex: 1;
min-width: 0;
}
/* Icon-less summaries: the CSS-generated / acts as the hanging
marker. Hanging indent keeps wrapped lines under the text body,
not under the chevron. Mirrors the flat-row text-indent metric. */
details.row > summary > .summary-text:only-child {
padding-left: 1.4em;
text-indent: -1.4em;
}
details.row > summary > .summary-text::before {
content: '▸ ';