You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
This is especially problematic if you minimize your CSS in the build step, because the minimization will turn the three separate border rules into a single rule:
border: 0 solid 'currentColor';
The invalid color value makes the whole rule invalid which can lead to elements suddenly having borders even though you don't expect them to (this is how I found the issue ;)).
The text was updated successfully, but these errors were encountered:
edda
added a commit
to sapcc/juno
that referenced
this issue
Jan 24, 2022
This is because using the closure to access the theme function currently
causes the base style for border to be invalid. See here:
tailwindlabs/tailwindcss#7186
What version of Tailwind CSS are you using?
v3.0.14
What browser are you using?
Chrome
What operating system are you using?
macOS
Reproduction URL
https://play.tailwindcss.com/adavrUyj2z?file=config
Describe your issue
When using a closure to access the theme function inside the
backgroundColor
section in thetailwind.config.js
like so:or even without accessing theme:
the base style border-color (https://github.com/tailwindlabs/tailwindcss/blob/master/src/css/preflight.css#L12) comes out as:
which is ignored by the browser because it is an invalid value. Without the closure it is:
This is especially problematic if you minimize your CSS in the build step, because the minimization will turn the three separate border rules into a single rule:
The invalid color value makes the whole rule invalid which can lead to elements suddenly having borders even though you don't expect them to (this is how I found the issue ;)).
The text was updated successfully, but these errors were encountered: