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 React, { FC } from 'react';
import Button from '@material-ui/core/Button'; import { makeStyles } from '@material-ui/core/styles';
import { Link } from 'react-router-dom'; import {
import { NonAuthRoutes } from 'api/routes'; CssBaseline,
Grid,
export const LandingPage: FC = () => ( Typography,
<> Hidden,
<Button variant="contained"> createMuiTheme,
<Link to={`/auth${NonAuthRoutes.signIn}`}>Log in</Link> responsiveFontSizes,
</Button> MuiThemeProvider,
<Button variant="contained"> Container,
<Link to={`/auth${NonAuthRoutes.signUp}`}>Sign up</Link> } from '@material-ui/core';
</Button> import { MapElement } from 'components/AuthUser/Dashboard/HomePage/MapElement';
<section> import { NavBarLogin } from 'components/AuthUser/Dashboard/HomePage/NavBarLogin';
<h2>What is MoveAid?</h2> import { Numbers } from 'components/AuthUser/Dashboard/HomePage/Numbers';
import { Steps } from 'components/AuthUser/Dashboard/HomePage/Steps';
<p>
MoveAid is a project born in order to satisfy a specific problem. There let themeResp = createMuiTheme();
are many senior citizens who are not able to drive and move from a place themeResp = responsiveFontSizes(themeResp);
to another easily, because of this they sometimes need to take private
Taxis or public means of transport which could be expensive and not const useStyles = makeStyles(() => ({
simple. MoveAid wants to be the solution to this problem offering free root: {
drives (carried out by voulunteers) for those who need them to reach minHeight: '100vh',
medical visit, to go to the supermarket or to satisfy any other need. backgroundImage: `url(${'/assets/bg3.png'})`,
</p> backgroundRepeat: 'no-repeat',
</section> backgroundSize: 'cover',
},
<section> rightAlign: {
<h2>How will MoveAid work?</h2> marginLeft: 'auto',
},
<p> whiteText: {
MoveAid will be the platform that will allow people to ask for a drive color: 'white',
(either by phone or online) and organizations of voulenteers to organise },
and accept drives. imageIcon: {
</p> maxHeight: '50%',
</section> },
paddingBottom: {
<p> paddingBottom: '65px',
<br /> },
</p> paddingTop: {
paddingTop: '65px',
<footer> },
<p> bodyIcon: {
Authors: Alberto Defendi, Andrea Esposito, Marco Marinello, Francesco fontSize: '90px',
Mazzini paddingBottom: '10px',
</p> paddingTop: '10px',
<p>&copy 2021 - All right reserved</p> },
</footer> 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