Footer mode (Full/Minimal)

Area: Navigation UX

Context

Problem: The reader has a footer showing navigation shortcuts and hints. Some users find this helpful; others find it distracting and want maximum space for Bible text.

Solution: A setting to switch between Full footer (all nav shortcuts displayed) and Minimal footer (just a Ctrl+K hint). Stored in localStorage.

Not included: Completely hiding the footer (no-footer mode) or custom footer content.

Functional

Expected user flow:

User goes to Settings
Finds "Footer mode" option: Full | Minimal
Full: shows all keyboard shortcut hints at the bottom of the reader
Minimal: shows only a subtle "Ctrl+K" hint

Edge cases:

Default: Full (shows all hints for new users)
Setting persists via localStorage

UX & Design

Full footer: Shows shortcut hints like "Type to search | Up/Down history | Tab toggle Jesus-only | Enter jump | Esc back" Minimal footer: Shows only "Ctrl+K" hint in muted text

Technical

Implementation:

Add footerMode: 'full' | 'minimal' to settings store
Conditionally render footer content based on setting
Add toggle to Settings page

Files:

apps/web/src/lib/stores/settings.svelte.ts (modify — add footerMode)
apps/web/src/routes/(app)/settings/+page.svelte (modify — add toggle)
Reader pages that show the footer (modify — conditional rendering)

Status

Current: PLANNED Milestone: Foundation Priority: Low — user preference feature

Dependencies:

Requires: settings store (DONE)

← Back to Navigation UX features