fix(room): tokenize the inline edit form (LC-558) #527

Merged
longjacksonle merged 1 commit from feat/LC-558-timeline-polish into main 2026-07-08 21:38:07 +02:00

LC-UI-05: tokenize the inline edit form (last raw-color file in the timeline)

Phase 2. The concrete, verifiable slice of the timeline-polish ticket: the message edit form was the last file using a hardcoded Tailwind color.

What changed (templates/room/edit_form.html)

  • bg-yellow-50 -> bg-warning-surface. The raw amber never recolored, so in dark/hc themes the edit form was a bright light-amber box; the token gives the correct dim amber surface per theme.
  • The raw edit <textarea> (w-full border rounded px-2 py-1) -> the shared .input component, so it themes its border/background/text/placeholder in all four themes. All attributes (name, autofocus, rows, Escape/Ctrl+Enter keybindings) unchanged, and the form keeps id="msg-{id}" so the edit -> view hx-swap round-trip is intact.

Safety

  • routes_math_round_trip + routes_drafts (which render the edit form, including the autofocus assertion) pass 43/43.
  • No new classes (both already in the build) -> no Tailwind rebuild. No Rust change.

Deferred (with reason)

The subjective polish in LC-UI-05 (author/timestamp hierarchy, softening the hover action chip, day/unread-divider contrast) is intentionally not in this PR:

  • The mention highlight already uses var(--accent) via color-mix (tokenized, recolors per theme), so that acceptance item is already satisfied.
  • The remaining tweaks need visual iteration against the OOB-heavy message.html (msg-{id}, reactions-{id}, seen-{id}, followup-{id}, reply-count-{id}, poll-{id}) and are safer as a separate focused pass.

🤖 Generated with Claude Code

https://claude.ai/code/session_011jXpZXXwpB36MvTr6JrGXN

## LC-UI-05: tokenize the inline edit form (last raw-color file in the timeline) Phase 2. The concrete, verifiable slice of the timeline-polish ticket: the message edit form was the last file using a hardcoded Tailwind color. ### What changed (`templates/room/edit_form.html`) - `bg-yellow-50` -> `bg-warning-surface`. The raw amber never recolored, so in dark/hc themes the edit form was a bright light-amber box; the token gives the correct dim amber surface per theme. - The raw edit `<textarea>` (`w-full border rounded px-2 py-1`) -> the shared `.input` component, so it themes its border/background/text/placeholder in all four themes. All attributes (name, autofocus, rows, Escape/Ctrl+Enter keybindings) unchanged, and the form keeps `id="msg-{id}"` so the edit -> view `hx-swap` round-trip is intact. ### Safety - `routes_math_round_trip` + `routes_drafts` (which render the edit form, including the autofocus assertion) pass **43/43**. - No new classes (both already in the build) -> no Tailwind rebuild. No Rust change. ### Deferred (with reason) The subjective polish in LC-UI-05 (author/timestamp hierarchy, softening the hover action chip, day/unread-divider contrast) is intentionally not in this PR: - The mention highlight already uses `var(--accent)` via `color-mix` (tokenized, recolors per theme), so that acceptance item is already satisfied. - The remaining tweaks need visual iteration against the OOB-heavy `message.html` (msg-{id}, reactions-{id}, seen-{id}, followup-{id}, reply-count-{id}, poll-{id}) and are safer as a separate focused pass. 🤖 Generated with [Claude Code](https://claude.com/claude-code) https://claude.ai/code/session_011jXpZXXwpB36MvTr6JrGXN
fix(room): tokenize the inline edit form so it themes correctly (LC-558 / LC-UI-05)
All checks were successful
check-secrets / Nosey parker (push) Successful in 3s
check-secrets / TruffleHog (push) Successful in 5s
check-secrets / Kingfisher (push) Successful in 5s
check-secrets / Nosey parker (pull_request) Successful in 5s
check-secrets / Kingfisher (pull_request) Successful in 11s
check-secrets / TruffleHog (pull_request) Successful in 11s
Check / clippy + fmt + tests (pull_request) Successful in 7m52s
Create release / Create release from merged PR (pull_request) Has been skipped
bb733f9445
- Replaces the hardcoded `bg-yellow-50` on the message edit form with the tokenized `bg-warning-surface`. The raw amber never recolored, so in dark/hc themes the edit form rendered as a bright light-amber box; the token gives the dim amber surface per theme. This was the last hardcoded-color file the redesign audit flagged in the timeline.
- Upgrades the raw edit `<textarea>` (`w-full border rounded px-2 py-1`) to the shared `.input` component so it picks up tokenized border/background/text + placeholder in every theme instead of a bare border. Attributes (name, autofocus, rows, the Escape/Ctrl+Enter keybindings) are unchanged, and the form keeps its `id="msg-{id}"` so the edit->view hx-swap round-trip is untouched.
- Verified: `routes_math_round_trip` + `routes_drafts` (which render the edit form, incl. the autofocus test) pass 43/43. No new classes (both are already in the build), so no Tailwind rebuild.

The subjective timeline polish in LC-UI-05 (author/timestamp hierarchy, softening the hover action chip, day/unread-divider contrast) is deferred: the mention highlight already uses `var(--accent)` (tokenized, recolors per theme) so that item is satisfied, and the rest needs visual iteration against the OOB-heavy message.html, best done as a separate focused pass.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_011jXpZXXwpB36MvTr6JrGXN
longjacksonle scheduled this pull request to auto merge when all checks succeed 2026-07-08 21:33:00 +02:00
longjacksonle deleted branch feat/LC-558-timeline-polish 2026-07-08 21:38:08 +02:00
Sign in to join this conversation.
No reviewers
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
psa-systems/lets-chat!527
No description provided.