/
Hero.js
37 lines (34 loc) · 1.17 KB
/
Hero.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
import React from 'react';
import { Grid, Typography, Button, Box } from '@mui/material';
import myteam from '../images/myteam.jpg';
import useStyles from '../styles/styles';
const Hero = () => {
const classes = useStyles();
return (
<Box className={classes.heroBox}>
<Grid container spacing={6} className={classes.gridContainer}>
<Grid item xs={12} md={7}>
<Typography variant="h3" fontWeight={700} className={classes.title}>
Let's scale your business
</Typography>
<Typography variant="h6" className={classes.subtitle}>
Hire professionals who will help your business make 10X your
previous income. With over 5years experience in Marketing & Business
strategy, we are your best client.
</Typography>
<Button
variant="contained"
color="primary"
sx={{ width: '200px', fontSize: '16px' }}
>
HIRE US
</Button>
</Grid>
<Grid item xs={12} md={5}>
<img src={myteam} alt="My Team" className={classes.largeImage} />
</Grid>
</Grid>
</Box>
);
};
export default Hero;