refactor: update to landing page structure (#5571)
* feat: initial work * chore: add translations * Revert "chore: add translations" This reverts commit 8ba0bf4a2e03e01243d40f7429276a2a906b8887. * chore: bring it back
This commit is contained in:
parent
f96ecb59eb
commit
28d6c6454e
@ -196,11 +196,10 @@ export default function App() {
|
||||
<Popups />
|
||||
<Polling />
|
||||
<TopLevelModals />
|
||||
<Landing />
|
||||
<Suspense fallback={<Loader />}>
|
||||
{isLoaded ? (
|
||||
<Routes>
|
||||
{landingPageFlag === LandingPageVariant.Enabled && <Route path="/" element={<Swap />} />}
|
||||
{landingPageFlag === LandingPageVariant.Enabled && <Route path="/" element={<Landing />} />}
|
||||
<Route path="tokens" element={<Tokens />}>
|
||||
<Route path=":chainName" />
|
||||
</Route>
|
||||
|
@ -1,6 +1,7 @@
|
||||
import { ButtonCTA } from 'components/Button'
|
||||
import { LandingPageVariant, useLandingPageFlag } from 'featureFlags/flags/landingPage'
|
||||
import { useLocation, useNavigate } from 'react-router-dom'
|
||||
import Swap from 'pages/Swap'
|
||||
import { PropsWithChildren } from 'react'
|
||||
import { Link } from 'react-router-dom'
|
||||
import { useIsDarkMode } from 'state/user/hooks'
|
||||
import styled from 'styled-components/macro'
|
||||
import { BREAKPOINTS } from 'theme'
|
||||
@ -70,8 +71,7 @@ const SubText = styled.h3`
|
||||
}
|
||||
`
|
||||
|
||||
const ButtonCTAText = styled.p`
|
||||
margin: 0px;
|
||||
const Button = styled(ButtonCTA)`
|
||||
font-size: 16px;
|
||||
white-space: nowrap;
|
||||
|
||||
@ -92,29 +92,23 @@ const ContentWrapper = styled.span`
|
||||
max-width: 720px;
|
||||
`
|
||||
|
||||
export default function Landing() {
|
||||
export default function Landing(props: PropsWithChildren) {
|
||||
const isDarkMode = useIsDarkMode()
|
||||
|
||||
const navigate = useNavigate()
|
||||
|
||||
const location = useLocation()
|
||||
const isOpen = location.pathname === '/'
|
||||
|
||||
const onContinueClick = () => navigate('/swap')
|
||||
|
||||
if (useLandingPageFlag() === LandingPageVariant.Control || !isOpen) return null
|
||||
|
||||
return (
|
||||
<>
|
||||
<PageWrapper isDarkMode={isDarkMode}>
|
||||
<TitleContentWrapper>
|
||||
<TitleText isDarkMode={isDarkMode}>Trade crypto & NFTs with confidence.</TitleText>
|
||||
<SubText>Uniswap is the best way to buy, sell, and manage your tokens and NFTs.</SubText>
|
||||
</TitleContentWrapper>
|
||||
<ContentWrapper>
|
||||
<ButtonCTA onClick={onContinueClick}>
|
||||
<ButtonCTAText>Continue</ButtonCTAText>
|
||||
</ButtonCTA>
|
||||
<Button as={Link} to="/swap">
|
||||
Continue
|
||||
</Button>
|
||||
</ContentWrapper>
|
||||
</PageWrapper>
|
||||
<Swap />
|
||||
</>
|
||||
)
|
||||
}
|
Loading…
Reference in New Issue
Block a user