custom component support for mdx

2023-06-01 18:05:04 -05:00
parent dc094d7a32
commit 45c7f96067
10 changed files with 178 additions and 42 deletions
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -1,9 +1,11 @@
 'use client'

+import Head from 'next/head'
 import Navbar from '@/components/Navbar'
 import SiteTree from '@/components/SiteTree'
 import { MDXProvider } from '@mdx-js/react'
 import { Inter } from 'next/font/google'
+import components from '@/components/mdx'
 import './globals.css'

 const inter = Inter({ subsets: ['latin'] })
@@ -13,22 +15,22 @@ export const metadata = {
  description: 'Integrating artistry and technology to create beautiful software',
 }

-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode
-}) {
+export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
-      <MDXProvider /* components={components} */>
-        <body className={inter.className}>
-          <>
-          <Navbar />
-          <SiteTree />
+      <Head>
+        <title>{metadata.title}</title>
+        <meta name="description" content={metadata.description} />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <link rel="icon" href="/favicon.ico" />
+      </Head>
+      <body className={inter.className}>
+        <Navbar />
+        <SiteTree />
+        <MDXProvider components={components}>
          {children}
-          </>
-        </body>
-      </MDXProvider>
+        </MDXProvider>
+      </body>
    </html>
  )
 }