docs: update README

Author: xiejay97

CONTRIBUTING.md

@@ -25,7 +25,7 @@ Consider the following guidelines:
 - Make your changes in a new git branch:
 
   ```shell
-  git checkout -b issue-N/A main
+  git switch -c issue-N/A
   ```
 
 - Create your patch, **including appropriate test cases**.
@@ -77,12 +77,10 @@ Must be one of the following:
 
 - **empty**: Does not provide scope
 - **module**: Such as **site**
-- **module:\***: Such as **ui:button**
 
 Real world examples can look like this:
 
 ```shell
 chore: update dependencies
 feat(site): support themes
-fix(ui:button): fix `onClick` no response
 ```

README.md

@@ -1,10 +1,71 @@
+<p align="center">
+  <a href="//react-devui.com" rel="noopener" target="_blank"><img width="150" src="/packages/site/src/assets/logo.svg" alt="DevUI logo"></a>
+</p>
+
 <h1 align="center">React DevUI</h1>
 
-<p align="center">UI components based on React</p>
+<div align="center">
+
+<!-- prettier-ignore-start -->
+[![npm latest package](http://img.shields.io/npm/v/@react-devui/ui/latest.svg?style=flat-square)](https://www.npmjs.com/package/@react-devui/ui)
+[![npm bundle size](https://img.shields.io/bundlephobia/minzip/@react-devui/ui?style=flat-square)](https://bundlephobia.com/package/@react-devui/ui)
+[![gitHub workflow status](https://img.shields.io/github/workflow/status/DevCloudFE/react-devui/Main?style=flat-square)](https://github.com/DevCloudFE/react-devui/actions/workflows/main.yml)
+<!-- prettier-ignore-end -->
+
+</div>
+
+<div align="center">
 
 English | [简体中文](README.zh-CN.md)
 
+</div>
+
+## Installation
+
+```bash
+yarn add @react-devui/ui @react-devui/icons @react-devui/hooks @react-devui/utils
+```
+
+## Getting Started
+
+```tsx
+import type { DRootProps } from '@react-devui/ui';
+
+import { useMemo } from 'react';
+
+import { DRoot } from '@react-devui/ui';
+
+export default function App() {
+  const rootContext = useMemo<DRootProps['context']>(
+    () => ({
+      layout: { pageScrollEl: '#app-main', contentResizeEl: '#app-content' },
+    }),
+    []
+  );
+
+  return (
+    <DRoot context={rootContext}>
+      <main id="app-main" style={{ overflow: 'auto' }}>
+        <section id="app-content" style={{ height: '200vh' }}>
+          Some content...
+        </section>
+      </main>
+    </DRoot>
+  );
+}
+```
+
+## Links
+
 - [react-devui.com](//react-devui.com)
 - [admin.react-devui.com](//admin.react-devui.com)
 
-Need unit test support (Jest) 🤝
+## Contributing
+
+Please read our [contributing guide](/CONTRIBUTING.md) first.
+
+Need unit test support (Jest) 🤝.
+
+## License
+
+[![gitHub license](https://img.shields.io/github/license/DevCloudFE/react-devui?style=flat-square)](https://github.com/DevCloudFE/react-devui/actions/workflows/main.yml)

README.zh-CN.md

@@ -1,10 +1,71 @@
+<p align="center">
+  <a href="//react-devui.com" rel="noopener" target="_blank"><img width="150" src="/packages/site/src/assets/logo.svg" alt="DevUI logo"></a>
+</p>
+
 <h1 align="center">React DevUI</h1>
 
-<p align="center">基于 React 的 UI 组件库</p>
+<div align="center">
+
+<!-- prettier-ignore-start -->
+[![npm latest package](http://img.shields.io/npm/v/@react-devui/ui/latest.svg?style=flat-square)](https://www.npmjs.com/package/@react-devui/ui)
+[![npm bundle size](https://img.shields.io/bundlephobia/minzip/@react-devui/ui?style=flat-square)](https://bundlephobia.com/package/@react-devui/ui)
+[![gitHub workflow status](https://img.shields.io/github/workflow/status/DevCloudFE/react-devui/Main?style=flat-square)](https://github.com/DevCloudFE/react-devui/actions/workflows/main.yml)
+<!-- prettier-ignore-end -->
+
+</div>
+ 
+ <div align="center">
 
 [English](README.md) | 简体中文
 
+</div>
+
+## 安装
+
+```bash
+yarn add @react-devui/ui @react-devui/icons @react-devui/hooks @react-devui/utils
+```
+
+## 快速开始
+
+```tsx
+import type { DRootProps } from '@react-devui/ui';
+
+import { useMemo } from 'react';
+
+import { DRoot } from '@react-devui/ui';
+
+export default function App() {
+  const rootContext = useMemo<DRootProps['context']>(
+    () => ({
+      layout: { pageScrollEl: '#app-main', contentResizeEl: '#app-content' },
+    }),
+    []
+  );
+
+  return (
+    <DRoot context={rootContext}>
+      <main id="app-main" style={{ overflow: 'auto' }}>
+        <section id="app-content" style={{ height: '200vh' }}>
+          Some content...
+        </section>
+      </main>
+    </DRoot>
+  );
+}
+```
+
+## 链接
+
 - [react-devui.com](//react-devui.com)
 - [admin.react-devui.com](//admin.react-devui.com)
 
-需要单元测试支持（Jest）🤝
+## 贡献
+
+请先阅读我们的[贡献指南](/CONTRIBUTING.md)。
+
+需要单元测试支持（Jest） 🤝。
+
+## 授权协议
+
+[![gitHub license](https://img.shields.io/github/license/DevCloudFE/react-devui?style=flat-square)](https://github.com/DevCloudFE/react-devui/actions/workflows/main.yml)

packages/hooks/project.json

@@ -21,7 +21,7 @@
           },
           {
             "glob": "README.md",
-            "input": "packages/hooks",
+            "input": "",
             "output": "/"
           },
           {

packages/icons/project.json

@@ -21,7 +21,7 @@
           },
           {
             "glob": "README.md",
-            "input": "packages/icons",
+            "input": "",
             "output": "/"
           },
           {

packages/ui/project.json

@@ -26,7 +26,7 @@
           },
           {
             "glob": "README.md",
-            "input": "packages/ui",
+            "input": "",
             "output": "/"
           },
           {

packages/utils/project.json

@@ -21,7 +21,7 @@
           },
           {
             "glob": "README.md",
-            "input": "packages/utils",
+            "input": "",
             "output": "/"
           },
           {