fix css parsing with space seperated values

fishnet-macros/src/css/parse.rs

@@ -133,17 +133,30 @@ impl Parser {
 
         let mut value = String::new();
         let mut maybe_triple_quote = false;
+        let mut add_space = true;
+
         loop {
             match self.peek() {
                 Some(TokenTree::Punct(ref punct)) => match punct.as_char() {
-                    ';' => break,
+                    ';' => {
+                        if value.ends_with(' ') {
+                            value.pop();
+                        }
+                        break;
+                    }
                     '{' | '}' => {
                         return None;
                     }
                     ':' | '&' => {
                         abort!(punct.span(), "unexpected token");
                     }
-                    _ => value.push(punct.as_char()),
+                    _ => {
+                        if value.ends_with(' ') {
+                            value.pop();
+                        }
+                        add_space = false;
+                        value.push(punct.as_char())
+                    }
                 },
                 Some(TokenTree::Literal(ref lit)) => {
                     let lit = lit.to_string();
@@ -152,6 +165,7 @@ impl Parser {
                         maybe_triple_quote = false;
                     } else if lit == "\"\"" {
                         // triple quoted string incoming? if yes fully escape it
+                        add_space = false;
                         maybe_triple_quote = true;
                         lit = "";
                     } else if lit.starts_with("\"#")
@@ -168,13 +182,21 @@ impl Parser {
                 Some(TokenTree::Group(ref group))
                     if group.delimiter() == Delimiter::Parenthesis =>
                 {
+                    if value.ends_with(' ') {
+                        value.pop();
+                    }
                     value.push('(');
                     value.push_str(&group.stream().to_string());
                     value.push(')');
                 }
                 Some(token) => abort!(token.span(), "unexpected token"),
                 None => abort_call_site!("unexpected end of input"),
             }
+            if add_space {
+                value.push(' ');
+            }
+            add_space = true;
+
             self.advance();
         }
 

fishnet/src/lib.rs

@@ -284,7 +284,7 @@ pub mod js;
 /// all selectors are relative to the root class used while rendering the resulting [`StyleFragment`](crate::css::StyleFragment). therefore `> div` will only select its direct children that are `div`s
 /// and `*` will select all children of the root class
 ///
-/// ### the issue with em, ex and color hex values
+/// ### the issue with `em`, `ex` and color hex values
 /// due to the way rust syntax works, everytime you have a number followed by the letter `e`
 /// (e.g. `#2effff`, `1em`, ...), it will be interpreted as an exponential number and result in a
 /// compile error. in these special cases you can use a string literal and it will be automatically
@@ -307,7 +307,7 @@ pub mod js;
 ///```
 ///
 /// ### double class selectors and other special cases
-/// in special cases like `.root-class.other-class` (e.g. both classes on the same element), cou
+/// in special cases like `.root-class.other-class` (e.g. both classes on the same element), you
 /// can refer to the root class using `&`:
 /// ```css
 /// css! {

fishnet/tests/test_css.rs

@@ -379,3 +379,19 @@ fn test_units_math() {
         ",
     )
 }
+
+#[test]
+fn test_border() {
+    test_match(
+        css! {
+            border-radius: 3rem 0 0 3rem;
+            border-right: 1px solid var(--fg-color);
+        },
+        r"
+        .component {
+            border-radius: 3rem 0 0 3rem;
+            border-right: 1px solid var(--fg-color);
+        }
+        ",
+    )
+}