From 5be5d8815e5153db82658ce96c7cf50d7172db1e Mon Sep 17 00:00:00 2001
From: Alireza <alireza@nwhco.ir>
Date: Tue, 25 Aug 2026 22:06:24 +0000
Subject: [PATCH] fix(ui): make top PageHeader sticky on new-match screen
 during scroll

---
 src/app/new-match/new-match-client.tsx | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/app/new-match/new-match-client.tsx b/src/app/new-match/new-match-client.tsx
index 428bd17..6b717f7 100644
--- a/src/app/new-match/new-match-client.tsx
+++ b/src/app/new-match/new-match-client.tsx
@@ -634,12 +634,14 @@ export default function NewMatchClient() {
       <>
         <PageBackground />
         <main
-          style={{
-            paddingTop: `${Math.max(12, top + 4)}px`,
-          }}
           className="-mx-[17px] flex min-h-dvh flex-col px-[18px] text-center"
         >
-          <div className="shrink-0 mb-1">
+          <div
+            style={{
+              paddingTop: `${Math.max(12, top + 4)}px`,
+            }}
+            className="sticky top-0 z-30 -mx-[18px] px-[18px] pb-2 bg-[#F7F1F0]/90 backdrop-blur-md"
+          >
             <PageHeader profile={profile} />
           </div>
 
@@ -721,12 +723,14 @@ export default function NewMatchClient() {
       <PageBackground />
 
       <main
-        style={{
-          paddingTop: `${Math.max(12, top + 4)}px`,
-        }}
         className="-mx-[17px] flex min-h-dvh flex-col px-[18px] text-center"
       >
-        <div className="shrink-0 mb-1">
+        <div
+          style={{
+            paddingTop: `${Math.max(12, top + 4)}px`,
+          }}
+          className="sticky top-0 z-30 -mx-[18px] px-[18px] pb-2 bg-[#F7F1F0]/90 backdrop-blur-md"
+        >
           <PageHeader profile={profile} />
         </div>