diff --git a/components/ErrorMessage.tsx b/components/ErrorMessage.tsx new file mode 100644 index 0000000..c20be77 --- /dev/null +++ b/components/ErrorMessage.tsx @@ -0,0 +1,37 @@ +import { ReactNode } from 'react'; +import { useRouter } from 'next/router'; +import Button from './Button'; +import { SITE_NAME } from 'constants/terms'; + +interface Props { + code?: string; + title: string; + children: ReactNode; +} + +export default function ErrorMessage({ code, title, children }: Props) { + const router = useRouter(); + + return ( +
+ {code?.trim() && ( +
+ {code} + ERROR +
+ )} +

{title}

+ +

{children}

+ +
+ + +
+
+ ); +} diff --git a/components/Svg/IconFaceDizzy.tsx b/components/Svg/IconFaceDizzy.tsx new file mode 100644 index 0000000..a079d0a --- /dev/null +++ b/components/Svg/IconFaceDizzy.tsx @@ -0,0 +1,28 @@ +import React from 'react'; + +export default function IconFaceDizzy({ + width = 32, + height = 32, + fill = 'currentColor', + ...props +}: React.SVGProps) { + return ( + + + + + + + + ); +} diff --git a/pages/404.tsx b/pages/404.tsx new file mode 100644 index 0000000..684064b --- /dev/null +++ b/pages/404.tsx @@ -0,0 +1,20 @@ +import IconFaceDizzy from '@/components/Svg/IconFaceDizzy'; +import ErrorMessage from '@/components/ErrorMessage'; + +export default function PageNotFound() { + return ( +
+
+
+ + + + 페이지가 존재하지 않거나, 사용할 수 없는 페이지입니다. +
+ 입력하신 주소가 정확한지 다시 한 번 확인해주세요. +
+
+
+
+ ); +} diff --git a/public/icon/icon-face-dizzy.svg b/public/icon/icon-face-dizzy.svg new file mode 100644 index 0000000..6f22807 --- /dev/null +++ b/public/icon/icon-face-dizzy.svg @@ -0,0 +1 @@ + \ No newline at end of file