fix: fix #1080 doing a wrong calc() (#1081)

Author: te6-in

packages/css/all.css

@@ -115,10 +115,10 @@
   padding-bottom: var(--seed-box-padding-bottom);
   padding-left: var(--seed-box-padding-left);
   padding-right: var(--seed-box-padding-right);
-  --seed-box-bleed-bottom: 0;
-  --seed-box-bleed-top: 0;
-  --seed-box-bleed-left: 0;
-  --seed-box-bleed-right: 0;
+  --seed-box-bleed-bottom: 0px;
+  --seed-box-bleed-top: 0px;
+  --seed-box-bleed-left: 0px;
+  --seed-box-bleed-right: 0px;
   margin-top: calc(var(--seed-box-bleed-top) * -1);
   margin-bottom: calc(var(--seed-box-bleed-bottom) * -1);
   margin-left: calc(var(--seed-box-bleed-left) * -1);
@@ -723,10 +723,10 @@
   padding-bottom: var(--seed-box-padding-bottom);
   padding-left: var(--seed-box-padding-left);
   padding-right: var(--seed-box-padding-right);
-  --seed-box-bleed-bottom: 0;
-  --seed-box-bleed-top: 0;
-  --seed-box-bleed-left: 0;
-  --seed-box-bleed-right: 0;
+  --seed-box-bleed-bottom: 0px;
+  --seed-box-bleed-top: 0px;
+  --seed-box-bleed-left: 0px;
+  --seed-box-bleed-right: 0px;
   margin-top: calc(var(--seed-box-bleed-top) * -1);
   margin-bottom: calc(var(--seed-box-bleed-bottom) * -1);
   margin-left: calc(var(--seed-box-bleed-left) * -1);

packages/css/all.min.css

@@ -115,10 +115,10 @@
   padding-bottom: var(--seed-box-padding-bottom);
   padding-left: var(--seed-box-padding-left);
   padding-right: var(--seed-box-padding-right);
-  --seed-box-bleed-bottom: 0;
-  --seed-box-bleed-top: 0;
-  --seed-box-bleed-left: 0;
-  --seed-box-bleed-right: 0;
+  --seed-box-bleed-bottom: 0px;
+  --seed-box-bleed-top: 0px;
+  --seed-box-bleed-left: 0px;
+  --seed-box-bleed-right: 0px;
   margin-top: calc(var(--seed-box-bleed-top) * -1);
   margin-bottom: calc(var(--seed-box-bleed-bottom) * -1);
   margin-left: calc(var(--seed-box-bleed-left) * -1);

packages/css/base.css

@@ -26,10 +26,10 @@
     padding-bottom: var(--seed-box-padding-bottom);
     padding-left: var(--seed-box-padding-left);
     padding-right: var(--seed-box-padding-right);
-    --seed-box-bleed-bottom: 0;
-    --seed-box-bleed-top: 0;
-    --seed-box-bleed-left: 0;
-    --seed-box-bleed-right: 0;
+    --seed-box-bleed-bottom: 0px;
+    --seed-box-bleed-top: 0px;
+    --seed-box-bleed-left: 0px;
+    --seed-box-bleed-right: 0px;
     margin-top: calc(var(--seed-box-bleed-top) * -1);
     margin-bottom: calc(var(--seed-box-bleed-bottom) * -1);
     margin-left: calc(var(--seed-box-bleed-left) * -1);

packages/css/base.min.css

@@ -123,10 +123,10 @@ export const globalCss = defineGlobalCss({
     paddingLeft: "var(--seed-box-padding-left)",
     paddingRight: "var(--seed-box-padding-right)",
 
-    "--seed-box-bleed-bottom": "0",
-    "--seed-box-bleed-top": "0",
-    "--seed-box-bleed-left": "0",
-    "--seed-box-bleed-right": "0",
+    "--seed-box-bleed-bottom": "0px",
+    "--seed-box-bleed-top": "0px",
+    "--seed-box-bleed-left": "0px",
+    "--seed-box-bleed-right": "0px",
     marginTop: "calc(var(--seed-box-bleed-top) * -1)",
     marginBottom: "calc(var(--seed-box-bleed-bottom) * -1)",
     marginLeft: "calc(var(--seed-box-bleed-left) * -1)",

packages/css/recipes/action-button.css

@@ -38,10 +38,10 @@ const actionButton = defineRecipe({
     paddingLeft: "var(--seed-box-padding-left)",
     paddingRight: "var(--seed-box-padding-right)",
 
-    "--seed-box-bleed-bottom": "0",
-    "--seed-box-bleed-top": "0",
-    "--seed-box-bleed-left": "0",
-    "--seed-box-bleed-right": "0",
+    "--seed-box-bleed-bottom": "0px",
+    "--seed-box-bleed-top": "0px",
+    "--seed-box-bleed-left": "0px",
+    "--seed-box-bleed-right": "0px",
     marginTop: "calc(var(--seed-box-bleed-top) * -1)",
     marginBottom: "calc(var(--seed-box-bleed-bottom) * -1)",
     marginLeft: "calc(var(--seed-box-bleed-left) * -1)",