--- name: theme-implement description: Implement themes from makeover proposals into the Covenant codebase. Handles Stimulus.js patterns, CSS specificity, and price formatting. --- # Theme Implementation Implement approved makeover themes into the Covenant codebase. This skill captures critical patterns learned from implementing themes like geocities-hellscape. ## Command ``` \/theme-implement [theme-name] ``` ## Prerequisites - Approved proposal exists at `tmp\/makeover\/themes\/{theme-name}.html` - Development server running (`npm run dev`) - Understanding of this codebase's Stimulus.js patterns ## File Structure Every theme consists of: ``` app\/themes\/{theme-name}\/ ├── layout.html # Main layout (header, nav, footer, modals) ├── home.html # Home page with collections grid ├── inscription.html # Inscription detail with buy flow ├── inscriptions.html # Collection page with inscription grid ├── activity.html # Transaction history ├── policy.html # Policy\/info page └── partials\/ ├── inscription-card.html # Card component for grids └── order.html # Order status display app\/assets\/stylesheets\/ └── application.{theme-name}.tailwind.css # Theme CSS with @theme variables ``` ## Implementation Steps ### 1. Read Proposal and Extract Metadata Read the proposal HTML and find the MAKEOVER_METADATA comment: ```html ``` ### 2. Create Theme Directory ```bash mkdir -p app\/themes\/{theme-name}\/partials ``` ### 3. Extract and Adapt CSS From the proposal's `