Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 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 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 | 61x | /* eslint-disable react/jsx-key */
import React from 'react';
import { Grid } from "@material-ui/core";
import Card from '@material-ui/core/Card';
import CardMedia from '@material-ui/core/CardMedia';
import Paper from '@material-ui/core/Paper';
import Button from '@material-ui/core/Button';
import { Link } from 'react-router-dom';
import Typography from '@material-ui/core/Typography';
import useStyles from './styles.js';
const FAQCardDesktop = (props) => {
const items = props.items;
const classes = useStyles();
return (
<>
{items.map((i) => {
let card;
if (i.title === 'img-4') {
card = <div>
<Grid item>
<Paper elevation={0} className={classes.innerTextCardContainer}>
<Typography className={classes.faqCardHeading} gutterBottom variant="h4">
{i.heading}
</Typography>
<Typography variant="h6" className={classes.faqPHeading}>
{i.subHeading}
</Typography>
<br></br>
<Typography className={classes.faqRightDtpLine1}>
{i.dsktpTxtLn1}
</Typography>
<Typography className={classes.faqRightDtpLine2}>
{i.dsktpTxtLn2}
</Typography>
<Typography className={classes.faqLinkText}>
View our <Link to="/faq">FAQ</Link>
to find answers or <a className={classes.inLineLinkText} href="mailto:civictechindex@hackforla.org">contact us.</a>
</Typography>
<Button component={Link} to='/faq' className={classes.faqButton}>
{i.buttonText}
</Button>
</Paper>
</Grid>
<Grid item >
<Card className={classes.imgCardLeft}>
<CardMedia
className={classes.cardMedia}
image={i.src}
/>
</Card>
</Grid>
</div>
}
return (
<Grid container className={classes.gridCont} align='center' >
<Card className={classes.outerCard}>
{card}
</Card>
</Grid>
)
})}
</>
);
}
export default FAQCardDesktop;
|