## Major Features Added: ### Presentation Management - Complete CRUD operations for presentations (create, read, update, delete) - IndexedDB storage for offline presentation data - Comprehensive presentation list view with metadata - Navigation integration with header menu ### Slide Management - Full slide editor with layout selection and content editing - Live preview with theme styling applied - Speaker notes functionality - Enhanced layout previews with realistic sample content - Themed layout selection with proper CSS inheritance ### Aspect Ratio System - Support for 3 common presentation formats: 16:9, 4:3, 16:10 - Global CSS system baked into theme engine - Visual aspect ratio selection in presentation creation - Responsive scaling for different viewing contexts - Print-optimized styling with proper dimensions ### User Experience Improvements - Enhanced sample content generation for realistic previews - Improved navigation with presentation management - Better form styling and user interaction - Comprehensive error handling and loading states - Mobile-responsive design throughout ### Technical Infrastructure - Complete TypeScript type system for presentations - Modular component architecture - CSS aspect ratio classes for theme consistency - Enhanced template rendering with live updates - Robust storage utilities with proper error handling 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
34 lines
1.6 KiB
TypeScript
34 lines
1.6 KiB
TypeScript
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom'
|
|
import { ThemeBrowser, ThemeDetailPage, LayoutDetailPage, LayoutPreviewPage } from './components/themes'
|
|
import { NewPresentationPage, PresentationViewer, PresentationEditor, SlideEditor, PresentationsList } from './components/presentations'
|
|
import { AppHeader } from './components/AppHeader'
|
|
import { Welcome } from './components/Welcome'
|
|
import './App.css'
|
|
import './components/themes/ThemeBrowser.css'
|
|
|
|
function App() {
|
|
return (
|
|
<Router>
|
|
<div className="app-root">
|
|
<AppHeader />
|
|
<main className="app-main">
|
|
<Routes>
|
|
<Route path="/" element={<Welcome />} />
|
|
<Route path="/presentations" element={<PresentationsList />} />
|
|
<Route path="/presentations/new" element={<NewPresentationPage />} />
|
|
<Route path="/presentations/:presentationId/edit/slides/:slideNumber" element={<PresentationEditor />} />
|
|
<Route path="/presentations/:presentationId/view/slides/:slideNumber" element={<PresentationViewer />} />
|
|
<Route path="/presentations/:presentationId/slide/:slideId/edit" element={<SlideEditor />} />
|
|
<Route path="/themes" element={<ThemeBrowser />} />
|
|
<Route path="/themes/:themeId" element={<ThemeDetailPage />} />
|
|
<Route path="/themes/:themeId/layouts/:layoutId" element={<LayoutDetailPage />} />
|
|
<Route path="/themes/:themeId/layouts/:layoutId/preview" element={<LayoutPreviewPage />} />
|
|
</Routes>
|
|
</main>
|
|
</div>
|
|
</Router>
|
|
)
|
|
}
|
|
|
|
export default App
|