add auto-compounder button, fix squid-router link (#2397)

KlimaDAO · Nov 22, 2024 · 059f2d9 · 059f2d9
1 parent 06e9973
commit 059f2d9
Show file tree

Hide file tree

Showing 7 changed files with 2,303 additions and 1,845 deletions.
diff --git a/app/components/NavMenu/index.tsx b/app/components/NavMenu/index.tsx
@@ -219,20 +219,29 @@ export const NavMenu: FC<Props> = (props) => {
         </div>
       )}
       <div className="navFooter">
+        <div className="hr" />
+        <div className="base-title">
+          <BaseLogo className={styles.baseIcon} />
+          <Text t="h5">Base Network</Text>
+        </div>
         <div className={styles.baseButtons}>
           <ButtonPrimary
             target="_blank"
             href={SQUID_ROUTER_URL}
             className={styles.baseButton}
-            icon={<BaseLogo className={styles.baseIcon} />}
-            label={<Trans>Bridge to Base</Trans>}
+            label={<Trans>Bridge</Trans>}
           />
           <ButtonPrimary
             target="_blank"
             href="https://base.klimadao.finance"
             className={styles.baseButton}
-            icon={<BaseLogo className={styles.baseIcon} />}
-            label={<Trans>Retire on Base</Trans>}
+            label={<Trans>Retire</Trans>}
+          />
+          <ButtonPrimary
+            target="_blank"
+            href="https://base.klimadao.finance/auto-compounder"
+            className={styles.baseButton}
+            label={<Trans>Autocompounder</Trans>}
           />
         </div>
         <div className="hr" />

diff --git a/app/components/NavMenu/styles.ts b/app/components/NavMenu/styles.ts
@@ -66,6 +66,12 @@ export const container = css`
     grid-column: 1 / 4;
   }
 
+  .navFooter .base-title {
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+  }
+
   .domain-wrapper {
     display: flex;
     align-items: center;
@@ -123,11 +129,10 @@ export const container = css`
 `;
 
 export const baseButtons = css`
-  gap: 1.6rem;
+  gap: 0.8rem;
   display: flex;
   flex-direction: column;
   justify-content: center;
-  margin-top: 2.4rem;
 `;
 
 export const baseButton = css`
@@ -137,8 +142,8 @@ export const baseButton = css`
 `;
 
 export const baseIcon = css`
-  width: 3rem;
-  height: 3rem;
+  width: 2rem;
+  height: 2rem;
 `;
 
 export const sidebarButton = css`

diff --git a/app/lib/constants.ts b/app/lib/constants.ts
@@ -63,7 +63,7 @@ export const DEFAULT_NETWORK = config.networks[ENVIRONMENT] as
   | "mainnet";
 
 export const SQUID_ROUTER_URL =
-  "https://v2.app.squidrouter.com/?chains=137%2C8453&tokens=0x4e78011Ce80ee02d2c3e649Fb657E45898257815%2C0xDCEFd8C8fCc492630B943ABcaB3429F12Ea9Fea2";
+  "https://app.squidrouter.com/?chains=137%2C8453&tokens=0x4e78011ce80ee02d2c3e649fb657e45898257815%2C0xdcefd8c8fcc492630b943abcab3429f12ea9fea2";
 
 /** Exposed via env vars, this is an infura id to be used in the browser, in getStaticProvider, as a fallback for polygon-rpc */
 export const CLIENT_INFURA_ID = process.env.NEXT_PUBLIC_CLIENT_INFURA_ID;