e.xyehr.cn
[READ-ONLY] One Calendar is a privacy-first calendar web app built with Next.js. It has modern security features, including e2ee, password-protected sharing, and self-destructing share links 📅
calendar.xyehr.cn
nextjs
1.8 kB
55 lines
1'use client'
2
3import Link from 'next/link'
4import { Button } from '@/components/ui/button'
5import { isZhLanguage, useLanguage } from '@/lib/i18n'
6
7export default function NotFound() {
8 const [language] = useLanguage()
9 const lang: 'zh' | 'en' = isZhLanguage(language) ? 'zh' : 'en'
10
11 const messages = {
12 zh: {
13 title: '页面未找到',
14 description: '抱歉，您访问的页面不存在或已被移动。',
15 button: '返回首页',
16 },
17 en: {
18 title: 'Page Not Found',
19 description:
20 'Sorry, the page you’re looking for doesn’t exist or has been moved.',
21 button: 'Go Back Home',
22 },
23 }
24
25 const t = messages[lang]
26
27 return (
28 <div className="flex flex-col items-center justify-center min-h-screen text-center px-4">
29 <div className="fixed -z-10 inset-0">
30 <div className="absolute inset-0 bg-white dark:bg-black">
31 <div
32 className="absolute inset-0"
33 style={{
34 backgroundImage: `radial-gradient(circle at 1px 1px, rgba(0, 0, 0, 0.1) 1px, transparent 0)`,
35 backgroundSize: '24px 24px',
36 }}
37 />
38 <div
39 className="absolute inset-0 dark:block hidden"
40 style={{
41 backgroundImage: `radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.15) 1px, transparent 0)`,
42 backgroundSize: '24px 24px',
43 }}
44 />
45 </div>
46 </div>
47 <h1 className="text-6xl font-bold mb-4">404</h1>
48 <h2 className="text-2xl font-semibold mb-2">{t.title}</h2>
49 <p className="text-gray-500 mb-6">{t.description}</p>
50 <Link href="/" passHref>
51 <Button variant="outline">{t.button}</Button>
52 </Link>
53 </div>
54 )
55}