onedrive/components/FourOhFour.tsx

36 lines
1.3 KiB
TypeScript
Raw Normal View History

2021-06-25 14:15:00 +00:00
import Image from 'next/image'
const FourOhFour: React.FC<{ errorMsg: string }> = ({ errorMsg }) => {
2021-06-25 14:15:00 +00:00
return (
<div className="my-12">
2021-12-31 13:55:41 +00:00
<div className="w-1/3 mx-auto">
2022-01-02 15:32:16 +00:00
<Image src='/images/fabulous-rip-2.png' alt="404" width={912} height={912} priority />
2021-08-30 13:34:37 +00:00
</div>
2021-12-18 03:00:08 +00:00
<div className="mt-6 text-gray-500 max-w-xl mx-auto">
<div className="text-xl font-bold mb-8">
2021-12-18 03:00:08 +00:00
Oops, that&apos;s a <span className="underline decoration-wavy decoration-red-500">four-oh-four</span>.
</div>
<div className="font-mono border border-gray-400/20 rounded p-2 mb-4 text-xs bg-gray-50 dark:bg-gray-800">
2021-12-18 03:00:08 +00:00
{errorMsg}
</div>
<div className="text-sm">
2021-12-18 03:00:08 +00:00
Press{' '}
<kbd className="border-opacity-20 font-mono text-xs p-1 bg-gray-100 dark:bg-gray-800 border rounded">F12</kbd>{' '}
2021-12-18 03:00:08 +00:00
and open devtools for more details, or seek help at{' '}
<a
className="text-blue-600 hover:text-blue-700 hover:underline"
href="https://github.com/spencerwooo/onedrive-vercel-index/discussions"
target="_blank"
rel="noopener noreferrer"
>
onedrive-vercel-index discussions
</a>
.
</div>
2021-06-25 14:15:00 +00:00
</div>
</div>
)
}
export default FourOhFour