scroll button fix

app/tournois/page.tsx

@@ -41,7 +41,7 @@ export default async function Tournaments() {
         <div className="">
           <TournamentMap tournamentData={JSON.parse(tournamentData)} />
         </div>
-        <div className="bg-white dark:bg-gray-800 lg:overflow-y-auto">
+        <div className="relative bg-white dark:bg-gray-800 lg:overflow-y-auto">
           <TournamentTable tournamentData={JSON.parse(tournamentData)} />
         </div>
       </main>

components/ScrollToTopButton.tsx

@@ -11,7 +11,7 @@ const ScrollToTopButton = ({ isLgScreen }: { isLgScreen: boolean }) => {
 
   const scrollToTopButtonClass = isLgScreen
     ? "absolute bottom-0 right-3 p-10"
-    : "sticky top-20";
+    : "fixed top-20 right-3";
 
   return (
     <button

components/TournamentTable.tsx

@@ -76,11 +76,15 @@ export default function TournamentTable({
       className="tournament-table w-full grid auto-rows-max pb-20 lg:h-[calc(100vh-174px)] lg:col-start-2 lg:col-end-3 lg:overflow-y-scroll"
       id="tournament-table"
     >
-      <SearchBar
+      <div className="flex z-10">
-        tournamentFilter={searchQuery}
+        <SearchBar
-        setTournamentFilter={setSearchQuery}
+          tournamentFilter={searchQuery}
-      />
+          setTournamentFilter={setSearchQuery}
-      <ScrollToTopButton isLgScreen={isLgScreen} />
+        />
+        <div>
+          <ScrollToTopButton isLgScreen={isLgScreen} />
+        </div>
+      </div>
       <table
         className="relative table-fixed w-full text-center text-xs"
         data-cy="tournament-table"