42 lines
2.0 KiB
TypeScript
42 lines
2.0 KiB
TypeScript
|
import { Box, Button, CssBaseline, Grid, Typography } from "@mui/material"
|
|||
|
import { ThemeProvider } from "@mui/material/styles"
|
|||
|
import { theme } from ".."
|
|||
|
import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline'
|
|||
|
import { useNavigate } from "react-router-dom"
|
|||
|
|
|||
|
export const PageNotFound = () => {
|
|||
|
const navigate = useNavigate()
|
|||
|
|
|||
|
return <ThemeProvider theme={theme}>
|
|||
|
<CssBaseline />
|
|||
|
<Box style={{ 'minWidth': '100%', 'minHeight': '100%', 'display': 'flex' }}>
|
|||
|
<Grid container direction="row" justifyContent="center" alignItems="center" spacing={3}>
|
|||
|
<Grid item>
|
|||
|
<ErrorOutlineIcon style={{width: '11rem', height: '11rem'}}/>
|
|||
|
</Grid>
|
|||
|
|
|||
|
<Grid item style={{ 'maxWidth': '50%', 'maxHeight': '80%'}}>
|
|||
|
<Grid container direction="column" justifyContent="center" alignItems="flex-start" spacing={1}>
|
|||
|
<Grid item>
|
|||
|
<Typography variant="h3">
|
|||
|
Oops! Page not found!
|
|||
|
</Typography>
|
|||
|
</Grid>
|
|||
|
|
|||
|
<Grid item style={{ 'maxWidth': '85%', 'maxHeight': '60%'}}>
|
|||
|
<Typography variant="body1" display="block" gutterBottom>
|
|||
|
您要访问的页面不存在!请确认您是不是瞎几把输入了个URL然后就访问。如果不是那就是出bug了,带上你访问的URL截图发给<strong> Lama </strong><div style={{'color': 'rgba(0,0,0,0)'}}>也解决不了</div>
|
|||
|
</Typography>
|
|||
|
</Grid>
|
|||
|
|
|||
|
<Grid item>
|
|||
|
<Button variant="contained" color="primary" onClick={() => { navigate('/') }}>
|
|||
|
返回主页
|
|||
|
</Button>
|
|||
|
</Grid>
|
|||
|
</Grid>
|
|||
|
</Grid>
|
|||
|
</Grid>
|
|||
|
</Box>
|
|||
|
</ThemeProvider>
|
|||
|
}
|