Some checks failed
No response / noResponse (push) Has been cancelled
CI / Continuous releases (push) Has been cancelled
CI / test-dev (macos-latest) (push) Has been cancelled
CI / test-dev (ubuntu-latest) (push) Has been cancelled
CI / test-dev (windows-latest) (push) Has been cancelled
Maintenance / main (push) Has been cancelled
Scorecards supply-chain security / Scorecards analysis (push) Has been cancelled
CodeQL / Analyze (push) Has been cancelled
37 lines
1.2 KiB
TypeScript
37 lines
1.2 KiB
TypeScript
import Button from '@mui/joy/Button';
|
|
import CardOverflow from '@mui/joy/CardOverflow';
|
|
import ModalDialog from '@mui/joy/ModalDialog';
|
|
import DialogTitle from '@mui/joy/DialogTitle';
|
|
import DialogContent from '@mui/joy/DialogContent';
|
|
import DialogActions from '@mui/joy/DialogActions';
|
|
import Divider from '@mui/joy/Divider';
|
|
|
|
export default function DividerInModalDialog() {
|
|
return (
|
|
<ModalDialog
|
|
sx={{
|
|
// this custom styles is for demonstration purpose, you might not need them in your app
|
|
position: 'static',
|
|
transform: 'none',
|
|
maxWidth: 300,
|
|
}}
|
|
>
|
|
<DialogTitle>Modal Title</DialogTitle>
|
|
<Divider inset="none" />
|
|
<DialogContent>
|
|
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
|
|
Lorem Ipsum has been the industry standard dummy text ever since the 1500s
|
|
</DialogContent>
|
|
<CardOverflow sx={{ bgcolor: 'background.level1' }}>
|
|
<Divider inset="context" />
|
|
<DialogActions
|
|
buttonFlex="none"
|
|
sx={{ pt: 1.5, justifyContent: 'flex-start' }}
|
|
>
|
|
<Button size="sm">Got it!</Button>
|
|
</DialogActions>
|
|
</CardOverflow>
|
|
</ModalDialog>
|
|
);
|
|
}
|