migrate-component-styles
CommunityAutomate Nuxt UI Tailwind migrations to HEEx.
Authorfodurrr
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Automates the migration of Tailwind classes from Nuxt UI components to Phoenix HEEx templates, while mapping hardcoded colors to theme tokens to ensure consistent theming.
Core Features & Use Cases
- Parse Tailwind classes from Nuxt UI examples and extract color/size/spacing tokens.
- Detect hardcoded colors and map them to theme tokens for consistent theming across components.
- Generate Phoenix Component helper templates (color_classes, size_classes) and ready-to-use HEEx templates.
- Validate theme compliance with automated checks and CI-friendly reports for ported components.
- Use Case: Port a Button or Chip from Nuxt UI into a Phoenix app with theme-aligned visuals.
Quick Start
Invoke the migration on a Nuxt UI component to generate theme-compliant HEEx templates and helper functions.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: migrate-component-styles Download link: https://github.com/fodurrr/xTweak/archive/main.zip#migrate-component-styles Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.