You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
71 lines
2.4 KiB
71 lines
2.4 KiB
5 months ago
|
import * as React from 'react'
|
||
|
import Button from '@mui/material/Button'
|
||
|
import { styled } from '@mui/material/styles'
|
||
|
import Dialog from '@mui/material/Dialog'
|
||
|
import DialogTitle from '@mui/material/DialogTitle'
|
||
|
import DialogContent from '@mui/material/DialogContent'
|
||
|
import DialogActions from '@mui/material/DialogActions'
|
||
|
import IconButton from '@mui/material/IconButton'
|
||
|
import CloseIcon from '@mui/icons-material/Close'
|
||
|
import Typography from '@mui/material/Typography'
|
||
|
|
||
|
const BootstrapDialog = styled(Dialog)(({ theme }) => ({
|
||
|
'& .MuiDialogContent-root': {
|
||
|
padding: theme.spacing(2)
|
||
|
},
|
||
|
'& .MuiDialogActions-root': {
|
||
|
padding: theme.spacing(1)
|
||
|
}
|
||
|
}))
|
||
|
|
||
|
const ViewICale = ({ visibleICale, setVisibleICale }) => {
|
||
|
const handleClickOpen = () => {
|
||
|
setVisibleICale(true)
|
||
|
}
|
||
|
const handleClose = () => {
|
||
|
setVisibleICale(false)
|
||
|
}
|
||
|
|
||
|
return (
|
||
|
<React.Fragment>
|
||
|
<BootstrapDialog onClose={handleClose} aria-labelledby="customized-dialog-title" open={visibleICale}>
|
||
|
<DialogTitle sx={{ m: 0, p: 2 }} id="customized-dialog-title">
|
||
|
Modal title
|
||
|
</DialogTitle>
|
||
|
<IconButton
|
||
|
aria-label="close"
|
||
|
onClick={handleClose}
|
||
|
sx={(theme) => ({
|
||
|
position: 'absolute',
|
||
|
right: 8,
|
||
|
top: 8,
|
||
|
color: theme.palette.grey[500]
|
||
|
})}
|
||
|
>
|
||
|
<CloseIcon />
|
||
|
</IconButton>
|
||
|
<DialogContent dividers>
|
||
|
<Typography gutterBottom>
|
||
|
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur
|
||
|
ac, vestibulum at eros.
|
||
|
</Typography>
|
||
|
<Typography gutterBottom>
|
||
|
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
|
||
|
</Typography>
|
||
|
<Typography gutterBottom>
|
||
|
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec
|
||
|
ullamcorper nulla non metus auctor fringilla.
|
||
|
</Typography>
|
||
|
</DialogContent>
|
||
|
<DialogActions>
|
||
|
<Button autoFocus onClick={handleClose}>
|
||
|
Save changes
|
||
|
</Button>
|
||
|
</DialogActions>
|
||
|
</BootstrapDialog>
|
||
|
</React.Fragment>
|
||
|
)
|
||
|
}
|
||
|
|
||
|
export default ViewICale
|