From 834d85a959e106ecd27584867d7ae0ea5b0bb7f2 Mon Sep 17 00:00:00 2001
From: zho <medenicablazo@gmail.com>
Date: Sat, 24 Aug 2024 11:06:29 +0200
Subject: [PATCH] enhancement: add rewards at the top for mobile in contest
 page (#2199)

---
 .../Contest/components/RewardsInfo/index.tsx      |  7 +------
 .../layouts/LayoutViewContest/index.tsx           | 15 ++++++++++-----
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/react-app-revamp/components/_pages/Contest/components/RewardsInfo/index.tsx b/packages/react-app-revamp/components/_pages/Contest/components/RewardsInfo/index.tsx
index 18256ba97..2130c577c 100644
--- a/packages/react-app-revamp/components/_pages/Contest/components/RewardsInfo/index.tsx
+++ b/packages/react-app-revamp/components/_pages/Contest/components/RewardsInfo/index.tsx
@@ -142,12 +142,7 @@ const ContestRewardsInfo: FC<ContestRewardsInfoProps> = ({ rewardsModuleAddress,
               {formatBalance(currentUnpaidToken.tokenBalance)} $
               <span className="uppercase mr-1 truncate inline-block overflow-hidden">{currentUnpaidSymbol}</span>
             </div>
-
-            {!isMobile ? (
-              <>
-                to {payees.length} {payees.length > 1 ? "winners" : "winner"}
-              </>
-            ) : null}
+            to {payees.length} {payees.length > 1 ? "winners" : "winner"}
           </span>
         </div>
       ) : currentPaidToken ? (
diff --git a/packages/react-app-revamp/layouts/LayoutViewContest/index.tsx b/packages/react-app-revamp/layouts/LayoutViewContest/index.tsx
index 09723fa52..2a96da63e 100644
--- a/packages/react-app-revamp/layouts/LayoutViewContest/index.tsx
+++ b/packages/react-app-revamp/layouts/LayoutViewContest/index.tsx
@@ -202,17 +202,22 @@ const LayoutViewContest = ({ children }: { children: React.ReactNode }) => {
                 )}
                 <div className="animate-reveal pt-3 md:pt-0">
                   <div className="flex flex-col mt-6 md:mt-10 gap-4">
-                    <ContestName contestName={contestName} address={address} chainName={chainName} />
+                    <div className="flex flex-col gap-2">
+                      {isMobile && rewardsModuleAddress && rewardsAbi ? (
+                        <div className="w-2/3">
+                          <ContestRewardsInfo rewardsModuleAddress={rewardsModuleAddress} rewardsAbi={rewardsAbi} />
+                        </div>
+                      ) : null}
+                      <ContestName contestName={contestName} address={address} chainName={chainName} />
+                    </div>
 
-                    <div
-                      className={`flex flex-row ${rewardsModuleAddress && rewardsAbi ? "justify-between" : "gap-3"} md:justify-normal md:gap-4 items-center`}
-                    >
+                    <div className={`flex flex-row gap-3 md:gap-4 items-center`}>
                       <UserProfileDisplay
                         ethereumAddress={contestAuthorEthereumAddress}
                         shortenOnFallback
                         textualVersion={isMobile}
                       />
-                      {rewardsModuleAddress && rewardsAbi ? (
+                      {!isMobile && rewardsModuleAddress && rewardsAbi ? (
                         <ContestRewardsInfo rewardsModuleAddress={rewardsModuleAddress} rewardsAbi={rewardsAbi} />
                       ) : null}
                       {isMobile ? (