feat: update Flux banner

.changeset/funny-dingos-relax.md

@@ -0,0 +1,5 @@
+---
+"@venusprotocol/evm": minor
+---
+
+update Flux banner

apps/evm/src/containers/AdBanner/VenusFluxBanner/index.tsx

@@ -1,39 +1,44 @@
 import { ButtonWrapper } from '@venusprotocol/ui';
-import { VENUS_FLUX_URL } from 'constants/production';
+
 import { Link } from 'containers/Link';
 import { useBreakpointUp } from 'hooks/responsive';
 import { useTranslation } from 'libs/translations';
-import mobileIllustrationSrc from './mobileIllustration.png';
-import tabletIllustrationSrc from './tabletIllustration.png';
+import illustrationSrc from './illustration.png';
+
+const CAMPAIGN_URL = 'https://binance.onelink.me/mL1z/x0rd7v8u?af_force_deeplink=true';
 
 export const VenusFluxBanner: React.FC = () => {
-  const { t } = useTranslation();
+  const { t, Trans } = useTranslation();
   const isSmOrUp = useBreakpointUp('sm');
 
   return (
-    <div className="relative rounded-lg h-26.25 px-3 pt-2 pb-3 flex flex-col gap-y-3 bg-linear-to-r from-[#363636] to-[#0C0C0C] sm:h-18 sm:flex-row sm:items-center sm:justify-between sm:py-3 sm:pl-31">
-      <img
-        src={mobileIllustrationSrc}
-        className="absolute left-4 bottom-0 h-12 sm:hidden"
-        alt={t('venusFluxBanner.illustrationAltText')}
-      />
+    <div className="relative rounded-lg h-26.25 px-4 pt-2 pb-3 flex flex-col gap-y-3 bg-linear-to-r from-[#363636] to-[#0C0C0C] sm:h-18 sm:flex-row sm:items-center sm:justify-between sm:py-3 sm:pl-29">
+      <div className="flex flex-col gap-y-3 sm:flex-row sm:justify-between sm:gap-x-4 sm:items-center sm:grow">
+        <div className="flex flex-col gap-y-0.5">
+          <p className="font-semibold text-sm sm:text-base">{t('venusFluxBanner.title')}</p>
 
-      <img
-        src={tabletIllustrationSrc}
-        className="hidden absolute bottom-0 left-3 h-19 sm:block"
-        alt={t('venusFluxBanner.illustrationAltText')}
-      />
+          <p className="text-xs text-grey sm:text-sm">
+            <Trans
+              i18nKey="venusFluxBanner.description"
+              components={{
+                YellowText: <span className="text-yellow" />,
+              }}
+            />
+          </p>
+        </div>
 
-      <div className="space-y-0.5">
-        <p className="font-semibold text-sm lg:text-base">{t('venusFluxBanner.title')}</p>
-        <p className="text-xs text-grey lg:text-sm">{t('venusFluxBanner.description')}</p>
+        <ButtonWrapper size={isSmOrUp ? 'md' : 'xs'} className="px-5 self-start md:px-6" asChild>
+          <Link href={CAMPAIGN_URL} noStyle>
+            {t('adBanner.startNow')}
+          </Link>
+        </ButtonWrapper>
       </div>
 
-      <ButtonWrapper size={isSmOrUp ? 'md' : 'xs'} className="self-end px-5 md:px-6" asChild>
-        <Link href={VENUS_FLUX_URL} target="_blank" noStyle>
-          {t('adBanner.startNow')}
-        </Link>
-      </ButtonWrapper>
+      <img
+        src={illustrationSrc}
+        className="absolute right-2 bottom-1 h-19 sm:left-4 sm:right-auto sm:bottom-0 sm:h-22"
+        alt={t('venusFluxBanner.illustrationAltText')}
+      />
     </div>
   );
 };

apps/evm/src/libs/translations/translations/en.json

