Fix the ssl version number error of nginx conf

README.md

@@ -36,20 +36,19 @@ For now, the entire open source community base on Git and GitHub. It's centraliz
 
 For now, the monorepo engine could be deployed on your host machine or insulated into containers. For deploying through docker, follow the steps below:
 
-1. Clone the project and build the docker images
+1. Pull docker images from Docker Hub
 
 ```bash
-$ git clone https://github.com/web3infra-foundation/mega.git
-$ cd mega
-$ git submodule update --init --recursive
-$ docker buildx build -t mono-pg:0.1-pre-release -f ./docker/mono-pg-dockerfile .
-$ docker buildx build -t mono-engine:0.1-pre-release -f ./docker/mono-engine-dockerfile .
-$ docker buildx build -t mono-ui:0.1-pre-release -f ./docker/mono-ui-dockerfile .
+$ docker pull genedna/mega:mono-pg-0.1-pre-release
+$ docker pull genedna/mega:mono-engine:0.1-pre-release
+$ docker pull genedna/mega:mono-ui:0.1-pre-release
 ```
 
 2. Initialize for mono-engine and PostgreSQL
 
 ```bash
+$ git clone https://github.com/web3infra-foundation/mega.git
+$ cd mega
 # Linux or MacOS
 $ ./docker/init-volume.sh /mnt/data ./docker/config.toml
 ```

aria/contents/docs/components/code-block/index.mdx

@@ -0,0 +1,41 @@
+---
+title: Code Block
+description: This section previews the Code Block features in markdown.
+---
+
+The Code Block in this documentation allows you to display code snippets with optional line numbering and line highlighting.
+
+## Preview
+
+```javascript:main.js showLineNumbers {3-4}
+function isRocketAboutToCrash() {
+    // Check if the rocket is stable
+    if (!isStable()) {
+        NoCrash(); // Prevent the crash
+    }
+}
+```
+
+In this example, line numbers are displayed for lines 1 to 4. You can specify which lines to highlight using the format `{2,3-5}`.
+
+## Usage
+
+You can directly use the following syntax to create a code block with line numbers and highlight specific lines:
+
+````plaintext
+```javascript:main.js showLineNumbers {3-4}
+function isRocketAboutToCrash() {
+    // Check if the rocket is stable
+    if (!isStable()) {
+        NoCrash(); // Prevent the crash
+    }
+}
+```
+````
+
+### Features
+
+- **Line Numbers**: Enable line numbers by adding `showLineNumbers` after the opening backticks.
+- **Highlight Lines**: Specify lines to highlight using curly braces (e.g., `{2,3-5}`).
+- **Syntax Highlighting**: Use the appropriate language for syntax highlighting.
+

aria/contents/docs/components/custom/index.mdx

@@ -0,0 +1,38 @@
+---
+title: Custom Components
+description: How to create custom components for Markdown.
+---
+
+To add custom components in AriaDocs, follow these steps:
+
+1. **Create Your Component**: First, create your custom component in the `@components/markdown` folder. For example, you might create a file named `Outlet.tsx`.
+
+2. **Import Your Component**: Next, open the `@lib/markdown.ts` file. This is where you'll register your custom component for use in Markdown.
+
+3. **Add Your Component to the Components Object**: In the `@lib/markdown.ts` file, import your custom component and add it to the `components` object. Here’s how to do it:
+
+```ts
+import Outlet from "@/components/markdown/outlet";
+
+// Add custom components
+const components = {
+  Outlet,
+};
+```
+
+4. **Using Your Custom Component in Markdown**: After registering your component, you can now use it anywhere in your Markdown content. For instance, if your `Outlet` component is designed to display additional information, you can use it as follows:
+
+### Markdown Example
+
+```markdown
+<Outlet>
+  This is some custom content rendered by the Outlet component!
+</Outlet>
+```
+
+### Rendered Output
+
+This will render the content inside the `Outlet` component, allowing you to create reusable and dynamic Markdown content.
+
+
+By following these steps, you can extend the capabilities of your Markdown documentation and create a more engaging user experience.

aria/contents/docs/components/image-link/index.mdx

