editor/apps/dev/src/pages/basic-editing.vue

<script setup lang="ts">
import LiveExample from "~/components/LiveExample.vue"
</script>

<template>
  <UPage>
    <UPageHeader title="Basic Editing" description="Headings, paragraphs, and structure." />

    <UPageBody>
      <div class="space-y-8">
        <LiveExample
          title="Headings"
          description="Use 1-6 # characters followed by a space."
          :content="`# Heading 1\n\n## Heading 2\n\n### Heading 3\n\n#### Heading 4`"
        />

        <LiveExample
          title="Paragraphs"
          description="Blank lines separate paragraphs. Each paragraph is its own Block."
          :content="`First paragraph with some text.\n\nSecond paragraph goes here.\n\nThird paragraph with more content for testing.`"
        />

        <LiveExample
          title="Horizontal Rule"
          description="Three or more dashes create a horizontal rule."
          :content="`Content above the rule\n\n---\n\nContent below the rule`"
        />
      </div>
    </UPageBody>
  </UPage>
</template>