blue band on earn page

ionicprotocol · Dec 17, 2024 · 4d4f13f · 4d4f13f
1 parent 082042c
commit 4d4f13f
Showing 1 changed file with 16 additions and 18 deletions.
diff --git a/packages/ui/app/_components/DynamicSubNav.tsx b/packages/ui/app/_components/DynamicSubNav.tsx
@@ -1,27 +1,30 @@
 'use client';
 
 import dynamic from 'next/dynamic';
-import { useSearchParams } from 'next/navigation';
-
-import { mode } from 'viem/chains';
-
+import { useSearchParams, usePathname } from 'next/navigation';
+import { mode, base } from 'viem/chains';
 import { pools } from '@ui/constants/index';
 
 function DynamicSubNav() {
-  // const router = useRouter();
   const searchParams = useSearchParams();
+  const pathname = usePathname();
   const chain = searchParams.get('chain');
   const chainId = chain === null ? mode.id : chain;
 
+  const getBgColor = () => {
+    if (pathname === '/earn') {
+      return pools[base.id]?.bg;
+    }
+    return pools[+chainId]?.bg ?? pools[mode.id]?.bg;
+  };
+
   function clone() {
     return (
-      <div
-        className={`thread min-w-max h-max group-hover:pause p-2 text-center animate-slide flex-shrink-0  `}
-      >
+      <div className="thread min-w-max h-max group-hover:pause p-2 text-center animate-slide flex-shrink-0">
         {Array.from({ length: 5 }).map((_, index) => (
           <span
             key={index}
-            className={`pl-14`}
+            className="pl-14"
           >
             veION COMING SOON! Supply & Borrow Assets to earn $ION. Accumulate &
             Lock $ION to increase Emissions to your favorite Assets and Maximize
@@ -31,13 +34,14 @@ function DynamicSubNav() {
       </div>
     );
   }
+
   return (
     <div
-      className={`${`${pools[+chainId]?.bg ?? pools[mode.id]?.bg} ${
+      className={`${getBgColor()} ${
         pools[+chainId]?.text ?? pools[mode.id]?.text
-      }`} absolute w-full z-20 top-full left-0 text-center text-sm font-medium `}
+      } absolute w-full z-20 top-full left-0 text-center text-sm font-medium`}
     >
-      <div className={`h-max w-full flex group z-20 givep overflow-x-hidden`}>
+      <div className="h-max w-full flex group z-20 givep overflow-x-hidden">
         {clone()}
         {clone()}
       </div>
@@ -46,9 +50,3 @@ function DynamicSubNav() {
 }
 
 export default dynamic(() => Promise.resolve(DynamicSubNav), { ssr: false });
-
-{
-  /* Hello, {pools[+chainId].name ?? 'Mode'}! Season 2 is LIVE - New
-      multipliers, new ways to earn points! See your Season 1 $ION eligibility
-      on the Claim page (Open till 6th of July). */
-}