Fix app buttons clipping with app's content (#5316)

saleor · Dec 11, 2024 · 3c4462a · 3c4462a
1 parent 1480eac
commit 3c4462a
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 5 deletions.
diff --git a/.changeset/shiny-mice-unite.md b/.changeset/shiny-mice-unite.md
@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+App buttons no longer clip with app contents
diff --git a/src/components/AppLayout/TopNav/TopNavWrapper.tsx b/src/components/AppLayout/TopNav/TopNavWrapper.tsx
@@ -3,12 +3,13 @@ import React from "react";
 
 import { topBarHeight, topBarHeightSubtitle } from "../consts";
 
-export const TopNavWrapper: React.FC<{ withoutBorder?: boolean; hasSubtitle?: boolean }> = ({
-  children,
-  withoutBorder,
-  hasSubtitle,
-}) => (
+export const TopNavWrapper: React.FC<{
+  withoutBorder?: boolean;
+  hasSubtitle?: boolean;
+}> = ({ children, withoutBorder, hasSubtitle }) => (
   <Box
+    display={hasSubtitle ? "block" : "flex"}
+    alignItems="center"
     paddingX={6}
     paddingY={5}
     borderBottomWidth={withoutBorder ? 0 : 1}