Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Wrong arbitrary values for border shorthand #25

Open
guivr opened this issue Sep 16, 2024 · 0 comments
Open

Wrong arbitrary values for border shorthand #25

guivr opened this issue Sep 16, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@guivr
Copy link

guivr commented Sep 16, 2024

Current Behavior

a {
  border-width: 1px 0;
}

Converts to:

a {
  @apply border-[1px_0];
}

Expected Behavior

It should convert to:

a {
  @apply border-y;
}

Things get more complicated if you do

a {
  border-width: 1px 0 3px;
}

then it should be

a {
 @apply border-t border-b-[3px];
}

It's currently using border-[] for arbitrary values but that's for border-color, not for border-width.

In the case above, where border-bottom-width has an arbitrary value of 3px, it should convert to border-b-[3px]

There are many other edge cases on that, like border-width: 1px 2px; which would be border-y border-x-2. Amazing if everything can be converted nicely, but if not, then it should remain unconverted.

@guivr guivr added the bug Something isn't working label Sep 16, 2024
guivr added a commit to guivr/css-to-tailwindcss that referenced this issue Sep 16, 2024
…der shorthand

Now arbitrary values for border shorthand works correctly. Previously, everything was using
border-[] prefix, but that is only correct for border-color arbitrary values.

fix Jackardios#25
guivr added a commit to guivr/css-to-tailwindcss that referenced this issue Sep 17, 2024
…when 4 values are declared"

Now if X and Y values are the same, even if border-width had 4 values declared, it uses X and Y
instead of using 4 different classes (2 vs 4)

fix Jackardios#25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant