fix(patterns): adjust flex layout for header

bigcommerce · Sep 12, 2024 · eef4d38 · eef4d38
1 parent 66bc0c8
commit eef4d38
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/.changeset/gentle-goats-cheer.md b/.changeset/gentle-goats-cheer.md
@@ -0,0 +1,5 @@
+---
+'@bigcommerce/big-design-patterns': patch
+---
+
+Fix header wrapping on smaller screens
diff --git a/packages/big-design-patterns/src/components/Header/Header.tsx b/packages/big-design-patterns/src/components/Header/Header.tsx
@@ -132,7 +132,7 @@ export const Header = ({
   title,
 }: HeaderProps) => {
   return (
-    <Flex as="header" flexDirection={{ mobile: 'column', tablet: 'row' }} flexWrap="wrap">
+    <Flex as="header" flexDirection="row" flexWrap="wrap">
       {backLink && (
         <FlexItem flexBasis="100%">
           <BackLink {...backLink} />