UI: collapsible sections in help modal

Post-processes rendered markdown: each H2 becomes a <details>/<summary>.
Top 4 sections (Header Controls, Chat, Sessions, Notes) open by default;
remaining sections (Backends, Talk, Files, Context, Shortcuts, API,
Planned) start collapsed.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scott Idem
2026-03-17 23:16:11 -04:00
parent 2ca02006dd
commit 2144d7c2c0
2 changed files with 65 additions and 0 deletions

View File

@@ -898,6 +898,43 @@
font-weight: 600;
}
/* ── Help modal collapsible sections ────────────────────── */
#help-modal-body details {
border-bottom: 1px solid var(--border);
}
#help-modal-body details:last-of-type { border-bottom: none; }
#help-modal-body summary {
cursor: pointer;
padding: 10px 4px;
font-size: 1.0em;
font-weight: 600;
color: var(--accent);
display: flex;
align-items: center;
gap: 8px;
user-select: none;
list-style: none;
}
#help-modal-body summary::-webkit-details-marker { display: none; }
#help-modal-body summary::before {
content: '▶';
font-size: 0.6em;
opacity: 0.55;
transition: transform 0.15s;
flex-shrink: 0;
}
#help-modal-body details[open] > summary::before {
transform: rotate(90deg);
}
#help-modal-body summary:hover { color: var(--text); }
/* Content inside a details block gets a little left indent */
#help-modal-body details > *:not(summary) {
padding-left: 12px;
}
/* ── Auth warning banner ─────────────────────────────────── */
#auth-banner {
display: none;