add footer links

This commit is contained in:
Barry Gitarts 2019-11-22 14:35:02 -05:00 committed by Barry G
parent 10fbd9eb08
commit d755557207
1 changed files with 38 additions and 11 deletions

View File

@ -5,7 +5,6 @@ import assemble from '../images/assemble-high-res.png'
import github from './image/github-logo.png' import github from './image/github-logo.png'
import statusGrey from './image/status-grey.png' import statusGrey from './image/status-grey.png'
import statusLogoText from './image/status-logo-text.png' import statusLogoText from './image/status-logo-text.png'
import twitter from './image/twitter-logo-button.png'
import classNames from 'classnames' import classNames from 'classnames'
import Typography from '@material-ui/core/Typography' import Typography from '@material-ui/core/Typography'
import { Divider} from '@material-ui/core' import { Divider} from '@material-ui/core'
@ -20,7 +19,7 @@ const style = ({
height: '12rem', height: '12rem',
marginTop: '5rem', marginTop: '5rem',
[up('md')]: { [up('md')]: {
gridTemplateRows: '4rem 3rem repeat(4, 2rem) 4rem' gridTemplateRows: '4rem 3rem repeat(5, 2rem) 4rem'
} }
}, },
assemble: { assemble: {
@ -89,7 +88,7 @@ const style = ({
const useStyle = makeStyles(style) const useStyle = makeStyles(style)
const Footer = () => { const Footer = () => {
const classes = useStyle() const classes = useStyle()
const { middle, midRight, text, header } = classes const { middle, midRight, text, header, link } = classes
return ( return (
<div className={classes.main}> <div className={classes.main}>
<Divider className={classes.divider} /> <Divider className={classes.divider} />
@ -103,16 +102,44 @@ const Footer = () => {
We are part of We are part of
<img src={statusLogoText} className={classes.statusLogoText} /> <img src={statusLogoText} className={classes.statusLogoText} />
</Typography> </Typography>
<img src={github} className={classes.github} /> <a href="https://github.com/status-im/liquid-funding" className={classNames(link, classes.github)}>
<img src={statusGrey} className={classes.statusGrey} /> <img src={github} className={classes.github} />
<img src={twitter} className={classes.twitter} /> </a>
<a href="https://status.im" className={classNames(link, classes.statusGrey)}>
<img src={statusGrey} className={classes.statusGrey} />
</a>
<Typography className={classNames(middle, text)}>Assemble</Typography> <Typography className={classNames(middle, text)}>Assemble</Typography>
<Typography className={classNames(midRight, text)}>Status</Typography> <Typography className={classNames(midRight, text)}>
<a href="https://status.im" className={classNames(text, link)}>
Status
</a>
</Typography>
<Typography className={classNames(middle, text)}>fund</Typography> <Typography className={classNames(middle, text)}>fund</Typography>
<Typography className={classNames(midRight, text)}>Keycard</Typography> <Typography className={classNames(midRight, text)}>
<Typography className={classNames(midRight, text)}>Embark</Typography> <a href="https://keycard.tech/" className={classNames(text, link)}>
<Typography className={classNames(midRight, text)}>Teller</Typography> Keycard
<Typography className={classNames(midRight, text)}>Nimbus</Typography> </a>
</Typography>
<Typography className={classNames(midRight, text)}>
<a href="https://dap.ps/" className={classNames(text, link)}>
dap.ps
</a>
</Typography>
<Typography className={classNames(midRight, text)}>
<a href="https://embark.status.im/" className={classNames(text, link)}>
Embark
</a>
</Typography>
<Typography className={classNames(midRight, text)}>
<a href="https://nimbus.team" className={classNames(text, link)}>
Nimbus
</a>
</Typography>
<Typography className={classNames(midRight, text)}>
<a href="https://vac.dev" className={classNames(text, link)}>
Vac
</a>
</Typography>
</div> </div>
) )
} }