Menu
Governs CCD local animate-lite route and wrapper transition usage without adding full Animate.css.
Instalar com Codex ou Claude Copie este prompt, cole no Codex, Claude ou outro assistente e deixe que ele revise a página da skill e instale para você.
Baseado na classificação ocupacional SOC
| name | ccd-animate-lite |
| description | Governs CCD local animate-lite route and wrapper transition usage without adding full Animate.css. |
| version | 1.0.0 |
Use this skill when a task mentions animate-lite, AnimateWrapper, route transition, page transition, or animate.css-style class transitions.
CCD uses a local animate-lite subset, not the full Animate.css dependency.
animate-lite is for route/page enter-leave and small wrapper transitions.
Prefer:
fadeIn;fadeOut;fadeInUp;fadeOutDown;fadeOutUp;zoomIn and zoomOut only for existing component contracts that require them.animate-lite.scss and AnimateWrapper types.Do not use strong attention animations for new work:
bounce, flip, rotate, jello, shake, flash, heartBeat, tada
If a legacy route or component still needs one of these, treat it as a migration candidate rather than expanding the local runtime.
Governs controlled GSAP usage for CCD web-demo component-scoped Level 1 and Level 2 motion.
Defines CCD material, liquid-glass-inspired surfaces, depth, shadows, borders, and overlay usage while preserving token and readability rules.
Defines CCD motion levels, animation limits, reduced-motion behavior, and motion review rules.
Maps CCD page types to UIDesignState, layout archetypes, density, hierarchy, component choices, and UI quality expectations.
Defines CCD's product visual language so AI-generated UI feels premium, coherent, Apple/Google-quality, and CCD-specific while preserving architecture and governance.
A final UI review checklist for CCD visual work before staging, committing, or pushing.