diff --git a/app/app.config.ts b/app/app.config.ts
index 0d58b73..67db033 100644
--- a/app/app.config.ts
+++ b/app/app.config.ts
@@ -1,8 +1,8 @@
 export default defineAppConfig({
   ui: {
     colors: {
-      primary: 'green',
-      neutral: 'slate'
+      primary: 'blue',
+      neutral: 'zinc'
     }
   },
   uiPro: {
diff --git a/app/components/AppSidebar.vue b/app/components/AppSidebar.vue
index b89aaa5..3fe3f65 100644
--- a/app/components/AppSidebar.vue
+++ b/app/components/AppSidebar.vue
@@ -63,7 +63,7 @@
             </NuxtLink>
           </div>
         </div>
-
+        <ContentDirectory />
         <!-- Document Navigation -->
         <UContainer>
           <UPageAside>
diff --git a/app/components/ContentDirectory.vue b/app/components/ContentDirectory.vue
new file mode 100644
index 0000000..7c2d26a
--- /dev/null
+++ b/app/components/ContentDirectory.vue
@@ -0,0 +1,52 @@
+<template>
+  <div>
+    <h3 class="text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-3 px-1">
+      文档目录
+    </h3>
+    
+    <UContentNavigation 
+      :navigation="directoryNavigation" 
+      highlight 
+      color="primary"
+      variant="pill"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { ContentNavigationItem } from '@nuxt/content'
+
+// 获取导航数据
+const navigation = inject<Ref<ContentNavigationItem[]>>('navigation')
+
+// 处理导航数据，只显示一级目录和根目录文件
+const directoryNavigation = computed(() => {
+  if (!navigation?.value) return []
+  
+  return navigation.value.map(item => {
+    // 如果是根目录文件（没有 children），直接返回
+    if (!item.children || item.children.length === 0) {
+      return {
+        title: item.title,
+        path: item.path,
+        icon: (item.icon as string) || 'i-lucide-file-text',
+        active: Boolean(item.active)
+      }
+    }
+    
+    // 如果是一级目录，只保留目录本身，不显示子项
+    return {
+      title: item.title,
+      path: item.path,
+      icon: (item.icon as string) || 'i-lucide-folder',
+      active: Boolean(item.active),
+      // 不包含 children，这样就不会展开显示子项
+      children: []
+    }
+  }).filter(item => item.title && item.path) // 过滤掉空项
+})
+
+// 调试信息
+// console.log('ContentDirectory: Navigation data:', navigation.value)
+// console.log('ContentDirectory: Processed navigation:', directoryNavigation.value)
+</script>
\ No newline at end of file
diff --git a/nuxt.config.ts b/nuxt.config.ts
index 5d77cd7..c68e64b 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -1,5 +1,6 @@
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
+
   modules: [
     '@nuxt/eslint',
     '@nuxt/image',