✨ 文档逻辑优化

.github/workflows/docs/README.md

@@ -1,73 +0,0 @@
-# Github actions 编译配置教程
-
-## 1.Fork 本项目
-
-[Fork 本项目](https://github.com/tw93/Pake/fork)
-
-## 2.前往 actions 页面启用 GitHub actions
-
-![image-20221205230324046](assets/image-20221205230324046.png)
-
-## 3.修改 app.csv 文件
-
-![image-20221205230432205](assets/image-20221205230432205.png)
-
-修改 app.csv 文件，自行将第二行以后的内容替换成自定义内容
-
-![image-20221205230553980](assets/image-20221205230553980.png)
-
-格式为：`Linux下应用名称,Mac和Windows下应用名称,中文名称,网址`，注意使用英文逗号分隔
-
-## 4.上传图标
-
-- 上传.icns 文件至`/src-tauri/icons`目录下（必须）
-- 上传.ico 和.png 文件至`/src-tauri/png`目录下（如果使用脚本自动转换可以跳过此步）
-
-**注意：需要两个.ico 文件和一个.png 文件，参考下表**
-
-| 文件名称    | 说明                 |
-| ----------- | -------------------- |
-| app_32.ico  | 32\*32 的 ico 图标   |
-| app_256.ico | 256\*256 的 ico 图标 |
-| app_512.png | 512\*512 的 png 图片 |
-
-> 你也可以直接 git 整个项目到本地，使用项目根目录下的 icns2png.py 文件批量将.icns 文件转换成.ico 和.png 文件（.icns 文件是必须的）
->
-> 转换完成后别忘了将对应文件上传
-
-## 5.更改配置文件（可选，用于进一步自定义编译好的程序）
-
-前往`/src-tauri/`目录，修改**tauri.conf.json**文件
-
-参考下面图片自定义配置，**推荐修改带星号的内容**，其他可以使用默认
-
-![image-20221206112931624](assets/image-20221206112931624.png)
-
-## 6.发布以开始运行自动编译
-
-- 点击前往 Releases 页面
-
-![image-20221205233624044](assets/image-20221205233624044.png)
-
-![image-20221205233722029](assets/image-20221205233722029.png)
-
-- 点击**Create a new release**
-
-![image-20221205233806355](assets/image-20221205233806355.png)
-
-- 点击**Choose a tag**，输入`V0.1.0`（版本号可自定义，但是**必须以大写 V 开头**）
-
-![image-20221205233956978](assets/image-20221205233956978.png)
-
-- 点击下方的**Create new tag**按钮
-
-![image-20221205234436283](assets/image-20221205234436283.png)
-
-- 填写标题和内容（可选）
-- 如果不是在`master`分支修改，需要在 target 下拉栏选择对应分支
-- 点击**Publish release**
-- 此时，前往 actions 页面，确保出现新 workflows
-
-![image-20221205234306770](assets/image-20221205234306770.png)
-
-在编译完成后，即可在 release 页面看到编译完成后生成的文件（编译大约需要 10-30 分钟）

.github/workflows/docs/README_EN.md

@@ -1,73 +0,0 @@
-# GitHub Actions compilation and configuration tutorial
-
-## 1. Fork this project
-
-[Fork this project](https://github.com/tw93/Pake/fork)
-
-## 2. Go to the actions page to enable GitHub actions
-
-![image-20221205230324046](assets/image-20221205230324046.png)
-
-## 3. Modify the app.csv file
-
-![image-20221205230432205](assets/image-20221205230432205.png)
-
-Modify the app.csv file and replace the content after the second line with custom content
-
-![image-20221205230553980](assets/image-20221205230553980.png)
-
-The format is: `Linux application name, Mac and Windows application name, Chinese character name, URL`, pay attention to use English commas to separate
-
-## 4. Upload icon
-
-- Upload the .icns file to the `/src-tauri/icons` directory (required)
-- Upload the .ico and .png files to the `/src-tauri/png` directory (you can skip this step if you use the script to convert automatically)
-
-**Note: Two .ico files and one .png file are required, refer to the table below**
-
-| File Name   | Description                        |
-| ----------- | ---------------------------------- |
-| app_32.ico  | A ico file with a size of 32\*32   |
-| app_256.ico | A ico file with a size of 256\*256 |
-| app_512.png | A png file with a size of 512\*512 |
-
-> You can also directly git the entire project to the local, and use the icns2png.py file in the project root directory to batch convert .icns files into .ico and .png files (.icns files are required)
->
-> Don't forget to upload the corresponding file after the conversion is complete
-
-## 5. Change the configuration file (optional, used to further customize the compiled program)
-
-Go to the `/src-tauri/` directory and modify the **tauri.conf.json** file
-
-Refer to the picture below to customize the configuration. **It is recommended to modify the content with an asterisk**. Others can use the default
-
-![image-20221206113351850](assets/image-20221206113351850.png)
-
-## 6. Publish to start running automatic compilation
-
-- Click to go to the Releases page
-
-![image-20221205233624044](assets/image-20221205233624044.png)
-
-![image-20221205233722029](assets/image-20221205233722029.png)
-
-- Click **Create a new release**
-
-![image-20221205233806355](assets/image-20221205233806355.png)
-
-- Click **Choose a tag** and enter `V0.1.0` (the version number can be customized, but **must start with a capital V**)
-
-![image-20221205233956978](assets/image-20221205233956978.png)
-
-- Click the **Create new tag** button below
-
-![image-20221205234436283](assets/image-20221205234436283.png)
-
-- Fill in title and content (optional)
-- If you are not modifying in the `master` branch, you need to select the corresponding branch in the target drop-down bar
-- Click **Publish release**
-- At this point, go to the actions page and make sure the new workflows appear
-
-![image-20221205234306770](assets/image-20221205234306770.png)
-
-After the compilation is completed, you can see the files generated after the compilation is completed on the release page (compilation takes about 10-30 minutes)

README.md

@@ -113,7 +113,7 @@ pake url [options]
 pake https://weekly.tw93.fun --name Weekly --transparent
 ```
 
-假如你是不太会使用命令行的小白，使用 **GitHub Actions 在线编译多系统版本** 也是一个不错的选择，可查看[文档](./.github/workflows/docs/README.md)。
+假如你是不太会使用命令行的小白，使用 **GitHub Actions 在线编译多系统版本** 也是一个不错的选择，可查看[文档](https://github.com/tw93/Pake/wiki/GitHub-Actions-%E5%9C%A8%E7%BA%BF%E7%BC%96%E8%AF%91%E5%A4%9A%E7%B3%BB%E7%BB%9F%E7%89%88%E6%9C%AC)。
 
 ## 快捷键
 
@@ -148,27 +148,13 @@ npm run build
 
 ```
 
-## 定制使用
+## 高级使用
 
 1. 关于 Pake 的代码结构可以参考[wiki](https://github.com/tw93/Pake/wiki/Pake-%E7%9A%84%E4%BB%A3%E7%A0%81%E7%BB%93%E6%9E%84%E8%AF%B4%E6%98%8E)
 2. 修改 `src-tauri` 目录下的 `tauri.conf.json` 中的 `url、productName、icon、identifier` 这 4 个字段，其中 icon 可以从 icons 目录选择一个，也可以去 [macOSicons](https://macosicons.com/#/) 下载符合产品名称的
 3. 关于窗口属性设置，可以在 `tauri.conf.json` 修改 `windows` 属性对应的 `width/height`，是否全屏 `fullscreen`，是否可以调整大小 `resizable`，假如想适配 Mac 沉浸式头部，可以将 `transparent` 设置成 `true`，找到 Header 元素加一个 `padding-top` 样式即可，不想适配改成 `false` 也行
-4. `npm run dev` 本地调试看看效果，此外可以使用 `npm run dev:debug` 进行容器调试
-5. `npm run build` 运行即可打生产包
-
-## 高级用法
-
-#### 1. 如何改写样式，如去掉原站广告、不想要的模块、甚至重新设计？
-
-首先需要使用 `npm run dev:debug` 打开 devtools 调试模式，找到你需要修改的样式名称，先在 devtools 里面验证效果；找到 `pake.js` 中样式位置 `style.innerHTML` ，将需要覆盖的样式加上即可，有一些案例你可以模仿。
-
-#### 2. 如何注入 JS 的逻辑，比如实现事件监听，比如说键盘快捷键？
-
-参考 `pake.js` 中事件监听 `document.addEventListener`，直接编写即可，这里更多是基础前端的技术。
-
-#### 3. 如何进行容器内的事件和 Pake 通信，比如说 Web 的拖拽、滚动、特殊点击传递啥的？
-
-参考 `pake.js` 中通信代码 `postMessage`，写好事件监听，然后用 `window.ipc.postMessage` 将事件以及参数传递出来，然后参考容器接收事件 `window.drag_window`，自己处理即可，更多可以参考 tauri 以及 wry 的官方文档。
+4. `npm run dev` 本地调试看看效果，此外可以使用 `npm run dev:debug` 进行容器调试，`npm run build` 运行即可打生产包
+5. 关于样式改写、屏蔽广告、逻辑代码注入、容器消息通信、自定义快捷键可见 [Pake 的高级用法](https://github.com/tw93/Pake/wiki/Pake-%E7%9A%84%E9%AB%98%E7%BA%A7%E7%94%A8%E6%B3%95)
 
 ## 开发者
 
@@ -281,9 +267,9 @@ Pake 的发展离不开这些 Hacker 们，一起贡献了大量能力，也欢
 
 ## 支持
 
-- 我有两只猫，一只叫汤圆，一只叫可乐，假如觉得 Pake 让你生活更美好，可以给汤圆可乐 <a href="https://miaoyan.app/cats.html?name=Pake" target="_blank">喂罐头 🥩🍤</a>。
-- 如果你喜欢 Pake，可以在 Github Star，更欢迎 [推荐](https://twitter.com/intent/tweet?url=https://github.com/tw93/Pake&text=Pake%20%E4%B8%80%E4%B8%AA%E5%BE%88%E7%AE%80%E5%8D%95%E7%9A%84%E7%94%A8%20Rust%20%E6%89%93%E5%8C%85%E7%BD%91%E9%A1%B5%E7%94%9F%E6%88%90%20Mac%20App%20%E7%9A%84%E5%B7%A5%E5%85%B7%EF%BC%8C%E7%9B%B8%E6%AF%94%E4%BC%A0%E7%BB%9F%E7%9A%84%20Electron%20%E5%A5%97%E5%A3%B3%E6%89%93%E5%8C%85%EF%BC%8C%E5%A4%A7%E5%B0%8F%E8%A6%81%E5%B0%8F%E5%B0%86%E8%BF%91%2040%20%E5%80%8D%EF%BC%8C%E4%B8%80%E8%88%AC%202M%20%E5%B7%A6%E5%8F%B3%EF%BC%8C%E5%BA%95%E5%B1%82%E4%BD%BF%E7%94%A8Tauri%20%EF%BC%8C%E6%80%A7%E8%83%BD%E4%BD%93%E9%AA%8C%E8%BE%83%20JS%20%E6%A1%86%E6%9E%B6%E8%A6%81%E8%BD%BB%E5%BF%AB%E4%B8%8D%E5%B0%91%EF%BC%8C%E5%86%85%E5%AD%98%E5%B0%8F%E5%BE%88%E5%A4%9A%EF%BC%8C%E6%94%AF%E6%8C%81%E5%BE%AE%E4%BF%A1%E8%AF%BB%E4%B9%A6%E3%80%81Twitter%E3%80%81Youtube%E3%80%81RunCode%E3%80%81Flomo%E3%80%81%E8%AF%AD%E9%9B%80%E7%AD%89%EF%BC%8C%E5%8F%AF%E4%BB%A5%E5%BE%88%E6%96%B9%E4%BE%BF%E4%BA%8C%E6%AC%A1%E5%BC%80%E5%8F%91~) 给你志同道合的朋友使用。
-- 可以关注我的 [Twitter](https://twitter.com/HiTw93) 获取到最新的 Pake 更新消息，也欢迎加入 [Telegram](https://t.me/miaoyan) 聊天群。
+1. 我有两只猫，一只叫汤圆，一只叫可乐，假如觉得 Pake 让你生活更美好，可以给汤圆可乐 <a href="https://miaoyan.app/cats.html?name=Pake" target="_blank">喂罐头 🥩🍤</a>。
+2. 如果你喜欢 Pake，可以在 Github Star，更欢迎 [推荐](https://twitter.com/intent/tweet?url=https://github.com/tw93/Pake&text=Pake%20%E4%B8%80%E4%B8%AA%E5%BE%88%E7%AE%80%E5%8D%95%E7%9A%84%E7%94%A8%20Rust%20%E6%89%93%E5%8C%85%E7%BD%91%E9%A1%B5%E7%94%9F%E6%88%90%20Mac%20App%20%E7%9A%84%E5%B7%A5%E5%85%B7%EF%BC%8C%E7%9B%B8%E6%AF%94%E4%BC%A0%E7%BB%9F%E7%9A%84%20Electron%20%E5%A5%97%E5%A3%B3%E6%89%93%E5%8C%85%EF%BC%8C%E5%A4%A7%E5%B0%8F%E8%A6%81%E5%B0%8F%E5%B0%86%E8%BF%91%2040%20%E5%80%8D%EF%BC%8C%E4%B8%80%E8%88%AC%202M%20%E5%B7%A6%E5%8F%B3%EF%BC%8C%E5%BA%95%E5%B1%82%E4%BD%BF%E7%94%A8Tauri%20%EF%BC%8C%E6%80%A7%E8%83%BD%E4%BD%93%E9%AA%8C%E8%BE%83%20JS%20%E6%A1%86%E6%9E%B6%E8%A6%81%E8%BD%BB%E5%BF%AB%E4%B8%8D%E5%B0%91%EF%BC%8C%E5%86%85%E5%AD%98%E5%B0%8F%E5%BE%88%E5%A4%9A%EF%BC%8C%E6%94%AF%E6%8C%81%E5%BE%AE%E4%BF%A1%E8%AF%BB%E4%B9%A6%E3%80%81Twitter%E3%80%81Youtube%E3%80%81RunCode%E3%80%81Flomo%E3%80%81%E8%AF%AD%E9%9B%80%E7%AD%89%EF%BC%8C%E5%8F%AF%E4%BB%A5%E5%BE%88%E6%96%B9%E4%BE%BF%E4%BA%8C%E6%AC%A1%E5%BC%80%E5%8F%91~) 给你志同道合的朋友使用。
+3. 可以关注我的 [Twitter](https://twitter.com/HiTw93) 获取到最新的 Pake 更新消息，也欢迎加入 [Telegram](https://t.me/miaoyan) 聊天群。
 
 ## 最后
 

README_EN.md

@@ -113,7 +113,7 @@ pake url [options]
 pake https://weekly.tw93.fun --name Weekly --transparent
 ```
 
-If you are a little white who doesn't know how to use the command line, a good option is to use **GitHub Actions online compilation**, see the [tutorial](/docs/README_EN.md).
+If you are a little white who doesn't know how to use the command line, a good option is to use **GitHub Actions online compilation**, see the [tutorial]([/docs/README_EN.md](https://github.com/tw93/Pake/wiki/GitHub-Actions-Online-Compilation-Multi-system-Version)).
 
 ## Shortcuts
 
@@ -148,33 +148,19 @@ npm run build
 
 ```
 
-## Custom Usage
+## Advanced use
 
 1. The code structure of Pake can be referred to [wiki](https://github.com/tw93/Pake/wiki/Description-of-Pake's-code-structure).
 2. Modify the `tauri.conf.json` in the `src-tauri` directory to include 4 fields `url, productName, icon, identifier`, icon can be selected from the `icons` directory or downloaded from [macOSicons](https://macosicons.com/#/) to match the product.
 3. For window property settings, you can modify the `width/height` of the `windows` property in `tauri.conf.json`, whether it is `fullscreen`, whether it is `resizable`, If you want to adapt the immersive header under Mac, you can set `transparent` to `true` and then find header element and add the `padding-top` style.
-4. `npm run dev` for local debugging; `npm run dev:debug` to open the devtools for container debugging.
-5. `npm run build` can be run to package for production.
-
-## Advanced
-
-#### 1. How do I rewrite the style, e.g. to remove ads from the original site, or even redesign it?
-
-First, open devtools debug mode with `npm run dev:debug`. After that, find the name of the style you want to change and verify the effect in devtools, and find the location of the style in `pake.js` with `style.innerHTML`. Finally, add the style you need to override, there are some examples you can copy.
-
-#### 2. How to inject js code, e.g. to implement event listeners, e.g. keyboard shortcuts?
-
-Refer to the event listener in `pake.js` with `document.addEventListener`, and write it directly, it's more of a basic front-end technique here.
-
-#### 3. How to communicate with Pake about events in containers, such as dragging and dropping, scrolling, special clicks on the Web, etc.?
-
-Refer to the communication code in `pake.js` with `postMessage`, write the event listener and then use `window.ipc.postMessage` to pass the event and its parameters, then refer to the container to receive events `window.drag_window` and handle them yourself, for more information, refer to tauri and wry's official documentation.
+4. `npm run dev` for local debugging; `npm run dev:debug` to open the devtools for container debugging, `npm run build` can be run to package for production.
+5. About style rewriting, advertising shielding, js injection, container message communication, and user-defined shortcut keys, you can see [Advanced Usage of Make](https://github.com/tw93/Pake/wiki/Advanced-Usage-of-Make).
 
 ## Support
 
-- I have two cats, one is called TangYuan, and one is called Coke, If you think Pake makes your life better, you can give my cats <a href="https://miaoyan.app/cats.html?name=Pake" target="_blank">feed canned food 🥩🍤</a>.
-- If you like Pake, you can star it in Github. We are more welcome to [recommend Pake](https://twitter.com/intent/tweet?url=https://github.com/tw93/Pake&text=Pake%20-%20A%20simple%20Rust%20packaged%20web%20pages%20to%20generate%20Mac%20App%20tool,%20compared%20to%20traditional%20Electron%20package,%20the%20size%20of%20nearly%2040%20times%20smaller,%20generally%20about%202M,%20the%20underlying%20use%20of%20Tauri,%20performance%20experience%20than%20the%20JS%20framework%20is%20much%20lighter~) to your like-minded friends.
-- You can follow my [Twitter](https://twitter.com/HiTw93) to get the latest news of Pake, or join [Telegram](https://t.me/miaoyan) chat group.
+1. I have two cats, one is called TangYuan, and one is called Coke, If you think Pake makes your life better, you can give my cats <a href="https://miaoyan.app/cats.html?name=Pake" target="_blank">feed canned food 🥩🍤</a>.
+2. If you like Pake, you can star it in Github. We are more welcome to [recommend Pake](https://twitter.com/intent/tweet?url=https://github.com/tw93/Pake&text=Pake%20-%20A%20simple%20Rust%20packaged%20web%20pages%20to%20generate%20Mac%20App%20tool,%20compared%20to%20traditional%20Electron%20package,%20the%20size%20of%20nearly%2040%20times%20smaller,%20generally%20about%202M,%20the%20underlying%20use%20of%20Tauri,%20performance%20experience%20than%20the%20JS%20framework%20is%20much%20lighter~) to your like-minded friends.
+3. You can follow my [Twitter](https://twitter.com/HiTw93) to get the latest news of Pake, or join [Telegram](https://t.me/miaoyan) chat group.
 
 ## Finally