feat(site): Optimize site documentation typesetting

examples/sites/demos/pc/webdoc/aui-adapter.md

@@ -20,13 +20,13 @@
 - 随着应用生态特别是手机应用生态的繁荣，以及多样化设备生态的发展，`多端`、`多主题`被提上日程；
 - 原有 AUI 推出的主题方案过于臃肿（用户定制主题需要设置一堆的  `cssvar`  变量，因为颜色没有统一，配置多主题的门槛也比较高），后期会基于  [tailwindcss](https://github.com/tailwindlabs/tailwindcss)  对主题变量进行收拢（简化开发者配置）以及工程化改造，使得定制多主题更加简单。目前业内比较成熟的主题方案  [daisyui](https://github.com/saadeghi/daisyui)。
 
-鉴于以上原因， 推出  `SaaS`  主题，如果想体验  `SaaS`  主题可以按照下述文档，进行打包配置更改：
+鉴于以上原因，推出  `SaaS`  主题，如果想体验  `SaaS`  主题可以按照下述文档，进行打包配置更改：
 
 #### 方法一
 
 方案一需要额外安装以下依赖：
 
-- `@opentiny/vue-theme-saas`  主题会对现有组件样式进行细微调整，不会影响原有 DOM 结构以及 API 。
+- `@opentiny/vue-theme-saas`  主题会对现有组件样式进行细微调整，不会影响原有 DOM 结构以及 API。
 - `@opentiny/vue-icon-saas`  是  `SaaS`  主题风格配套的 icon 图标组件。
 - `@opentiny/vue-design-saas`  是  `SaaS`  主题风格配套的设计规范配置。
 
@@ -68,7 +68,7 @@ export default defineConfig({
 </script>
 
 <template>
-  <!-- 注入saas设计规范配置 -->
+  <!-- 注入 saas 设计规范配置 -->
   <config-provider :design="designSaasConfig">
     <my-app></my-app>
   </config-provider>
@@ -79,7 +79,7 @@ export default defineConfig({
 
 方法二需要额外安装以下依赖：
 
-- `@opentiny/vue-theme-saas`  主题会对现有组件样式进行细微调整，不会影响原有 DOM 结构以及 API 。
+- `@opentiny/vue-theme-saas`  主题会对现有组件样式进行细微调整，不会影响原有 DOM 结构以及 API。
 - `@opentiny/vue-icon-saas`  是  `SaaS`  主题风格配套的 icon 图标组件。
 - `@opentiny/vue-common-saas`  是  `SaaS`  主题风格配套的适配层，内联了方法一的`@opentiny/vue-design-saas`。
 
@@ -174,7 +174,7 @@ app.config.globalProperties.tiny_mode = { value: 'mobile-first' }
   <div>
     <tiny-layout>
       <tiny-row tiny_mode="pc" tiny_mode_root>
-        <tiny-button>PC按钮</tiny-button>
+        <tiny-button>PC 按钮</tiny-button>
         <tiny-button type="primary" native-type="submit">主要按钮</tiny-button>
         <tiny-button type="success">成功按钮</tiny-button>
         <tiny-button type="info">信息按钮</tiny-button>

examples/sites/demos/pc/webdoc/changelog-en.md

@@ -155,7 +155,7 @@
 
 ### 📢 Breaking changes
 
-- Remove the `rich-text` component, because the third-party plug-in `quill` introduced by the component is an overdue high-risk dependency, and if you want to continue to use it, you can use the old version： `@opentiny/vue-rich-text@3.0.0`
+- Remove the `rich-text` component, because the third-party plug-in `quill` introduced by the component is an overdue high-risk dependency, and if you want to continue to use it, you can use the old version: `@opentiny/vue-rich-text@3.0.0`
 
 ### ✨ New characteristics
 

examples/sites/demos/pc/webdoc/changelog.md

@@ -101,7 +101,7 @@ Tiny Vue 团队在正常情况下使用 每月 发布策略。
 - fix(notify): [notify] missing title parameter style exception by @betavs in https://github.com/opentiny/tiny-vue/pull/2571
 - fix(button): [button,cascader] fix button's radius and cascader bgcolor by @shenjunjian in https://github.com/opentiny/tiny-vue/pull/2572
 - fix(select): [select] fix the problem of multiple selection of hover … by @MomoPoppy in https://github.com/opentiny/tiny-vue/pull/2566
-- fix: fix grid、flowchart、grid、tree-menu bugs by @zzcr in https://github.com/opentiny/tiny-vue/pull/2588
+- fix: fix grid, flowchart, grid, tree-menu bugs by @zzcr in https://github.com/opentiny/tiny-vue/pull/2588
 - fix: remove mathlive demo to fixed site build error by @zzcr in https://github.com/opentiny/tiny-vue/pull/2587
 - fix: fix color-select-panel error when publish by @zzcr in https://github.com/opentiny/tiny-vue/pull/2583
 - fix(date-picker): [date-picker] Fix the issue of icons not being cent… by @Youyou-smiles in https://github.com/opentiny/tiny-vue/pull/2592
@@ -134,7 +134,7 @@ Tiny Vue 团队在正常情况下使用 每月 发布策略。
 
 ### Breaking Changes 🛠
 
-- 为了更好的用户体验，从 @opentiny/vue@3.19.0 版本开始， 组件库的整体默认风格切换为 Opentiny Design 新风格。
+- 为了更好的用户体验，从 @opentiny/vue@3.19.0 版本开始，组件库的整体默认风格切换为 Opentiny Design 新风格。
 - feat(tooltip): [tooltip] add text content wrapper and content-max-height prop by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1910
 
 ### Exciting New Features 🎉
@@ -202,7 +202,7 @@ Tiny Vue 团队在正常情况下使用 每月 发布策略。
 - feat(carousel): [carousel]modify smb theme and add props by @James-9696 in https://github.com/opentiny/tiny-vue/pull/2125
 - feat(switch): [switch] Adapting to the SMB theme by @Youyou-smiles in https://github.com/opentiny/tiny-vue/pull/2112
 - feat(drop-times): [drop-times] Adapting to the SMB theme by @Youyou-smiles in https://github.com/opentiny/tiny-vue/pull/2118
-- fix(theme):　[tree,tooltip,transfer, cascader] update unsolved smb components by @shenjunjian in https://github.com/opentiny/tiny-vue/pull/2124
+- fix(theme): [tree,tooltip,transfer, cascader] update unsolved smb components by @shenjunjian in https://github.com/opentiny/tiny-vue/pull/2124
 - feat(modal): [modal] modify demo by @James-9696 in https://github.com/opentiny/tiny-vue/pull/2129
 - feat(checkbox): [checkbox] Adapting to the SMB theme by @Youyou-smiles in https://github.com/opentiny/tiny-vue/pull/2130
 - feat: [input] add new vars less by @zzcr in https://github.com/opentiny/tiny-vue/pull/2128
@@ -535,7 +535,7 @@ Tiny Vue 团队在正常情况下使用 每月 发布策略。
 - feat(link-menu): [link-menu]modify smb-theme by @James-9696 in https://github.com/opentiny/tiny-vue/pull/1846
 - feat(nav-menu): [nav-menu] updata nav-menu xdesign by @wuyiping0628 in https://github.com/opentiny/tiny-vue/pull/1849
 - feat(pop-upload): [pop-upload] 刷新 popupload 规范，增加 uploadTip 插槽 by @chenxi-20 in https://github.com/opentiny/tiny-vue/pull/1850
-- feat(pop-upload): [pop-upload] 刷新 popupload 规范，表格头部优化，增加上传数据统计能力,修复长度限制 bug by @chenxi-20 in https://github.com/opentiny/tiny-vue/pull/1852
+- feat(pop-upload): [pop-upload] 刷新 popupload 规范，表格头部优化，增加上传数据统计能力，修复长度限制 bug by @chenxi-20 in https://github.com/opentiny/tiny-vue/pull/1852
 - feat(toggle-menu): [toggle-menu] add smb theme by @James-9696 in https://github.com/opentiny/tiny-vue/pull/1861
 - feat(color-select-panel): [color-select-panel]modify smb-theme by @James-9696 in https://github.com/opentiny/tiny-vue/pull/1837
 - fix(button): [button] add ts declaration for button , and remove hook-updated … by @shenjunjian in https://github.com/opentiny/tiny-vue/pull/1853

examples/sites/demos/pc/webdoc/develop-demo.md

@@ -32,7 +32,7 @@ npm run dev
 
 ## 安装并使用 `TinyVue` 组件
 
-执行以下命令安装 `Vue 3.0` 版本的 `TinyVue` 组件库 ：
+执行以下命令安装 `Vue 3.0` 版本的 `TinyVue` 组件库：
 
 ```bash
 yarn add @opentiny/vue@3
@@ -58,7 +58,7 @@ export default defineConfig({
 
 安装完成后，请按 `Ctrl + C` 中断关闭当前服务，然后执行 `yarn dev # npm run dev` 重启服务；
 
-接下来修改工程中的 `App.vue` 文件， 添加以下代码（以 `Button` 组件为例）：
+接下来修改工程中的 `App.vue` 文件，添加以下代码（以 `Button` 组件为例）：
 
 ```js
 <script setup>

examples/sites/demos/pc/webdoc/faq-en.md

@@ -1,6 +1,6 @@
 # FAQ
 
-## 1、Popup element misaligned and flipped in wujie micro front-end
+## 1, Popup element misaligned and flipped in wujie micro front-end
 
 _Reason:_ The popup element has a boundary detection logic, and in sub applications, the width and height of 'window' may be much smaller than that of the viewport,
 therefore, it can misjudge boundaries, leading to issues such as flipping and misalignment.

examples/sites/demos/pc/webdoc/faq.md

@@ -12,7 +12,7 @@ import globalConfig from '@opentiny/vue-renderless/common/global'
 
 // 需要判断是否在子应用当中
 if (window.__POWERED_BY_WUJIE__) {
-  // 子应用中可以通过window.parent获取主应用的window
+  // 子应用中可以通过 window.parent 获取主应用的 window
   globalConfig.viewportWindow = window.parent
 }
 ```

examples/sites/demos/pc/webdoc/form-valid.md

@@ -91,7 +91,7 @@ rules: {
 
 ```js
 rules: {
-  users: { min: 2, message: '长度必须不小于2' }
+  users: { min: 2, message: '长度必须不小于 2' }
 }
 ```
 
@@ -101,7 +101,7 @@ rules: {
 
 ```js
 rules: {
-  users: { max: 11, message: '长度必须不大于11' }
+  users: { max: 11, message: '长度必须不大于 11' }
 }
 ```
 
@@ -111,7 +111,7 @@ rules: {
 
 ```js
 rules: {
-  users: { len: 2, message: '长度必须为2' }
+  users: { len: 2, message: '长度必须为 2' }
 }
 ```
 
@@ -122,8 +122,8 @@ rules: {
 
 ```js
 rules: {
-  users: { len: 2, message: '长度必须为2', trigger: 'change' },
-  password: { len: 2, message: '长度必须为2', trigger: ['change', 'blur'] },
+  users: { len: 2, message: '长度必须为 2', trigger: 'change' },
+  password: { len: 2, message: '长度必须为 2', trigger: ['change', 'blur'] },
   nickname: { len: 10, message: '已存在重复名称', trigger: [] }
 }
 ```
@@ -254,7 +254,7 @@ rules: {
 如下所示，先在 `methods` 对象中定义一个自定义校验的方法：
 
 ```js
-// 自定义的校验password的方法
+// 自定义的校验 password 的方法
 validatePass(rule, value, callback) {
   if (!/^(?=._[a-z])(?=._[A-Z])(?=.\*\\d)[a-zA-Z\d]{8,}$/.test(value)) {
     callback(new Error('最少八个字符，至少包含一个大写字母，一个小写字母和一个数字'))
@@ -282,7 +282,7 @@ rules: {
 如下所示，先在 `methods` 对象中定义一个自定义的异步校验的方法：
 
 ```js
-// 自定义异步校验password的方法
+// 自定义异步校验 password 的方法
 promiseField(rule, value, callback) {
   ajax({
     url: 'xx',

examples/sites/demos/pc/webdoc/import-components.md

@@ -134,7 +134,7 @@ module.exports = defineConfig({
 
 <div class="tip custom-block">
 <br />
-温馨提示：带有Tiny前缀的组件导出自3.17.0开始支持。若使用之前版本，需使用别名。
+温馨提示：带有 Tiny 前缀的组件导出自 3.17.0 开始支持。若使用之前版本，需使用别名。
 <br />
 <p>例如：<code>import { Button as TinyButton } from '@opentiny/vue'</code></p>
 </div>
@@ -197,7 +197,7 @@ export default {
           }
         }
       ],
-      'pc' // 此配置非必选，按需配置(pc|mobile|mobile-first)
+      'pc' // 此配置非必选，按需配置 (pc|mobile|mobile-first)
     )
   ],
   define: {

examples/sites/demos/pc/webdoc/installation.md

@@ -11,19 +11,19 @@
 
 **Vue2 工程说明**
 
-长期以来，TinyVue 都是只支持 Vue 2.6.14 版本。 从 TinyVue 2.11.0 开始，也支持 Vue 2.7+的工程了，请确保你安装了正确的 Vue 2.x 的依赖。
+长期以来，TinyVue 都是只支持 Vue 2.6.14 版本。从 TinyVue 2.11.0 开始，也支持 Vue 2.7+ 的工程了，请确保你安装了正确的 Vue 2.x 的依赖。
 
 ## 全新项目配置
 
-在项目的根目录中，打开控制台，执行以下命令，为 `Vue 3.0` 的项目安装 `TinyVue` 组件库 ：
+在项目的根目录中，打开控制台，执行以下命令，为 `Vue 3.0` 的项目安装 `TinyVue` 组件库：
 
 ```bash
 yarn add @opentiny/vue@3
 # 或者
 npm install @opentiny/vue@3
 ```
 
-或者执行以下命令，为 `Vue 2.0` 的项目安装 `TinyVue` 组件库 ：
+或者执行以下命令，为 `Vue 2.0` 的项目安装 `TinyVue` 组件库：
 
 ```bash
 yarn add @opentiny/vue@2
@@ -49,17 +49,17 @@ export default defineConfig({
 
 <div class="tip custom-block">
   <br>
-  <p>为了避免<code> @opentiny/vue </code> 的月度版本(minor)升级带来的不确定因素，因此推荐在您的工程中的<code> package.json </code> 中依赖包的版本号前使用 ~，
+  <p>为了避免<code> @opentiny/vue </code> 的月度版本 (minor) 升级带来的不确定因素，因此推荐在您的工程中的<code> package.json </code> 中依赖包的版本号前使用 ~，
     比如 <code>"@opentiny/vue": "~3.12.0</code>。</p>
 </div>
 <div class="tip custom-block">
   <br>
   <p><code> @opentiny/vue </code> 支持多种模式。如果您的工程非移动端工程，可以在上面配置代码中的<code>process.env</code>中，声明<code>TINY_MODE</code>的值，以使工程在构建时，能将移动端模式的代码摇掉，优化打包产物的体积。比如 <code>'process.env': { ...process.env,TINY_MODE:'pc' }</code>。</p>
 </div>
 
-## 通过 CDN 方式引入 (v3.16.0及之前的版本可用)
+## 通过 CDN 方式引入 (v3.16.0 及之前的版本可用)
 
-为了更快地体验 `TinyVue` 的组件，你也可以通过 `CDN` 方式直接在 HTML 页面中引入 `TinyVue`, 建议版本号写 `2` 个有效版本数字即可，具体配置如下:
+为了更快地体验 `TinyVue` 的组件，你也可以通过 `CDN` 方式直接在 HTML 页面中引入 `TinyVue`, 建议版本号写 `2` 个有效版本数字即可，具体配置如下：
 
 ```html
 <head>
@@ -80,13 +80,13 @@ export default defineConfig({
 </head>
 ```
 
-## 通过 CDN 方式引入 (v3.17.0开始提供使用)
+## 通过 CDN 方式引入 (v3.17.0 开始提供使用)
 
 为了应对不同的业务需要，`TinyVue` 提供多种形态的 `runtime`:
 
 | Runtime 名称              | 使用说明                   |
 | ------------------------- | -------------------------- |
-| tiny-vue-pc.mjs           | 包含所有pc模板的组件集合   |
+| tiny-vue-pc.mjs           | 包含所有 pc 模板的组件集合   |
 | tiny-vue-mobile.mjs       | 包含所有移动模板的组件集合 |
 | tiny-vue-mobile-first.mjs | 包含所有多端模板的组件集合 |
 | tiny-vue-simple.mjs       | 包含常用组件的集合         |

examples/sites/demos/pc/webdoc/theme-en.md

@@ -101,7 +101,7 @@ themeTool.changeTheme(
 )
 ```
 
-## OLD主题配置
+## OLD 主题配置
 
 We do not recommend that users continue to use the old theme, but for historical projects, we provide a set of 'CSS variables' of the old theme that users need to adapt in the project.
 

examples/sites/demos/pc/webdoc/theme.md

@@ -4,9 +4,9 @@
   本节文档仅支持 <code> @opentiny/vue@3.19.0 </code> 及其之后版本的主题定制，更早的历史版本的主题配置，请参阅当前文档底部的 <a href='#历史版本的主题配置'>历史版本的主题配置</a>
 </div>
 
-为了给开发者带来更好的用户体验，从 <code> @opentiny/vue@3.19.0 </code> 版本开始， 组件库的整体风格切换为 `Opentiny Design` 新风格。
+为了给开发者带来更好的用户体验，从 <code> @opentiny/vue@3.19.0 </code> 版本开始，组件库的整体风格切换为 `Opentiny Design` 新风格。
 
-<!-- 如果需要使用旧主题风格，可以选择继续使用历史版本，或者参考当前文档的<a href='#OLD主题配置'>OLD主题配置</a>进行配置。 -->
+<!-- 如果需要使用旧主题风格，可以选择继续使用历史版本，或者参考当前文档的<a href='#OLD 主题配置'>OLD 主题配置</a>进行配置。 -->
 
 在 `TinyVue` 组件库中定义了一组全局 `CSS 变量`，用于统一主题风格，比如字体，颜色，间距，圆角等值，每个组件内部也定义了组件级的`CSS 变量`。
 
@@ -19,23 +19,23 @@
 
 在用户的工程中，如果需要定制主题风格，或者覆盖某些组件的样式，则可以使用组件库提供的 `TinyThemeTool` 类进行配置用户工程的主题。后续我们也将提供更多的主题供大家选择。
 
-`ThemeData` 是自定义主题数据格式，用户可以通过`data`属性，传入覆盖的全局 `CSS 变量`， 通过`css`属性，传入有效的 CSS 规则块。
+`ThemeData` 是自定义主题数据格式，用户可以通过`data`属性，传入覆盖的全局 `CSS 变量`，通过`css`属性，传入有效的 CSS 规则块。
 
 ```ts
 interface ThemeData {
-  /** 主题的ID */
+  /** 主题的 ID */
   id?: string
   /** 主题的名称 */
   name?: string
   /** 主题的中文名称 */
   cnName?: string
   /**
-   * 需要追加的全局css变量的对象
+   * 需要追加的全局 css 变量的对象
    * 比如： { 'tv-base-color-brand' : '#1476ff' } 会追加到 :root { --tv-base....... }
    * */
   data?: Record<string, string>
   /**
-   * 需要追加的样式规则, 以覆盖或扩充组件的样式
+   * 需要追加的样式规则，以覆盖或扩充组件的样式
    * 比如： .tiny-button { border:none;  }
    * */
   css?: string
@@ -81,7 +81,7 @@ themeTool.changeTheme({
 
 ## 微前端场景
 
-默认情况下,`themeTool.changeTheme` 方法，会将自定义样式挂载到当前`document`下。但是在微前端框架中，通常会有样式隔离的机制，比如无界微前端会封装一个 `Web Component` 组件挂载子应用。如果自定义这种场景下的主题时，就必须将样式挂载到子应用的`ShadowRoot`上，用法如下：
+默认情况下，`themeTool.changeTheme` 方法，会将自定义样式挂载到当前`document`下。但是在微前端框架中，通常会有样式隔离的机制，比如无界微前端会封装一个 `Web Component` 组件挂载子应用。如果自定义这种场景下的主题时，就必须将样式挂载到子应用的`ShadowRoot`上，用法如下：
 
 ```ts
 import TinyThemeTool from '@opentiny/vue-theme/theme-tool'
@@ -103,7 +103,7 @@ themeTool.changeTheme(
 )
 ```
 
-## OLD主题配置
+## OLD 主题配置
 
 我们不建议用户继续使用旧主题，对于历史项目，我们提供一组旧主题的`CSS变量`,需要用户在工程中适配。
 
@@ -158,7 +158,7 @@ vue.config.js 定义
 chainWebpack: (config) => {
   // XDesign 主题
   config.resolve.alias.set('@opentiny/vue-theme', '@opentiny/vue-theme/smb-theme')
-  // aurora 主题 则是将以上smb主题中的'smb'字符全替换成 'aurora'即可
+  // aurora 主题 则是将以上 smb 主题中的'smb'字符全替换成 'aurora'即可
 }
 ```
 
@@ -217,7 +217,7 @@ const changeTheme = (value) => {
 ```ts
 // 自定义主题数据格式要求
 const tinyTestTheme = {
-  id: 'tiny-test-theme', // 主题的唯一id，每个主题必须唯一
+  id: 'tiny-test-theme', // 主题的唯一 id，每个主题必须唯一
   name: 'testTheme', // 主题的英文名称
   cnName: '测试主题', // 主题的中文名称
   data: { 'ti-base-color': '#f2f2f3' } //  主题数据
@@ -286,7 +286,7 @@ plugins: [
 ]
 ```
 
-## 配置 Design Config （解决交互规范的不同）
+## 配置 Design Config（解决交互规范的不同）
 
 有部分组件在不同主题下的图标或者交互不同，需要配置相应的 Design Config。