57 lines
1.3 KiB
JavaScript
57 lines
1.3 KiB
JavaScript
import React from 'react'
|
|
import PropTypes from 'prop-types'
|
|
import {useRouter} from 'next/router'
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
CardActionArea,
|
|
Typography,
|
|
Grid
|
|
} from '@material-ui/core'
|
|
import {makeStyles} from '@material-ui/core/styles'
|
|
|
|
const useStyles = makeStyles({
|
|
root: {
|
|
minWidth: 275
|
|
},
|
|
bullet: {
|
|
display: 'inline-block',
|
|
margin: '0 2px',
|
|
transform: 'scale(0.8)'
|
|
},
|
|
title: {
|
|
fontSize: 14
|
|
},
|
|
pos: {
|
|
marginBottom: 12
|
|
}
|
|
})
|
|
|
|
export default function KatKayLa({tit, kantite, route}) {
|
|
const classes = useStyles()
|
|
const router = useRouter()
|
|
|
|
return (
|
|
<Grid item xs={12} md={6}>
|
|
<Card className={classes.root} variant='outlined'>
|
|
<CardActionArea onClick={() => router.push(route).then(() => window.scrollTo(0, 0))}>
|
|
<CardContent>
|
|
<Typography gutterBottom align='center' variant='h3' component='h1'>
|
|
{tit}
|
|
</Typography>
|
|
<Typography gutterBottom style={{fontWeight: 'bold'}} align='center' variant='h4' component='h2'>
|
|
{kantite}
|
|
</Typography>
|
|
</CardContent>
|
|
</CardActionArea>
|
|
</Card>
|
|
</Grid>
|
|
)
|
|
}
|
|
|
|
KatKayLa.propTypes = {
|
|
tit: PropTypes.string.isRequired,
|
|
kantite: PropTypes.number.isRequired,
|
|
route: PropTypes.string.isRequired
|
|
}
|