From bc649947211d8936feccb8755c450c26459c350b Mon Sep 17 00:00:00 2001
From: Pratik Mane <153143167+PratikMane0112@users.noreply.github.com>
Date: Sat, 1 Jun 2024 13:52:58 +0530
Subject: [PATCH 1/3] Update App.jsx

---
 src/App.jsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/App.jsx b/src/App.jsx
index 4ddb7417..f49bd390 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -17,6 +17,7 @@ import PrivacyPolicy from "./components/UI/privacypolicy";
 import Licensing from "./components/UI/Licensing";
 import TermsAndConditions from "./components/UI/termsandconditions";
 import { BrowserRouter as Router , Routes, Route } from "react-router-dom";
+import Error from "./components/UI/Error";
 
 
 
@@ -53,6 +54,7 @@ function App() {
           <Route path="/privacypolicy" element={<PrivacyPolicy />} />
           <Route path="/licensing" element={<Licensing />} />
           <Route path="/termsandconditions" element={<TermsAndConditions />} />
+          <Route path="*" element={<Error />} />
         </Routes>
       </Router>
     </>

From 12e69c2f080d61385fabc726102337d123936008 Mon Sep 17 00:00:00 2001
From: Pratik Mane <153143167+PratikMane0112@users.noreply.github.com>
Date: Sat, 1 Jun 2024 13:54:08 +0530
Subject: [PATCH 2/3] Create Error.jsx

---
 src/components/UI/Error.jsx | 31 +++++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)
 create mode 100644 src/components/UI/Error.jsx

diff --git a/src/components/UI/Error.jsx b/src/components/UI/Error.jsx
new file mode 100644
index 00000000..5b5f4203
--- /dev/null
+++ b/src/components/UI/Error.jsx
@@ -0,0 +1,31 @@
+import React, { useState } from 'react';
+import Header from '../Header/Header';
+import Footer from '../UI/Footer';
+import "../../styles/error.css";
+
+
+
+const Error = () => {
+
+    const [isDarkMode, setDarkMode] = useState(false);
+
+    return (
+        <>
+            <div className={isDarkMode ? "dark-mode-app" : "light-mode-app"}>
+                <Header className="header" isDarkMode={isDarkMode} setDarkMode={setDarkMode} />
+                <div className="not-found-container">
+                    <div className="content">
+                        <p className="content-text">Oops! It looks like you're lost.</p>
+                        <a href="/" className="home-button">
+                            Go to Homepage
+                        </a>
+                    </div>
+                </div>
+                <Footer />
+            </div>
+            
+        </>
+    );
+};
+
+export default Error;

From 94852977acf17d61aaa7e1be5f597b5117318f52 Mon Sep 17 00:00:00 2001
From: Pratik Mane <153143167+PratikMane0112@users.noreply.github.com>
Date: Sat, 1 Jun 2024 13:56:28 +0530
Subject: [PATCH 3/3] Create error.css

---
 src/styles/error.css | 70 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 70 insertions(+)
 create mode 100644 src/styles/error.css

diff --git a/src/styles/error.css b/src/styles/error.css
new file mode 100644
index 00000000..3041f08e
--- /dev/null
+++ b/src/styles/error.css
@@ -0,0 +1,70 @@
+
+ .not-found-container {
+      display: flex;
+      justify-content: center;
+      margin-top: -3.2rem;
+      align-items: center;
+      height: 95vh;
+      background-size: cover;
+      background-position: center;
+      text-align: center;
+      color: white;
+  }
+
+  .error-image {
+      max-width: 100%;
+      height: 375px;
+      margin-bottom: 20px;
+  }
+
+  .content {
+      border-radius: 10px;
+  }
+
+  .content-text {
+      font-size: 2rem;
+      margin-bottom: 70px;
+  }
+
+  .home-button {
+      border: none;
+      outline: none;
+      padding: 15px 20px;
+      color: #fff;
+      background: var(--primary-color);
+      border-radius: 5px;
+      font-family: var(--font-name);
+      font-size: 1.0rem;
+      font-weight: 500;
+      cursor: pointer;
+      transition: all 0.5s ease-in-out;
+  }
+
+  .home-button:hover {
+      box-shadow: 0.3rem 0.3rem #5844c1, -0.3rem -0.3rem #8b76f4;
+      color: white;
+  }
+
+  /* Light mode styles */
+  .light-mode-app .content {
+      color: #000;
+  }
+
+  /* Dark mode styles */
+  .dark-mode-app .content {
+      color: #fff;
+  }
+
+  @media (max-width: 768px) {
+      .content {
+          width: 90%;
+          padding: 15px;
+      }
+
+      .home-button {
+          font-size: 1rem;
+          padding: 8px 16px;
+      }
+  }
+
+