UX improvements: dark mode, tabbed editor, live preview, templates, bug fixes & tests
Summary
- Home page redesign: hero section with feature grid and CTA buttons
- Dark mode: auto (prefers-color-scheme) + manual toggle in header
- Tabbed multi-file editor: auto-detects HTML/JS/CSS, smart preview mapping
- Live preview: URL bar, reload on save, cross-origin fallback
- Templates gallery: 5 starter templates
- Keyboard shortcuts modal
- Bug fixes: tab switch data loss, preview URL persistence, cross-origin reload, file upload reset
- Cleanup: modernized URL API in crib-enable.js, improved error display with copy button, removed dead code
- Unit tests: QUnit test suite (21 tests, 39 assertions) for editor utility functions
Test plan
-
All changes deployed to https://cribjs.nexedi.net via ZIP import -
10 Playwright smoke tests passed (home page, dark mode, navigation, editor, preview, file manager, grep, unit tests) -
QUnit unit tests: 21/21 passed, 39/39 assertions