Cédric FAMIBELLE-PRONZOLA
68 lines
1.7 KiB
JavaScript
68 lines
1.7 KiB
JavaScript
import PropTypes from 'prop-types'
|
|
import {useRouter} from 'next/router'
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
CardActionArea,
|
|
Typography,
|
|
Grid
|
|
} from '@mui/material'
|
|
import {styled} from '@mui/material/styles'
|
|
|
|
const PREFIX = 'kat-kay-la'
|
|
|
|
const classes = {
|
|
root: `${PREFIX}-root`,
|
|
bullet: `${PREFIX}-bullet`,
|
|
title: `${PREFIX}-title`,
|
|
pos: `${PREFIX}-pos`
|
|
}
|
|
|
|
const StyledGrid = styled(Grid)({
|
|
[`& .${classes.root}`]: {
|
|
minWidth: 275
|
|
},
|
|
[`& .${classes.bullet}`]: {
|
|
display: 'inline-block',
|
|
margin: '0 2px',
|
|
transform: 'scale(0.8)'
|
|
},
|
|
[`& .${classes.title}`]: {
|
|
fontSize: 14
|
|
},
|
|
[`& .${classes.pos}`]: {
|
|
marginBottom: 12
|
|
}
|
|
})
|
|
|
|
export default function KatKayLa({tit, soutit, kantite, route}) {
|
|
const router = useRouter()
|
|
|
|
return (
|
|
<StyledGrid item xs={12} md={6}>
|
|
<Card className={classes.root} variant='outlined'>
|
|
<CardActionArea onClick={() => router.push(route).then(() => window.scrollTo(0, 0))}>
|
|
<CardContent>
|
|
<Typography style={{display: 'flex', justifyContent: 'center', alignItems: 'center'}} align='center' variant='h3' component='h1'>
|
|
{tit}
|
|
<Typography style={{marginLeft: 5}} variant='overline'>
|
|
({soutit})
|
|
</Typography>
|
|
</Typography>
|
|
<Typography gutterBottom style={{fontWeight: 'bold'}} align='center' variant='h4' component='h2'>
|
|
{kantite}
|
|
</Typography>
|
|
</CardContent>
|
|
</CardActionArea>
|
|
</Card>
|
|
</StyledGrid>
|
|
)
|
|
}
|
|
|
|
KatKayLa.propTypes = {
|
|
tit: PropTypes.string.isRequired,
|
|
soutit: PropTypes.string.isRequired,
|
|
kantite: PropTypes.number.isRequired,
|
|
route: PropTypes.string.isRequired
|
|
}
|