#24

2025-07-17 04:51:57 +09:00
parent 88bf6c8446
commit 315d511f41
11 changed files with 136 additions and 55 deletions
@@ -0,0 +1,48 @@
+import { Helmet } from 'react-helmet-async'
+
+import errorImg from '@/assets/images/not-found.gif'
+import MainArea from '@/components/layout/MainArea'
+import { SITE_TITLE } from '@/config'
+
+type Props = { status: number }
+
+
+export default ({ status }: Props) => {
+  const [message, rightMsg, leftMsg]: [string, string, string] = (() => {
+    switch (status)
+    {
+    case 403:
+      return ['権限ないよ（笑）', '帰れ！', '帰れ！']
+    case 404:
+      return ['ページないよ（笑）', '帰れ！', '帰れ！']
+    case 500:
+      return ['鯖でエラー出たって（嘲笑）', '管理人に', '聯絡を！']
+    case 503:
+      return ['鯖死んでるよ（泣）', '管理人に', '聯絡を！']
+    default:
+      throw new Error
+    }
+  }) ()
+
+  const title = message.replaceAll ('（', ' (').replaceAll ('）', ')')
+
+  return (
+      <MainArea>
+	<Helmet>
+	  <meta name="robots" content="noindex" />
+	  <title>{title} | {SITE_TITLE}</title>
+	</Helmet>
+	<div className="text-6xl font-bold text-transparent whitespace-nowrap
+			bg-[linear-gradient(90deg,#ff0000,#ff8800,#ffff00,#00ff00,#00ffff,#0000ff,#ff00ff,#ff0000)]
+			bg-clip-text bg-[length:200%_100%] animate-rainbow-scroll drop-shadow-[0_0_6px_black]
+			space-y-6 text-center flex flex-col justify-center items-center">
+	  <p>{status}</p>
+	  <div className="flex space-x-4">
+	    <p style={{ writingMode: 'vertical-rl' }}>{leftMsg}</p>
+	    <img src={errorImg} alt="逃げたギター" />
+	    <p style={{ writingMode: 'vertical-rl' }}>{rightMsg}</p>
+	  </div>
+	  <p className="mr-[-.5em]">{message}</p>
+	</div>
+      </MainArea>)
+}