feat(ui): intentional long-message truncation (LC-385) #395

Merged

longjacksonle merged 1 commit from feat/lc-385-truncation into main

2026-06-20 04:04:07 +02:00

longjacksonle commented

2026-06-20 04:02:39 +02:00

Owner

Closes LC-385. Part of the LC-383 room-polish-2 epic.

What

The LC-256 long-message fold already had a bottom fade, but the expand control was a bare blue "Show more" link, so the clamp read as accidental.

Styled control. "Show more" / "Show less" becomes a quiet inline .lc-collapse-toggle: muted-to-content on hover, with a CSS-triangle chevron that rotates 180 on expand. The chevron is a ::before border triangle (not glyph content), so auto_scroll.html keeps setting textContent for the label without wiping it, and screen readers don't announce the marker. The JS now toggles .lc-collapse-open alongside the existing label swap.
Refined fade. Taller (4rem) two-stop gradient to --surface, so the cut reads as a deliberate fade, not a hard crop.

Preserved

Progressive enhancement is unchanged: the full body always renders; auto_scroll.html only clamps + reveals the toggle when the body overflows COLLAPSE_MAX, and expand/collapse behaves exactly as before.

Tests

Four LC-77 fixtures regenerated for the toggle class change; diff verified to contain only that.
./dev/cargo check, just build-css, just test, just test-saas - all green.

🤖 Generated with Claude Code

Closes LC-385. Part of the LC-383 room-polish-2 epic. ## What The LC-256 long-message fold already had a bottom fade, but the expand control was a bare blue "Show more" link, so the clamp read as accidental. - **Styled control.** "Show more" / "Show less" becomes a quiet inline `.lc-collapse-toggle`: muted-to-content on hover, with a CSS-triangle chevron that rotates 180 on expand. The chevron is a `::before` border triangle (not glyph content), so `auto_scroll.html` keeps setting `textContent` for the label without wiping it, and screen readers don't announce the marker. The JS now toggles `.lc-collapse-open` alongside the existing label swap. - **Refined fade.** Taller (4rem) two-stop gradient to `--surface`, so the cut reads as a deliberate fade, not a hard crop. ## Preserved Progressive enhancement is unchanged: the full body always renders; `auto_scroll.html` only clamps + reveals the toggle when the body overflows `COLLAPSE_MAX`, and expand/collapse behaves exactly as before. ## Tests - Four LC-77 fixtures regenerated for the toggle class change; diff verified to contain only that. - `./dev/cargo check`, `just build-css`, `just test`, `just test-saas` - all green. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

longjacksonle added 1 commit

2026-06-20 04:02:39 +02:00

feat(ui): intentional long-message truncation (LC-385)

Check / clippy + fmt + tests (pull_request) Successful in 3m45s

Details

check-secrets / Kingfisher (push) Successful in 5s

Details

check-secrets / TruffleHog (push) Successful in 5s

Details

check-secrets / Nosey parker (pull_request) Successful in 5s

Details

check-secrets / Nosey parker (push) Successful in 6s

Details

check-secrets / TruffleHog (pull_request) Successful in 4s

Details

check-secrets / Kingfisher (pull_request) Successful in 4s

Details

Create release / Create release from merged PR (pull_request) Has been skipped

Details

11eb7a76ad

The LC-256 long-message fold had a bottom fade but the expand control was a bare blue "Show more" link, so the clamp read as accidental.

Style "Show more" / "Show less" as a quiet inline control (.lc-collapse-toggle): muted-to-content on hover, with a CSS-triangle chevron that rotates 180 on expand. The chevron is a ::before border triangle, not glyph content, so auto_scroll.html keeps setting textContent for the label without wiping it and screen readers don't announce the marker; the JS now toggles .lc-collapse-open alongside the existing label swap. The bottom fade is taller (4rem) with a smoother two-stop gradient to --surface so the cut reads as a deliberate fade rather than a hard crop.

Progressive-enhancement contract unchanged: the full body always renders; auto_scroll.html only clamps + reveals the toggle when the body overflows COLLAPSE_MAX, and expand/collapse works exactly as before. The four LC-77 fixtures are regenerated for the toggle class change; diff verified to contain only that.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>