Merge pull request #7 from phucbm/enhance-template-demo

Enhance template demo

Author: phucbm

app/_meta.global.ts

@@ -0,0 +1,53 @@
+import {MetaRecord} from "nextra";
+
+const DOCS_ITEMS: MetaRecord = {
+    index: '',
+    navigation: '',
+    tips: '',
+}
+
+
+export default {
+    index: {
+        type: 'page',
+        theme: {
+            layout: 'full',
+            toc: false,
+            timestamp: false,
+        }
+    },
+    docs: {
+        type: 'page',
+        title: 'Documentation',
+        items: DOCS_ITEMS
+    },
+    article: {
+        type: 'page',
+        theme: {
+            toc: false,
+            typesetting: 'article',
+        }
+    },
+    contact: {
+        type: 'page',
+        theme: {
+            layout: 'full',
+            toc: false,
+            timestamp: false,
+        }
+    },
+    nextraStarter: {
+        title: 'Starter Templates',
+        type: 'menu',
+        items: {
+            docs: {
+                title: 'Docs Starter repo',
+                href: 'https://github.com/phucbm/nextra-docs-starter',
+            },
+            blog: {
+                title: 'Blog Starter repo',
+                href: 'https://github.com/phucbm/nextra-blog-starter'
+            }
+        }
+    },
+}

app/_meta.global.tsx

@@ -0,0 +1,6 @@
+@import "tailwindcss";
+
+/* Optional: import Nextra theme styles */
+@import "nextra-theme-docs/style.css";
+
+@variant dark (&:where(.dark *));

app/globals.css

@@ -1,9 +1,10 @@
 import {Footer, Layout, Navbar} from 'nextra-theme-docs'
 import {Head} from 'nextra/components'
 import {getPageMap} from 'nextra/page-map'
-import 'nextra-theme-docs/style.css'
+import './globals.css'
+import {Metadata} from "next";
 
-export const metadata = {
+export const metadata: Metadata = {
     // Define your metadata here
     // For more information on metadata API, see: https://nextjs.org/docs/app/building-your-application/optimizing/metadata
 }

app/layout.tsx

@@ -0,0 +1,18 @@
+import Link from "next/link";
+
+export default function NotFound() {
+    return (
+        <div className="min-h-[80vh] flex items-center justify-center">
+            <div className="text-center">
+                <h1 className="text-6xl font-bold mb-4">404</h1>
+                <p className="text-xl mb-8">Page Not Found</p>
+                <Link
+                    href="/"
+                    className="text-blue-600 hover:underline"
+                >
+                    Go back home
+                </Link>
+            </div>
+        </div>
+    )
+}