- Add hybrid modal/page navigation based on screen size (1024px breakpoint) - Desktop (>1024px): Uses modal overlays for quick interactions - Mobile (≤1024px): Navigates to dedicated full pages for better UX - Extract shared NPC chat content into reusable partial template - Add responsive navigation JavaScript (responsive-modals.js) - Create dedicated NPC chat page route with back button navigation - Add mobile-optimized CSS with sticky header and chat input - Fix HTMX indicator errors by using htmx-indicator class pattern - Document responsive modal pattern for future features Addresses mobile UX issues: cramped space, nested scrolling, keyboard conflicts, and lack of native back button support in modals. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Public Web Frontend Documentation
This folder contains documentation specific to the public web frontend service.
Documents
- TEMPLATES.md - Template structure, naming conventions, and Jinja2 best practices
- HTMX_PATTERNS.md - HTMX integration patterns and dynamic UI updates
- TESTING.md - Manual testing checklist and browser testing guide
- MULTIPLAYER.md - Multiplayer lobby and session UI implementation
Quick Reference
Service Role: Thin UI layer that makes HTTP requests to API backend
Tech Stack: Flask + Jinja2 + HTMX + Vanilla CSS
Port: 5001 (development), 8080 (production)
Related Documentation
- ../CLAUDE.md - Web frontend development guidelines
- ../README.md - Setup and usage guide
- ../../docs/ARCHITECTURE.md - System architecture overview
- ../../api/docs/API_REFERENCE.md - API endpoints to call