docs: upgrade docus (#1503)

Co-authored-by: Sébastien Chopin <seb@nuxtjs.com>

docs/app.config.ts

@@ -0,0 +1,55 @@
+export default defineAppConfig({
+  docus: {
+    title: 'Nuxt Content',
+    description: 'Write pages in markdown, use Vue components and enjoy the power of Nuxt with a blazing fast developer experience.',
+    layout: 'docs',
+    url: 'https://content.nuxtjs.org',
+    debug: false,
+    socials: {
+      twitter: '@nuxt_js',
+      github: 'nuxt/content'
+    },
+    github: {
+      root: 'docs/content',
+      edit: true,
+      releases: true
+    },
+    cover: {
+      src: '/cover.jpg',
+      alt: 'Content made easy for Vue developers'
+    },
+    aside: {
+      level: 1,
+      filter: [
+        '/v1',
+        '/content-v1',
+        '/fr',
+        '/ja',
+        '/ru'
+      ]
+    },
+    header: {
+      title: false,
+      logo: true
+    },
+    footer: {
+      credits: {
+        icon: 'IconDocus',
+        text: 'Powered by Docus',
+        href: 'https://docus.com'
+      },
+      icons: [
+        {
+          label: 'NuxtJS',
+          href: 'https://nuxtjs.org',
+          component: 'IconNuxt'
+        },
+        {
+          label: 'Vue Telescope',
+          href: 'https://vuetelescope.com',
+          component: 'IconVueTelescope'
+        }
+      ]
+    }
+  }
+})

docs/components/content/ExampleTheTitle.vue

@@ -1,5 +1,5 @@
 <template>
   <h1 class="text-4xl">
-    <Markdown :use="$slots.default" unwrap="p" />
+    <ContentSlot :use="$slots.default" unwrap="p" />
   </h1>
 </template>

docs/components/content/MyButton.vue

@@ -9,7 +9,7 @@ defineProps({
 
 <template>
   <button :class="type">
-    <Markdown :use="$slots.default" unwrap="p" />
+    <ContentSlot :use="$slots.default" unwrap="p" />
   </button>
 </template>
 

docs/content/1.index.md

@@ -2,7 +2,7 @@
 title: "Content made easy for Vue developers"
 description: "The file-based CMS for your Nuxt application, powered by Markdown and Vue components."
 navigation: false
-layout: fluid
+layout: page
 ---
 
 ::block-hero
@@ -89,7 +89,7 @@ Powerful Features
 :ellipsis
 ::
 
-::container{padded .py-8 .mb-8 .flex .items-center .justify-center}
+::div{.py-8 .mb-8 .flex .items-center .justify-center}
 
   ::button-link{href="/content-v1" type="base"}
   Looking for v1 documentation ?

docs/content/2.get-started.md

@@ -2,9 +2,13 @@
 title: Get Started
 description: How to start with Nuxt Content, by creating a fresh new project or adding it to your Nuxt application.
 icon: heroicons-outline:lightning-bolt
-layout: blogpost
+layout: page
+constrainedClass: 'max-w-4xl'
 ---
 
+::article-hero
+::
+
 ## Play online
 
 You can start playing with Nuxt Content in your browser using our online sandboxes:

docs/content/6.blog/1.announcing-v2.md

@@ -1,5 +1,6 @@
 ---
-layout: blogpost
+layout: page
+constrainedClass: 'max-w-4xl'
 navigation: false
 title: 'Announcing Nuxt Content v2'
 description: '2 years after the release of Content v1, we are proud to announce the second version of Nuxt Content built for Nuxt 3.'
@@ -25,6 +26,9 @@ tags:
 category: Announcements
 ---
 
+::article-hero
+::
+
 2 years after the [release of Content v1](https://github.com/nuxt/content/releases/tag/v1.0.0), we are proud to announce the second version of Nuxt Content built for [Nuxt 3](https://v3.nuxtjs.org).
 
 On top of the Nuxt 3 support, it comes with new features:

docs/content/8.playground.md

@@ -1,5 +1,6 @@
 ---
-layout: fluid
+layout: page
+fluid: true
 icon: file-icons:sandbox
 ---
 

docs/content/9.content-v1.md

@@ -1,6 +1,7 @@
 ---
 title: V1 Documentation
-layout: fluid
+layout: page
+fluid: true
 ---
 
 

docs/nuxt.config.ts

@@ -62,24 +62,13 @@ export default defineNuxtConfig({
     }
   },
   modules: ['@nuxtlabs/github-module'],
-  extends: [
-    (process.env.DOCUS_THEME_PATH || '@nuxt-themes/docus')
-  ],
+  extends: process.env.DOCUS_THEME_PATH || '@nuxt-themes/docus',
   github: {
     owner: 'nuxt',
     repo: 'content',
     branch: 'main'
   },
-  vite: {
-    define: {
-      'process.env.FORCE_COLOR': {},
-      'process.env.NODE_DISABLE_COLORS': {},
-      'process.env.NO_COLOR': {},
-      'process.env.FORCE_TERM': {}
-    }
-  },
   colorMode: {
     preference: 'dark'
-  },
-  theme: {}
+  }
 })

docs/package.json

@@ -12,7 +12,7 @@
     "@nuxt-themes/docus": "npm:@nuxt-themes/docus-edge@latest",
     "@nuxtlabs/github-module": "npm:@nuxtlabs/github-module-edge@latest",
     "monaco-editor-core": "^0.34.0",
-    "nuxt": "3.0.0-rc.6",
+    "nuxt": "^3.0.0-rc.9",
     "vue-plausible": "^1.3.2"
   },
   "dependencies": {