From 3110bae209406122e5371567ef66ce598a52bd47 Mon Sep 17 00:00:00 2001
From: Mohamed Boudra <boudra.moha@gmail.com>
Date: Sat, 4 Apr 2026 21:06:35 +0700
Subject: [PATCH] fix(website): stack header vertically on mobile to prevent
 overflow

---
 packages/website/src/components/site-header.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/website/src/components/site-header.tsx b/packages/website/src/components/site-header.tsx
index a3e2e1ce9..210b21cbd 100644
--- a/packages/website/src/components/site-header.tsx
+++ b/packages/website/src/components/site-header.tsx
@@ -2,12 +2,12 @@ import "~/styles.css";
 
 export function SiteHeader() {
   return (
-    <header className="flex items-center justify-between gap-4">
+    <header className="flex flex-col items-center gap-4 md:flex-row md:justify-between">
       <a href="/" className="flex items-center gap-3">
         <img src="/logo.svg" alt="Paseo" className="w-6 h-6" />
         <span className="text-lg font-medium">Paseo</span>
       </a>
-      <div className="flex items-center gap-4">
+      <div className="flex flex-wrap items-center justify-center gap-4">
         <a
           href="/blog"
           className="text-sm text-muted-foreground hover:text-foreground transition-colors"