feat: 支持border-left/right/bottom/top 4个方向的变量处理

Author: heiazu

__test__/fixure/pesudo.scss

@@ -1,21 +1,3 @@
 .hello {
-    height: 100px;
-    width: 50%;
-    flex-direction: column;
-    flex-grow: 1;
-    color: #00f;
+    border-left: 10px solid var(--aa-color);
 }
-
-.child {
-    background-size: contain;
-    background-image: linear-gradient(to bottom, #f00, #00f 10%, #0f0);
-}
-
-@media screen and (max-width: 100px) {
-    .hello {
-        height: 200px;
-        width: 100%;
-        color: #f00;
-        background-image: radial-gradient(circle, #f00, #00f 10%, #0f0);
-    }
-}

__test__/fixure/style.bin

@@ -114,6 +114,10 @@ pub enum CSSPropertyType {
   AnimationPlayState = 109,
   Animation = 110,
   Filter = 111,
+  BorderTop = 112,
+  BorderRight = 113,
+  BorderBottom = 114,
+  BorderLeft = 115,
   // ...
   All = 99999,       // used for transition-property
 }
@@ -229,6 +233,10 @@ pub fn string_to_css_property_type(property: &str) -> CSSPropertyType {
     "gap" => CSSPropertyType::Gap,
     "borderStyle" => CSSPropertyType::BorderStyle,
     "filter" => CSSPropertyType::Filter,
+    "borderTop" => CSSPropertyType::BorderTop,
+    "borderRight" => CSSPropertyType::BorderRight,
+    "borderBottom" => CSSPropertyType::BorderBottom,
+    "borderLeft" => CSSPropertyType::BorderLeft,
     // E 复合属性，仅用作css变量的解析 ====
     _ => CSSPropertyType::Invalid,
   }