diff --git a/src/pages/App.tsx b/src/pages/App.tsx
index 02d20e041..87a478af5 100644
--- a/src/pages/App.tsx
+++ b/src/pages/App.tsx
@@ -4,6 +4,7 @@ import { Suspense, useEffect, useState } from 'react'
import { SkeletonTheme } from 'react-loading-skeleton'
import { useLocation } from 'react-router-dom'
import { Slide, ToastContainer, toast } from 'react-toastify'
+import { Text } from 'rebass'
import styled, { useTheme } from 'styled-components'
import { defaultSubgraphClient, subgraphClients } from '../apollo/client'
@@ -16,6 +17,7 @@ import Web3ReactManager from '../components/Web3ReactManager'
import { useActiveWeb3React } from '../hooks'
import { useStacklyPopup } from '../state/application/hooks'
import { useUpdateStacklyPopupOpen } from '../state/user/hooks'
+import { CloseIcon } from '../theme'
import { SWPRSupportedChains } from '../utils/chainSupportsSWPR'
import { Routes } from './Routes'
@@ -68,6 +70,22 @@ const BodyWrapper = styled.div<{
const Marginer = styled.div`
margin-top: 5rem;
`
+
+const WarningBanner = styled.div`
+ display: flex;
+ min-height: 30px;
+ width: 100%;
+ background-color: ${({ theme }) => theme.bg1And2};
+ font-size: 12px;
+ z-index: 2;
+ align-items: center;
+ padding: 0 14px;
+`
+
+const TextBanner = styled.p`
+ margin: 0 auto;
+`
+
const showStacklyPopup = process.env.REACT_APP_SHOW_STACKLY_POPUP === 'true'
export default function App() {
@@ -75,6 +93,7 @@ export default function App() {
const location = useLocation()
const theme = useTheme()
const [isSwapPage, setIsSwapPage] = useState(false)
+ const [isOpenBanner, setIsOpenBanner] = useState(true)
const isAdvancedTradeMode = location.pathname.includes('/swap/pro')
useEffect(() => {
@@ -111,6 +130,17 @@ export default function App() {
+ {isOpenBanner && (
+
+
+ Make sure you are on
+
+ swapr.eth.limo
+
+
+ setIsOpenBanner(false)} />
+
+ )}