feat: stack PageHeader vertically on mobile

2026-03-12 00:28:26 +01:00
parent a75642bc7f
commit 44dc7d128b
1 changed files with 7 additions and 1 deletions
--- 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}