Merge pull request #43 from AaadityaG/404page

Add: 404 page

client/src/App.js

@@ -8,6 +8,7 @@ import Contact from "./pages/Contact"
 import ExploreProducts from "./pages/ExploreProducts";
 import OpenStore from "./pages/OpenStore";
 import CreateItem from "./pages/CreateItem";
+import ErrorPage from "./components/ErrorPage";
 
 
 // import SingleBlog from "./pages/SingleBlog
@@ -65,6 +66,9 @@ function App() {
             <Route path="blog/:id" element={<SingleBlog />} />
 
 
+          </Route>
+          <Route path="/*" element={<ErrorPage/>}>
+
           </Route>
         </Routes>
       </BrowserRouter>

client/src/components/ErrorPage.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import { Link } from 'react-router-dom'; // If you're using React Router
+
+const ErrorPage = () => {
+  const pageStyle = {
+    backgroundColor: '#C4A1D4',
+    minHeight: '100vh',
+    display: 'flex',
+    flexDirection: 'column',
+    alignItems: 'center',
+    justifyContent: 'center',
+    padding: '20px',
+  };
+
+  const textStyle = {
+    color: '#010101',
+    textAlign: 'center',
+    marginBottom: '20px',
+  };
+
+  const buttonStyle = {
+    marginTop: '50px',
+    backgroundColor: '#ffe9cc',
+    color: '#010101',
+    padding: '10px 20px',
+    borderRadius: '5px',
+    textDecoration: 'none',
+  };
+
+  const h1Style = {
+    fontSize: "100px",
+  }
+
+  return (
+    <div style={pageStyle}>
+      <h1 style={h1Style}>404</h1>
+      <p style={textStyle}>Sorry, your page is not found!</p>
+      <Link to="/" style={buttonStyle}>
+        Go back
+      </Link>
+    </div>
+  );
+};
+
+export default ErrorPage;