From 44dc7d128bd908efbde6818e8ecdb8bec5c527d3 Mon Sep 17 00:00:00 2001
From: fuomag9 <1580624+fuomag9@users.noreply.github.com>
Date: Thu, 12 Mar 2026 00:28:26 +0100
Subject: [PATCH] feat: stack PageHeader vertically on mobile

---
 src/components/ui/PageHeader.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/components/ui/PageHeader.tsx b/src/components/ui/PageHeader.tsx
index 35330f21..f072d2e3 100644
--- a/src/components/ui/PageHeader.tsx
+++ b/src/components/ui/PageHeader.tsx
@@ -15,7 +15,13 @@ type PageHeaderProps = {
 
 export function PageHeader({ title, description, action }: PageHeaderProps) {
     return (
-        <Stack direction="row" justifyContent="space-between" alignItems="flex-start" spacing={2} sx={{ mb: 4 }}>
+        <Stack
+            direction={{ xs: "column", sm: "row" }}
+            justifyContent="space-between"
+            alignItems={{ xs: "flex-start", sm: "flex-start" }}
+            spacing={2}
+            sx={{ mb: 4 }}
+        >
             <Stack spacing={1}>
                 <Typography variant="h4" color="text.primary">
                     {title}