zachdaniel / tails

Utilities for working with tailwind classes, like semantic merge, and conditional class lists.
MIT License
81 stars 9 forks source link

Border classes that are specific to one or more sides override one another #16

Closed TrevorHinesley closed 7 months ago

TrevorHinesley commented 7 months ago

Describe the bug Similar to the bug fixed in https://github.com/zachdaniel/tails/issues/13, border-b-*, border-t-*, border-l-*, and border-r-* override one another, but they shouldn't. Same with border-x-* and border-y-*.

To Reproduce Tests here and here

On any element:

<div class={Tails.classes(["border-l-4 border-b-4"])}></div>

The rendered element:

<div class="border-b-4"></div>

Expected behavior I expect the rendered element to maintain non-competing classes, like so:

<div class="border-l-4 border-b-4"></div>