- Multi-stage build: node:22-alpine for build, separate stage for serve
- Runs vite preview on port 4173 with host 0.0.0.0
- config.json mountable at runtime via -v /path/to/config.json:/app/dist/config.json:ro
- Import SLOTS_PER_PAGE in reward.ts; replace hardcoded 12 with it
- Import SLOTS_PER_PAGE and getForestElements in app.ts
- Zurueck zum Wald callback navigates to page containing new element
- currentForestPage updated in progress before initForestScreen
- Add saveProgress import to scene.ts
- Wire prevBtn/nextBtn onclick handlers in initForestScreen
- Persist currentForestPage to IndexedDB on every navigation
- Add fade-out/fade-in opacity transition on page changes
- Add forest__nav container with prev/next buttons and page indicator in index.html
- Navigation placed between forest scene and level map, hidden by default
- Add .forest__nav, .forest__nav-btn, .forest__nav-text CSS classes
- 44px minimum touch targets on nav buttons, pastel BEM styling
- Buttons use Quicksand font matching app design language
- Add currentForestPage: number field to Progress interface in types.ts
- Export SLOTS_PER_PAGE = 12 constant from scene.ts
- Change renderForestScene signature to accept page: number parameter
- Slice elements by page (start/end = page * SLOTS_PER_PAGE)
- Update navigation UI (forest-nav) after rendering
- Add migrateProgress entry for currentForestPage in app.ts
- Fix Progress object literals in db.test.ts and screens.ts to include new field
- levels.test.ts: change length assertion to 16, add newKeys tests for levels 7-16
- levels.test.ts: add Level 16 allKeys completeness test (all QWERTZ keys)
- words.test.ts: extend all loops from 6 to 16 levels, add validateWordList test
- companion.test.ts: fix unknown-letter test to use '@' (z now has a fallback entry)
- Add German word lists for levels 7-16 (10 words each, max 5 chars)
- All words validated against allowed keys per level
- Level 16 uses short words with period for punctuation practice
- Add 19 new fallback letter introductions (r,u,t,z,w,o,q,p,n,b,v,m,c,x,ä,ü,y,, ,.)
- Update entry count comment to 32 entries (levels 1-16)
- Add levels 7-16 covering r,u,t,z,w,o,q,p,n,b,v,m,c,x,ä,ü,y and punctuation
- Add comma and period to fingerMap (r-mid and r-ring)
- Update keyboard.ts: add ',' and '.' to bottom row in DE and CH layouts
- Add comma and period to fingerColorMap in keyboard.ts
- Full project overview with tagline and concept description
- Features, tech stack, prerequisites, getting started sections
- Available scripts table, project structure tree
- How It Works explanation of the three-phase lesson loop
- Configuration, deployment, contributing, and license sections
- Added forest__intro paragraph between title and greeting area in index.html
- Added .forest__intro CSS block with Nunito font, centered, pastel-style styling
- setPhase("practice") now shows full instruction instead of "Ueben"
- setPhase("words") now shows full instruction instead of "Woerter"
- Removed 2500ms delay and companion text flicker in runPracticePhase
- Removed 2500ms delay and companion text flicker in runWordsPhase
- src/app.ts: greeting text now renders inline markdown
- src/ui/screens.ts: letter intro text now renders inline markdown
- src/forest/reward.ts: forest comment now renders inline markdown
- All 3 sites use innerHTML with XSS-safe renderInlineMarkdown
- Escapes HTML special chars first (XSS safe)
- Converts **bold** to <strong>, *italic* to <em>
- Standalone asterisks with spaces are left unchanged
- Pure function, no DOM dependency
- Practice phase shows 'Jetzt kannst du ueben! Druecke die Taste zu dem Buchstaben, der herunterfaellt.' for 2.5s before exercise starts
- Words phase shows 'Jetzt kommen ganze Woerter! Tippe die Buchstaben nacheinander ein.' for 2.5s before exercise starts
- Both functions converted to async/await pattern matching existing discover phase
- Companion text cleared after delay before exercises begin
- Replace 'if (key === " ") continue' with a dedicated space bar step
- Shows ␣ symbol large with 'Leertaste' label underneath
- Companion text explains the symbol in child-friendly German
- Highlights and pulses the space key on the keyboard
- Child must press space bar once to confirm understanding and continue
- html/body: height 100dvh, overflow hidden
- .screen--active: height 100dvh instead of min-height 100vh
- Forest/lesson/reward/welcome: flex: 1 to fill available space
- Forest scene: flex: 1 with min-height: 0 to shrink properly
- Reduced padding and font sizes for better fit
- Continue button and title: flex-shrink: 0 to stay visible
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Click any forest element or reward image to see it large
- Smooth zoom-in animation, click anywhere to close
- Hover effect on clickable images
- Works on both forest grid and reward screen
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
gurix
