ButterflyEffect/uniswap-interface-uncensored
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: make background header a background-image (#5635)

Browse Source 
* fix: make background header a background-image

* fit differently
This commit is contained in:
Vignesh Mohankumar 2022-12-11 17:37:50 -05:00 committed by GitHub
parent 1aba4fbcd7
commit a6eff7823a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 5 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/pages/About/index.tsx
View File

@ -12,7 +12,7 @@ import backgroundImgSrc from './images/background.jpg'
import Step from './Step'
import { SubTitle, Title } from './Title'
const Page = styled.div<{ isDarkMode: boolean; titleHeight: number }>`
const Page = styled.div<{ isDarkMode: boolean; titleHeight: number; backgroundImgSrc: string }>`
position: relative;
width: 100%;
align-self: center;
@ -21,13 +21,9 @@ const Page = styled.div<{ isDarkMode: boolean; titleHeight: number }>`
align-items: center;
width: 100%;
padding-top: calc(100vh - ${({ titleHeight }) => titleHeight + 200}px);
`
const BackgroundImage = styled.img`
position: absolute;
top: 0;
left: 0;
height: calc(100vh - 72px);
background: url(${backgroundImgSrc});
background-size: auto 100vh;
background-repeat: no-repeat;
`
const Panels = styled.div`
@ -166,8 +162,7 @@ export default function About() {
return (
<Trace page={PageName.ABOUT_PAGE} shouldLogImpression>
<Page isDarkMode={isDarkMode} titleHeight={titleHeight}>
<BackgroundImage src={backgroundImgSrc} />
<Page isDarkMode={isDarkMode} titleHeight={titleHeight} backgroundImgSrc={backgroundImgSrc}>
<Content>
<Title ref={titleRef} isDarkMode={isDarkMode}>
Uniswap is the leading on-chain marketplace for tokens and NFTs.