@@ -0,0 +1,57 @@
+---
+title: Image and Link
+description: This section provides an overview of how AriaDocs handles links and images in Markdown.
+---
+
+In AriaDocs, all links and images written in Markdown are automatically converted to their respective Next.js components. This allows for better optimization and performance in your application.
+
+## Links
+
+When you create a link in your Markdown, it is converted to the Next.js `Link` component. This enables client-side navigation and improves loading times. Here’s an example of how a Markdown link is transformed:
+
+### Markdown example
+
+```markdown 
+[Visit OpenAI](https://www.openai.com)
+```
+
+### Rendered Output
+
+The above Markdown is converted to:
+
+```jsx
+<Link href="https://www.openai.com" target="_blank" rel="noopener noreferrer">
+    Visit OpenAI
+</Link>
+```
+
+## Images
+
+Similarly, images in Markdown are transformed into the Next.js `Image` component. This allows for automatic image optimization, such as lazy loading and resizing, which enhances performance and user experience. Here’s an example:
+
+### Markdown
+
+```markdown
+![Alt text for the image](https://via.placeholder.com/150)
+```
+
+### Output
+
+The above Markdown is converted to:
+
+```jsx
+<Image
+    src="https://via.placeholder.com/150"
+    alt="Alt text for the image"
+    width={800}
+    height={350}
+/>
+```
+
+## Benefits
+
+- **Performance Optimization**: Automatic conversion to Next.js components ensures optimized loading of images and links.
+- **Improved User Experience**: Client-side navigation with Next.js `Link` improves the browsing experience.
+- **Responsive Images**: Next.js `Image` component handles responsive images, providing the best quality for various device sizes.
+
+By utilizing these features, you can ensure that your documentation is not only visually appealing but also performs efficiently.

aria/contents/docs/components/index.mdx

@@ -0,0 +1,9 @@
+---
+title: Components
+description: This section provides an overview of the custom components available in AriaDocs.
+---
+
+Explore the custom components we've defined for easy integration and development within your projects. Each component is designed to enhance your workflow and streamline your development process.
+
+
+<Outlet path="components" />

aria/contents/docs/components/note/index.mdx

