docs: move to Nuxt UI

docs/.gitignore

@@ -1,12 +1,24 @@
-node_modules
-*.iml
-.idea
-*.log*
+# Nuxt dev/build outputs
+.output
+.data
 .nuxt
-.vscode
-.DS_Store
-coverage
+.nitro
+.cache
 dist
-sw.*
+
+# Node dependencies
+node_modules
+
+# Logs
+logs
+*.log
+
+# Misc
+.DS_Store
+.fleet
+.idea
+
+# Local env files
 .env
-.output
+.env.*
+!.env.example

docs/.npmrc

@@ -1 +1,2 @@
 shamefully-hoist=true
+strict-peer-dependencies=false

docs/app.config.ts

@@ -1,38 +1,6 @@
 export default defineAppConfig({
-  docus: {
-    title: 'Nuxt Color Mode',
-    layout: 'default',
-    url: 'https://color-mode.nuxtjs.org',
-    description: 'Dark and Light mode with auto detection made easy with Nuxt 🌗',
-    socials: {
-      twitter: 'nuxt_js',
-      github: 'nuxt-modules/color-mode',
-    },
-    aside: {
-      level: 1,
-    },
-    image: '/cover.jpg',
-    header: {
-      logo: true,
-    },
-    footer: {
-      credits: {
-        icon: 'IconDocus',
-        text: 'Powered by Docus',
-        href: 'https://docus.com',
-      },
-      iconLinks: [
-        {
-          label: 'Nuxt',
-          href: 'https://nuxt.com',
-          icon: 'IconNuxt',
-        },
-        {
-          label: 'Vue Telescope',
-          href: 'https://vuetelescope.com',
-          icon: 'IconVueTelescope',
-        },
-      ],
-    },
+  ui: {
+    primary: 'green',
+    gray: 'slate',
   },
 })

docs/content/1.index.md → docs/content/index.md

@@ -1,14 +1,8 @@
 ---
-title: 'Documentation'
-description: 'Dark and Light mode with auto detection made easy with Nuxt 🌗'
-aside: false
-navigation: false
+title: Nuxt Color Mode
+description: Dark and Light mode with auto detection made easy with Nuxt 🌗
 ---
 
-# Nuxt Color Mode
-
-Dark and Light mode with auto detection made easy with Nuxt 🌗
-
 ## Features
 
 - Nuxt 3 and Nuxt Bridge support
@@ -27,7 +21,7 @@ Checkout the [online demo](https://color-mode.nuxtjs.app) and [source code](http
 
 ## Setup
 
-::alert{type="info"}
+::callout
 The current version of `@nuxtjs/color-mode` is compatible with [Nuxt 3 and Nuxt Bridge](https://nuxt.com). :br If you're looking for the previous version of this module, check out [v2.color-mode.nuxtjs.org](https://v2.color-mode.nuxtjs.org/), or [read more about the differences](#migrating-to-v3).
 ::
 
@@ -116,7 +110,7 @@ definePageMeta({
 
 This feature is perfect for implementing dark mode to a website incrementally by setting the not-ready pages to `colorMode: 'light'`.
 
-::alert{type="info"}
+::callout
 We recommend to hide or disable the color mode picker on the page since it won't be able to change the current page color mode, using `$colorMode.forced` value.
 ::
 
@@ -201,12 +195,6 @@ v3 of `@nuxtjs/color-mode` requires either Nuxt Bridge or Nuxt 3. (If you are us
 
 ## Contributing
 
-You can contribute to this module online with CodeSandBox:
-
-[![Edit @nuxtjs/color-mode](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/nuxt-modules/color-mode/tree/main/?fontsize=14&hidenavigation=1&theme=dark)
-
-Or locally:
-
 1. Clone this repository
 2. Install dependencies using `pnpm install`
 3. Start development server using `pnpm dev`
@@ -215,4 +203,3 @@ Or locally:
 
 [MIT License](https://github.com/nuxt-modules/color-mode/blob/main/LICENSE)
 
-Copyright (c) Nuxt Team

docs/nuxt.config.ts

@@ -1,7 +1,8 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
-  extends: ['@nuxt-themes/docus'],
-  modules: ['@nuxtjs/plausible'],
-  imports: {
-    autoImport: true,
-  },
+  compatibilityDate: '2024-09-13',
+  extends: '@nuxt/ui-pro',
+  modules: ['@nuxt/ui', '@nuxt/content'],
+  uiPro: { license: 'oss' },
+  devtools: { enabled: true },
 })

docs/package.json

@@ -1,18 +1,21 @@
 {
-  "name": "nuxt-color-mode-docs",
-  "version": "1.0.0",
-  "description": "Dark and Light mode with auto detection made easy with Nuxt",
-  "homepage": "https://color-mode.nuxtjs.org/",
-  "license": "MIT",
+  "name": "nuxt-app",
+  "private": true,
+  "type": "module",
   "scripts": {
-    "dev": "nuxi dev",
-    "build": "nuxi build",
-    "generate": "nuxi generate",
-    "preview": "nuxi preview"
+    "build": "nuxt build",
+    "dev": "nuxt dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare"
   },
   "devDependencies": {
-    "@nuxt-themes/docus": "^1.15.0",
-    "@nuxtjs/plausible": "^1.0.2",
-    "nuxt": "^3.13.1"
+    "@nuxt/devtools": "latest",
+    "@nuxt/ui": "^2.18.4",
+    "nuxt": "^3.12.4"
+  },
+  "dependencies": {
+    "@nuxt/content": "^2.13.2",
+    "@nuxt/ui-pro": "^1.4.2"
   }
 }

docs/pages/index.vue

@@ -0,0 +1,125 @@
+<script setup>
+const route = useRoute()
+const { data: page } = await useAsyncData(() => queryContent(route.path).findOne())
+
+if (!page.value)
+  throw createError({ statusCode: 404, statusMessage: 'Page not found' })
+
+useSeoMeta({
+  title: page.value.title,
+  ogTitle: page.value.title,
+  description: page.value.description,
+  ogDescription: page.value.description,
+  ogImage: 'https://color-mode.nuxtjs.org/social-card.jpg',
+  twitterCard: 'summary_large_image',
+})
+const communityLinks = computed(() => [
+  {
+    icon: 'i-ph-pen-duotone',
+    label: 'Edit this page',
+    to: `https://github.com/nuxt-modules/color-mode/edit/main/docs/content/${page?.value?._file}`,
+    target: '_blank',
+  },
+  {
+    icon: 'i-ph-chat-centered-text-duotone',
+    label: 'Chat on Discord',
+    to: 'https://go.nuxt.com/discord',
+    target: '_blank',
+  },
+  {
+    icon: 'i-ph-hand-heart-duotone',
+    label: 'Become a Sponsor',
+    to: 'https://github.com/sponsors/nuxt',
+    target: '_blank',
+  },
+  {
+    icon: 'i-simple-icons-nuxtdotjs',
+    label: 'Nuxt docs',
+    to: 'https://nuxt.com',
+    target: '_blank',
+  },
+])
+</script>
+
+<template>
+  <UMain>
+    <UHeader>
+      <template #logo>
+        <svg
+          viewBox="0 0 277 40"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+          class="h-8"
+        ><path
+          d="M43.904 30V10.4H47.488L56.7 24.204V10.4H60.284V30H56.7L47.488 16.224V30H43.904ZM69.2077 30.336C67.4717 30.336 66.1277 29.7947 65.1757 28.712C64.2424 27.6293 63.7757 26.0427 63.7757 23.952V16.112H67.3317V23.616C67.3317 24.8107 67.5744 25.7253 68.0597 26.36C68.545 26.9947 69.3104 27.312 70.3557 27.312C71.345 27.312 72.157 26.9573 72.7917 26.248C73.445 25.5387 73.7717 24.5493 73.7717 23.28V16.112H77.3557V30H74.1917L73.9117 27.648C73.4824 28.4693 72.857 29.1227 72.0357 29.608C71.233 30.0933 70.2904 30.336 69.2077 30.336ZM79.7188 30L84.7588 23.056L79.7188 16.112H83.5548L87.0828 21.04L90.5828 16.112H94.4468L89.3788 23.056L94.4468 30H90.5828L87.0828 25.072L83.5548 30H79.7188ZM102.918 30C101.462 30 100.295 29.6453 99.4182 28.936C98.5408 28.2267 98.1022 26.9667 98.1022 25.156V19.108H95.7222V16.112H98.1022L98.5222 12.388H101.686V16.112H105.438V19.108H101.686V25.184C101.686 25.856 101.826 26.3227 102.106 26.584C102.405 26.8267 102.909 26.948 103.618 26.948H105.354V30H102.918Z"
+          fill="currentColor"
+        /><path
+          d="M117.475 30.336C115.497 30.336 113.798 29.916 112.379 29.076C110.961 28.2173 109.869 27.032 109.103 25.52C108.338 23.9893 107.955 22.2253 107.955 20.228C107.955 18.2307 108.338 16.4667 109.103 14.936C109.869 13.4053 110.961 12.2107 112.379 11.352C113.798 10.4933 115.497 10.064 117.475 10.064C119.827 10.064 121.75 10.652 123.243 11.828C124.755 12.9853 125.698 14.6187 126.071 16.728H122.123C121.881 15.664 121.358 14.8333 120.555 14.236C119.771 13.62 118.726 13.312 117.419 13.312C115.609 13.312 114.19 13.928 113.163 15.16C112.137 16.392 111.623 18.0813 111.623 20.228C111.623 22.3747 112.137 24.064 113.163 25.296C114.19 26.5093 115.609 27.116 117.419 27.116C118.726 27.116 119.771 26.836 120.555 26.276C121.358 25.6973 121.881 24.904 122.123 23.896H126.071C125.698 25.912 124.755 27.4893 123.243 28.628C121.75 29.7667 119.827 30.336 117.475 30.336ZM135.824 30.336C134.48 30.336 133.267 30.028 132.184 29.412C131.12 28.796 130.271 27.9467 129.636 26.864C129.02 25.7627 128.712 24.4933 128.712 23.056C128.712 21.6187 129.029 20.3587 129.664 19.276C130.299 18.1747 131.148 17.316 132.212 16.7C133.295 16.084 134.508 15.776 135.852 15.776C137.177 15.776 138.372 16.084 139.436 16.7C140.519 17.316 141.368 18.1747 141.984 19.276C142.619 20.3587 142.936 21.6187 142.936 23.056C142.936 24.4933 142.619 25.7627 141.984 26.864C141.368 27.9467 140.519 28.796 139.436 29.412C138.353 30.028 137.149 30.336 135.824 30.336ZM135.824 27.228C136.757 27.228 137.569 26.8827 138.26 26.192C138.951 25.4827 139.296 24.4373 139.296 23.056C139.296 21.6747 138.951 20.6387 138.26 19.948C137.569 19.2387 136.767 18.884 135.852 18.884C134.9 18.884 134.079 19.2387 133.388 19.948C132.716 20.6387 132.38 21.6747 132.38 23.056C132.38 24.4373 132.716 25.4827 133.388 26.192C134.079 26.8827 134.891 27.228 135.824 27.228ZM146.14 30V9.84H149.724V30H146.14ZM160.05 30.336C158.706 30.336 157.493 30.028 156.41 29.412C155.346 28.796 154.497 27.9467 153.862 26.864C153.246 25.7627 152.938 24.4933 152.938 23.056C152.938 21.6187 153.256 20.3587 153.89 19.276C154.525 18.1747 155.374 17.316 156.438 16.7C157.521 16.084 158.734 15.776 160.078 15.776C161.404 15.776 162.598 16.084 163.662 16.7C164.745 17.316 165.594 18.1747 166.21 19.276C166.845 20.3587 167.162 21.6187 167.162 23.056C167.162 24.4933 166.845 25.7627 166.21 26.864C165.594 27.9467 164.745 28.796 163.662 29.412C162.58 30.028 161.376 30.336 160.05 30.336ZM160.05 27.228C160.984 27.228 161.796 26.8827 162.486 26.192C163.177 25.4827 163.522 24.4373 163.522 23.056C163.522 21.6747 163.177 20.6387 162.486 19.948C161.796 19.2387 160.993 18.884 160.078 18.884C159.126 18.884 158.305 19.2387 157.614 19.948C156.942 20.6387 156.606 21.6747 156.606 23.056C156.606 24.4373 156.942 25.4827 157.614 26.192C158.305 26.8827 159.117 27.228 160.05 27.228ZM170.367 30V16.112H173.559L173.895 18.716C174.399 17.82 175.08 17.1107 175.939 16.588C176.816 16.0467 177.843 15.776 179.019 15.776V19.556H178.011C177.227 19.556 176.527 19.6773 175.911 19.92C175.295 20.1627 174.81 20.5827 174.455 21.18C174.119 21.7773 173.951 22.608 173.951 23.672V30H170.367ZM181.552 30V10.4H185.808L192.052 22.832L198.212 10.4H202.468V30H198.884V16.476L193.424 27.2H190.596L185.136 16.476V30H181.552ZM212.851 30.336C211.507 30.336 210.294 30.028 209.211 29.412C208.147 28.796 207.298 27.9467 206.663 26.864C206.047 25.7627 205.739 24.4933 205.739 23.056C205.739 21.6187 206.057 20.3587 206.691 19.276C207.326 18.1747 208.175 17.316 209.239 16.7C210.322 16.084 211.535 15.776 212.879 15.776C214.205 15.776 215.399 16.084 216.463 16.7C217.546 17.316 218.395 18.1747 219.011 19.276C219.646 20.3587 219.963 21.6187 219.963 23.056C219.963 24.4933 219.646 25.7627 219.011 26.864C218.395 27.9467 217.546 28.796 216.463 29.412C215.381 30.028 214.177 30.336 212.851 30.336ZM212.851 27.228C213.785 27.228 214.597 26.8827 215.287 26.192C215.978 25.4827 216.323 24.4373 216.323 23.056C216.323 21.6747 215.978 20.6387 215.287 19.948C214.597 19.2387 213.794 18.884 212.879 18.884C211.927 18.884 211.106 19.2387 210.415 19.948C209.743 20.6387 209.407 21.6747 209.407 23.056C209.407 24.4373 209.743 25.4827 210.415 26.192C211.106 26.8827 211.918 27.228 212.851 27.228ZM229.552 30.336C228.245 30.336 227.078 30.0187 226.052 29.384C225.025 28.7493 224.213 27.8813 223.616 26.78C223.018 25.6787 222.72 24.428 222.72 23.028C222.72 21.628 223.018 20.3867 223.616 19.304C224.213 18.2027 225.025 17.344 226.052 16.728C227.078 16.0933 228.245 15.776 229.552 15.776C230.597 15.776 231.512 15.972 232.296 16.364C233.08 16.756 233.714 17.3067 234.2 18.016V9.84H237.784V30H234.592L234.2 28.012C233.752 28.628 233.154 29.1693 232.408 29.636C231.68 30.1027 230.728 30.336 229.552 30.336ZM230.308 27.2C231.465 27.2 232.408 26.8173 233.136 26.052C233.882 25.268 234.256 24.2693 234.256 23.056C234.256 21.8427 233.882 20.8533 233.136 20.088C232.408 19.304 231.465 18.912 230.308 18.912C229.169 18.912 228.226 19.2947 227.48 20.06C226.733 20.8253 226.36 21.8147 226.36 23.028C226.36 24.2413 226.733 25.24 227.48 26.024C228.226 26.808 229.169 27.2 230.308 27.2ZM248.181 30.336C246.781 30.336 245.54 30.0373 244.457 29.44C243.375 28.8427 242.525 28.0027 241.909 26.92C241.293 25.8373 240.985 24.5867 240.985 23.168C240.985 21.7307 241.284 20.452 241.881 19.332C242.497 18.212 243.337 17.344 244.401 16.728C245.484 16.0933 246.753 15.776 248.209 15.776C249.572 15.776 250.776 16.0747 251.821 16.672C252.867 17.2693 253.679 18.0907 254.257 19.136C254.855 20.1627 255.153 21.3107 255.153 22.58C255.153 22.7853 255.144 23 255.125 23.224C255.125 23.448 255.116 23.6813 255.097 23.924H244.541C244.616 25.0067 244.989 25.856 245.661 26.472C246.352 27.088 247.183 27.396 248.153 27.396C248.881 27.396 249.488 27.2373 249.973 26.92C250.477 26.584 250.851 26.1547 251.093 25.632H254.733C254.472 26.5093 254.033 27.312 253.417 28.04C252.82 28.7493 252.073 29.3093 251.177 29.72C250.3 30.1307 249.301 30.336 248.181 30.336ZM248.209 18.688C247.332 18.688 246.557 18.94 245.885 19.444C245.213 19.9293 244.784 20.676 244.597 21.684H251.513C251.457 20.7693 251.121 20.0413 250.505 19.5C249.889 18.9587 249.124 18.688 248.209 18.688Z"
+          fill="#00DC82"
+        /><path
+          fill-rule="evenodd"
+          clip-rule="evenodd"
+          d="M16.0005 4.64001C16.8841 4.64001 17.6005 5.35636 17.6005 6.24001V7.84001C17.6005 8.72367 16.8841 9.44001 16.0005 9.44001C15.1168 9.44001 14.4005 8.72367 14.4005 7.84001V6.24001C14.4005 5.35636 15.1168 4.64001 16.0005 4.64001ZM27.3143 9.32624C27.9391 9.95108 27.9391 10.9641 27.3143 11.589L26.1831 12.7202C25.5582 13.345 24.5451 13.345 23.9203 12.7202C23.2955 12.0953 23.2955 11.0823 23.9203 10.4574L25.0515 9.32624C25.6764 8.7014 26.6894 8.70141 27.3143 9.32624ZM16.0005 15.84C14.7274 15.84 13.5065 16.3457 12.6064 17.2459C11.9815 17.8707 10.9685 17.8707 10.3436 17.2459C9.71879 16.6211 9.71879 15.608 10.3436 14.9832C11.8439 13.4829 13.8788 12.64 16.0005 12.64C18.1222 12.64 20.157 13.4829 21.6573 14.9832C23.1576 16.4834 24.0005 18.5183 24.0005 20.64C24.0005 22.7617 23.1576 24.7966 21.6573 26.2969C21.0325 26.9217 20.0194 26.9217 19.3946 26.2969C18.7698 25.672 18.7698 24.659 19.3946 24.0341C20.2948 23.134 20.8005 21.9131 20.8005 20.64C20.8005 19.367 20.2948 18.1461 19.3946 17.2459C18.4944 16.3457 17.2735 15.84 16.0005 15.84ZM27.2005 20.64C27.2005 19.7564 27.9168 19.04 28.8005 19.04H30.4005C31.2841 19.04 32.0005 19.7564 32.0005 20.64C32.0005 21.5237 31.2841 22.24 30.4005 22.24H28.8005C27.9168 22.24 27.2005 21.5237 27.2005 20.64Z"
+          fill="#00DC82"
+        /><path
+          fill-rule="evenodd"
+          clip-rule="evenodd"
+          d="M11.7539 5.10837C12.2075 5.56169 12.3466 6.24204 12.1073 6.83702C11.1712 9.16487 10.9399 11.7165 11.4421 14.1748C11.9443 16.633 13.1579 18.8895 14.9321 20.6636C16.7062 22.4378 18.9627 23.6514 21.4209 24.1536C23.8792 24.6558 26.4308 24.4245 28.7587 23.4884C29.3535 23.2492 30.0335 23.3881 30.4869 23.8414C30.9402 24.2946 31.0793 24.9747 30.8403 25.5695C29.6491 28.5335 27.5983 31.0733 24.9516 32.862C22.305 34.6507 19.1836 35.6066 15.9892 35.6065H15.9875C12.2728 35.6024 8.67509 34.3064 5.81124 31.9404C2.94739 29.5744 0.995725 26.286 0.29082 22.6387C-0.414085 18.9914 0.171672 15.2126 1.94768 11.9499C3.72368 8.68716 6.57932 6.14385 10.0251 4.75593C10.6199 4.51634 11.3003 4.65505 11.7539 5.10837ZM8.12168 9.51113C6.75059 10.5823 5.60211 11.9295 4.75826 13.4798C3.33735 16.0901 2.86871 19.1135 3.43268 22.0315C3.99665 24.9495 5.55809 27.5805 7.84935 29.4734C10.1406 31.3663 13.019 32.4032 15.991 32.4065C18.5461 32.4062 21.0428 31.6415 23.1598 30.2107C24.2801 29.4536 25.2669 28.5283 26.0891 27.4734C24.3308 27.7069 22.5365 27.6476 20.7804 27.2888C17.7076 26.6611 14.887 25.144 12.6694 22.9264C10.4517 20.7087 8.93465 17.8881 8.30687 14.8153C7.94841 13.0607 7.88891 11.268 8.12168 9.51113Z"
+          fill="currentColor"
+        /></svg>
+      </template>
+      <template #right>
+        <UColorModeButton />
+        <UButton
+          icon="i-simple-icons-x"
+          variant="ghost"
+          color="gray"
+          to="https://x.com/nuxt_js"
+          target="_blank"
+        />
+        <UButton
+          icon="i-simple-icons-github"
+          variant="ghost"
+          color="gray"
+          to="https://github.com/nuxt-modules/color-mode"
+          target="_blank"
+        />
+      </template>
+    </UHeader>
+    <UContainer>
+      <UPage
+        class="pb-10"
+      >
+        <UPageHeader
+          :title="page.title"
+          :description="page.description"
+        />
+        <UPageBody
+          prose
+          class="pb-0"
+        >
+          <ContentRenderer
+            v-if="page.body"
+            :value="page"
+          />
+        </UPageBody>
+        <template #right>
+          <UContentToc :links="page.body.toc.links">
+            <template #bottom>
+              <div class="hidden lg:block space-y-6 !mt-6">
+                <UDivider
+                  v-if="page.body?.toc?.links?.length"
+                  type="dashed"
+                />
+                <UPageLinks
+                  title="Community"
+                  :links="communityLinks"
+                />
+              </div>
+            </template>
+          </UContentToc>
+        </template>
+      </UPage>
+    </UContainer>
+  </UMain>
+</template>

docs/server/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "extends": "../.nuxt/tsconfig.server.json"
+}

docs/tsconfig.json

@@ -1,3 +1,4 @@
 {
+  // https://nuxt.com/docs/guide/concepts/typescript
   "extends": "./.nuxt/tsconfig.json"
 }

package.json

@@ -32,6 +32,8 @@
     "dev": "nuxi dev playground",
     "dev:build": "nuxi build playground",
     "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
+    "docs": "nuxi dev docs",
+    "docs:build": "nuxi generate docs",
     "lint": "eslint .",
     "prepublishOnly": "pnpm run prepack",
     "release": "pnpm lint && pnpm test && changelogen --release && npm publish && git push --follow-tags",