thibaudcolas / tailwindcss-vanilla-rtl

Simple right-to-left (RTL) language support, switching vanilla Tailwind utilities to CSS logical properties and values.

Home Page:https://thibaudcolas.github.io/tailwindcss-vanilla-rtl/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Border opacity not working

vltansky opened this issue · comments

image

Commenting out borderOpacity fixes it. Probably cause plugins are added after the core plugins, so the opacity class is overridden by the default value. There is a possibility for similar bugs in other properties.
image
image

Nice catch @vltansky! I’ll work on a fix. This could indeed affect other properties – any that’s set by multiple plugins, where the CSS source order would be different between core plugins vs. this plugin.

Here are the properties I found used in multiple plugins:

  • margin – used by margin and space core plugins. Shouldn’t cause issues since we’re overriding both.
  • margin – this time used by sr-only and container. Shouldn’t cause issues because sr-only is before margin even in the corePlugins, and container is a component (so output after all utilities)
  • padding – also used in sr-only and container. Also wouldn’t expect issues.
  • border width – use by borderWidth and divideWidth. Same, shouldn’t cause issues since we’re overriding both.
  • --tw-border-opacity – what this issue is about. Used by borderOpacity and borderColor
  • --tw-border-opacity is also used inside the visited: variant of the pseudoClassVariants plugin. No idea whether that might cause issues, I suspect not but won’t check for now.

I’ll also update the docs to specify vanillaRTL should be the first entry inside the plugins array, as this would also be an issue if third-party plugins that produce utilities using the same properties were placed earlier in the plugins.