From 0a728b50d51304b2736a839dfe291f35f03b3496 Mon Sep 17 00:00:00 2001
From: Anil Kumar Rai <anilrai@outlook.com>
Date: Thu, 8 Sep 2022 20:11:15 +0530
Subject: [PATCH 1/2] fixed apymodal alignment issue for mobile

---
 .../VaultApyBreakdownItem/index.tsx           |  13 +-
 .../VaultApyInformation/index.tsx             |   7 +-
 src/tests/__snapshots__/Landing.test.tsx.snap | 742 +++++++++---------
 .../VaultListDisplay.test.tsx.snap            | 192 ++---
 4 files changed, 482 insertions(+), 472 deletions(-)

diff --git a/src/components-v2/VaultApyBreakdownItem/index.tsx b/src/components-v2/VaultApyBreakdownItem/index.tsx
index 653c2cf14..ef1ff62f4 100644
--- a/src/components-v2/VaultApyBreakdownItem/index.tsx
+++ b/src/components-v2/VaultApyBreakdownItem/index.tsx
@@ -1,5 +1,5 @@
 import { VaultDTO } from '@badger-dao/sdk';
-import { Box, Grid, Link, makeStyles, Typography } from '@material-ui/core';
+import { Box, Grid, Link, makeStyles, Theme, Typography } from '@material-ui/core';
 import TokenLogo from 'components-v2/TokenLogo';
 import { YieldValueSource } from 'components-v2/VaultApyInformation';
 import { getYieldBearingVaultBySourceName } from 'components-v2/YieldBearingVaults/YieldBearingVaultUtil';
@@ -16,7 +16,7 @@ import routes from '../../config/routes';
 import { useVaultInformation } from '../../hooks/useVaultInformation';
 import { numberWithCommas } from '../../mobx/utils/helpers';
 
