Convert from Tailwind CSS 3 style to Tailwind CSS 4 native approach: - Install @tailwindcss/postcss plugin - Create postcss.config.mjs with Tailwind PostCSS plugin - Migrate all custom theme colors to globals.css using @theme directive - Remove tailwind.config.ts (no longer needed in Tailwind CSS 4) - Update globals.css from @import style to native CSS with custom properties Custom theme includes: - 23 category-specific colors as CSS custom properties - --color-category-* naming convention for all unit types - Follows Tailwind CSS 4 best practices with @theme block Benefits: - Native CSS features, no JS config needed - Better performance with PostCSS plugin - Cleaner separation of concerns - Follows Tailwind CSS 4 migration guide 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
28 lines
589 B
JSON
28 lines
589 B
JSON
{
|
|
"name": "units-ui",
|
|
"version": "1.0.0",
|
|
"private": true,
|
|
"scripts": {
|
|
"dev": "next dev --turbopack",
|
|
"build": "next build",
|
|
"start": "next start",
|
|
"lint": "next lint"
|
|
},
|
|
"dependencies": {
|
|
"convert-units": "^2.3.4",
|
|
"next": "^16.0.0",
|
|
"react": "^19.0.0",
|
|
"react-dom": "^19.0.0"
|
|
},
|
|
"devDependencies": {
|
|
"@tailwindcss/postcss": "^4.1.17",
|
|
"@types/node": "^22",
|
|
"@types/react": "^19",
|
|
"@types/react-dom": "^19",
|
|
"eslint": "^9",
|
|
"eslint-config-next": "^16.0.0",
|
|
"tailwindcss": "^4.0.0",
|
|
"typescript": "^5"
|
|
}
|
|
}
|