Files
hotel-fe/src/pages/blank/NotFound.jsx
2025-09-25 09:56:27 +07:00

86 lines
2.4 KiB
JavaScript

import { Button, Typography } from 'antd';
import { Link } from 'react-router-dom';
// import ImgRobot from '../../assets/freepik/404.png';
const { Title, Paragraph, Text } = Typography;
const NotFound = () => {
return (
<div
style={{
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
backgroundColor: '#fafafa',
padding: '5vh 16px',
textAlign: 'center',
minHeight: '100vh',
}}
>
<Title
level={2}
style={{
fontWeight: 800,
marginBottom: 12,
fontSize: 'clamp(28px, 5vw, 42px)',
color: '#1f1f1f',
}}
>
Oops... You seem lost.
</Title>
<Paragraph
style={{
fontSize: 'clamp(14px, 2vw, 18px)',
maxWidth: '90%',
color: '#595959',
marginBottom: '3vh',
}}
>
We couldn't find the page you were looking for. Let us take you back to the main
page.
</Paragraph>
{/* <img
src={ImgRobot}
alt="404 Not Found"
style={{
maxWidth: '90%',
width: '480px',
marginBottom: '4vh',
}}
/> */}
<Link to="/">
<Button
type="default"
size="large"
style={{
backgroundColor: '#2f2f2f',
color: '#fff',
border: 'none',
padding: '10px 20px',
}}
>
Go back
</Button>
</Link>
<Text type="secondary" style={{ fontSize: '12px', marginTop: '5vh' }}>
Illustration by{' '}
<a
href="https://www.freepik.com"
target="_blank"
rel="noopener noreferrer"
style={{ color: '#1890ff' }}
>
Freepik
</a>
</Text>
</div>
);
};
export default NotFound;