doc: Update top page

docs/.vitepress/config.ts

@@ -3,19 +3,31 @@ import { defineConfig } from "vitepress"
 // https://vitepress.dev/reference/site-config
 export default defineConfig({
   title: "react-dropzone-vv",
-  description: "react-dropzone-vv docs",
+  description:
+    "react-dropzone-vv is a simple React hook " +
+    "that creates a drag-and-drop zone for files. " +
+    "Simple, yet customizable by the user.",
   themeConfig: {
     // https://vitepress.dev/reference/default-theme-config
     nav: [
       { text: "Home", link: "/" },
+      { text: "Introduction", link: "/introduction/what-is-react-dropzone-vv" },
       { text: "Examples", link: "/examples/basic-example" },
     ],
 
     sidebar: [
       {
         text: "Introduction",
         items: [
+          {
+            text: "What is react-dropzone-vv",
+            link: "/introduction/what-is-react-dropzone-vv",
+          },
           { text: "Getting Started", link: "/introduction/getting-started" },
+          {
+            text: "Hooks and Components",
+            link: "/introduction/hooks-and-components",
+          },
         ],
       },
       {

docs/index.md

@@ -3,22 +3,27 @@
 layout: home
 
 hero:
-  name: "react-dropzone-vv docs"
-  text: "A VitePress Site"
-  tagline: My great project tagline
-  # actions:
-  #   - theme: brand
-  #     text: Markdown Examples
-  #     link: /markdown-examples
-  #   - theme: alt
-  #     text: API Examples
-  #     link: /api-examples
+  name: "react-dropzone-vv"
+  text: ""
+  tagline: "react-dropzone-vv is a simple React hook that creates a drag-and-drop zone for files. Simple, yet customizable by the user."
+  actions:
+    - theme: brand
+      text: What is react-dropzone-vv
+      link: /introduction/what-is-react-dropzone-vv
+    - theme: alt
+      text: Getting Started
+      link: /introduction/getting-started.html
+    - theme: alt
+      text: Github
+      link: https://github.com/yosipy/react-dropzone-vv
 
 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
+  - title: Lightweight
+    details: Small package just to create drag-and-drop zones
+    icon: 📃
+  - title: It's used in my application
+    details: ImgRoller is a free website that allows you to resize and compress multiple images at once.
+    icon:
+      src: /imgroller.svg
+    link: https://yosidev.com/tools/imgroller/en/
 ---