fix(Box): set margin-inline correctly

einride · May 5, 2023 · b27bd45 · b27bd45
1 parent efb5180
commit b27bd45
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 2 deletions.
diff --git a/.changeset/fresh-camels-shop.md b/.changeset/fresh-camels-shop.md
@@ -0,0 +1,5 @@
+---
+"@einride/ui": patch
+---
+
+Box: Set margin-inline correctly.
diff --git a/packages/einride-ui/src/components/layout/Box/Box.stories.tsx b/packages/einride-ui/src/components/layout/Box/Box.stories.tsx
@@ -13,6 +13,7 @@ export const Basic = {
     background: "tertiary",
     borderRadius: "lg",
     height: 10,
+    marginInline: "sm",
     width: 10,
   },
 } satisfies Story

diff --git a/packages/einride-ui/src/components/layout/Box/Box.tsx b/packages/einride-ui/src/components/layout/Box/Box.tsx
@@ -281,8 +281,7 @@ const Wrapper = styled("div", {
   margin-block-start: ${({ marginBlockStart, theme }) =>
     marginBlockStart && getSpacing(marginBlockStart, theme)};
   margin-bottom: ${({ marginBottom, theme }) => marginBottom && getSpacing(marginBottom, theme)};
-  margin-inline-end: ${({ marginInline, theme }) =>
-    marginInline && getSpacing(marginInline, theme)};
+  margin-inline: ${({ marginInline, theme }) => marginInline && getSpacing(marginInline, theme)};
   margin-inline-end: ${({ marginInlineEnd, theme }) =>
     marginInlineEnd && getSpacing(marginInlineEnd, theme)};
   margin-inline-start: ${({ marginInlineStart, theme }) =>