Menú
Redesign a page or component using the project design system components, CSS variables, and Tailwind utilities.
Instalar con Codex o Claude Copia este prompt, pégalo en Codex, Claude u otro asistente, y deja que revise la página de la skill y la instale por ti.
Basado en la clasificación ocupacional SOC
| name | redesign |
| description | Redesign a page or component using the project design system components, CSS variables, and Tailwind utilities. |
Available from @acme/design-system:
| Component | Usage |
|---|---|
| Button | Primary actions, variants: default, destructive, outline, secondary, ghost, link |
| Input | Text inputs with validation states |
| Label | Form field labels |
| Card | Content containers (CardHeader, CardTitle, CardContent, CardFooter) |
| FrostedPanel | Glass-morphism container for hero sections |
| Dialog | Modal dialogs with overlay |
| Toast | Notification system (default, destructive, success) |
| DropdownMenu | Action menus |
| PageSpinner | Loading states |
| EmptyState | Zero-data states with icon, title, description, action |
| ErrorAlert | Dismissible error messages |
| Skeleton | Loading placeholders |
The design system uses HSL CSS variables. See packages/frontend/src/styles/index.css for the full list:
--primary, --secondary, --destructive, --muted, --accent--background, --foreground, --card, --popover--border, --input, --ringdata-testid attributes for E2E testingpackages/frontend/src/routes/Implement a backlog story following the layer order (Domain, Database, API, Frontend, E2E) with TDD.
Review the backlog to determine what to work on next by checking epic and story statuses in docs/backlog/.
Automates pre-commit workflow: lint, test, review changes, then commit with conventional commit format.
Verify a story is complete by checking acceptance criteria, running all tests, and updating status.
Add end-to-end Playwright tests for a feature using data-testid selectors, with API and UI test patterns.
Add unit tests for domain logic, database adapters, API endpoints, or frontend components using Vitest patterns.