Edit and move KatRezo component

This commit is contained in:
Cédric FAMIBELLE-PRONZOLA
2022-05-08 23:46:02 +04:00
parent bf97113eb5
commit f69dfeeff5
@@ -2,14 +2,14 @@ import {useState} from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import Card from '@mui/material/Card' import Card from '@mui/material/Card'
import CardContent from '@mui/material/CardContent' import CardContent from '@mui/material/CardContent'
import Button from '@mui/material/Button'
import CardActionArea from '@mui/material/CardActionArea' import CardActionArea from '@mui/material/CardActionArea'
import CardActions from '@mui/material/CardActions'
import Divider from '@mui/material/Divider' import Divider from '@mui/material/Divider'
import Grid from '@mui/material/Grid' import Grid from '@mui/material/Grid'
import Typography from '@mui/material/Typography' import Typography from '@mui/material/Typography'
import RezoImaj from './rezo-imaj' import {CardMedia} from '@mui/material'
import RezoImaj from '../rezo-imaj'
export default function KatRezoNou({tit, img, soutit, ko, lyen}) { export default function KatRezoNou({tit, img, soutit, ko, lyen}) {
const [open, setOpen] = useState(false) const [open, setOpen] = useState(false)
@@ -20,30 +20,35 @@ export default function KatRezoNou({tit, img, soutit, ko, lyen}) {
return ( return (
<> <>
<Grid item xs={12} md={6} sx={{marginBottom: 3}}> <Grid item xs={12} md={6} sx={{marginBottom: 2}}>
<Card raised> <Card raised>
<CardActionArea onClick={handleClickOpen}> <CardActionArea onClick={handleClickOpen}>
<Typography color='primary' sx={{margin: 1, fontSize: 16}} variant='button' component='div'> <CardMedia
<strong>Aperçu</strong> component='img'
</Typography> height='140'
image={`/captures/${img}.png`}
alt={`Aperçu ${tit}`}
/>
<CardContent>
<Typography color='primary' variant='h6' component='div'>
{tit}
</Typography>
<Typography variant='h6' component='div'>
{soutit}
</Typography>
<Typography variant='body2'>
{ko}
</Typography>
</CardContent>
</CardActionArea> </CardActionArea>
<Divider sx={{borderWidth: 1}} /> <Divider sx={{borderWidth: 1}} />
<CardContent> <CardActionArea onClick={() => window.open(lyen, '_blank')}>
<Button sx={{fontSize: 25}} onClick={() => window.open(lyen, '_blank')}> <CardContent>
{tit} <Typography textAlign='center' color='primary' variant='h6' component='div'>
</Button> Accéder à {tit}
<Typography variant='h6' component='div'> </Typography>
{soutit} </CardContent>
</Typography> </CardActionArea>
<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> </Card>
</Grid> </Grid>
<RezoImaj tit={tit} img={img} open={open} setOpen={setOpen} /> <RezoImaj tit={tit} img={img} open={open} setOpen={setOpen} />