[feat](trx-frontend-http): add F1 keyboard shortcuts overlay

Press F1 to toggle a help overlay listing available keyboard shortcuts.
Dismiss with F1, Escape, or clicking the backdrop. Refactored the
global keydown handler to route all shortcuts through one listener.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Signed-off-by: Stan Grams <sjg@haxx.space>
This commit is contained in:
2026-03-25 22:35:11 +01:00
parent 892533bdc2
commit d11f7b4876
3 changed files with 135 additions and 3 deletions
@@ -1046,6 +1046,19 @@
</div>
</div>
</div>
<div id="shortcut-overlay" class="shortcut-overlay is-hidden" aria-live="polite" aria-atomic="true">
<div class="shortcut-overlay-card">
<div class="shortcut-overlay-title">Keyboard Shortcuts</div>
<table class="shortcut-table">
<tbody>
<tr><td class="shortcut-key"><kbd>S</kbd></td><td>Spectrum screenshot</td></tr>
<tr><td class="shortcut-key"><kbd>F1</kbd></td><td>Toggle this help</td></tr>
<tr><td class="shortcut-key"><kbd>Esc</kbd></td><td>Close overlay / exit fullscreen</td></tr>
</tbody>
</table>
<div class="shortcut-overlay-hint">Press <kbd>F1</kbd> or <kbd>Esc</kbd> to close</div>
</div>
</div>
<div id="decode-history-overlay" class="decode-history-overlay is-hidden" aria-live="polite" aria-atomic="true">
<div class="decode-history-overlay-card">
<div id="decode-history-overlay-title" class="decode-history-overlay-title">Loading decode history…</div>