on adding direction to inset

[devhady]

on adding direction to inset in next js 10 project its fails with open square brackets

[RonMelkhior]

Hi, I need more info. This doesn't tell me anything

[devhady]

thanks for fast responding, i'm using your plugin and it working really fine on next js 10 with padding and margin but when trying to add directive to inset in tailwind variants it crashes with error expected open square brackets

[RonMelkhior]

Show me your config? The exact error, the lines where it happens.

[devhady]

[RonMelkhior]

Can you share the entire config? That error is caused by a typo in the config.

[devhady]

module.exports = {
purge: ["./pages//*.{js,ts,jsx,tsx}", "./components//*.{js,ts,jsx,tsx}"],
darkMode: "class",
theme: {
zIndex: {
0: 0,
1: 1,
2: 2,
3: 3,
4: 4,
5: 5,
6: 6,
7: 7,
8: 8,
9: 9,
10: 10,
},
extend: {
colors: {
primary: "#8B5CF6",
accent: "#EC4899",
dark: "#1F2937",
info: "#3B82F6",
success: "#10B981",
danger: "#EF4444",
facebook: "#4267B2",
google: " #4285F4",
apple: "#555555",
},
maxWidth: {
"8xl": "88rem",
"9xl": "96rem",
"10xl": "104rem",
"1/4": "25%",
"1/2": "50%",
"3/4": "75%",
},
maxHeight: {
"1/4": "25%",
"1/2": "50%",
"3/4": "75%",
},
screens: {
"3xl": "1920px",
},
},
},
variants: {
extend: {
backgroundColor: ["active"],
margin: ["hover", "focus", "direction"],
padding: ["hover", "focus", "direction"],
inset: ["direction"],
},
},
plugins: [require("tailwindcss-rtl"), require("tailwindcss-dir")()],
};

[RonMelkhior]

https://play.tailwindcss.com/JFh3k86DqN?file=config

I can't reproduce it. If you can, I'll happily take a look :)