@@ -2154,9 +2154,9 @@
     }
   },
   "venusFluxBanner": {
-    "description": "Let your liquidity Flux, watch your yield grow.",
+    "description": "30 days only. Live May 28 with <YellowText>Binance Wallet</YellowText>",
     "illustrationAltText": "Venus Flux illustration",
-    "title": "Share $1M in Venus Flux Incentives"
+    "title": "$50K USDT rewards on Venus Flux"
   },
   "vote": {
     "abstain": "Abstain",

apps/evm/src/libs/translations/translations/ja.json

@@ -2153,9 +2153,9 @@
     }
   },
   "venusFluxBanner": {
-    "description": "流動性をFluxさせ、利回りの伸びを見届けよう。",
+    "description": "30日間限定。5月28日、<YellowText>Binance Wallet</YellowText>とともに開始",
     "illustrationAltText": "Venus Flux のイラスト",
-    "title": "Venus Flux インセンティブ総額100万ドルをシェア"
+    "title": "Venus Fluxで5万USDTの報酬"
   },
   "vote": {
     "abstain": "棄権",

apps/evm/src/libs/translations/translations/th.json

@@ -2153,9 +2153,9 @@
     }
   },
   "venusFluxBanner": {
-    "description": "ปล่อยให้สภาพคล่องของคุณ Flux แล้วดูผลตอบแทนเติบโต",
+    "description": "เฉพาะ 30 วันเท่านั้น เริ่ม 28 พ.ค. กับ <YellowText>Binance Wallet</YellowText>",
     "illustrationAltText": "ภาพประกอบ Venus Flux",
-    "title": "แบ่งปันเงินจูงใจ Venus Flux มูลค่า $1M"
+    "title": "รางวัล USDT มูลค่า $50K บน Venus Flux"
   },
   "vote": {
     "abstain": "งดออกเสียง",

apps/evm/src/libs/translations/translations/tr.json

@@ -2154,9 +2154,9 @@
     }
   },
   "venusFluxBanner": {
-    "description": "Likiditenizi Flux'a bırakın, getirinizi büyürken izleyin.",
+    "description": "Yalnızca 30 gün. 28 Mayıs'ta <YellowText>Binance Wallet</YellowText> ile yayında",
     "illustrationAltText": "Venus Flux illüstrasyonu",
-    "title": "Venus Flux Teşviklerinde $1M Paylaşın"
+    "title": "Venus Flux'ta $50K USDT ödülü"
   },
   "vote": {
     "abstain": "Çekimser",

apps/evm/src/libs/translations/translations/vi.json

@@ -2153,9 +2153,9 @@
     }
   },
   "venusFluxBanner": {
-    "description": "Hãy để thanh khoản của bạn Flux, theo dõi lợi suất tăng trưởng.",
+    "description": "Chỉ trong 30 ngày. Ra mắt ngày 28 tháng 5 cùng <YellowText>Binance Wallet</YellowText>",
     "illustrationAltText": "Hình minh họa Venus Flux",
-    "title": "Chia sẻ $1M phần thưởng Venus Flux"
+    "title": "Phần thưởng $50K USDT trên Venus Flux"
   },
   "vote": {
     "abstain": "Bỏ phiếu trắng",

apps/evm/src/libs/translations/translations/zh-Hans.json

@@ -2153,9 +2153,9 @@
     }
   },
   "venusFluxBanner": {
-    "description": "让你的流动性 Flux，见证收益增长。",
+    "description": "仅限30天。5月28日携手<YellowText>Binance Wallet</YellowText>上线",
     "illustrationAltText": "Venus Flux 插图",
-    "title": "瓜分 Venus Flux 百万美元激励"
+    "title": "Venus Flux 上线 5 万 USDT 奖励"
   },
   "vote": {
     "abstain": "弃权",

apps/evm/src/libs/translations/translations/zh-Hant.json

@@ -2153,9 +2153,9 @@
     }
   },
   "venusFluxBanner": {
-    "description": "讓你的流動性 Flux，見證收益成長。",
+    "description": "僅限30天。5月28日攜手<YellowText>Binance Wallet</YellowText>上線",
     "illustrationAltText": "Venus Flux 插圖",
-    "title": "瓜分 Venus Flux 百萬美元激勵"
+    "title": "Venus Flux 上線 5 萬 USDT 獎勵"
   },
   "vote": {
     "abstain": "棄權",

apps/evm/src/pages/Dashboard/__tests__/__snapshots__/index.spec.tsx.snap

@@ -1,3 +1,3 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`Dashboard > displays content correctly 1`] = `"Venus Trade is live nowTrade relative performance on-chainStart nowShare $1M in Venus Flux IncentivesLet your liquidity Flux, watch your yield grow.Start nowPendle vault now openOne-click Pendle yield right from VenusStart nowBoost is available now!One-click leverage to boost your yield up to 5x.Start nowBoost is available now!One-click leverage to boost your yield up to 5x.Isolated pools have been sunsetPlease withdraw or migrate all assets nowStart nowIsolated pools have been sunsetPlease withdraw or migrate all assets nowNet worth$1.23MToday's change+$1.23M99.99%Absolute performance+$1.23MMarketsVaultsHealth factor15.62HealthyNet APY0.02%Daily earnings$1Total supply$1.23MTotal borrow$123.33Borrowed:$123.33LT:Liquidation threshold:$1.92K..Health factor15.62HealthyNet APY0.02%Daily earnings$1Total supply$1.23MTotal borrow$123.33Borrowed:$123.33LT:Liquidation threshold:$1.92K..SuppliedAssetAPY Balancesorted descendingCollateralXVS0.16%90$115.08USDT4.01%5.76%100$100USDC5.99%100$99.99XVSAPY 0.16%Balance90$115.08CollateralUSDTAPY 4.01%5.76%Balance100$100CollateralUSDCAPY 5.99%Balance100$99.99CollateralBorrowedAssetAPY Balancesorted descending% of limitBUSD-5.81%50$500%USDT-5.49%-6.51%40$400%BUSDAPY -5.81%Balance50$50% of limit0%USDTAPY -5.49%-6.51%Balance40$40% of limit0%Spotlight ( Supply/Borrow )USDC5.99%USDT4.01%5.76%BUSD3.56%5.31%"`;
+exports[`Dashboard > displays content correctly 1`] = `"Venus Trade is live nowTrade relative performance on-chainStart now$50K USDT rewards on Venus Flux30 days only. Live May 28 with Binance WalletStart nowPendle vault now openOne-click Pendle yield right from VenusStart nowBoost is available now!One-click leverage to boost your yield up to 5x.Start nowBoost is available now!One-click leverage to boost your yield up to 5x.Isolated pools have been sunsetPlease withdraw or migrate all assets nowStart nowIsolated pools have been sunsetPlease withdraw or migrate all assets nowNet worth$1.23MToday's change+$1.23M99.99%Absolute performance+$1.23MMarketsVaultsHealth factor15.62HealthyNet APY0.02%Daily earnings$1Total supply$1.23MTotal borrow$123.33Borrowed:$123.33LT:Liquidation threshold:$1.92K..Health factor15.62HealthyNet APY0.02%Daily earnings$1Total supply$1.23MTotal borrow$123.33Borrowed:$123.33LT:Liquidation threshold:$1.92K..SuppliedAssetAPY Balancesorted descendingCollateralXVS0.16%90$115.08USDT4.01%5.76%100$100USDC5.99%100$99.99XVSAPY 0.16%Balance90$115.08CollateralUSDTAPY 4.01%5.76%Balance100$100CollateralUSDCAPY 5.99%Balance100$99.99CollateralBorrowedAssetAPY Balancesorted descending% of limitBUSD-5.81%50$500%USDT-5.49%-6.51%40$400%BUSDAPY -5.81%Balance50$50% of limit0%USDTAPY -5.49%-6.51%Balance40$40% of limit0%Spotlight ( Supply/Borrow )USDC5.99%USDT4.01%5.76%BUSD3.56%5.31%"`;