fix: updated files

Author: Iam-Karan-Suresh

plugins/docusaurus-tailwindcss-loader/package.json

@@ -0,0 +1,11 @@
+{
+  "name": "docusaurus-tailwindcss-loader",
+  "version": "1.0.0",
+  "description": "A Docusaurus plugin to load TailwindCSS",
+  "main": "index.js",
+  "peerDependencies": {
+    "postcss-import": "^14.0.2",
+    "tailwindcss": "^3.0.1",
+    "postcss-preset-env": "^7.4.1"
+  }
+}

src/components/NotFoundPage.js

@@ -0,0 +1,36 @@
+import React from "react";
+import error from "../../static/img/error404.png";
+
+const NotFoundPage = () => {
+  return (
+    // `notfound-wrapper` ensures the page takes up enough vertical space
+    // so the footer (and social icons) remain in place and are not pushed down.
+    <main className="notfound-wrapper margin-vert--xl container">
+      <div className="row">
+        <div className="col col--6 col--offset-3">
+          <div className="text-center">
+            <img
+              src={error}
+              width={300}
+              height={300}
+              alt="404 Error"
+              style={{margin: "0 auto"}}
+            />
+            <h1 className="hero__title">🐰 Oops! 🐰</h1>
+            <p className="hero__subtitle margin-vert--md">404 - Page Not Found</p>
+            <div className="margin-vert--lg">
+              <div className="loading-dots">
+                <span>Redirecting to documentation</span>
+                <span className="dot">.</span>
+                <span className="dot">.</span>
+                <span className="dot">.</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </main>
+  );
+};
+
+export default NotFoundPage;

src/theme/NotFound/Content/styles.module.css

@@ -0,0 +1,34 @@
+/* Loading dots animation */
+.loading-dots {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 4px;
+  font-size: 1.1rem;
+  color: var(--ifm-color-primary);
+}
+
+.dot {
+  animation: dotPulse 1.5s infinite;
+  opacity: 0;
+}
+
+.dot:nth-child(2) {
+  animation-delay: 0.5s;
+}
+
+.dot:nth-child(3) {
+  animation-delay: 1s;
+}
+
+@keyframes dotPulse {
+  0% {
+    opacity: 0;
+  }
+  50% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}