-const useStyles = makeStyles({
+const useStyles = makeStyles((theme: Theme) => ({
   apyBreakdownIcon: {
     marginRight: 8,
   },
@@ -39,7 +39,12 @@ const useStyles = makeStyles({
     },
   },
   earnedAs: { color: 'rgba(255,255,255,0.6)' },
-});
+  yieldSourceRow: {
+    [theme.breakpoints.down('sm')]: {
+      flexWrap: 'wrap',
+    },
+  },
+}));
 
 interface Props {
   vault: VaultDTO;
@@ -100,7 +105,7 @@ const VaultApyBreakdownItem = ({ vault, source }: Props): JSX.Element => {
       <>
         <Grid container className={classes.totalVaultRewardsRow}>
           <Grid item xs={9}>
-            <Box display="flex" alignItems="center">
+            <Box display="flex" alignItems="center" className={classes.yieldSourceRow}>
               <TokenLogo
                 width="24"
                 height="24"
diff --git a/src/components-v2/VaultApyInformation/index.tsx b/src/components-v2/VaultApyInformation/index.tsx
index c7cec3dfa..02e93a791 100644
--- a/src/components-v2/VaultApyInformation/index.tsx
+++ b/src/components-v2/VaultApyInformation/index.tsx
@@ -100,6 +100,11 @@ const useStyles = makeStyles((theme) => ({
     marginTop: 20,
     borderRadius: 10,
   },
+  yieldSourceRow: {
+    [theme.breakpoints.down('sm')]: {
+      flexWrap: 'wrap',
+    },
+  },
 }));
 
 interface Props {
@@ -334,7 +339,7 @@ const VaultApyInformation = ({ open, onClose, boost, vault, projectedBoost }: Pr
                   <Divider className={classes.totalVaultRewardsDivider} />
                   <Grid container className={classes.totalVaultRewardsRow}>
                     <Grid item xs={9}>
-                      <Box display="flex" alignItems="center">
+                      <Box display="flex" alignItems="center" className={classes.yieldSourceRow}>
                         <TokenLogo width="24" height="24" token={{ symbol: yieldSource.vaultName }} />
                         <img
                           width="12"
diff --git a/src/tests/__snapshots__/Landing.test.tsx.snap b/src/tests/__snapshots__/Landing.test.tsx.snap
index 9c91f1ab8..84b3f1bde 100644
--- a/src/tests/__snapshots__/Landing.test.tsx.snap
+++ b/src/tests/__snapshots__/Landing.test.tsx.snap
@@ -40,7 +40,7 @@ exports[`Landing Renders correctly 1`] = `
                 </svg>
               </span>
               <span
-                class="MuiTouchRipple-root-640"
+                class="MuiTouchRipple-root-641"
               />
             </span>
             <span
@@ -81,7 +81,7 @@ exports[`Landing Renders correctly 1`] = `
                 </svg>
               </span>
               <span
-                class="MuiTouchRipple-root-640"
+                class="MuiTouchRipple-root-641"
               />
             </span>
             <span
@@ -122,7 +122,7 @@ exports[`Landing Renders correctly 1`] = `
                 </svg>
               </span>
               <span
-                class="MuiTouchRipple-root-640"
+                class="MuiTouchRipple-root-641"
               />
             </span>
             <span
@@ -154,7 +154,7 @@ exports[`Landing Renders correctly 1`] = `
                 APY
               </span>
               <span
-                class="MuiTouchRipple-root-640"
+                class="MuiTouchRipple-root-641"
               />
             </button>
             <button
@@ -169,7 +169,7 @@ exports[`Landing Renders correctly 1`] = `
                 APR
               </span>
               <span
-                class="MuiTouchRipple-root-640"
+                class="MuiTouchRipple-root-641"
               />
             </button>
           </div>
@@ -399,7 +399,7 @@ exports[`Landing Renders correctly 1`] = `
                     </svg>
                   </span>
                   <span
-                    class="MuiTouchRipple-root-640"
+                    class="MuiTouchRipple-root-641"
                   />
                 </button>
               </div>
@@ -434,7 +434,7 @@ exports[`Landing Renders correctly 1`] = `
               CLEAR ALL
             </span>
             <span
-              class="MuiTouchRipple-root-640"
+              class="MuiTouchRipple-root-641"
             />
           </button>
         </div>
@@ -473,7 +473,7 @@ exports[`Landing Renders correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-640"
+              class="MuiTouchRipple-root-641"
             />
           </button>
         </div>
@@ -501,7 +501,7 @@ exports[`Landing Renders correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-640"
+              class="MuiTouchRipple-root-641"
             />
           </button>
         </div>
@@ -529,7 +529,7 @@ exports[`Landing Renders correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-640"
+              class="MuiTouchRipple-root-641"
             />
           </button>
         </div>
@@ -557,7 +557,7 @@ exports[`Landing Renders correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-640"
+              class="MuiTouchRipple-root-641"
             />
           </button>
         </div>
@@ -628,7 +628,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-477"
+            class="MuiBox-root-446 MuiBox-root-478"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -641,7 +641,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-481"
+            class="MuiBox-root-446 MuiBox-root-482"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -721,10 +721,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-482 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-483 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-483 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-484 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -743,7 +743,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-486"
+            class="MuiBox-root-446 MuiBox-root-487"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -756,7 +756,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-489"
+            class="MuiBox-root-446 MuiBox-root-490"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -810,10 +810,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-490 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-491 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-491 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-492 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -832,7 +832,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-494"
+            class="MuiBox-root-446 MuiBox-root-495"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -845,7 +845,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-497"
+            class="MuiBox-root-446 MuiBox-root-498"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -925,10 +925,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-498 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-499 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-499 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-500 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -946,7 +946,7 @@ exports[`Landing Renders correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-500"
+              class="MuiBox-root-446 MuiBox-root-501"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -961,7 +961,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-503"
+            class="MuiBox-root-446 MuiBox-root-504"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -974,7 +974,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-506"
+            class="MuiBox-root-446 MuiBox-root-507"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -999,17 +999,17 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="auraBAL logo"
-              class="makeStyles-position-507"
+              class="makeStyles-position-508"
               src="/assets/icons/aurabal.svg"
             />
             <img
               alt="graviAURA logo"
-              class="makeStyles-position-508"
+              class="makeStyles-position-509"
               src="/assets/icons/graviaura.svg"
             />
             <img
               alt="WETH logo"
-              class="makeStyles-position-509"
+              class="makeStyles-position-510"
               src="/assets/icons/weth.svg"
             />
           </div>
@@ -1057,10 +1057,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-510 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-511 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-511 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-512 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -1078,7 +1078,7 @@ exports[`Landing Renders correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-512"
+              class="MuiBox-root-446 MuiBox-root-513"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -1093,7 +1093,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-515"
+            class="MuiBox-root-446 MuiBox-root-516"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1106,7 +1106,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-518"
+            class="MuiBox-root-446 MuiBox-root-519"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1131,12 +1131,12 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="WBTC logo"
-              class="makeStyles-position-519"
+              class="makeStyles-position-520"
               src="/assets/icons/wbtc.svg"
             />
             <img
               alt="BADGER logo"
-              class="makeStyles-position-520"
+              class="makeStyles-position-521"
               src="/assets/icons/badger.svg"
             />
           </div>
@@ -1184,10 +1184,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-521 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-522 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-522 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-523 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -1205,7 +1205,7 @@ exports[`Landing Renders correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-523"
+              class="MuiBox-root-446 MuiBox-root-524"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -1220,7 +1220,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-526"
+            class="MuiBox-root-446 MuiBox-root-527"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1233,7 +1233,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-529"
+            class="MuiBox-root-446 MuiBox-root-530"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1258,17 +1258,17 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="WBTC logo"
-              class="makeStyles-position-530"
+              class="makeStyles-position-531"
               src="/assets/icons/wbtc.svg"
             />
             <img
               alt="DIGG logo"
-              class="makeStyles-position-531"
+              class="makeStyles-position-532"
               src="/assets/icons/digg.svg"
             />
             <img
               alt="graviAURA logo"
-              class="makeStyles-position-532"
+              class="makeStyles-position-533"
               src="/assets/icons/graviaura.svg"
             />
           </div>
@@ -1316,10 +1316,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-533 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-534 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-534 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-535 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -1337,7 +1337,7 @@ exports[`Landing Renders correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-535"
+              class="MuiBox-root-446 MuiBox-root-536"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -1352,7 +1352,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-538"
+            class="MuiBox-root-446 MuiBox-root-539"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1365,7 +1365,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-541"
+            class="MuiBox-root-446 MuiBox-root-542"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1390,12 +1390,12 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="CVX logo"
-              class="makeStyles-position-542"
+              class="makeStyles-position-543"
               src="/assets/icons/cvx.svg"
             />
             <img
               alt="bveCVX logo"
-              class="makeStyles-position-543"
+              class="makeStyles-position-544"
               src="/assets/icons/bvecvx.svg"
             />
           </div>
@@ -1430,10 +1430,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-544 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-545 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-545 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-546 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -1452,7 +1452,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-548"
+            class="MuiBox-root-446 MuiBox-root-549"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1465,7 +1465,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-551"
+            class="MuiBox-root-446 MuiBox-root-552"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1490,12 +1490,12 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="wibBTC logo"
-              class="makeStyles-position-552"
+              class="makeStyles-position-553"
               src="/assets/icons/wibbtc.svg"
             />
             <img
               alt="crvRenWSBTC logo"
-              class="makeStyles-position-553"
+              class="makeStyles-position-554"
               src="/assets/icons/crvrenwsbtc.svg"
             />
           </div>
@@ -1543,10 +1543,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-554 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-555 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-555 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-556 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -1565,7 +1565,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-558"
+            class="MuiBox-root-446 MuiBox-root-559"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1578,7 +1578,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-561"
+            class="MuiBox-root-446 MuiBox-root-562"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1603,12 +1603,12 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="BADGER logo"
-              class="makeStyles-position-562"
+              class="makeStyles-position-563"
               src="/assets/icons/badger.svg"
             />
             <img
               alt="WBTC logo"
-              class="makeStyles-position-563"
+              class="makeStyles-position-564"
               src="/assets/icons/wbtc.svg"
             />
           </div>
@@ -1643,10 +1643,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-564 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-565 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-565 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-566 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -1665,7 +1665,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-568"
+            class="MuiBox-root-446 MuiBox-root-569"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1678,7 +1678,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-571"
+            class="MuiBox-root-446 MuiBox-root-572"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1703,12 +1703,12 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="WBTC logo"
-              class="makeStyles-position-572"
+              class="makeStyles-position-573"
               src="/assets/icons/wbtc.svg"
             />
             <img
               alt="BADGER logo"
-              class="makeStyles-position-573"
+              class="makeStyles-position-574"
               src="/assets/icons/badger.svg"
             />
           </div>
@@ -1743,10 +1743,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-574 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-575 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-575 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-576 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -1765,7 +1765,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-578"
+            class="MuiBox-root-446 MuiBox-root-579"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1778,7 +1778,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-581"
+            class="MuiBox-root-446 MuiBox-root-582"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1803,7 +1803,7 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="WBTC logo"
-              class="makeStyles-position-582"
+              class="makeStyles-position-583"
               src="/assets/icons/wbtc.svg"
             />
           </div>
@@ -1847,7 +1847,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-585"
+            class="MuiBox-root-446 MuiBox-root-586"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1860,7 +1860,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-588"
+            class="MuiBox-root-446 MuiBox-root-589"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1885,12 +1885,12 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="WBTC logo"
-              class="makeStyles-position-589"
+              class="makeStyles-position-590"
               src="/assets/icons/wbtc.svg"
             />
             <img
               alt="WETH logo"
-              class="makeStyles-position-590"
+              class="makeStyles-position-591"
               src="/assets/icons/weth.svg"
             />
           </div>
@@ -1925,10 +1925,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-591 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-592 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-592 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-593 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -1947,7 +1947,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-595"
+            class="MuiBox-root-446 MuiBox-root-596"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1960,7 +1960,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-598"
+            class="MuiBox-root-446 MuiBox-root-599"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -1985,17 +1985,17 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="bb-a-USDT logo"
-              class="makeStyles-position-599"
+              class="makeStyles-position-600"
               src="/assets/icons/bb-a-usdt.svg"
             />
             <img
               alt="bb-a-DAI logo"
-              class="makeStyles-position-600"
+              class="makeStyles-position-601"
               src="/assets/icons/bb-a-dai.svg"
             />
             <img
               alt="bb-a-USDC logo"
-              class="makeStyles-position-601"
+              class="makeStyles-position-602"
               src="/assets/icons/bb-a-usdc.svg"
             />
           </div>
@@ -2056,10 +2056,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-602 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-603 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-603 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-604 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -2077,7 +2077,7 @@ exports[`Landing Renders correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-604"
+              class="MuiBox-root-446 MuiBox-root-605"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -2092,7 +2092,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-607"
+            class="MuiBox-root-446 MuiBox-root-608"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -2105,7 +2105,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-610"
+            class="MuiBox-root-446 MuiBox-root-611"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -2130,12 +2130,12 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="renBTC logo"
-              class="makeStyles-position-611"
+              class="makeStyles-position-612"
               src="/assets/icons/renbtc.svg"
             />
             <img
               alt="WBTC logo"
-              class="makeStyles-position-612"
+              class="makeStyles-position-613"
               src="/assets/icons/wbtc.svg"
             />
           </div>
@@ -2170,10 +2170,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-613 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-614 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-614 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-615 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -2192,7 +2192,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-617"
+            class="MuiBox-root-446 MuiBox-root-618"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -2205,7 +2205,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-620"
+            class="MuiBox-root-446 MuiBox-root-621"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -2230,17 +2230,17 @@ exports[`Landing Renders correctly 1`] = `
           >
             <img
               alt="USDT logo"
-              class="makeStyles-position-621"
+              class="makeStyles-position-622"
               src="/assets/icons/usdt.svg"
             />
             <img
               alt="WBTC logo"
-              class="makeStyles-position-622"
+              class="makeStyles-position-623"
               src="/assets/icons/wbtc.svg"
             />
             <img
               alt="WETH logo"
-              class="makeStyles-position-623"
+              class="makeStyles-position-624"
               src="/assets/icons/weth.svg"
             />
           </div>
@@ -2275,10 +2275,10 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-align-items-xs-center-51 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-624 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-625 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-625 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-626 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -2297,7 +2297,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-628"
+            class="MuiBox-root-446 MuiBox-root-629"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -2310,7 +2310,7 @@ exports[`Landing Renders correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <div
-            class="MuiBox-root-446 MuiBox-root-631"
+            class="MuiBox-root-446 MuiBox-root-632"
           >
             <p
               class="MuiTypography-root-182 makeStyles-itemText-397 MuiTypography-body1-184"
@@ -2367,7 +2367,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
                 </svg>
               </span>
               <span
-                class="MuiTouchRipple-root-642"
+                class="MuiTouchRipple-root-643"
               />
             </span>
             <span
@@ -2385,12 +2385,12 @@ exports[`Landing Renders mobile version correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <button
-            class="MuiButtonBase-root-170 MuiButton-root-239 MuiButton-text-241 makeStyles-button-640"
+            class="MuiButtonBase-root-170 MuiButton-root-239 MuiButton-text-241 makeStyles-button-641"
             tabindex="0"
             type="button"
           >
             <span
-              class="MuiButton-label-240 makeStyles-buttonLabel-641"
+              class="MuiButton-label-240 makeStyles-buttonLabel-642"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body2-183 MuiTypography-displayInline-210"
@@ -2409,7 +2409,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
               </svg>
             </span>
             <span
-              class="MuiTouchRipple-root-642"
+              class="MuiTouchRipple-root-643"
             />
           </button>
         </div>
@@ -2448,7 +2448,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-642"
+              class="MuiTouchRipple-root-643"
             />
           </button>
         </div>
@@ -2476,7 +2476,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-642"
+              class="MuiTouchRipple-root-643"
             />
           </button>
         </div>
@@ -2504,7 +2504,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-642"
+              class="MuiTouchRipple-root-643"
             />
           </button>
         </div>
@@ -2532,14 +2532,14 @@ exports[`Landing Renders mobile version correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-642"
+              class="MuiTouchRipple-root-643"
             />
           </button>
         </div>
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -2548,13 +2548,13 @@ exports[`Landing Renders mobile version correctly 1`] = `
           class="makeStyles-root-405"
         />
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           bveCVX
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -2565,10 +2565,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-655 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-656 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-656 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-657 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -2592,7 +2592,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-659"
+            class="MuiBox-root-446 MuiBox-root-660"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -2625,7 +2625,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -2634,13 +2634,13 @@ exports[`Landing Renders mobile version correctly 1`] = `
           class="makeStyles-root-405"
         />
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           cvxCRV
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -2651,10 +2651,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-660 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-661 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-661 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-662 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -2678,7 +2678,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-664"
+            class="MuiBox-root-446 MuiBox-root-665"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -2737,7 +2737,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -2746,13 +2746,13 @@ exports[`Landing Renders mobile version correctly 1`] = `
           class="makeStyles-root-405"
         />
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           graviAURA
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -2763,10 +2763,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-665 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-666 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-666 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-667 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -2790,7 +2790,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-669"
+            class="MuiBox-root-446 MuiBox-root-670"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -2823,7 +2823,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -2832,13 +2832,13 @@ exports[`Landing Renders mobile version correctly 1`] = `
           class="makeStyles-root-405"
         />
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           auraBAL
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -2849,10 +2849,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-670 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-671 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-671 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-672 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -2870,7 +2870,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-672"
+              class="MuiBox-root-446 MuiBox-root-673"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -2890,7 +2890,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-675"
+            class="MuiBox-root-446 MuiBox-root-676"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -2949,7 +2949,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -2959,28 +2959,28 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="auraBAL logo"
-            class="makeStyles-position-676"
+            class="makeStyles-position-677"
             src="/assets/icons/aurabal.svg"
           />
           <img
             alt="graviAURA logo"
-            class="makeStyles-position-677"
+            class="makeStyles-position-678"
             src="/assets/icons/graviaura.svg"
           />
           <img
             alt="WETH logo"
-            class="makeStyles-position-678"
+            class="makeStyles-position-679"
             src="/assets/icons/weth.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           graviAURA/auraBAL/WETH
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -2991,10 +2991,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-679 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-680 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-680 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-681 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -3012,7 +3012,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-681"
+              class="MuiBox-root-446 MuiBox-root-682"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -3032,7 +3032,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-684"
+            class="MuiBox-root-446 MuiBox-root-685"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -3078,7 +3078,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -3088,23 +3088,23 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-685"
+            class="makeStyles-position-686"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="BADGER logo"
-            class="makeStyles-position-686"
+            class="makeStyles-position-687"
             src="/assets/icons/badger.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           BADGER/WBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -3115,10 +3115,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-687 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-688 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-688 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-689 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -3136,7 +3136,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-689"
+              class="MuiBox-root-446 MuiBox-root-690"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -3156,7 +3156,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-692"
+            class="MuiBox-root-446 MuiBox-root-693"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -3202,7 +3202,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -3212,28 +3212,28 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-693"
+            class="makeStyles-position-694"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="DIGG logo"
-            class="makeStyles-position-694"
+            class="makeStyles-position-695"
             src="/assets/icons/digg.svg"
           />
           <img
             alt="graviAURA logo"
-            class="makeStyles-position-695"
+            class="makeStyles-position-696"
             src="/assets/icons/graviaura.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           graviAURA/DIGG/WBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -3244,10 +3244,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-696 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-697 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-697 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-698 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -3265,7 +3265,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-698"
+              class="MuiBox-root-446 MuiBox-root-699"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -3285,7 +3285,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-701"
+            class="MuiBox-root-446 MuiBox-root-702"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -3331,7 +3331,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -3341,23 +3341,23 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="CVX logo"
-            class="makeStyles-position-702"
+            class="makeStyles-position-703"
             src="/assets/icons/cvx.svg"
           />
           <img
             alt="bveCVX logo"
-            class="makeStyles-position-703"
+            class="makeStyles-position-704"
             src="/assets/icons/bvecvx.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           CVX/bveCVX
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -3368,10 +3368,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-704 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-705 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-705 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-706 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -3395,7 +3395,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-708"
+            class="MuiBox-root-446 MuiBox-root-709"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -3428,7 +3428,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -3438,23 +3438,23 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="wibBTC logo"
-            class="makeStyles-position-709"
+            class="makeStyles-position-710"
             src="/assets/icons/wibbtc.svg"
           />
           <img
             alt="crvRenWSBTC logo"
-            class="makeStyles-position-710"
+            class="makeStyles-position-711"
             src="/assets/icons/crvrenwsbtc.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           ibBTC/crvsBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -3465,10 +3465,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-711 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-712 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-712 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-713 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -3492,7 +3492,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-715"
+            class="MuiBox-root-446 MuiBox-root-716"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -3538,7 +3538,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -3548,23 +3548,23 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="BADGER logo"
-            class="makeStyles-position-716"
+            class="makeStyles-position-717"
             src="/assets/icons/badger.svg"
           />
           <img
             alt="WBTC logo"
-            class="makeStyles-position-717"
+            class="makeStyles-position-718"
             src="/assets/icons/wbtc.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           BADGER/WBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -3575,10 +3575,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-718 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-719 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-719 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-720 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -3602,7 +3602,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-722"
+            class="MuiBox-root-446 MuiBox-root-723"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -3635,7 +3635,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -3645,23 +3645,23 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-723"
+            class="makeStyles-position-724"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="BADGER logo"
-            class="makeStyles-position-724"
+            class="makeStyles-position-725"
             src="/assets/icons/badger.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           wBTC/Badger
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -3672,10 +3672,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-725 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-726 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-726 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-727 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -3699,7 +3699,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-729"
+            class="MuiBox-root-446 MuiBox-root-730"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -3732,7 +3732,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -3742,18 +3742,18 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-730"
+            class="makeStyles-position-731"
             src="/assets/icons/wbtc.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           wBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -3778,7 +3778,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-733"
+            class="MuiBox-root-446 MuiBox-root-734"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -3811,7 +3811,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -3821,23 +3821,23 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-734"
+            class="makeStyles-position-735"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="WETH logo"
-            class="makeStyles-position-735"
+            class="makeStyles-position-736"
             src="/assets/icons/weth.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           wBTC/wETH
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -3848,10 +3848,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-736 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-737 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-737 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-738 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -3875,7 +3875,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-740"
+            class="MuiBox-root-446 MuiBox-root-741"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -3908,7 +3908,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -3918,28 +3918,28 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="bb-a-USDT logo"
-            class="makeStyles-position-741"
+            class="makeStyles-position-742"
             src="/assets/icons/bb-a-usdt.svg"
           />
           <img
             alt="bb-a-DAI logo"
-            class="makeStyles-position-742"
+            class="makeStyles-position-743"
             src="/assets/icons/bb-a-dai.svg"
           />
           <img
             alt="bb-a-USDC logo"
-            class="makeStyles-position-743"
+            class="makeStyles-position-744"
             src="/assets/icons/bb-a-usdc.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           bb-a-USD
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -3950,10 +3950,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-744 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-745 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-745 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-746 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -3971,7 +3971,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-746"
+              class="MuiBox-root-446 MuiBox-root-747"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -3991,7 +3991,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-749"
+            class="MuiBox-root-446 MuiBox-root-750"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -4050,7 +4050,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -4060,23 +4060,23 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="renBTC logo"
-            class="makeStyles-position-750"
+            class="makeStyles-position-751"
             src="/assets/icons/renbtc.svg"
           />
           <img
             alt="WBTC logo"
-            class="makeStyles-position-751"
+            class="makeStyles-position-752"
             src="/assets/icons/wbtc.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           renBTC/wBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -4087,10 +4087,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-752 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-753 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-753 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-754 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -4114,7 +4114,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-756"
+            class="MuiBox-root-446 MuiBox-root-757"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -4147,7 +4147,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -4157,28 +4157,28 @@ exports[`Landing Renders mobile version correctly 1`] = `
         >
           <img
             alt="USDT logo"
-            class="makeStyles-position-757"
+            class="makeStyles-position-758"
             src="/assets/icons/usdt.svg"
           />
           <img
             alt="WBTC logo"
-            class="makeStyles-position-758"
+            class="makeStyles-position-759"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="WETH logo"
-            class="makeStyles-position-759"
+            class="makeStyles-position-760"
             src="/assets/icons/weth.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           Tricrypto2
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -4189,10 +4189,10 @@ exports[`Landing Renders mobile version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-760 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-761 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-761 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-762 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -4216,7 +4216,7 @@ exports[`Landing Renders mobile version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-764"
+            class="MuiBox-root-446 MuiBox-root-765"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -4294,7 +4294,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
                 </svg>
               </span>
               <span
-                class="MuiTouchRipple-root-642"
+                class="MuiTouchRipple-root-643"
               />
             </span>
             <span
@@ -4312,12 +4312,12 @@ exports[`Landing Renders tablet version correctly 1`] = `
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-justify-content-xs-flex-end-61 MuiGrid-grid-xs-true-76"
         >
           <button
-            class="MuiButtonBase-root-170 MuiButton-root-239 MuiButton-text-241 makeStyles-button-640"
+            class="MuiButtonBase-root-170 MuiButton-root-239 MuiButton-text-241 makeStyles-button-641"
             tabindex="0"
             type="button"
           >
             <span
-              class="MuiButton-label-240 makeStyles-buttonLabel-641"
+              class="MuiButton-label-240 makeStyles-buttonLabel-642"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body2-183 MuiTypography-displayInline-210"
@@ -4336,7 +4336,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
               </svg>
             </span>
             <span
-              class="MuiTouchRipple-root-642"
+              class="MuiTouchRipple-root-643"
             />
           </button>
         </div>
@@ -4375,7 +4375,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-642"
+              class="MuiTouchRipple-root-643"
             />
           </button>
         </div>
@@ -4403,7 +4403,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-642"
+              class="MuiTouchRipple-root-643"
             />
           </button>
         </div>
@@ -4431,7 +4431,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-642"
+              class="MuiTouchRipple-root-643"
             />
           </button>
         </div>
@@ -4459,14 +4459,14 @@ exports[`Landing Renders tablet version correctly 1`] = `
               />
             </span>
             <span
-              class="MuiTouchRipple-root-642"
+              class="MuiTouchRipple-root-643"
             />
           </button>
         </div>
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -4475,13 +4475,13 @@ exports[`Landing Renders tablet version correctly 1`] = `
           class="makeStyles-root-405"
         />
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           bveCVX
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -4492,10 +4492,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-655 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-656 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-656 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-657 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -4519,7 +4519,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-659"
+            class="MuiBox-root-446 MuiBox-root-660"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -4552,7 +4552,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -4561,13 +4561,13 @@ exports[`Landing Renders tablet version correctly 1`] = `
           class="makeStyles-root-405"
         />
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           cvxCRV
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -4578,10 +4578,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-660 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-661 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-661 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-662 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -4605,7 +4605,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-664"
+            class="MuiBox-root-446 MuiBox-root-665"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -4664,7 +4664,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -4673,13 +4673,13 @@ exports[`Landing Renders tablet version correctly 1`] = `
           class="makeStyles-root-405"
         />
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           graviAURA
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -4690,10 +4690,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-665 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-666 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-666 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-667 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -4717,7 +4717,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-669"
+            class="MuiBox-root-446 MuiBox-root-670"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -4750,7 +4750,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -4759,13 +4759,13 @@ exports[`Landing Renders tablet version correctly 1`] = `
           class="makeStyles-root-405"
         />
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           auraBAL
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -4776,10 +4776,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-670 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-671 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-671 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-672 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -4797,7 +4797,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-672"
+              class="MuiBox-root-446 MuiBox-root-673"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -4817,7 +4817,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-675"
+            class="MuiBox-root-446 MuiBox-root-676"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -4876,7 +4876,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -4886,28 +4886,28 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="auraBAL logo"
-            class="makeStyles-position-676"
+            class="makeStyles-position-677"
             src="/assets/icons/aurabal.svg"
           />
           <img
             alt="graviAURA logo"
-            class="makeStyles-position-677"
+            class="makeStyles-position-678"
             src="/assets/icons/graviaura.svg"
           />
           <img
             alt="WETH logo"
-            class="makeStyles-position-678"
+            class="makeStyles-position-679"
             src="/assets/icons/weth.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           graviAURA/auraBAL/WETH
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -4918,10 +4918,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-679 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-680 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-680 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-681 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -4939,7 +4939,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-681"
+              class="MuiBox-root-446 MuiBox-root-682"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -4959,7 +4959,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-684"
+            class="MuiBox-root-446 MuiBox-root-685"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -5005,7 +5005,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -5015,23 +5015,23 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-685"
+            class="makeStyles-position-686"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="BADGER logo"
-            class="makeStyles-position-686"
+            class="makeStyles-position-687"
             src="/assets/icons/badger.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           BADGER/WBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -5042,10 +5042,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-687 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-688 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-688 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-689 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -5063,7 +5063,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-689"
+              class="MuiBox-root-446 MuiBox-root-690"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -5083,7 +5083,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-692"
+            class="MuiBox-root-446 MuiBox-root-693"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -5129,7 +5129,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -5139,28 +5139,28 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-693"
+            class="makeStyles-position-694"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="DIGG logo"
-            class="makeStyles-position-694"
+            class="makeStyles-position-695"
             src="/assets/icons/digg.svg"
           />
           <img
             alt="graviAURA logo"
-            class="makeStyles-position-695"
+            class="makeStyles-position-696"
             src="/assets/icons/graviaura.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           graviAURA/DIGG/WBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -5171,10 +5171,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-696 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-697 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-697 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-698 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -5192,7 +5192,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-698"
+              class="MuiBox-root-446 MuiBox-root-699"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -5212,7 +5212,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-701"
+            class="MuiBox-root-446 MuiBox-root-702"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -5258,7 +5258,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -5268,23 +5268,23 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="CVX logo"
-            class="makeStyles-position-702"
+            class="makeStyles-position-703"
             src="/assets/icons/cvx.svg"
           />
           <img
             alt="bveCVX logo"
-            class="makeStyles-position-703"
+            class="makeStyles-position-704"
             src="/assets/icons/bvecvx.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           CVX/bveCVX
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -5295,10 +5295,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-704 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-705 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-705 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-706 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -5322,7 +5322,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-708"
+            class="MuiBox-root-446 MuiBox-root-709"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -5355,7 +5355,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -5365,23 +5365,23 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="wibBTC logo"
-            class="makeStyles-position-709"
+            class="makeStyles-position-710"
             src="/assets/icons/wibbtc.svg"
           />
           <img
             alt="crvRenWSBTC logo"
-            class="makeStyles-position-710"
+            class="makeStyles-position-711"
             src="/assets/icons/crvrenwsbtc.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           ibBTC/crvsBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -5392,10 +5392,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-711 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-712 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-712 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-713 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -5419,7 +5419,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-715"
+            class="MuiBox-root-446 MuiBox-root-716"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -5465,7 +5465,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -5475,23 +5475,23 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="BADGER logo"
-            class="makeStyles-position-716"
+            class="makeStyles-position-717"
             src="/assets/icons/badger.svg"
           />
           <img
             alt="WBTC logo"
-            class="makeStyles-position-717"
+            class="makeStyles-position-718"
             src="/assets/icons/wbtc.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           BADGER/WBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -5502,10 +5502,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-718 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-719 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-719 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-720 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -5529,7 +5529,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-722"
+            class="MuiBox-root-446 MuiBox-root-723"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -5562,7 +5562,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -5572,23 +5572,23 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-723"
+            class="makeStyles-position-724"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="BADGER logo"
-            class="makeStyles-position-724"
+            class="makeStyles-position-725"
             src="/assets/icons/badger.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           wBTC/Badger
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -5599,10 +5599,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-725 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-726 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-726 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-727 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -5626,7 +5626,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-729"
+            class="MuiBox-root-446 MuiBox-root-730"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -5659,7 +5659,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -5669,18 +5669,18 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-730"
+            class="makeStyles-position-731"
             src="/assets/icons/wbtc.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           wBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -5705,7 +5705,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-733"
+            class="MuiBox-root-446 MuiBox-root-734"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -5738,7 +5738,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -5748,23 +5748,23 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-734"
+            class="makeStyles-position-735"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="WETH logo"
-            class="makeStyles-position-735"
+            class="makeStyles-position-736"
             src="/assets/icons/weth.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           wBTC/wETH
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -5775,10 +5775,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-736 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-737 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-737 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-738 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -5802,7 +5802,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-740"
+            class="MuiBox-root-446 MuiBox-root-741"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -5835,7 +5835,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -5845,28 +5845,28 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="bb-a-USDT logo"
-            class="makeStyles-position-741"
+            class="makeStyles-position-742"
             src="/assets/icons/bb-a-usdt.svg"
           />
           <img
             alt="bb-a-DAI logo"
-            class="makeStyles-position-742"
+            class="makeStyles-position-743"
             src="/assets/icons/bb-a-dai.svg"
           />
           <img
             alt="bb-a-USDC logo"
-            class="makeStyles-position-743"
+            class="makeStyles-position-744"
             src="/assets/icons/bb-a-usdc.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           bb-a-USD
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -5877,10 +5877,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-744 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-745 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-745 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-746 makeStyles-aprDisplay-443"
             >
               <h6
                 class="MuiTypography-root-182 MuiTypography-subtitle1-193 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -5898,7 +5898,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
               />
             </div>
             <div
-              class="MuiBox-root-446 MuiBox-root-746"
+              class="MuiBox-root-446 MuiBox-root-747"
             >
               <p
                 class="MuiTypography-root-182 makeStyles-projectedApr-444 MuiTypography-body1-184"
@@ -5918,7 +5918,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-749"
+            class="MuiBox-root-446 MuiBox-root-750"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -5977,7 +5977,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -5987,23 +5987,23 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="renBTC logo"
-            class="makeStyles-position-750"
+            class="makeStyles-position-751"
             src="/assets/icons/renbtc.svg"
           />
           <img
             alt="WBTC logo"
-            class="makeStyles-position-751"
+            class="makeStyles-position-752"
             src="/assets/icons/wbtc.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           renBTC/wBTC
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -6014,10 +6014,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-752 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-753 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-753 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-754 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -6041,7 +6041,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-756"
+            class="MuiBox-root-446 MuiBox-root-757"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
@@ -6074,7 +6074,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
       </div>
     </div>
     <div
-      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-652 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
+      class="MuiPaper-root-14 MuiCard-root-404 MuiGrid-root-42 makeStyles-root-653 MuiGrid-container-43 MuiGrid-direction-xs-column-46 MuiPaper-elevation1-18 MuiPaper-rounded-15"
     >
       <div
         class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44"
@@ -6084,28 +6084,28 @@ exports[`Landing Renders tablet version correctly 1`] = `
         >
           <img
             alt="USDT logo"
-            class="makeStyles-position-757"
+            class="makeStyles-position-758"
             src="/assets/icons/usdt.svg"
           />
           <img
             alt="WBTC logo"
-            class="makeStyles-position-758"
+            class="makeStyles-position-759"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="WETH logo"
-            class="makeStyles-position-759"
+            class="makeStyles-position-760"
             src="/assets/icons/weth.svg"
           />
         </div>
         <h6
-          class="MuiTypography-root-182 makeStyles-name-654 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
+          class="MuiTypography-root-182 makeStyles-name-655 MuiTypography-subtitle1-193 MuiTypography-displayInline-210"
         >
           Tricrypto2
         </h6>
       </div>
       <div
-        class="MuiGrid-root-42 makeStyles-info-653 MuiGrid-container-43 MuiGrid-item-44"
+        class="MuiGrid-root-42 makeStyles-info-654 MuiGrid-container-43 MuiGrid-item-44"
       >
         <div
           class="MuiGrid-root-42 MuiGrid-container-43 MuiGrid-item-44 MuiGrid-direction-xs-column-46 MuiGrid-grid-xs-true-76"
@@ -6116,10 +6116,10 @@ exports[`Landing Renders tablet version correctly 1`] = `
             APY
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-760 makeStyles-root-440"
+            class="MuiBox-root-446 MuiBox-root-761 makeStyles-root-440"
           >
             <div
-              class="MuiBox-root-446 MuiBox-root-761 makeStyles-aprDisplay-443"
+              class="MuiBox-root-446 MuiBox-root-762 makeStyles-aprDisplay-443"
             >
               <p
                 class="MuiTypography-root-182 MuiTypography-body1-184 MuiTypography-colorTextPrimary-207 MuiTypography-displayInline-210"
@@ -6143,7 +6143,7 @@ exports[`Landing Renders tablet version correctly 1`] = `
             My Deposits
           </p>
           <div
-            class="MuiBox-root-446 MuiBox-root-764"
+            class="MuiBox-root-446 MuiBox-root-765"
           >
             <p
               class="MuiTypography-root-182 MuiTypography-body1-184"
diff --git a/src/tests/vaults/__snapshots__/VaultListDisplay.test.tsx.snap b/src/tests/vaults/__snapshots__/VaultListDisplay.test.tsx.snap
index 85f1e9515..a1a1110be 100644
--- a/src/tests/vaults/__snapshots__/VaultListDisplay.test.tsx.snap
+++ b/src/tests/vaults/__snapshots__/VaultListDisplay.test.tsx.snap
@@ -339,7 +339,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
             />
           </span>
           <span
-            class="MuiTouchRipple-root-453"
+            class="MuiTouchRipple-root-454"
           />
         </button>
       </div>
@@ -367,7 +367,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
             />
           </span>
           <span
-            class="MuiTouchRipple-root-453"
+            class="MuiTouchRipple-root-454"
           />
         </button>
       </div>
@@ -395,7 +395,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
             />
           </span>
           <span
-            class="MuiTouchRipple-root-453"
+            class="MuiTouchRipple-root-454"
           />
         </button>
       </div>
@@ -423,7 +423,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
             />
           </span>
           <span
-            class="MuiTouchRipple-root-453"
+            class="MuiTouchRipple-root-454"
           />
         </button>
       </div>
@@ -589,7 +589,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-291"
+          class="MuiBox-root-240 MuiBox-root-292"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -602,7 +602,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-294"
+          class="MuiBox-root-240 MuiBox-root-295"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -656,10 +656,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-295 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-296 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-296 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-297 makeStyles-aprDisplay-235"
           >
             <p
               class="MuiTypography-root-144 MuiTypography-body1-146 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -678,7 +678,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-299"
+          class="MuiBox-root-240 MuiBox-root-300"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -691,7 +691,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-302"
+          class="MuiBox-root-240 MuiBox-root-303"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -771,10 +771,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-303 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-304 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-304 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-305 makeStyles-aprDisplay-235"
           >
             <h6
               class="MuiTypography-root-144 MuiTypography-subtitle1-155 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -792,7 +792,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
             />
           </div>
           <div
-            class="MuiBox-root-240 MuiBox-root-305"
+            class="MuiBox-root-240 MuiBox-root-306"
           >
             <p
               class="MuiTypography-root-144 makeStyles-projectedApr-236 MuiTypography-body1-146"
@@ -807,7 +807,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-308"
+          class="MuiBox-root-240 MuiBox-root-309"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -820,7 +820,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-311"
+          class="MuiBox-root-240 MuiBox-root-312"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -845,17 +845,17 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="auraBAL logo"
-            class="makeStyles-position-312"
+            class="makeStyles-position-313"
             src="/assets/icons/aurabal.svg"
           />
           <img
             alt="graviAURA logo"
-            class="makeStyles-position-313"
+            class="makeStyles-position-314"
             src="/assets/icons/graviaura.svg"
           />
           <img
             alt="WETH logo"
-            class="makeStyles-position-314"
+            class="makeStyles-position-315"
             src="/assets/icons/weth.svg"
           />
         </div>
@@ -903,10 +903,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-315 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-316 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-316 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-317 makeStyles-aprDisplay-235"
           >
             <h6
               class="MuiTypography-root-144 MuiTypography-subtitle1-155 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -924,7 +924,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
             />
           </div>
           <div
-            class="MuiBox-root-240 MuiBox-root-317"
+            class="MuiBox-root-240 MuiBox-root-318"
           >
             <p
               class="MuiTypography-root-144 makeStyles-projectedApr-236 MuiTypography-body1-146"
@@ -939,7 +939,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-320"
+          class="MuiBox-root-240 MuiBox-root-321"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -952,7 +952,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-323"
+          class="MuiBox-root-240 MuiBox-root-324"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -977,12 +977,12 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-324"
+            class="makeStyles-position-325"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="BADGER logo"
-            class="makeStyles-position-325"
+            class="makeStyles-position-326"
             src="/assets/icons/badger.svg"
           />
         </div>
@@ -1030,10 +1030,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-326 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-327 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-327 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-328 makeStyles-aprDisplay-235"
           >
             <h6
               class="MuiTypography-root-144 MuiTypography-subtitle1-155 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -1051,7 +1051,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
             />
           </div>
           <div
-            class="MuiBox-root-240 MuiBox-root-328"
+            class="MuiBox-root-240 MuiBox-root-329"
           >
             <p
               class="MuiTypography-root-144 makeStyles-projectedApr-236 MuiTypography-body1-146"
@@ -1066,7 +1066,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-331"
+          class="MuiBox-root-240 MuiBox-root-332"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1079,7 +1079,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-334"
+          class="MuiBox-root-240 MuiBox-root-335"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1104,17 +1104,17 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-335"
+            class="makeStyles-position-336"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="DIGG logo"
-            class="makeStyles-position-336"
+            class="makeStyles-position-337"
             src="/assets/icons/digg.svg"
           />
           <img
             alt="graviAURA logo"
-            class="makeStyles-position-337"
+            class="makeStyles-position-338"
             src="/assets/icons/graviaura.svg"
           />
         </div>
@@ -1162,10 +1162,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-338 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-339 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-339 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-340 makeStyles-aprDisplay-235"
           >
             <h6
               class="MuiTypography-root-144 MuiTypography-subtitle1-155 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -1183,7 +1183,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
             />
           </div>
           <div
-            class="MuiBox-root-240 MuiBox-root-340"
+            class="MuiBox-root-240 MuiBox-root-341"
           >
             <p
               class="MuiTypography-root-144 makeStyles-projectedApr-236 MuiTypography-body1-146"
@@ -1198,7 +1198,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-343"
+          class="MuiBox-root-240 MuiBox-root-344"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1211,7 +1211,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-346"
+          class="MuiBox-root-240 MuiBox-root-347"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1236,12 +1236,12 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="CVX logo"
-            class="makeStyles-position-347"
+            class="makeStyles-position-348"
             src="/assets/icons/cvx.svg"
           />
           <img
             alt="bveCVX logo"
-            class="makeStyles-position-348"
+            class="makeStyles-position-349"
             src="/assets/icons/bvecvx.svg"
           />
         </div>
@@ -1276,10 +1276,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-349 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-350 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-350 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-351 makeStyles-aprDisplay-235"
           >
             <p
               class="MuiTypography-root-144 MuiTypography-body1-146 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -1298,7 +1298,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-353"
+          class="MuiBox-root-240 MuiBox-root-354"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1311,7 +1311,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-356"
+          class="MuiBox-root-240 MuiBox-root-357"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1391,10 +1391,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-357 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-358 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-358 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-359 makeStyles-aprDisplay-235"
           >
             <p
               class="MuiTypography-root-144 MuiTypography-body1-146 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -1413,7 +1413,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-361"
+          class="MuiBox-root-240 MuiBox-root-362"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1426,7 +1426,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-364"
+          class="MuiBox-root-240 MuiBox-root-365"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1451,12 +1451,12 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="wibBTC logo"
-            class="makeStyles-position-365"
+            class="makeStyles-position-366"
             src="/assets/icons/wibbtc.svg"
           />
           <img
             alt="crvRenWSBTC logo"
-            class="makeStyles-position-366"
+            class="makeStyles-position-367"
             src="/assets/icons/crvrenwsbtc.svg"
           />
         </div>
@@ -1504,10 +1504,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-367 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-368 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-368 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-369 makeStyles-aprDisplay-235"
           >
             <p
               class="MuiTypography-root-144 MuiTypography-body1-146 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -1526,7 +1526,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-371"
+          class="MuiBox-root-240 MuiBox-root-372"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1539,7 +1539,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-374"
+          class="MuiBox-root-240 MuiBox-root-375"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1564,12 +1564,12 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="BADGER logo"
-            class="makeStyles-position-375"
+            class="makeStyles-position-376"
             src="/assets/icons/badger.svg"
           />
           <img
             alt="WBTC logo"
-            class="makeStyles-position-376"
+            class="makeStyles-position-377"
             src="/assets/icons/wbtc.svg"
           />
         </div>
@@ -1604,10 +1604,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-377 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-378 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-378 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-379 makeStyles-aprDisplay-235"
           >
             <p
               class="MuiTypography-root-144 MuiTypography-body1-146 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -1626,7 +1626,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-381"
+          class="MuiBox-root-240 MuiBox-root-382"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1639,7 +1639,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-384"
+          class="MuiBox-root-240 MuiBox-root-385"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1664,12 +1664,12 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-385"
+            class="makeStyles-position-386"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="BADGER logo"
-            class="makeStyles-position-386"
+            class="makeStyles-position-387"
             src="/assets/icons/badger.svg"
           />
         </div>
@@ -1704,10 +1704,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-387 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-388 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-388 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-389 makeStyles-aprDisplay-235"
           >
             <p
               class="MuiTypography-root-144 MuiTypography-body1-146 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -1726,7 +1726,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-391"
+          class="MuiBox-root-240 MuiBox-root-392"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1739,7 +1739,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-394"
+          class="MuiBox-root-240 MuiBox-root-395"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1764,7 +1764,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-395"
+            class="makeStyles-position-396"
             src="/assets/icons/wbtc.svg"
           />
         </div>
@@ -1808,7 +1808,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-398"
+          class="MuiBox-root-240 MuiBox-root-399"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1821,7 +1821,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-401"
+          class="MuiBox-root-240 MuiBox-root-402"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1846,12 +1846,12 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="WBTC logo"
-            class="makeStyles-position-402"
+            class="makeStyles-position-403"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="WETH logo"
-            class="makeStyles-position-403"
+            class="makeStyles-position-404"
             src="/assets/icons/weth.svg"
           />
         </div>
@@ -1886,10 +1886,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-404 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-405 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-405 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-406 makeStyles-aprDisplay-235"
           >
             <p
               class="MuiTypography-root-144 MuiTypography-body1-146 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -1908,7 +1908,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-408"
+          class="MuiBox-root-240 MuiBox-root-409"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1921,7 +1921,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-411"
+          class="MuiBox-root-240 MuiBox-root-412"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -1946,17 +1946,17 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="bb-a-USDT logo"
-            class="makeStyles-position-412"
+            class="makeStyles-position-413"
             src="/assets/icons/bb-a-usdt.svg"
           />
           <img
             alt="bb-a-DAI logo"
-            class="makeStyles-position-413"
+            class="makeStyles-position-414"
             src="/assets/icons/bb-a-dai.svg"
           />
           <img
             alt="bb-a-USDC logo"
-            class="makeStyles-position-414"
+            class="makeStyles-position-415"
             src="/assets/icons/bb-a-usdc.svg"
           />
         </div>
@@ -2017,10 +2017,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-415 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-416 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-416 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-417 makeStyles-aprDisplay-235"
           >
             <h6
               class="MuiTypography-root-144 MuiTypography-subtitle1-155 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -2038,7 +2038,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
             />
           </div>
           <div
-            class="MuiBox-root-240 MuiBox-root-417"
+            class="MuiBox-root-240 MuiBox-root-418"
           >
             <p
               class="MuiTypography-root-144 makeStyles-projectedApr-236 MuiTypography-body1-146"
@@ -2053,7 +2053,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-420"
+          class="MuiBox-root-240 MuiBox-root-421"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -2066,7 +2066,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-423"
+          class="MuiBox-root-240 MuiBox-root-424"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -2091,12 +2091,12 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="renBTC logo"
-            class="makeStyles-position-424"
+            class="makeStyles-position-425"
             src="/assets/icons/renbtc.svg"
           />
           <img
             alt="WBTC logo"
-            class="makeStyles-position-425"
+            class="makeStyles-position-426"
             src="/assets/icons/wbtc.svg"
           />
         </div>
@@ -2131,10 +2131,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-426 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-427 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-427 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-428 makeStyles-aprDisplay-235"
           >
             <p
               class="MuiTypography-root-144 MuiTypography-body1-146 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -2153,7 +2153,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-430"
+          class="MuiBox-root-240 MuiBox-root-431"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -2166,7 +2166,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-433"
+          class="MuiBox-root-240 MuiBox-root-434"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -2191,17 +2191,17 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         >
           <img
             alt="USDT logo"
-            class="makeStyles-position-434"
+            class="makeStyles-position-435"
             src="/assets/icons/usdt.svg"
           />
           <img
             alt="WBTC logo"
-            class="makeStyles-position-435"
+            class="makeStyles-position-436"
             src="/assets/icons/wbtc.svg"
           />
           <img
             alt="WETH logo"
-            class="makeStyles-position-436"
+            class="makeStyles-position-437"
             src="/assets/icons/weth.svg"
           />
         </div>
@@ -2236,10 +2236,10 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-align-items-xs-center-22 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-437 makeStyles-root-232"
+          class="MuiBox-root-240 MuiBox-root-438 makeStyles-root-232"
         >
           <div
-            class="MuiBox-root-240 MuiBox-root-438 makeStyles-aprDisplay-235"
+            class="MuiBox-root-240 MuiBox-root-439 makeStyles-aprDisplay-235"
           >
             <p
               class="MuiTypography-root-144 MuiTypography-body1-146 MuiTypography-colorTextPrimary-169 MuiTypography-displayInline-172"
@@ -2258,7 +2258,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-441"
+          class="MuiBox-root-240 MuiBox-root-442"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"
@@ -2271,7 +2271,7 @@ exports[`VaultListDisplay uses default sort criteria by default 1`] = `
         class="MuiGrid-root-13 MuiGrid-container-14 MuiGrid-item-15 MuiGrid-justify-content-xs-flex-end-32 MuiGrid-grid-xs-true-47"
       >
         <div
-          class="MuiBox-root-240 MuiBox-root-444"
+          class="MuiBox-root-240 MuiBox-root-445"
         >
           <p
             class="MuiTypography-root-144 makeStyles-itemText-188 MuiTypography-body1-146"

From a6bbf62b17ecf5072507c9a23c00b98d39c91e54 Mon Sep 17 00:00:00 2001
From: Anil Kumar Rai <anilrai@outlook.com>
Date: Thu, 8 Sep 2022 21:23:20 +0530
Subject: [PATCH 2/2] fixed UI based on feadback

---
 public/assets/icons/curve lp fees.svg             | 1 +
 public/assets/icons/sushiswap lp fees.svg         | 1 +
 src/components-v2/VaultApyBreakdownItem/index.tsx | 5 ++++-
 src/components-v2/VaultApyInformation/index.tsx   | 6 +++---
 src/components-v2/landing/VaultItemApr.tsx        | 5 ++++-
 5 files changed, 13 insertions(+), 5 deletions(-)
 create mode 100644 public/assets/icons/curve lp fees.svg
 create mode 100644 public/assets/icons/sushiswap lp fees.svg

diff --git a/public/assets/icons/curve lp fees.svg b/public/assets/icons/curve lp fees.svg
new file mode 100644
index 000000000..fe4343ae4
--- /dev/null
+++ b/public/assets/icons/curve lp fees.svg	
@@ -0,0 +1 @@
+<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 24c6.627 0 12-5.373 12-12S18.627 0 12 0 0 5.373 0 12s5.373 12 12 12ZM6 7.333h1.676v8.386h4.007v1.614H6v-10Zm14 3.27c0 1.929-1.257 3.283-3.17 3.283h-2.107v3.447h-1.677v-10h3.785c1.925 0 3.169 1.314 3.169 3.27Zm-1.755-.014c0-1.094-.628-1.696-1.741-1.696h-1.781v3.433h1.754c1.153 0 1.768-.643 1.768-1.737Z" fill="#fff" fill-opacity=".87"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/public/assets/icons/sushiswap lp fees.svg b/public/assets/icons/sushiswap lp fees.svg
new file mode 100644
index 000000000..fe4343ae4
--- /dev/null
+++ b/public/assets/icons/sushiswap lp fees.svg	
@@ -0,0 +1 @@
+<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M12 24c6.627 0 12-5.373 12-12S18.627 0 12 0 0 5.373 0 12s5.373 12 12 12ZM6 7.333h1.676v8.386h4.007v1.614H6v-10Zm14 3.27c0 1.929-1.257 3.283-3.17 3.283h-2.107v3.447h-1.677v-10h3.785c1.925 0 3.169 1.314 3.169 3.27Zm-1.755-.014c0-1.094-.628-1.696-1.741-1.696h-1.781v3.433h1.754c1.153 0 1.768-.643 1.768-1.737Z" fill="#fff" fill-opacity=".87"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/src/components-v2/VaultApyBreakdownItem/index.tsx b/src/components-v2/VaultApyBreakdownItem/index.tsx
index ef1ff62f4..661cabecf 100644
--- a/src/components-v2/VaultApyBreakdownItem/index.tsx
+++ b/src/components-v2/VaultApyBreakdownItem/index.tsx
@@ -33,8 +33,11 @@ const useStyles = makeStyles((theme: Theme) => ({
     padding: 10,
     '& .MuiBox-root > *': {
       marginRight: 5,
+      '&:last-child': {
+        marginRight: 0,
+      },
     },
-    '& .MuiBox-root > img': {
+    '& .MuiBox-root > img:first-child': {
       marginRight: 10,
     },
   },
diff --git a/src/components-v2/VaultApyInformation/index.tsx b/src/components-v2/VaultApyInformation/index.tsx
index 02e93a791..7bc46e94c 100644
--- a/src/components-v2/VaultApyInformation/index.tsx
+++ b/src/components-v2/VaultApyInformation/index.tsx
@@ -72,13 +72,13 @@ const useStyles = makeStyles((theme) => ({
   totalVaultRewardsRow: {
     padding: 10,
     '& .MuiBox-root > *': {
-      marginRight: 10,
+      marginRight: 5,
       '&:last-child': {
         marginRight: 0,
       },
     },
-    '& .MuiBox-root > img': {
-      marginRight: 5,
+    '& .MuiBox-root > img:first-child': {
+      marginRight: 10,
     },
   },
   rowAsHead: {
diff --git a/src/components-v2/landing/VaultItemApr.tsx b/src/components-v2/landing/VaultItemApr.tsx
index de527203b..29942ccb2 100644
--- a/src/components-v2/landing/VaultItemApr.tsx
+++ b/src/components-v2/landing/VaultItemApr.tsx
@@ -28,6 +28,9 @@ const useStyles = makeStyles((theme: Theme) => ({
     [theme.breakpoints.down('sm')]: {
       justifyContent: 'flex-start',
     },
+    '&:hover': {
+      textDecoration: 'underline',
+    },
   },
   projectedApr: {
     fontSize: 10,
@@ -127,7 +130,7 @@ const VaultItemApr = ({ vault }: Props): JSX.Element => {
         <Box className={classes.yieldBearingRewards}>
           <Link color="primary" onClick={handleYieldBearingRewardsClick}>
             <img width="9" src="assets/icons/yield-bearing-rewards.svg" alt="Yield-Bearing Rewards" /> Yield-Bearing
-            Rewards.
+            Rewards:
           </Link>
           <Typography onClick={handleApyInfoClick} variant="inherit">
             Rewards earn up to {yieldSourcesAprTotal.toFixed(2)}%