<script setup lang="ts">
// 无需额外的脚本逻辑
</script>

<template>
  <div class="w-full top-0 left-0 bg-gray-50 dark:bg-gray-900">
    <!-- 欢迎卡片 -->
    <div
      class="bg-slate-200 dark:bg-slate-600 rounded-lg border border-gray-200 dark:border-gray-700 p-2 sm:p-4 shadow-sm"
    >
      <h1 class="text-xl font-bold text-gray-900 dark:text-white mb-2">
        Hi 👋, 欢迎使用简单文档系统.
      </h1>
      <!-- 编号列表 -->
      <div class="mt-2 text-base text-gray-700 dark:text-gray-300">
        · Nuxt 4 全栈框架构建<br>
        · 基于 Markdown 语法的文档系统！<br>
        · 在文档内使用自定义语法的 Vue 组件!
      </div>
    </div>
  </div>
</template>
