1import React from 'react';
 2import {makeStyles} from '@material-ui/core/styles';
 3import logo from '../../assets/logo.png';
 4
 5const Logo = () => {
 6  const classes = useStyles();
 7  return (
 8    <div className={classes.layout}>
 9      <a href="https://caroster.io" className={classes.link}>
10        <img src={logo} alt="Caroster" className={classes.logo} />
11      </a>
12    </div>
13  );
14};
15
16const useStyles = makeStyles(theme => ({
17  layout: {
18    display: 'flex',
19    justifyContent: 'center',
20    alignItems: 'center',
21    paddingTop: theme.spacing(4),
22    paddingBottom: theme.spacing(4),
23  },
24  link: {
25    width: '100%',
26  },
27  logo: {
28    display: 'block',
29    width: '40%',
30    height: 'auto',
31    margin: '0 auto',
32  },
33}));
34export default Logo;