Michael Mainguy
15d3789bb4
- Create LayoutPreviewPage component for full-screen layout previews - Add preview route /themes/:themeId/layouts/:layoutId/preview to App routing - Update theme components with preview links and improved navigation - Fix iframe sandbox error by adding allow-scripts permission - Enhance template renderer with layout metadata support - Replace PostCSS with regex-only CSS parsing for browser compatibility - Add comprehensive standards documentation for code quality - Clean up CSS slot indicators to be always visible with descriptions 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
65 lines
3.3 KiB
Markdown
65 lines
3.3 KiB
Markdown
# Slide authoring and presentation tool
|
|
- Should run with no backend server required
|
|
- Data should be stored in indexdb in the browser
|
|
- leverage existing react and npm libraries
|
|
|
|
# Features
|
|
- Create new presentation
|
|
- Select theme for presentation
|
|
- Add slides to presentation and select layout for each slide based on the selected theme and it's layouts
|
|
- Add text to slide in theme layout "slots"
|
|
- Add images to slide in theme layout "slots"
|
|
- Add presentation notes to slide
|
|
- Present slides in a full screen mode
|
|
|
|
|
|
# Themes
|
|
- Themes should be baked into the app, but should be customizable
|
|
- Themes should be selectable when creating a new presentation
|
|
- Themes should be applied to all slides in the presentation
|
|
- Themes should be able to be updated after the presentation is created and presentations will be updated to reflect the new theme
|
|
- Themes should allow multiple layouts for slides that are selectable when creating a new slide
|
|
- Themes should allow for custom CSS to be applied to the presentation
|
|
- Themes should allow for custom fonts to be applied to the presentation
|
|
- Themes should allow for custom colors to be applied to the presentation
|
|
- Themes should allow for custom images to be applied to the presentation
|
|
- Themes should allow for "master slides" that have content that slide authors cannot override or change
|
|
|
|
# ROADMAP
|
|
- [x] build themeing system creating initial default theme
|
|
- [x] build theme selection system
|
|
- [ ] build theme browsing module
|
|
- [ ] build presentation creation system
|
|
- [ ] build slide creation system
|
|
- [ ] build slide authoring system
|
|
- [ ] build presentation system
|
|
|
|
# CURRENT FOCUS
|
|
## determine structure and approach for theming system
|
|
- [x] it should be flexible and allow for custom themes to be created using only html templates and css
|
|
- [x] themes and templates should be very close to native html and css so that they can be easily created and modified
|
|
-
|
|
|
|
# Code Standards
|
|
- Strongly prefer convention over configuration versus configuration over convention
|
|
- Use React for the UI, but allow for other libraries if needed and try to keep as close to html/js/css as possible
|
|
- Use functional components and hooks
|
|
- Use TypeScript for type safety, but allow for JavaScript in some cases
|
|
- **No inline styles** - All styling should be in CSS files with semantic class names
|
|
- Theme structure should be simple and easy to understand for someone familiar with html and ccss
|
|
- Theme structure should not repeat the same information in multiple places
|
|
- Theme structure should be flexible and allow for custom themes to be created using only html templates and css
|
|
- Metadata for themes should be stored as comments in the html and css files
|
|
|
|
# General Claude Guidelines
|
|
- Don't run npm commands, just tell me what to run and I'll run them myself
|
|
|
|
# Architecture
|
|
## Themes
|
|
- Themes should be stored in a directory structure under public directory that allows for easy access and modification by browser
|
|
- Themes should be stored in a directory structure that allows for easy access
|
|
|
|
- don't try to run command to restart, just tell me the command when necessary
|
|
- Add to memory. Just tell me to run build, I'll paste in results, don't try to run the command
|
|
- Add to memory. I want to make sure this approach is generally followed
|
|
- remember to always use introspection when browsing themes and details |