Cédric FAMIBELLE-PRONZOLA
61 lines
1.9 KiB
JavaScript
61 lines
1.9 KiB
JavaScript
import {useState} from 'react'
|
|
import PropTypes from 'prop-types'
|
|
import Card from '@mui/material/Card'
|
|
import CardContent from '@mui/material/CardContent'
|
|
import Button from '@mui/material/Button'
|
|
import CardActionArea from '@mui/material/CardActionArea'
|
|
import CardActions from '@mui/material/CardActions'
|
|
import Divider from '@mui/material/Divider'
|
|
import Grid from '@mui/material/Grid'
|
|
|
|
import Typography from '@mui/material/Typography'
|
|
import RezoImaj from './rezo-imaj'
|
|
|
|
export default function KatRezoNou({tit, img, soutit, ko, lyen}) {
|
|
const [open, setOpen] = useState(false)
|
|
|
|
const handleClickOpen = () => {
|
|
setOpen(true)
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Grid item xs={12} md={6} sx={{marginBottom: 3}}>
|
|
<Card raised>
|
|
<CardActionArea onClick={handleClickOpen}>
|
|
<Typography color='primary' sx={{margin: 1, fontSize: 16}} variant='button' component='div'>
|
|
<strong>Aperçu</strong>
|
|
</Typography>
|
|
</CardActionArea>
|
|
<Divider sx={{borderWidth: 1}} />
|
|
<CardContent>
|
|
<Button sx={{fontSize: 25}} onClick={() => window.open(lyen, '_blank')}>
|
|
{tit}
|
|
</Button>
|
|
<Typography variant='h6' component='div'>
|
|
{soutit}
|
|
</Typography>
|
|
<Typography variant='body2'>
|
|
{ko}
|
|
</Typography>
|
|
</CardContent>
|
|
<CardActions sx={{textAlign: 'center'}}>
|
|
<Button variant='outlined' size='small' color='primary' onClick={() => window.open(lyen, '_blank')}>
|
|
Accéder à {tit}
|
|
</Button>
|
|
</CardActions>
|
|
</Card>
|
|
</Grid>
|
|
<RezoImaj tit={tit} img={img} open={open} setOpen={setOpen} />
|
|
</>
|
|
)
|
|
}
|
|
|
|
KatRezoNou.propTypes = {
|
|
tit: PropTypes.string.isRequired,
|
|
img: PropTypes.string.isRequired,
|
|
soutit: PropTypes.string.isRequired,
|
|
ko: PropTypes.string.isRequired,
|
|
lyen: PropTypes.string.isRequired
|
|
}
|