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
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:
@@ -0,0 +1,71 @@
|
||||
# Modular Component Architecture
|
||||
|
||||
**Navigation hub for the three-tier specification system**
|
||||
|
||||
---
|
||||
|
||||
## Foundation (00-)
|
||||
|
||||
### [Agent-Designer Collaboration](00-foundation/agent-designer-collaboration.md)
|
||||
|
||||
How AI agents optimize designer craft without replacing designer thinking
|
||||
|
||||
---
|
||||
|
||||
## Core Concepts (01-)
|
||||
|
||||
### [Three-Tier Architecture](01-core-concepts/three-tier-overview.md)
|
||||
|
||||
Overview of Pages, Components, and Features separation
|
||||
|
||||
### [Content Placement Rules](01-core-concepts/content-placement-rules.md)
|
||||
|
||||
Decision tree for where to document content
|
||||
|
||||
### [Complexity Detection](01-core-concepts/complexity-detection.md)
|
||||
|
||||
How to identify simple vs complex components
|
||||
|
||||
---
|
||||
|
||||
## Workflows (02-)
|
||||
|
||||
### [Page Specification Workflow](02-workflows/page-specification-workflow.md)
|
||||
|
||||
Step-by-step page decomposition from sketch to specs
|
||||
|
||||
### [Complexity Router Workflow](02-workflows/complexity-router-workflow.md)
|
||||
|
||||
Guided decomposition for complex components
|
||||
|
||||
### [Storyboard Integration](02-workflows/storyboards/storyboards-guide.md)
|
||||
|
||||
Using visual storyboards for complex components
|
||||
|
||||
---
|
||||
|
||||
## Examples
|
||||
|
||||
### [Simple Component Example](examples/simple-button.md)
|
||||
|
||||
Button - single file documentation
|
||||
|
||||
### [Complex Component Example](examples/complex-calendar.md)
|
||||
|
||||
Calendar - three-tier decomposition
|
||||
|
||||
### [Search Bar Example](examples/search-bar.md)
|
||||
|
||||
Search with page-specific content
|
||||
|
||||
---
|
||||
|
||||
## Quick References (03-)
|
||||
|
||||
### [Decision Tree](03-quick-refs/decision-tree.md)
|
||||
|
||||
One-page flowchart for file placement
|
||||
|
||||
### [Benefits Summary](03-quick-refs/benefits.md)
|
||||
|
||||
Why this architecture works
|
||||
Reference in New Issue
Block a user