fix: border bug

Author: hymhub

npm/CssToTailwindTranslator.ts

@@ -455,18 +455,14 @@ const propertyMap: Map<string, Record<string, string> | ((val: string) => string
     'border',
     val => {
       val = val.replace(/\(.+?\)/, v => v.replace(/\s/g, ''))
-      const vals: string = val.split(' ').filter(v => v !== '').map(v => (isUnit(v) || isColor(v)) ? ({ 'transparent': 'border-transparent', 'currentColor': 'border-current', 'currentcolor': 'border-current' }[val] ?? `border-[${v}]`) : ((propertyMap.get('border-style') as Record<string, string>)[v] ?? '')).filter(v => v !== '').join(' ')
+      const vals: string = val.split(' ').filter(v => v !== '').map(v => (isUnit(v) || isColor(v)) ? ({ 'transparent': 'border-transparent', 'currentColor': 'border-current', 'currentcolor': 'border-current' }[val] ?? (propertyMap.get('border-style') as Record<string, string>)[v] ?? `border-[${v}]`) : ((propertyMap.get('border-style') as Record<string, string>)[v] ?? '')).filter(v => v !== '').join(' ')
       return vals
     }
   ],
   [
     'border-bottom',
     val => {
-      if (isUnit(val)) {
-        return `border-b-[${getCustomVal(val)}]`
-      } else {
-        return `[border-bottom:${getCustomVal(val)}]`
-      }
+      return `[border-bottom:${getCustomVal(val)}]`
     }
   ],
   [
@@ -528,11 +524,7 @@ const propertyMap: Map<string, Record<string, string> | ((val: string) => string
   [
     'border-left',
     val => {
-      if (isUnit(val)) {
-        return `border-l-[${getCustomVal(val)}]`
-      } else {
-        return `[border-left:${getCustomVal(val)}]`
-      }
+      return `[border-left:${getCustomVal(val)}]`
     }
   ],
   [
@@ -577,11 +569,7 @@ const propertyMap: Map<string, Record<string, string> | ((val: string) => string
   [
     'border-right',
     val => {
-      if (isUnit(val)) {
-        return `border-r-[${getCustomVal(val)}]`
-      } else {
-        return `[border-right:${getCustomVal(val)}]`
-      }
+      return `[border-right:${getCustomVal(val)}]`
     }
   ],
   [
@@ -609,11 +597,7 @@ const propertyMap: Map<string, Record<string, string> | ((val: string) => string
   [
     'border-top',
     val => {
-      if (isUnit(val)) {
-        return `border-t-[${getCustomVal(val)}]`
-      } else {
-        return `[border-top:${getCustomVal(val)}]`
-      }
+      return `[border-top:${getCustomVal(val)}]`
     }
   ],
   [

npm/package.json

@@ -1,6 +1,6 @@
 {
   "name": "css-to-tailwind-translator",
-  "version": "1.2.6",
+  "version": "1.2.8",
   "description": "Convert CSS code to Tailwindcss syntax in real time",
   "scripts": {},
   "repository": {
@@ -42,4 +42,4 @@
     "css-to-tailwind-translator",
     "convert css code to tailwindcss"
   ]
-}
+}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "css-to-tailwind",
-  "version": "1.2.6",
+  "version": "1.2.8",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -15,7 +15,7 @@
     "@monaco-editor/react": "^4.4.6",
     "clipboard": "^2.0.11",
     "clsx": "^1.2.1",
-    "css-to-tailwind-translator": "^1.2.6",
+    "css-to-tailwind-translator": "^1.2.8",
     "next": "13.2.4",
     "react": "18.2.0",
     "react-dom": "18.2.0",
@@ -41,4 +41,4 @@
     "tailwindcss": "^3.2.7",
     "typescript": "5.0.2"
   }
-}
+}