feat(docs): seo improvements (#43)

Author: HugoRCD

docs/app/components/AppHeaderLogo.vue

@@ -3,6 +3,8 @@
     xmlns="http://www.w3.org/2000/svg"
     viewBox="0 0 576 128"
     fill="none"
+    role="img"
+    aria-label="Comark"
   >
     <path
       stroke="currentColor"

docs/app/pages/play.vue

@@ -2,6 +2,10 @@
 definePageMeta({
   footer: false,
 })
+useSeoMeta({
+  title: 'Playground - Comark',
+  description: 'Try Comark live in the browser. Edit markdown with component syntax and see the rendered output in real-time.',
+})
 defineOgImageComponent('Docs', {
   headline: 'Playground',
 })

docs/app/pages/stream.vue

@@ -8,6 +8,10 @@ import resolveComponent from '../utils/components-manifest'
 definePageMeta({
   footer: false,
 })
+useSeoMeta({
+  title: 'Streaming Demo - Comark',
+  description: 'See Comark streaming in action. Watch markdown content parse and render in real-time as it arrives.',
+})
 defineOgImageComponent('Docs', {
   headline: 'Streaming',
 })

docs/app/pages/test.vue

@@ -3,6 +3,10 @@ import { Comark } from 'comark/vue'
 import highlight from 'comark/plugins/highlight'
 import resolveComponent from '../utils/components-manifest'
 
+useHead({
+  meta: [{ name: 'robots', content: 'noindex, nofollow' }],
+})
+
 const markdown = ref(`
 ---
 seo:

docs/content/3.rendering/2.react.md

@@ -195,7 +195,7 @@ export default function ArticleCard() {
 ### With Tailwind CSS
 
 ```tsx [App.tsx]
-<Comark 
+<Comark
   value={content}
   className="prose prose-slate lg:prose-xl dark:prose-invert"
 />

docs/content/index.md

@@ -165,11 +165,11 @@ footerSections:
       - label: Syntax Highlighting
         to: /plugins/core/highlight
       - label: Math
-        to: /plugins/community/math
+        to: /plugins/external/math
       - label: CJK
-        to: /plugins/community/cjk
+        to: /plugins/external/cjk
       - label: Mermaid
-        to: /plugins/community/mermaid
+        to: /plugins/external/mermaid
   - title: Community
     links:
       - label: GitHub