@@ -0,0 +1,44 @@
+---
+title: Note
+description: This section previews the Note component.
+---
+
+The `Note` component allows you to display different types of messages such as general notes, warnings, or success notifications. Each type is styled accordingly, providing a clear visual cue to the user.
+
+## Preview
+
+<Note type="note" title="Note">
+  This is a general note to convey information to the user.
+</Note>
+<Note type="danger" title="Danger">
+  This is a danger alert to notify the user of a critical issue.
+</Note>
+<Note type="warning" title="Warning">
+  This is a warning alert for issues that require attention.
+</Note>
+<Note type="success" title="Success">
+  This is a success message to inform the user of successful actions.
+</Note>
+
+## Props
+
+| Prop    | Type                           | Default | Description                                |
+|---------|--------------------------------|---------|--------------------------------------------|
+| `title` | `string`                       | "Note"  | Sets the title of the note.                |
+| `type`  | `"note"`, `"danger"`, `"warning"`, `"success"` | "note"  | Determines the visual style of the note.   |
+
+## Code
+
+```jsx
+<Note type="note" title="Note">
+  This is a general note to convey information to the user.
+</Note>
+<Note type="danger" title="Danger">
+  This is a danger alert to notify the user of a critical issue.
+</Note>
+<Note type="warning" title="Warning">
+  This is a warning alert for issues that require attention.
+</Note>
+<Note type="success" title="Success">
+  This is a success message to inform the user of successful actions.
+</Note>

aria/contents/docs/components/project-structure/index.mdx

@@ -0,0 +1,95 @@
+---
+title: Project Structure
+description: This section provides an overview of Project Structure.
+---
+
+## Project Structure Overview
+
+### app
+
+This folder contains the main application code for Next.js, managing layouts, routing, and specific content pages. It is organized to support both the `docs` and `blog` sections, with dedicated pages and layouts for each section.
+
+```
+app                         // Main Next.js application folder
+├── page.tsx                // Hero page - the entry point of the app showcasing key content
+├── layout.tsx              // Main layout file, applies global navigation and footer
+├── blog
+│   ├── page.tsx            // Blog list page, displaying all blog posts with titles, dates, and excerpts
+│   └── [slug]
+│       └── page.tsx        // Dynamic blog post page for viewing individual posts with rich content
+└── docs
+    ├── layout.tsx          // Documentation layout with sidebar, providing easy navigation across doc pages
+    └── [[...slug]]         // Catch-all route to handle nested documentation pages, allowing flexible doc structure
+```
+
+### components
+
+This folder contains all reusable components used throughout the project. It’s structured to categorize components, making it easy to locate and manage UI elements, Markdown customizations, and navigation.
+
+```
+components                    // Reusable components
+├── ui                        // ShadCN components, includes standardized UI elements like buttons, forms, and modals
+├── markdown                  // Custom Markdown components for rendering rich Markdown content
+│   ├── CodeBlock.tsx         // Component for rendering syntax-highlighted code blocks
+│   ├── Image.tsx             // Component for handling responsive images in Markdown
+│   └── Table.tsx             // Component to render tables with consistent styling
+└── navbar.tsx                // Main navigation component for the site header, managing links and responsive behavior
+```
+
+### styles
+
+This folder contains global and component-specific CSS files, allowing for project-wide styling consistency and customizations.
+
+```
+styles                        // CSS files
+├── globals.css               // Global CSS file, includes Tailwind base, utilities, and custom global styles
+├── syntax.css                // Syntax highlighting styles, providing consistent code block appearance across the site
+└── overrides.css             // Additional custom styles that override specific component or plugin defaults
+```
+
+### contents
+
+This folder stores all Markdown content for the documentation and blog sections, with clear organization by content type. Each Markdown file represents a single piece of content, with frontmatter used for metadata.
+
+```
+contents                      // Markdown content for blogs and documentation
+├── docs                      // Documentation content, structured to support nested sections and pages
+│   ├── getting-started.md    // Introductory guide for new users
+│   ├── api-reference.md      // API documentation with detailed endpoint descriptions
+│   └── tutorials             // Subfolder for tutorial-style content
+│       └── tutorial-1.md     // Step-by-step tutorial on a specific topic
+└── blogs                     // Blog content, organized by post
+    ├── intro-to-project.md   // Blog post introducing the project and its goals
+    └── dev-updates.md        // Post discussing recent development updates and new features
+```
+
+### public
+
+This folder holds all static assets, such as images, videos, fonts, and icons. These files are directly accessible via URL, so it’s important to avoid sensitive or private content here.
+
+```
+public                        // Publicly accessible assets
+├── images                    // Image assets, used across various parts of the app
+│   ├── logo.png              // Project logo for branding
+│   └── banner.jpg            // Banner image for the hero section
+├── icons                     // SVG icons for the app
+└── videos                    // Video files for media content, if any
+```
+
+### lib
+
+This folder contains helper functions and utilities used across the application, such as Markdown parsing and routing logic. These utilities help keep the codebase clean and organized by separating out common functionality.
+
+```
+lib                           // Utility or helper functions
+├── markdown.ts               // Markdown parsing logic, converts Markdown to HTML and adds custom components
+├── routes-config.ts          // Routing configuration for docs, maps URLs to content files for dynamic routing
+└── utils.tsx                 // General utility functions used across the app, such as data formatting and validation helpers
+```
+
+### Additional
+
+- **`package.json`**: Contains metadata about the project, dependencies, and scripts for building and running the application.
+- **`tailwind.config.ts`**: Configures Tailwind CSS, allowing customization of theme colors, fonts, and responsive breakpoints specific to this project. 
+
+This structure organizes your project in a way that supports scalability and maintainability, making it easier to navigate and work on different sections of the application.

aria/contents/docs/components/stepper/index.mdx

@@ -0,0 +1,38 @@
+---
+title: Stepper
+description: This section previews the stepper component.
+---
+
+In this guide, we utilize a custom `Stepper` component, specifically designed for AriaDocs, which enables users to display step-by-step instructions directly within the markdown render. 
+
+## Preview
+##
+
+<Stepper>
+  <StepperItem title="Step 1: Clone the AriaDocs Repository">
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec interdum, felis sed efficitur tincidunt, justo nulla viverra enim, et maximus nunc dolor in lorem.
+  </StepperItem>
+  <StepperItem title="Step 2: Access the Project Directory">
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin non neque ut eros auctor accumsan. Mauris a nisl vitae magna ultricies aliquam.
+  </StepperItem>
+  <StepperItem title="Step 3: Install Required Dependencies">
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ut ipsum nec nulla ultricies porttitor et non justo.
+  </StepperItem>
+</Stepper>
+
+## Code
+
+```jsx
+<Stepper>
+  <StepperItem title="Step 1: Clone the AriaDocs Repository">
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec interdum, felis sed efficitur tincidunt, justo nulla viverra enim, et maximus nunc dolor in lorem.
+  </StepperItem>
+  <StepperItem title="Step 2: Access the Project Directory">
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin non neque ut eros auctor accumsan. Mauris a nisl vitae magna ultricies aliquam.
+  </StepperItem>
+  <StepperItem title="Step 3: Install Required Dependencies">
+    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ut ipsum nec nulla ultricies porttitor et non justo.
+  </StepperItem>
+</Stepper>
+```
+