Merge pull request #2462 from graphcommerce-org/fix/fix-category-chil…

…dren-layout fix issue where CategoryChildren would cause layout to break on mobile
graphcommerce-org · Dec 20, 2024 · 3bb93cd · 3bb93cd
2 parents dc9a3c5 + 6031bba
commit 3bb93cd
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/.changeset/happy-melons-train.md b/.changeset/happy-melons-train.md
@@ -0,0 +1,5 @@
+---
+"@graphcommerce/magento-category": patch
+---
+
+fix issue where CategoryChildren would cause layout to break on mobile
diff --git a/packages/magento-category/components/CategoryChildren/CategoryChildren.tsx b/packages/magento-category/components/CategoryChildren/CategoryChildren.tsx
@@ -38,7 +38,10 @@ export function CategoryChildren(props: CategoryChildrenProps) {
     <ScrollerProvider scrollSnapAlign='none'>
       <Box
         className={classes.container}
-        sx={[{ display: 'flex' }, ...(Array.isArray(sx) ? sx : [sx])]}
+        sx={[
+          { display: 'flex', width: '100%', overflow: 'hidden' },
+          ...(Array.isArray(sx) ? sx : [sx]),
+        ]}
       >
         <Scroller
           className={classes.scroller}