css-development-validatelisted

# CSS Development: Validate ## Overview Reviews existing CSS code against established patterns and provides specific, actionable feedback: - Semantic naming conventions - Tailwind `@apply` composition - Dark mode variant coverage - Test coverage (static + rendering) - Documentation quality - Composition opportunities **This is a sub-skill of `css-development`** - typically invoked automatically via the main skill. ## When This Skill Applies Use when: - Reviewing existing CSS code - Auditing component styles for consistency - Checking if patterns are being followed - Before merging CSS changes - Refactoring prep (identify issues first) ## Pattern Reference This skill validates against patterns documented in the main `css-development` skill: **Semantic naming:** `.button-primary` not `.btn-blue` **Tailwind composition:** Use `@apply` to compose utilities **Dark mode:** Include `dark:` variants **Test coverage:** Static CSS + component rendering tests **Documentation:** Usage comments above classes ## Workflow When this skill is invoked, create a TodoWrite checklist and work through validation systematically. ### Announce Usage "I'm using the css-development:validate skill to review this CSS against established patterns." ### Create TodoWrite Checklist Use the TodoWrite tool: ``` Validating CSS: - [ ] Read CSS files (load components.css and related styles) - [ ] Check semantic naming (verify descriptive class names) - [ ] Verify @apply usage (ensure Tailwind compo