📃 docs: 文档更新

demo/_config.async.yml

@@ -24,8 +24,6 @@ sidebar:
       url: https://www.npmjs.com/package/hexo-theme-async
       name: Npm
 
-is_toc: true
-
 footer:
   powered:
     enable: true
@@ -60,3 +58,11 @@ creative_commons:
   language: deed.zh
   post: true
   clipboard: true
+
+swup: true
+
+toc:
+  enable: true
+  list_number: true
+  max_depth: 3
+  min_depth: 1

demo/source/_data/style/index.less

@@ -15,7 +15,7 @@
     }
 }
 
-body::before {
+.trm-app-frame::before {
     content         : 'dev';
     position        : absolute;
     z-index         : 55;

docs/.vitepress/assets/log.json

@@ -1,4 +1,31 @@
 [
+    {
+        "large_version": "v1.2.x",
+        "children": [
+            {
+                "version": "1.2.1",
+                "date": "2022-10-11",
+                "logs": [
+                    {
+                        "type": "refactor",
+                        "text": "修改主题切换方式"
+                    },
+                    {
+                        "type": "perf",
+                        "text": "优化移动端间距"
+                    },
+                    {
+                        "type": "perf",
+                        "text": "优化文章目录"
+                    },
+                    {
+                        "type": "fix",
+                        "text": "嵌套导航 target 设置失效"
+                    }
+                ]
+            }
+        ]
+    },
     {
         "large_version": "v1.1.x",
         "children": [

docs/.vitepress/components/ChangeLog.vue

@@ -22,7 +22,7 @@ const props = defineProps({
     }
 
     &.fix {
-        color: #ff9900;
+        color: #ff2600;
     }
 
     // 样式

docs/.vitepress/components/ChangeLogs.vue

@@ -11,10 +11,23 @@ import logs from "../assets/log.json";
         <template v-for="log in item.children">
             <blockquote>
                 <Badge>{{ log.version }}</Badge>
+                <span>{{ log.date }}</span>
             </blockquote>
             <ul>
                 <ChangeLog v-for="(item, index) in log.logs" v-bind="item" :key="index"></ChangeLog>
             </ul>
         </template>
     </template>
-</template>
+</template>
+<style lang="less" scoped>
+blockquote {
+    display: flex;
+    justify-content: space-between;
+}
+
+ul {
+    background: var(--vp-c-bg-alt);
+    padding: 10px 10px 10px 30px;
+    border-radius: 6px;
+}
+</style>

docs/guide/config.md

@@ -371,11 +371,19 @@ reward: true
 ```
 
 ### 文章目录
+文章目录，默认是关闭的。开启后，根据您的 [Markdown](https://segmentfault.com/markdown) 自动生成目录。如果您想关闭指定文章的目录，您可以在文章页单独配置当前文章关闭。[参考这里](/guide/page.html#文章-posts)
 
-文章详情页目录，默认关闭。开启后，您可以在文章页单独配置当前文章关闭。[参考这里](/guide/page.html#文章-posts)
+- `enable`：是否开启
+- `list_number`：是否显示编号
+- `max_depth`：生成 TOC 的最大深度
+- `min_depth`：生成 TOC 的最小深度
 
 ``` yaml 
-is_toc: true
+toc:
+  enable: true
+  list_number: true
+  max_depth: 3
+  min_depth: 1
 ```
 
 ### 图片懒加载
@@ -461,9 +469,49 @@ icons:
 ```
 
 ## 自定义样式 Style
-
 相比 `head` 引入，您可以直接编写 `less` 文件，并使用主题已有的变量，且将和主题样式文件一起编译。
 
+::: danger
+在 `1.2.x + ` 修改主题切换实现方式，由原来多份样式文件调整为 CSS 变量形式。所以自定义样式也有些许变化。
+:::
+
+### `1.2.x` 版本
+- 新建 `source/_data/style/index.less`，开始编写你的自定义样式了。
+
+```text {5}
+┌── blog                     
+│   └── source
+│       └── _data
+│           └── style
+│               ├── index.less
+│   └── themes
+```
+
+`:root` 下为白色主题，`:root.dart` 下为暗黑色主题，
+
+修改主题色示例：
+
+``` less source/_data/style/index.less
+:root {
+    .var-primary(#5a5df0, #697be2);
+
+    &.dark {
+        .var-primary(#a4ce60, #82df7a);
+    }
+}
+```
+
+跟随操作系统选择主题示例：
+
+``` less source/_data/style/index.less
+@media (prefers-color-scheme: dark) {
+    :root {
+        .dark()
+    }
+}
+```
+### `1.1.x` 版本
+
 - 新建 `source/_data/style/dark.less`、`source/_data/style/light.less`，开始编写你的自定义样式了。他们分别默认会合并到 `dark`、`light` 两种模式中去。
 - 如果需要覆盖变量可以添加 `source/_data/style/dark.variables.less`、`source/_data/style/light.variables.less`，进行覆盖。
 
@@ -478,6 +526,18 @@ icons:
 │               └── light.variables.less
 │   └── themes
 ```
+修改主题色示例：
+``` less source/_data/style/dark.less
+// source/_data/style/dark.less
+@primary :#6062ce;
+@primary-weak :#7a89df;
+```
+
+``` less source/_data/style/light.less
+// source/_data/style/light.less
+@primary :#6062ce;
+@primary-weak :#7a89df;
+```
 
 ## 渐进式应用 PWA
 

docs/guide/third-party-support.md

@@ -3,6 +3,7 @@
 所有配置默认在 `_config.async.yml` 文件下进行。
 
 与额外依赖库支持的区别，此处主要为使用第三方服务商提供的服务实现。
+
 ## 分析统计
 默认内置了 百度、谷歌、腾讯三个种。
 
@@ -46,6 +47,10 @@ comment:
 ```
 若果您需要集成一些三方评论插件，您可以通过修改下列 layout 文件进行集成。
 
+::: tip
+增加三方评论插件，一般来说只需要按照三方插件添加对应 `js`、`css` 文件，在 `layout/_widget/comment.ejs` 添加对应初始化代码，处理好主题切换样式就可以了。
+:::
+
 第一部分：
 
 你需要 修改 `layout/_widget/comment.ejs`（评论插件模板，所有使用评论页面都引用了这个文件） 文件，有关三方评论插件使用的 HTML 相关代码可以在这个文件编写。`layout/comment.ejs` 文件为留言页面模板，一般不需要额外修改。
@@ -63,11 +68,7 @@ assets:
 ```
 并在 `layout/_third-party/plugin.ejs` 里，编写您动态加载插件代码。
 
-~~第三部分：~~
-
-~~通过上面步骤发现加载出您的评论插件后，您可能会发现，有评论页面，滚动条出现异常并不能滚动到底。是因为评论区域数据是动态的，滚动插件没更新高度导致的。您可以[参考这里](https://github.com/MaLuns/hexo-theme-async/blob/415eba005dffe1e42b10c7b9c104e901542a9dc7/source/js/main.js)代码的 InitLocomotiveScroll 函数。~~
-
-如果您集成了三方评论插件，欢迎您提交 Pull Request 。
+如果您集成了三方评论插件，欢迎您提交 [Pull Request](https://github.com/MaLuns/hexo-theme-async/pulls) ，完善主题健壮性。
 
 
 ## 搜索

package/hexo-theme-async/_config.yml

@@ -184,7 +184,7 @@ reward:
   # url:
   methods:
 
-# p
+# Article table of contents
 toc:
   enable: false
   list_number: true