feat: design system overhaul — sidebar, AI chats, settings, brainstorm, color cleanup
All checks were successful
Deploy to Production / Build and Deploy (push) Successful in 12s

- Sidebar: dynamic brand-accent colors, brainstorm section restyled
- AI chat general: popup panel with expand/collapse, hides when contextual AI open
- AI chat contextual: tabs reordered (Actions first), X close button, height fix
- Settings: all tabs restyled, 6 new color presets (sage, terracotta, iron, etc.)
- Global color cleanup: emerald/orange hardcoded → brand-accent dynamic
- Brainstorm page: orange → brand-accent throughout
- PageEntry animation component added to key pages
- Floating AI button: bg-brand-accent instead of hardcoded black
- i18n: all 15 locales updated with new AI/billing keys
- Billing: freemium quota tracking, BYOK, stripe subscription scaffolding
- Admin: integrated into new design
- AGENTS.md + CLAUDE.md project rules added
This commit is contained in:
Antigravity
2026-05-16 12:59:30 +00:00
parent 1fcea6ed7d
commit bd495be965
2284 changed files with 395285 additions and 2327 deletions

View File

@@ -0,0 +1,75 @@
# Storyboard Integration
**Using visual storyboards for complex components**
---
## Core Concepts (01-)
### [What Are Storyboards?](01-what-are-storyboards.md)
Visual documentation of state transitions and flows
### [When to Use Storyboards](01-when-to-use.md)
Complexity indicators that require visual documentation
### [Storyboard Types](01-storyboard-types.md)
State transitions, interaction flows, multi-component sync
---
## Storage & Organization (02-)
### [File Structure](02-file-structure.md)
Where to store storyboards in the three-tier architecture
### [Naming Conventions](02-naming-conventions.md)
How to name storyboard files
---
## Creation Guidelines
### [How to Create Storyboards](creation-guide.md)
Hand-drawn, digital, or annotated screenshots
### [Annotation Best Practices](annotation-guide.md)
Numbering, labels, and visual indicators
---
## Integration
### [Referencing in Feature Files](feature-file-integration.md)
How to link storyboards from specifications
### [Referencing in Component Files](component-file-integration.md)
Visual state references
---
## Examples
### [TaskFlow Task States](examples/task-states.md)
6-state walk booking storyboard
### [Search Flow](examples/search-flow.md)
Multi-step interaction storyboard
---
## Benefits
### [Why Storyboards Work](benefits.md)
Developer clarity, QA testing, design consistency