fix(declaration-converters-mapping): fix border shorthands, improves border-width, and fixes border arbitrary values
Supports border shorthand when some of its values are missing (width, style, color)
Description of change
The way border shorthand was being converted, it was always expecting a perfect value, in order, and nothing missing: width style color. But sometimes border doesn't come with width, or style, or color - and it's still valid CSS. Or it could be on a completely different order, like color width style.
Example:
td {
border: solid rgba(148, 163, 184, 0.1);
}
was converting to:
td {
@apply border-[solid] border-[163,184,0.1)];
}
now converts to:
td {
@apply border-[solid] border-[rgba(148,163,184,0.1)];
}
Fixes #26
It now also properly handles border-width arbitrary value. It used to convert border-width: 4.5em to border-[4.5em] which is wrong (that is for border-color), now it converts to border-w-[4.5em] and it's quite smart and converts border-width: 1px 2px; to border-y border-x-2
Fixes +1: #25
This now also fixes #25 Sorry for the not so beautiful code - it was generated with AI Passes all tests though
But can be improved for sure