zecfoundation
/
zcash-grant-system
mirror of https://github.com/ZcashFoundation/zcash-grant-system.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Change homepage splash image to background image that keeps its place before loading.

This commit is contained in:
Will O'Beirne 2019-03-06 18:39:44 -05:00
parent 312818d71a
commit e9a052870c
No known key found for this signature in database
GPG Key ID: 44C190DB5DEAF9F6
2 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/client/components/Home/Intro.less
View File

@ -96,11 +96,15 @@
} }
&-illustration { &-illustration {
position: relative;
width: 100%;
max-width: 640px; max-width: 640px;
background-size: contain;
img { &:after {
width: 100%; content: '';
height: auto; display: block;
padding-top: 86.3%; // Aspect ratio of img
} }
@media @thin-query { @media @thin-query {

7
frontend/client/components/Home/Intro.tsx
View File

@ -32,9 +32,10 @@ const HomeIntro: React.SFC<Props> = ({ t, authUser }) => (
</a> </a>
</div> </div>
</div> </div>
<div className="HomeIntro-illustration"> <div
<img src={HomeIllustration} /> className="HomeIntro-illustration"
</div> style={{ backgroundImage: `url(${HomeIllustration})` }}
/>
</div> </div>
); );