/
githubmirror
/
material-ui
Обзор
Документация
Войти
/
githubmirror
/
material-ui
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
docs/data/material/components/dialogs/ResponsiveDialog.js
55 строк
2 KB
Zeeshan Tamboli
[docs][material-ui] Improve Dialog demos (#39642)
30 окт 2023, 09:12
Не верифицирован
30 окт 2023, 09:12
8eb3c1f
Код
Авторство
О чём код?
import * as React from 'react'; import Button from '@mui/material/Button'; import Dialog from '@mui/material/Dialog'; import DialogActions from '@mui/material/DialogActions'; import DialogContent from '@mui/material/DialogContent'; import DialogContentText from '@mui/material/DialogContentText'; import DialogTitle from '@mui/material/DialogTitle'; import useMediaQuery from '@mui/material/useMediaQuery'; import { useTheme } from '@mui/material/styles'; export default function ResponsiveDialog() { const [open, setOpen] = React.useState(false); const theme = useTheme(); const fullScreen = useMediaQuery(theme.breakpoints.down('md')); const handleClickOpen = () => { setOpen(true); }; const handleClose = () => { setOpen(false); }; return ( <React.Fragment> <Button variant="outlined" onClick={handleClickOpen}> Open responsive dialog </Button> <Dialog fullScreen={fullScreen} open={open} onClose={handleClose} aria-labelledby="responsive-dialog-title" > <DialogTitle id="responsive-dialog-title"> {"Use Google's location service?"} </DialogTitle> <DialogContent> <DialogContentText> Let Google help apps determine location. This means sending anonymous location data to Google, even when no apps are running. </DialogContentText> </DialogContent> <DialogActions> <Button autoFocus onClick={handleClose}> Disagree </Button> <Button onClick={handleClose} autoFocus> Agree </Button> </DialogActions> </Dialog> </React.Fragment> ); }