From daad58ed3401566f95b9597ff359ec17bfd97d52 Mon Sep 17 00:00:00 2001
From: nijoe1 <nikolaos@gitcoin.co>
Date: Tue, 8 Apr 2025 19:00:49 +0300
Subject: [PATCH 1/2] feat: adds learn more btn in the staking banner

---
 .../StakingBannerAndModal.tsx                 | 23 ++++++++++++++++++-
 1 file changed, 22 insertions(+), 1 deletion(-)

diff --git a/packages/grant-explorer/src/features/round/ViewProjectDetails/components/StakingBannerAndModal/StakingBannerAndModal.tsx b/packages/grant-explorer/src/features/round/ViewProjectDetails/components/StakingBannerAndModal/StakingBannerAndModal.tsx
index 634811a7de..b1b6f6faf7 100644
--- a/packages/grant-explorer/src/features/round/ViewProjectDetails/components/StakingBannerAndModal/StakingBannerAndModal.tsx
+++ b/packages/grant-explorer/src/features/round/ViewProjectDetails/components/StakingBannerAndModal/StakingBannerAndModal.tsx
@@ -6,6 +6,8 @@ import { useIsStakable } from "./hooks/useIsStakable";
 import { useDonationPeriod } from "./hooks/useDonationPeriod";
 import { StakingButton } from "./StakingButton";
 import { StakingCountDownLabel } from "./StakingCountDownLabel";
+import { Button } from "../../../../collections/CollectionDetails";
+import { ArrowTopRightOnSquareIcon } from "@heroicons/react/20/solid";
 
 const STAKING_APP_URL = process.env.REACT_APP_STAKING_APP;
 
@@ -109,7 +111,26 @@ export const StakingBannerAndModal = ({
     return (
       <div className="mt-2 mb-6">
         <StakingBanner isRoundView={isRoundView}>
-          <StakingButton onClick={handleOpenModal} isRoundView={isRoundView} />
+          <div className="flex items-center gap-2">
+            <StakingButton
+              onClick={handleOpenModal}
+              isRoundView={isRoundView}
+            />
+            {isRoundView && (
+              <Button
+                onClick={() => {
+                  window.open(
+                    "https://dashboard.boost.explorer.gitcoin.co/about-explorer-boost",
+                    "_blank"
+                  );
+                }}
+                className="text-black text-sm font-mono font-medium px-4 py-2 leading-normal rounded-lg inline-flex justify-center items-center gap-2 bg-transparent hover:bg-transparent"
+              >
+                Learn more
+                <ArrowTopRightOnSquareIcon className="w-4 h-4" />
+              </Button>
+            )}
+          </div>
         </StakingBanner>
         <StakingModal
           isOpen={isOpen}

From daf3474aca773e4a9d0d4c475e061fea8ecc73cb Mon Sep 17 00:00:00 2001
From: nijoe1 <nikolaos@gitcoin.co>
Date: Tue, 8 Apr 2025 19:01:07 +0300
Subject: [PATCH 2/2] chore: staking-btn minor improvements

---
 .../components/StakingBannerAndModal/StakingButton.tsx          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/grant-explorer/src/features/round/ViewProjectDetails/components/StakingBannerAndModal/StakingButton.tsx b/packages/grant-explorer/src/features/round/ViewProjectDetails/components/StakingBannerAndModal/StakingButton.tsx
index 1c4faf22db..049461df82 100644
--- a/packages/grant-explorer/src/features/round/ViewProjectDetails/components/StakingBannerAndModal/StakingButton.tsx
+++ b/packages/grant-explorer/src/features/round/ViewProjectDetails/components/StakingBannerAndModal/StakingButton.tsx
@@ -14,7 +14,7 @@ export const StakingButton = ({
 }) => {
   return (
     <Button
-      className={`text-white max-h-[40px] font-mono whitespace-nowrap text-[14px]/[24px] ${isClaimPeriod ? "bg-[#5C35CC]" : "bg-[#22635A]"}`}
+      className={`text-white text-sm font-medium px-4 py-2 leading-normal rounded-lg inline-flex justify-center items-center gap-2 font-mono ${isClaimPeriod ? "bg-[#5C35CC]" : "bg-[#22635A]"}`}
       onClick={onClick}
     >
       {isClaimPeriod