diff --git a/.cspell.json b/.cspell.json index 58a854014..2b6bce380 100644 --- a/.cspell.json +++ b/.cspell.json @@ -104,6 +104,7 @@ "**/renovate.json", "**/esbuild.js", "**/tailwind.config.js", + "**/tailwind.config.mjs", "**/tailwind.config.ts", "**/vite.config.ts", "**/entry.server.tsx", diff --git a/configs/tailwind/package.json b/configs/tailwind/package.json new file mode 100644 index 000000000..b2664008b --- /dev/null +++ b/configs/tailwind/package.json @@ -0,0 +1,19 @@ +{ + "name": "@zodiac/tailwind-config", + "private": true, + "type": "module", + "license": "UNLICENSED", + "sideEffects": false, + "packageManager": "pnpm@9.15.3", + "main": "./tailwind.config.mjs", + "exports": { + ".": { + "import": "./tailwind.config.mjs", + "default": "./tailwind.config.mjs" + } + }, + "dependencies": {}, + "peerDependencies": { + "tailwindcss": "3.4.17" + } +} diff --git a/configs/tailwind/tailwind.config.mjs b/configs/tailwind/tailwind.config.mjs new file mode 100644 index 000000000..def23243f --- /dev/null +++ b/configs/tailwind/tailwind.config.mjs @@ -0,0 +1,16 @@ +export default { + content: [ + './src/**/*.{tsx,html}', + './app/**/*.tsx', + './public/*.html', + './node_modules/@zodiac/ui/**/*.tsx', + ], + theme: { + extend: { + fontFamily: { + mono: '"Roboto Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace', + }, + }, + }, + plugins: [], +} diff --git a/deployables/app/package.json b/deployables/app/package.json index 423752862..01362c451 100644 --- a/deployables/app/package.json +++ b/deployables/app/package.json @@ -32,6 +32,7 @@ "@types/react": "^19.0.1", "@types/react-dom": "^19.0.1", "@vitest/coverage-v8": "2.1.8", + "@zodiac/tailwind-config": "workspace:*", "@zodiac/test-utils": "workspace:*", "autoprefixer": "^10.4.20", "eslint": "^9.7.0", diff --git a/deployables/app/tailwind.config.ts b/deployables/app/tailwind.config.ts index 585a5e9f1..da448d694 100644 --- a/deployables/app/tailwind.config.ts +++ b/deployables/app/tailwind.config.ts @@ -1,25 +1,4 @@ +import zodiacTailwindConfig from '@zodiac/tailwind-config' import type { Config } from 'tailwindcss' -export default { - content: [ - './app/**/{**,.client,.server}/**/*.{js,jsx,ts,tsx}', - '../../packages/ui/**/*.tsx', - ], - theme: { - extend: { - fontFamily: { - sans: [ - '"Inter"', - 'ui-sans-serif', - 'system-ui', - 'sans-serif', - '"Apple Color Emoji"', - '"Segoe UI Emoji"', - '"Segoe UI Symbol"', - '"Noto Color Emoji"', - ], - }, - }, - }, - plugins: [], -} satisfies Config +export default zodiacTailwindConfig satisfies Config diff --git a/deployables/example-app/package.json b/deployables/example-app/package.json index 6e73683c3..b7256e624 100644 --- a/deployables/example-app/package.json +++ b/deployables/example-app/package.json @@ -31,6 +31,7 @@ "@types/chrome": "^0.0.290", "@types/react": "^19.0.0", "@zodiac/eslint-config": "workspace:*", + "@zodiac/tailwind-config": "workspace:*", "autoprefixer": "^10.4.20", "eslint": "^9.7.0", "globals": "^15.8.0", diff --git a/deployables/example-app/tailwind.config.ts b/deployables/example-app/tailwind.config.ts index a46e8ca9c..da448d694 100644 --- a/deployables/example-app/tailwind.config.ts +++ b/deployables/example-app/tailwind.config.ts @@ -1,9 +1,4 @@ +import zodiacTailwindConfig from '@zodiac/tailwind-config' import type { Config } from 'tailwindcss' -export default { - content: ['./app/**/*.tsx'], - theme: { - extend: {}, - }, - plugins: [], -} satisfies Config +export default zodiacTailwindConfig satisfies Config diff --git a/deployables/extension/package.json b/deployables/extension/package.json index 4798b7e19..2c1fa75a5 100644 --- a/deployables/extension/package.json +++ b/deployables/extension/package.json @@ -52,6 +52,7 @@ "@walletconnect/sign-client": "2.17.3", "@walletconnect/universal-provider": "2.17.3", "@zodiac/eslint-config": "workspace:*", + "@zodiac/tailwind-config": "workspace:*", "@zodiac/test-utils": "workspace:*", "autoprefixer": "^10.4.20", "classnames": "^2.3.1", diff --git a/deployables/extension/tailwind.config.js b/deployables/extension/tailwind.config.js index 2613b73b5..db8e6d919 100644 --- a/deployables/extension/tailwind.config.js +++ b/deployables/extension/tailwind.config.js @@ -1,18 +1,7 @@ +import zodiacTailwindConfig from '@zodiac/tailwind-config' + /** @type {import('tailwindcss').Config} */ export default { + ...zodiacTailwindConfig, important: true, - content: [ - './src/**/*.tsx', - './public/*.html', - './src/**/*.html', - '../../packages/ui/**/*.tsx', - ], - theme: { - extend: { - fontFamily: { - mono: '"Roboto Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace', - }, - }, - }, - plugins: [], } diff --git a/deployables/landing-page/package.json b/deployables/landing-page/package.json index 6176769ec..9ffb3dd8d 100644 --- a/deployables/landing-page/package.json +++ b/deployables/landing-page/package.json @@ -15,6 +15,7 @@ "devDependencies": { "@vitejs/plugin-react": "^4.3.4", "@zodiac/eslint-config": "workspace:*", + "@zodiac/tailwind-config": "workspace:*", "autoprefixer": "^10.4.20", "eslint": "^9.7.0", "postcss": "^8.4.47", diff --git a/deployables/landing-page/tailwind.config.ts b/deployables/landing-page/tailwind.config.ts index 098cc4955..a1d86faff 100644 --- a/deployables/landing-page/tailwind.config.ts +++ b/deployables/landing-page/tailwind.config.ts @@ -1,16 +1,9 @@ +import zodiacTailwindConfig from '@zodiac/tailwind-config' import type { Config } from 'tailwindcss' const tailwindConfig = { - important: true, - content: ['./src/**/*.tsx', './index.html', '../../packages/ui/**/*.tsx'], - theme: { - extend: { - fontFamily: { - mono: '"Roboto Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace', - }, - }, - }, - plugins: [], + ...zodiacTailwindConfig, + content: [...zodiacTailwindConfig.content, './index.html'], } satisfies Config export default tailwindConfig diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index caf53e66e..4ccfd938a 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -56,6 +56,12 @@ importers: specifier: ^8.0.0 version: 8.19.1(eslint@9.17.0(jiti@2.4.1))(typescript@5.7.3) + configs/tailwind: + dependencies: + tailwindcss: + specifier: 3.4.17 + version: 3.4.17 + deployables/app: dependencies: '@epic-web/invariant': @@ -119,6 +125,9 @@ importers: '@vitest/coverage-v8': specifier: 2.1.8 version: 2.1.8(vitest@2.1.8(@types/node@22.10.5)(happy-dom@16.5.3)(less@4.2.1)(lightningcss@1.28.2)(sass@1.82.0)(stylus@0.62.0)) + '@zodiac/tailwind-config': + specifier: workspace:* + version: link:../../configs/tailwind '@zodiac/test-utils': specifier: workspace:* version: link:../../packages/test-utils @@ -213,6 +222,9 @@ importers: '@zodiac/eslint-config': specifier: workspace:* version: link:../../configs/eslint + '@zodiac/tailwind-config': + specifier: workspace:* + version: link:../../configs/tailwind autoprefixer: specifier: ^10.4.20 version: 10.4.20(postcss@8.4.49) @@ -349,6 +361,9 @@ importers: '@zodiac/eslint-config': specifier: workspace:* version: link:../../configs/eslint + '@zodiac/tailwind-config': + specifier: workspace:* + version: link:../../configs/tailwind '@zodiac/test-utils': specifier: workspace:* version: link:../../packages/test-utils @@ -491,6 +506,9 @@ importers: '@zodiac/eslint-config': specifier: workspace:* version: link:../../configs/eslint + '@zodiac/tailwind-config': + specifier: workspace:* + version: link:../../configs/tailwind autoprefixer: specifier: ^10.4.20 version: 10.4.20(postcss@8.4.49)