Post CSS plugin for new tailwind version and Aceternity #13425
Unanswered
fernandortec
asked this question in
Help
Replies: 1 comment
-
Hello, Have you found a solution? |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
https://ui.aceternity.com/components
I'm using Aceternity- UI, and some complex components use this plugin to generate CSS variables, but there is no support for tailwind.config.ts, in V4, I couldn't find a way to add this plugin manually to PostCSS, did anyone manage to do that? Without that 1/3 of the components in there aren't usable in the latest version of tailwind
`
const defaultTheme = require("tailwindcss/defaultTheme");
const colors = require("tailwindcss/colors");
const {
default: flattenColorPalette,
} = require("tailwindcss/lib/util/flattenColorPalette");
/** @type {import('tailwindcss').Config} /
module.exports = {
content: ["./src/**/.{ts,tsx}"],
darkMode: "class",
theme: {
// rest of the code
},
plugins: [addVariablesForColors],
};
function addVariablesForColors({ addBase, theme }: any) {
let allColors = flattenColorPalette(theme("colors"));
let newVars = Object.fromEntries(
Object.entries(allColors).map(([key, val]) => [
--${key}
, val]));
addBase({
":root": newVars,
});
}
`
Beta Was this translation helpful? Give feedback.
All reactions