Use nicer glyphs for fold/unfold controls (#247)

[cboos]

Closes #247.

Cosmetic: replace the fold-bar control glyphs with cleaner Unicode triangles that double better without kerning tricks.

Glyph mapping

Control	Old	New
fold-one, folded → Unfold (1st level)…	▶	⏵ (U+23F5)
fold-one, unfolded → Fold (all levels)…	▼	⏷ (U+23F7)
fold-all, folded → Unfold (all levels)…	▶▶	⏵⏵
fold-all, unfolded → Fold (to 1st level)…	▼▼	⏷⏷

Also the params-table disclosure-marker fallback: ▸ → ⏵ (U+25B8→U+23F5) and ▾ → ⏷ (U+25BE→U+23F7).

Notes

• Tooltips and fold behavior unchanged. Only the emitted glyph characters change; fold state is driven by booleans / data-state / aria-expanded, never by reading a glyph back.
• Kerning hack removed. The .fold-icon letter-spacing: -.2em workaround (added for ▶▶/▼▼ Chrome kerning, CB's ideas scratchpad #73/Minor CSS clean-ups #153) is dropped — the new ⏵⏵/⏷⏷ space evenly natively in Chrome and Firefox.
• Params-table change is fallback-only. The CSS cascades list-style-type: "\23F5" then disclosure-closed; Chrome and Firefox resolve to disclosure-closed (native marker), so the params marker is visually unchanged there — ⏵/⏷ only render where disclosure-* is unsupported.
• dev-docs/message-hierarchy.md and the HTML snapshot are updated to match.

🤖 Generated with Claude Code

Summary by CodeRabbit

• New Features

  • Updated fold/unfold indicators throughout the transcript and parameter views to a new, clearer glyph set.
  • Fold controls now use consistent single and double icons for collapsed and expanded states.

• Documentation

  • Refreshed help and reference content to match the new fold control icons and state labels.

• Tests

  • Updated snapshot and test expectations to reflect the new fold indicator appearance.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 2624c150-cb72-467b-a728-34c0c887df16

📥 Commits

Reviewing files that changed from the base of the PR and between 8c974bf and 2c5ecaf.

📒 Files selected for processing (8)

• claude_code_log/html/templates/components/message_styles.css
• claude_code_log/html/templates/transcript.html
• claude_code_log/html/tool_formatters.py
• claude_code_log/renderer.py
• dev-docs/message-hierarchy.md
• test/__snapshots__/test_snapshot_html.ambr
• test/test_hook_attachment_rendering.py
• test/test_params_rows_toggle_browser.py

---

📝 Walkthrough

Walkthrough

This PR replaces fold/unfold UI glyphs (▶/▼, doubled ▶▶/▼▼, and params-table ▸/▾) with new ⏵/⏷ (U+23F5/U+23F7) glyphs throughout CSS, the transcript HTML template's client-side JS, Python comments, dev-docs, and regenerated test snapshots/docstrings. A previous letter-spacing kerning tweak for doubled glyphs is removed since the new glyphs space evenly without it.

Changes

Fold glyph swap

Layer / File(s)	Summary
CSS glyph and kerning updates claude_code_log/html/templates/components/message_styles.css	list-style-type mappings for fold marker states switch from U+25B8/U+25BE to U+23F5/U+23F7, disclosure fallback keywords updated, and the .fold-icon letter-spacing kerning tweak is removed with comments rewritten to explain new spacing.
Transcript template markup and fold state JS claude_code_log/html/templates/transcript.html	Fold-bar button markup and JS functions (applyFoldState, setInitialFoldState, unfoldAncestorsOf) update icon label mappings for folded/first/open states, and related inline comments reference the new glyphs.
Python glyph references claude_code_log/html/tool_formatters.py, claude_code_log/renderer.py	Docstring and inline comments describing fold toggle glyphs and fold-bar markers are updated to the new notation.
Dev docs glyph updates dev-docs/message-hierarchy.md	Fold-state tables, ASCII diagrams, tooltip tables, and example flows are updated to show the new glyphs.
Snapshot regeneration test/__snapshots__/test_snapshot_html.ambr	Embedded CSS, JS fold logic, and rendered fold-bar HTML across many repeated sections are regenerated to use the new glyphs.
Test docstring/comment updates test/test_hook_attachment_rendering.py, test/test_params_rows_toggle_browser.py	Docstrings and comments describing expected glyph output are updated to match the new notation.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~5 minutes

Possibly related PRs

• daaain/claude-code-log#191: Both PRs modify the fold/unfold state logic in transcript.html's client-side icon mapping area.
• daaain/claude-code-log#216: Both PRs touch the params-table fold/expand row-toggle rendering wiring.
• daaain/claude-code-log#217: Both PRs modify the key-column toggle fold-control wiring tied to aria-expanded state.

Poem

A triangle hopped off to bed,
⏵ and ⏷ rose instead,
No kerning tricks, no fuss, no fight,
Just glyphs that space themselves just right.
Thump-thump! says this rabbit, glyph-proud and small,
Fold once, fold twice, unfold them all 🐇

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 75.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly summarizes the main change: updating fold/unfold control glyphs.
Linked Issues check	✅ Passed	The PR matches #247 by replacing fold glyphs everywhere, updating params-table fallbacks, and refreshing docs and snapshots.
Out of Scope Changes check	✅ Passed	The changes stay within the glyph refresh scope and only adjust related code, docs, comments, and snapshots.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch dev/nicer-fold-glyphs

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}