search

francoismassart / eslint-plugin-tailwindcss

ESLint plugin for Tailwind CSS usage
https://www.npmjs.com/package/eslint-plugin-tailwindcss
MIT License
1.47k stars 70 forks source link

[BUG] `[&>button]:bg-opacity-90` should be valid for `migration-from-tailwind-2` rule #333

Open nghiepdev opened 5 months ago

nghiepdev commented 5 months ago

Describe the bug The code below is currently displaying a warning

Classname '[&>button]:bg-opacity-90' should be replaced by an opacity suffix (eg. '/90')

      <div className="[&>button]:bg-opacity-90">
        <button className="bg-green-400">Login</button>
        <button className="bg-red-500">Register</button>
      </div>

Expected behvior Rule migration-from-tailwind-2 should be valid for child selector: [&>], [&_]

Screenshots

image
kachkaev commented 5 months ago

Rule migration-from-tailwind-2 should be valid for child selector: [&>], [&_]

Why do you think so? I’d suggest that this code should be refactored to:

      <div>
        <button className="bg-green-400/90">Login</button>
        <button className="bg-red-500/90">Register</button>
      </div>