From 1fc3ca059a684704b95d2192a0ab100bee3c5323 Mon Sep 17 00:00:00 2001
From: Ariful Alam <swazan.arif@gmail.com>
Date: Sat, 19 Mar 2022 00:52:38 +0600
Subject: [PATCH] Create ErrorPage component

---
 src/components/error-page/index.jsx | 31 +++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)
 create mode 100644 src/components/error-page/index.jsx

diff --git a/src/components/error-page/index.jsx b/src/components/error-page/index.jsx
new file mode 100644
index 0000000..458db24
--- /dev/null
+++ b/src/components/error-page/index.jsx
@@ -0,0 +1,31 @@
+import PropTypes from 'prop-types';
+
+const ErrorPage = (props) => {
+  return (
+    <div className="min-w-screen min-h-screen bg-base-200 flex items-center p-5 lg:p-20 overflow-hidden relative">
+      <div className="flex-1 min-h-full min-w-full rounded-3xl bg-base-100 shadow-xl p-10 lg:p-20 text-gray-800 relative md:flex items-center text-center md:text-left">
+        <div className="w-full">
+          <div className="mb-10 md:mb-20 mt-10 md:mt-20 text-gray-600 font-light">
+            <h1 className="font-black uppercase text-3xl lg:text-5xl text-primary mb-10">
+              {props.status}
+            </h1>
+            <p className="text-lg pb-2 text-base-content">{props.title}</p>
+            <p className="text-base-content text-opacity-60">
+              {props.subTitle}
+            </p>
+          </div>
+        </div>
+      </div>
+      <div className="w-64 md:w-96 h-96 md:h-full bg-accent bg-opacity-10 absolute -top-64 md:-top-96 right-20 md:right-32 rounded-full pointer-events-none -rotate-45 transform"></div>
+      <div className="w-96 h-full bg-secondary bg-opacity-10 absolute -bottom-96 right-64 rounded-full pointer-events-none -rotate-45 transform"></div>
+    </div>
+  );
+};
+
+ErrorPage.propTypes = {
+  status: PropTypes.string.isRequired,
+  title: PropTypes.string.isRequired,
+  subTitle: PropTypes.string.isRequired,
+};
+
+export default ErrorPage;