|
1 | 1 | // pages/404.js
|
| 2 | +import Head from "next/head"; |
2 | 3 | import { motion } from "framer-motion";
|
3 | 4 | import Link from 'next/link'
|
4 | 5 |
|
5 | 6 | const Custom404 = () => {
|
6 | 7 | return (
|
7 |
| - <div className="min-h-full px-4 py-16 sm:px-6 sm:py-24 md:grid md:place-items-center lg:px-8"> |
8 |
| - <div className="mx-auto max-w-max"> |
9 |
| - <main className="sm:flex"> |
10 |
| - <p className="bg-gradient-to-r from-pink-500 to-pink-700 bg-clip-text text-4xl font-bold tracking-tight text-transparent sm:text-5xl"> |
11 |
| - 404 |
12 |
| - </p> |
13 |
| - <div className="sm:ml-6"> |
14 |
| - <div className="sm:border-l sm:border-gray-200 sm:pl-6 text-white"> |
15 |
| - <h1 className="text-4xl font-bold tracking-tight sm:text-5xl"> |
16 |
| - Page not found |
17 |
| - </h1> |
18 |
| - <p className="mt-4 text-base text-gray-300"> |
19 |
| - Please check the URL in the address bar and try again. |
20 |
| - </p> |
| 8 | + <> |
| 9 | + <Head> |
| 10 | + <title>404 | WebXDAO</title> |
| 11 | + </Head> |
| 12 | + <div className="min-h-full px-4 py-16 sm:px-6 sm:py-24 md:grid md:place-items-center lg:px-8"> |
| 13 | + <div className="mx-auto max-w-max"> |
| 14 | + <main className="sm:flex"> |
| 15 | + <p className="bg-gradient-to-r from-pink-500 to-pink-700 bg-clip-text text-4xl font-bold tracking-tight text-transparent sm:text-5xl"> |
| 16 | + 404 |
| 17 | + </p> |
| 18 | + <div className="sm:ml-6"> |
| 19 | + <div className="sm:border-l sm:border-gray-200 sm:pl-6 text-white"> |
| 20 | + <h1 className="text-4xl font-bold tracking-tight sm:text-5xl"> |
| 21 | + Page not found |
| 22 | + </h1> |
| 23 | + <p className="mt-4 text-base text-gray-300"> |
| 24 | + Please check the URL in the address bar and try again. |
| 25 | + </p> |
| 26 | + </div> |
| 27 | + <div className="mt-10 flex space-x-3 sm:border-l sm:border-transparent sm:pl-6"> |
| 28 | + <Link href="/"> |
| 29 | + <motion.a |
| 30 | + className="inline-flex items-center justify-center px-4 py-3 text-base font-medium transition-all duration-100 border border-transparent rounded-md shadow-sm hover:border-white/80 bg-cyber-webx text-white/80 hover:text-white hover:bg-gradient-to-r hover:from-pink-700 hover:to-pink-900 focus:outline-none focus:ring-2 focus:ring-cyber-webx focus:ring-offset-2" |
| 31 | + whileHover={{ scale: 1.05 }} |
| 32 | + whileTap={{ scale: 1 }} |
| 33 | + href="/" |
| 34 | + > |
| 35 | + Go back home |
| 36 | + </motion.a> |
| 37 | + </Link> |
| 38 | + {/* <Link href="/support"> |
| 39 | + <a className="inline-flex items-center rounded-md border border-transparent bg-pink-100 px-4 py-2 text-sm font-medium text-black hover:bg-pink-200 focus:outline-none focus:ring-2 focus:ring-pink-500 focus:ring-offset-2"> |
| 40 | + Contact support |
| 41 | + </a> |
| 42 | + </Link> */} |
| 43 | + </div> |
21 | 44 | </div>
|
22 |
| - <div className="mt-10 flex space-x-3 sm:border-l sm:border-transparent sm:pl-6"> |
23 |
| - <Link href="/"> |
24 |
| - <motion.a |
25 |
| - className="inline-flex items-center justify-center px-4 py-3 text-base font-medium transition-all duration-100 border border-transparent rounded-md shadow-sm hover:border-white/80 bg-cyber-webx text-white/80 hover:text-white hover:bg-gradient-to-r hover:from-pink-700 hover:to-pink-900 focus:outline-none focus:ring-2 focus:ring-cyber-webx focus:ring-offset-2" |
26 |
| - whileHover={{ scale: 1.05 }} |
27 |
| - whileTap={{ scale: 1 }} |
28 |
| - href="/" |
29 |
| - > |
30 |
| - Go back home |
31 |
| - </motion.a> |
32 |
| - </Link> |
33 |
| - {/* <Link href="/support"> |
34 |
| - <a className="inline-flex items-center rounded-md border border-transparent bg-pink-100 px-4 py-2 text-sm font-medium text-black hover:bg-pink-200 focus:outline-none focus:ring-2 focus:ring-pink-500 focus:ring-offset-2"> |
35 |
| - Contact support |
36 |
| - </a> |
37 |
| - </Link> */} |
38 |
| - </div> |
39 |
| - </div> |
40 |
| - </main> |
| 45 | + </main> |
| 46 | + </div> |
41 | 47 | </div>
|
42 |
| - </div> |
| 48 | + </> |
43 | 49 | )
|
44 | 50 | }
|
45 | 51 |
|
|
0 commit comments