Skip to content
Snippets Groups Projects
Verified Commit fe0ad4c2 authored by Defendi Alberto's avatar Defendi Alberto
Browse files

Merge @fmazzini homepage.

parent 9e46aeee
No related branches found
No related tags found
2 merge requests!56Refined auth flow and new website pages.,!47Merge @fmazzini components.
Pipeline #12243 passed
import React, { FC } from 'react';
import Button from '@material-ui/core/Button';
import { Link } from 'react-router-dom';
import { NonAuthRoutes } from 'api/routes';
export const LandingPage: FC = () => (
<>
<Button variant="contained">
<Link to={`/auth${NonAuthRoutes.signIn}`}>Log in</Link>
</Button>
<Button variant="contained">
<Link to={`/auth${NonAuthRoutes.signUp}`}>Sign up</Link>
</Button>
<section>
<h2>What is MoveAid?</h2>
<p>
MoveAid is a project born in order to satisfy a specific problem. There
are many senior citizens who are not able to drive and move from a place
to another easily, because of this they sometimes need to take private
Taxis or public means of transport which could be expensive and not
simple. MoveAid wants to be the solution to this problem offering free
drives (carried out by voulunteers) for those who need them to reach
medical visit, to go to the supermarket or to satisfy any other need.
</p>
</section>
<section>
<h2>How will MoveAid work?</h2>
<p>
MoveAid will be the platform that will allow people to ask for a drive
(either by phone or online) and organizations of voulenteers to organise
and accept drives.
</p>
</section>
<p>
<br />
</p>
<footer>
<p>
Authors: Alberto Defendi, Andrea Esposito, Marco Marinello, Francesco
Mazzini
</p>
<p>&copy 2021 - All right reserved</p>
</footer>
</>
);
import { makeStyles } from '@material-ui/core/styles';
import {
CssBaseline,
Grid,
Typography,
Hidden,
createMuiTheme,
responsiveFontSizes,
MuiThemeProvider,
Container,
} from '@material-ui/core';
import { MapElement } from 'components/AuthUser/Dashboard/HomePage/MapElement';
import { NavBarLogin } from 'components/AuthUser/Dashboard/HomePage/NavBarLogin';
import { Numbers } from 'components/AuthUser/Dashboard/HomePage/Numbers';
import { Steps } from 'components/AuthUser/Dashboard/HomePage/Steps';
let themeResp = createMuiTheme();
themeResp = responsiveFontSizes(themeResp);
const useStyles = makeStyles(() => ({
root: {
minHeight: '100vh',
backgroundImage: `url(${'/assets/bg3.png'})`,
backgroundRepeat: 'no-repeat',
backgroundSize: 'cover',
},
rightAlign: {
marginLeft: 'auto',
},
whiteText: {
color: 'white',
},
imageIcon: {
maxHeight: '50%',
},
paddingBottom: {
paddingBottom: '65px',
},
paddingTop: {
paddingTop: '65px',
},
bodyIcon: {
fontSize: '90px',
paddingBottom: '10px',
paddingTop: '10px',
},
contIcon: {
width: '100%',
left: '0',
right: '0',
},
noShadow: {
border: 'none',
boxShadow: 'none',
backgroundColor: 'transparent',
},
}));
export const LandingPage: FC = () => {
const classes = useStyles();
return (
<Grid container direction="column" className={classes.paddingBottom}>
<div className={classes.root}>
<CssBaseline />
<Grid item>
<NavBarLogin />
</Grid>
<MuiThemeProvider theme={themeResp}>
<Grid item container className={classes.paddingBottom}>
<Grid item xs={1} md={2} lg={2} />
<Grid item xs={10} md={6} lg={4}>
<Typography variant="h2" className={classes.whiteText}>
Book Free Rides Now With
</Typography>
<Typography variant="h1" className={classes.whiteText}>
MOVE AID
</Typography>
</Grid>
<Grid item xs={false} md={3} lg={5}>
<Hidden mdDown>
<Container>
<MapElement />
</Container>
</Hidden>
</Grid>
<Grid item xs={1} />
</Grid>
<Steps />
</MuiThemeProvider>
</div>
<Grid item container className={classes.paddingTop}>
<Grid item xs={2} />
<Grid item xs={8}>
<Typography variant="h3" align="right">
Some Our Numbers
</Typography>
</Grid>
<Grid item xs={2} />
</Grid>
<Numbers />
</Grid>
);
};
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment