feat: add NoScript component

app/(root)/layout.tsx

@@ -1,6 +1,7 @@
 import Footer from "@/components/shared/Footer";
 import Navbar from "@/components/shared/Navbar";
 import Banner from "@/components/widgets/Banner";
+import NoScript from "@/components/shared/NoScript";
 import { Home } from "lucide-react";
 import { Metadata } from "next";
 
@@ -52,6 +53,7 @@ export default function PageLayout({
         buttonText="Read more"
       />
       <Navbar />
+      <NoScript />
       <div className="flex-grow flex-1 overflow-x-hidden">{children}</div>
       <Footer />
     </div>

app/not-found.tsx

@@ -2,6 +2,7 @@ import type { Metadata } from "next";
 import Footer from "@/components/shared/Footer";
 import Navbar from "@/components/shared/Navbar";
 import Link from "next/link";
+import NoScript from "@/components/shared/NoScript";
 
 export const metadata: Metadata = {
   title: "404 Not Found - SVR.JS",
@@ -16,8 +17,9 @@ export const metadata: Metadata = {
 const NotFound = () => {
   return (
     <>
-      <main className="flex flex-col min-h-screen">
+      <div className="flex flex-col min-h-screen">
         <Navbar />
+        <NoScript />
         <section
           id="404error"
           className="flex-center flex-col wrapper container flex-1 flex-grow"
@@ -33,7 +35,7 @@ const NotFound = () => {
           </p>
         </section>
         <Footer />
-      </main>
+      </div>
     </>
   );
 };

components/shared/NoScript.tsx

@@ -0,0 +1,9 @@
+const NoScript = () => {
+  return (
+    <noscript className="bg-orange-500 text-white p-1 font-bold text-lg">
+      Turn on JavaScript for a better experience.
+    </noscript>
+  );
+};
+
+export default NoScript;