eslint-plugin-tailwindcss icon indicating copy to clipboard operation
eslint-plugin-tailwindcss copied to clipboard

[BUG] bg-opacity/[value] doesn't work

Open dolanmiu opened this issue 2 years ago • 1 comments

Describe the bug bg-opacity/70 or any of its variants do not work:

Classname 'bg-opacity/70' is not a Tailwind CSS class!
eslint[tailwindcss/no-custom-classname](https://github.com/francoismassart/eslint-plugin-tailwindcss/tree/master/docs/rules/no-custom-classname.md)

image

The TailwindCSS 2 version works though, but it tells me to change it to bg-opacity/70! I am so confused. i don't know why its like this or why it's happening

Classname 'bg-opacity-70' should be replaced by an opacity suffix (eg. '/70')
eslint[tailwindcss/migration-from-tailwind-2](https://github.com/francoismassart/eslint-plugin-tailwindcss/tree/master/docs/rules/migration-from-tailwind-2.md)

image

To Reproduce Steps to reproduce the behavior:

  1. Use bg-opacity/70 in your html template of your choice
  2. Try using bg-opacity-70

dolanmiu avatar Jan 11 '23 21:01 dolanmiu

The message could be clearer. For your example using bg-black/70 and removing bg-opacity-70 should resolve the issue.

samdoidge avatar Dec 27 '23 23:12 samdoidge