59 lines
2.7 KiB
TypeScript
59 lines
2.7 KiB
TypeScript
import { Paper, 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"
|
||
import "./custom.css"
|
||
|
||
export const PageNotFound = () => {
|
||
const navigate = useNavigate()
|
||
|
||
return <ThemeProvider theme={theme}>
|
||
<CssBaseline />
|
||
<div className="rootPanel">
|
||
|
||
<Box>
|
||
<Grid container direction="column" justifyContent="center" alignItems="center" spacing={1}>
|
||
<Paper elevation={3} className="inlineBox">
|
||
<Grid container direction="column" justifyContent="center" alignItems="center" spacing={3}>
|
||
<Grid item><Grid container direction="row" alignItems="center">
|
||
<ErrorOutlineIcon style={{
|
||
width: '3rem',
|
||
height: '3rem',
|
||
marginRight: '0.5rem'
|
||
}}/>
|
||
<Typography variant="h5">
|
||
Oops! 网页娘迷路了~
|
||
</Typography>
|
||
</Grid></Grid>
|
||
|
||
<Grid item style={{
|
||
color: "pink",
|
||
lineHeight: "5px"
|
||
}}>
|
||
<Typography>
|
||
如果你看到这个页面，那大概率是你乱访问了一个不存在的地址。
|
||
</Typography>
|
||
</Grid>
|
||
<Grid item>
|
||
<Typography>
|
||
如果不是这样的，那可能是网页出现了Bug，请截图发送给开发者 Qumolama.d 以寻求帮助。
|
||
</Typography>
|
||
</Grid>
|
||
<Grid item>
|
||
<Button variant="contained" color="primary" onClick={() => { navigate('/') }}>
|
||
返回主页
|
||
</Button>
|
||
</Grid>
|
||
<Grid item>
|
||
<Button variant="contained" color="primary" href="https://t.me/qumolama" target="_blank">
|
||
找开发者击剑
|
||
</Button>
|
||
</Grid>
|
||
</Grid>
|
||
</Paper>
|
||
</Grid>
|
||
</Box>
|
||
</div>
|
||
</ThemeProvider>
|
||
} |