📝 Build document directory structure

frontend/docs/src/index.md

@@ -1,28 +1,56 @@
 ---
-# https://vitepress.dev/reference/default-theme-home-page
 layout: home
 
 hero:
   name: "voidraft"
-  text: "An elegant text snippet recording tool designed for developers."
-  tagline: My great project tagline
+  text: "An elegant text snippet recording tool"
+  tagline: Designed for developers, built with modern technology
   image: 
     src: /static/img/hero.png
     alt: "voidraft"
   actions:
     - theme: brand
-      text: Markdown Examples
-      link: /markdown-examples
+      text: Get Started
+      link: https://github.com/landaiqing/voidraft/releases
     - theme: alt
-      text: API Examples
-      link: /api-examples
+      text: Documentation
+      link: /guide/introduction
 
 features:
-  - title: Feature A
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
-  - title: Feature B
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
-  - title: Feature C
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
----
+  - icon: 📝
+    title: Block-Based Editing
+    details: Split your content into independent code blocks, each with different language settings. Inspired by Heynote's innovative design philosophy.
+  
+  - icon: 🎨
+    title: Syntax Highlighting
+    details: Built-in support for 30+ programming languages with automatic language detection and Prettier integration for code formatting.
+  
+  - icon: 🌐
+    title: HTTP Client
+    details: Integrated HTTP client with support for multiple request formats including JSON, FormData, XML, and more. Test APIs directly within the editor.
+  
+  - icon: 🎯
+    title: Multi-Window Support
+    details: Work on multiple documents simultaneously with independent windows. Each window maintains its own state and configuration.
+  
+  - icon: 🎭
+    title: Customizable Themes
+    details: Full theme customization support with dark/light modes. Create and save your own editor themes to match your preferences.
+  
+  - icon: 🔧
+    title: Rich Extensions
+    details: VSCode-style search and replace, rainbow brackets, minimap, color picker, translation tool, text highlighting, and more.
+  
+  - icon: 🔄
+    title: Auto-Update System
+    details: Built-in self-update mechanism with support for multiple update sources. Stay up-to-date with the latest features and improvements.
+  
+  - icon: ☁️
+    title: Git-Based Backup
+    details: Automatic data backup using Git repositories. Supports GitHub, Gitea, with multiple authentication methods including SSH and tokens.
+  
+  - icon: ⚡
+    title: Modern Architecture
+    details: Built with Wails3, Vue 3, and CodeMirror 6. Cross-platform desktop application with native performance and modern UI.
 
+---