add whalex banner (#615)

* add whalex banner

* changed gradient

components/Navbar/Navbar.tsx

@@ -1,4 +1,3 @@
-import { InfoIcon } from '@chakra-ui/icons'
 import {
   Box,
   Drawer,
@@ -15,7 +14,7 @@ import {
 } from '@chakra-ui/react'
 import BurgerIcon from 'components/Icons/BurgerIcon'
 import { ACTIVE_BONDING_NETWORKS, ChainId } from 'constants/index'
-import { useRouter } from 'next/router'
+import * as motion from 'motion/react-client'
 import { useRecoilValue } from 'recoil'
 import { chainState } from 'state/chainState'
 
@@ -33,7 +32,6 @@ const Navbar = () => {
 
   const { isOpen, onOpen, onClose } = useDisclosure()
   const currentChainName = chainName
-  const router = useRouter()
 
   const links = [
     {
@@ -137,26 +135,31 @@ const Navbar = () => {
         </IconButton>
       </Flex>
       {/* Announcement Banner */}
-      {chainId === 'phoenix-1' && <Flex
+      <Flex
         mx="auto"
         maxWidth="container.xl"
-        display={{ base: 'none',
-          md: 'flex' }}
+        display={{
+          base: 'none',
+          md: 'flex',
+        }}
         alignItems="center"
         justifyContent="center"
-        bgGradient="linear(to-r, blue.500, orange.500)"
-        p={3}
+        bgGradient="linear-gradient(to right, #F7931B 0%, #F7931B 5%, #000000 35%,#000000 65%, #3CCD64 95%, #3CCD64 100%)"
+        p={2}
         cursor="pointer"
-        onClick={() => router.push('/terra/pools/migrate')}
         borderRadius="md"
-        marginTop={5}
+        marginTop={3}
+        as="a"
+        href="https://app.migaloo.zone/staking/liquid-staking"
+        target="_blank"
+        rel="noopener noreferrer"
       >
-        <InfoIcon boxSize={5} color="white" mr={3} />
+        <img src={'/logos/whaleX.png'} width={32} height={32} />
         <Text fontWeight="bold" color="white">
-          Attention: We’re migrating pools. Click here to learn more and proceed.
+          WhaleX has arrived! Click here and start earning.
         </Text>
+        <img src={'/logos/whaleX.png'} width={32} height={32} />
       </Flex>
-      }
       <Drawer isOpen={isOpen} placement="right" onClose={onClose}>
         <DrawerOverlay />
         <DrawerContent>

next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/pages/api-reference/config/typescript for more information.
+// see https://nextjs.org/docs/basic-features/typescript for more information.