@wulechuan/css-stylus-markdown-themes 7.3.2 → 7.4.0
Sign up to get free protection for your applications and to get access to all the features.
- package/ReadMe.md +14 -14
- package/package.json +22 -22
- package//346/226/207/346/241/243/{ → 351/233/206/}/346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/225/210/346/236/234/347/244/272/344/276/213/351/233/206//345/216/237/345/247/213/347/232/204-markdown-/346/240/274/345/274/217/347/232/204/346/226/207/347/253/240/illustrates/duan-er-pretty.jpg +0 -0
- package//346/226/207/346/241/243/{ → 351/233/206/}/346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/225/210/346/236/234/347/244/272/344/276/213/351/233/206//345/216/237/345/247/213/347/232/204-markdown-/346/240/274/345/274/217/347/232/204/346/226/207/347/253/240/illustrates/flower.webm +0 -0
- package//346/226/207/346/241/243/{ → 351/233/206/}/346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/225/210/346/236/234/347/244/272/344/276/213/351/233/206//345/216/237/345/247/213/347/232/204-markdown-/346/240/274/345/274/217/347/232/204/346/226/207/347/253/240/illustrates/softimage_xsi_2011_ice_graph.jpg +0 -0
- package//346/226/207/346/241/243/{ → 351/233/206/}/346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/225/210/346/236/234/347/244/272/344/276/213/351/233/206//345/216/237/345/247/213/347/232/204-markdown-/346/240/274/345/274/217/347/232/204/346/226/207/347/253/240/theming-example-article.en-US.md +0 -0
- package//346/226/207/346/241/243/{ → 351/233/206/}/346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/225/210/346/236/234/347/244/272/344/276/213/351/233/206//345/216/237/345/247/213/347/232/204-markdown-/346/240/274/345/274/217/347/232/204/346/226/207/347/253/240/theming-example-article.zh-hans-CN.md +16 -5
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206/javascript/table-of-contents-and-back-to-top-anchor-behaviors.js +37 -21
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206/javascript/table-of-contents-and-back-to-top-anchor-behaviors.min.js +1 -1
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.default--with-toc.css +202 -43
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.default--with-toc.min.css +1 -1
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.default--wrapped--with-toc.css +202 -43
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.default--wrapped--with-toc.min.css +1 -1
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.default-dark--with-toc.css +202 -43
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.default-dark--with-toc.min.css +1 -1
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.default-dark--wrapped--with-toc.css +202 -43
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.default-dark--wrapped--with-toc.min.css +1 -1
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.generic-default-light--atom-one-dark--with-toc.css +202 -43
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.generic-default-light--atom-one-dark--with-toc.min.css +1 -1
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.generic-default-light--atom-one-dark--wrapped--with-toc.css +202 -43
- package//346/272/220/344/273/243/347/240/201//345/217/221/345/270/203/347/232/204/346/272/220/344/273/243/347/240/201//346/226/207/347/253/240/346/216/222/347/211/210/344/270/216/351/205/215/350/211/262/346/226/271/346/241/210/351/233/206//345/261/202/345/217/240/346/240/267/345/274/217/350/241/250/wulechuan-styles-for-html-via-markdown.generic-default-light--atom-one-dark--wrapped--with-toc.min.css +1 -1
package/ReadMe.md
CHANGED
@@ -10,7 +10,7 @@
|
|
10
10
|
|
11
11
|
## Multilingual Editions of this Article
|
12
12
|
|
13
|
-
- [English version of this ReadMe](
|
13
|
+
- [English version of this ReadMe](./文档集集/说明书/en-US/ReadMe.md)
|
14
14
|
|
15
15
|
|
16
16
|
|
@@ -39,15 +39,15 @@
|
|
39
39
|
|
40
40
|
|
41
41
|
|
42
|
-
##
|
42
|
+
## 文档集章节
|
43
43
|
|
44
44
|
> 以下章节均存在于单独的文件中,并非本文章之部分。
|
45
45
|
|
46
|
-
- 《[本工具之简介](
|
47
|
-
- 《[关于文章排版与配色效果示例集的说明(含最终视觉效果)](
|
48
|
-
- 《[本工具构建层叠样式表时所采用之内在规则之介绍](
|
49
|
-
- 《[业已支持的应用场景](
|
50
|
-
- 《[采用本工具开发一套新的文章排版与配色方案之详细步骤](
|
46
|
+
- 《[本工具之简介](./文档集/说明书/汉语/本工具之简介.md)》
|
47
|
+
- 《[关于文章排版与配色效果示例集的说明(含最终视觉效果)](./文档集/说明书/汉语/关于文章排版与配色效果示例集的说明.md)》
|
48
|
+
- 《[本工具构建层叠样式表时所采用之内在规则之介绍](./文档集/说明书/汉语/本工具构建层叠样式表时所采用之内在规则之介绍.md)》
|
49
|
+
- 《[业已支持的应用场景](./文档集/说明书/汉语/业已支持的应用场景.md)》
|
50
|
+
- 《[采用本工具开发一套新的文章排版与配色方案之详细步骤](./文档集/说明书/汉语/采用本工具开发一套新的文章排版与配色方案之详细步骤.md)》
|
51
51
|
|
52
52
|
|
53
53
|
|
@@ -60,24 +60,24 @@
|
|
60
60
|
|
61
61
|
### 应用默认浅色主题的范文截图
|
62
62
|
|
63
|
-
- [示例:简体中文范文配默认浅色主题,在宽大尺寸浏览器中的效果(目录已收叠)](
|
64
|
-
- [Snapshot: In default light-colored theme, in a wide window, with toc collapsed](
|
63
|
+
- [示例:简体中文范文配默认浅色主题,在宽大尺寸浏览器中的效果(目录已收叠)](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/示例:简体中文范文配默认浅色主题,1-在宽大尺寸浏览器中的效果(目录已收叠).png)
|
64
|
+
- [Snapshot: In default light-colored theme, in a wide window, with toc collapsed](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/example_en-US_default-light-colored-theme_1-in-a-wide-window_with-toc-collapsed.png)
|
65
65
|
|
66
66
|
|
67
67
|
### 应用默认深色主题的范文截图
|
68
68
|
|
69
|
-
- [示例:简体中文范文配默认深色主题,在宽大尺寸浏览器中的效果(目录已收叠)](
|
70
|
-
- [Snapshot: In default dark-colored theme, in a wide window, with toc collapsed](
|
69
|
+
- [示例:简体中文范文配默认深色主题,在宽大尺寸浏览器中的效果(目录已收叠)](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/示例:简体中文范文配默认深色主题,1-在宽大尺寸浏览器中的效果(目录已收叠).png)
|
70
|
+
- [Snapshot: In default dark-colored theme, in a wide window, with toc collapsed](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/example_en-US_default-dark-colored-theme_1-in-a-wide-window_with-toc-collapsed.png)
|
71
71
|
|
72
72
|
|
73
73
|
### 范文的所有截图
|
74
74
|
|
75
75
|
两篇范文之截图不止于上文中提及的四幅。更多图例,见:
|
76
76
|
|
77
|
-
- 《[应用效果示例(汉语版)](
|
78
|
-
- 《[Application Examples (en-US)](
|
77
|
+
- 《[应用效果示例(汉语版)](./文档集/说明书/汉语/关于文章排版与配色效果示例集的说明.md)》
|
78
|
+
- 《[Application Examples (en-US)](./文档集/说明书/en-US/application-examples.md)》
|
79
79
|
|
80
|
-
另附《[示范文章之截图之制作指南](
|
80
|
+
另附《[示范文章之截图之制作指南](./文档集/说明书/汉语/示范文章之截图之制作指南.md)》
|
81
81
|
|
82
82
|
|
83
83
|
|
package/package.json
CHANGED
@@ -2,37 +2,37 @@
|
|
2
2
|
"name": "@wulechuan/css-stylus-markdown-themes",
|
3
3
|
"author": "吴乐川 <wulechuan@live.com>",
|
4
4
|
"license": "WTFPL",
|
5
|
-
"version": "7.
|
6
|
-
"description": "
|
5
|
+
"version": "7.4.0",
|
6
|
+
"description": "此为吴乐川的 HTML 文章排版与配色之方案集。本工具可用于构建一组层叠样式表(即 CSS )文件,本工具亦提供了一组现成的层叠样式表文件。凡这些样式表,均可用于美化采用超文本标记语言(即 HTML )格式存储的文章。且不必同时取用多个样式表文件,仅取其一足矣。",
|
7
7
|
"directories": {
|
8
8
|
"source": "源代码/原始的源代码",
|
9
9
|
"dist": "源代码/发布的源代码",
|
10
10
|
"test": "测试集",
|
11
|
-
"doc": "
|
11
|
+
"doc": "文档集"
|
12
12
|
},
|
13
13
|
"main": "源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/index.js",
|
14
14
|
"types": "源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/index.d.ts",
|
15
15
|
"scripts": {
|
16
|
-
"eslint": "eslint ./.eslintrc.js ./gulpfile.esm.js/**/*.js
|
17
|
-
"firefox": "start firefox ./测试集/产生的临时文件/示例性-html-文件集(均嵌有半自动化截图辅助逻辑)/example.en-us.default-light-colored-theme.html ./测试集/产生的临时文件/示例性-html-文件集(均嵌有半自动化截图辅助逻辑)/example.en-us.default-dark-colored-theme.html ./测试集/产生的临时文件/示例性-html-文件集(均嵌有半自动化截图辅助逻辑)/example.zh-hans-cn.default-light-colored-theme.html ./测试集/产生的临时文件/示例性-html-文件集(均嵌有半自动化截图辅助逻辑)/example.zh-hans-cn.default-dark-colored-theme.html",
|
18
|
-
"open-dev-htmls": "start
|
19
|
-
"clean": "gulp
|
20
|
-
"
|
21
|
-
"_build": "gulp
|
22
|
-
"
|
23
|
-
"_update-example-htmls": "gulp
|
24
|
-
"_update-example-
|
25
|
-
"
|
26
|
-
"start": "gulp
|
16
|
+
"eslint": "eslint ./.eslintrc.js ./gulpfile.esm.js/**/*.js ./文档集/文章排版与配色效果示例集/*.js ./测试集/*.js ./源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/*.js ./源代码/原始的源代码/用于设计文章排版与配色方案的代码/js/**/*.js ./本项目之全局配置项集.js",
|
17
|
+
"open-firefox-for-snapshots": "start firefox ./测试集/产生的临时文件/示例性-html-文件集(均嵌有半自动化截图辅助逻辑)/example.en-us.default-light-colored-theme.html ./测试集/产生的临时文件/示例性-html-文件集(均嵌有半自动化截图辅助逻辑)/example.en-us.default-dark-colored-theme.html ./测试集/产生的临时文件/示例性-html-文件集(均嵌有半自动化截图辅助逻辑)/example.zh-hans-cn.default-light-colored-theme.html ./测试集/产生的临时文件/示例性-html-文件集(均嵌有半自动化截图辅助逻辑)/example.zh-hans-cn.default-dark-colored-theme.html",
|
18
|
+
"open-dev-htmls": "start ./测试集/产生的临时文件/示例性-html-文件集(仅限于当前正在开发的排版与配色方案)/default-theming-example.--DEV--.en-us.html && start ./测试集/产生的临时文件/示例性-html-文件集(仅限于当前正在开发的排版与配色方案)/default-theming-example.--DEV--.zh-hans-cn.html",
|
19
|
+
"clean": "gulp --silent cleanAll",
|
20
|
+
"clean-2": "gulp cleanAll",
|
21
|
+
"_build": "gulp --silent buildAllThemesOnce",
|
22
|
+
"_build-2": "gulp buildAllThemesOnce",
|
23
|
+
"_update-example-htmls": "gulp --silent updateExampleHTMLs",
|
24
|
+
"_update-example-htmls-2": "gulp updateExampleHTMLs",
|
25
|
+
"start-2": "gulp --silent devSingleThemeOnce && npm run open-dev-htmls && gulp --silent devSingleTheme",
|
26
|
+
"start": "gulp devSingleThemeOnce && npm run open-dev-htmls && gulp devSingleTheme",
|
27
27
|
"_test-package-interfaces": "node ./测试集/用于测试本项目之-javascript-接口的测试代码集.js",
|
28
|
-
"_test-all-without-linting-without-browser": "npm run _test-package-interfaces
|
29
|
-
"update-example-htmls": "npm
|
30
|
-
"update-example-
|
31
|
-
"test": "npm
|
32
|
-
"build": "npm
|
33
|
-
"
|
34
|
-
"
|
35
|
-
"prepublishOnly": "npm
|
28
|
+
"_test-all-without-linting-without-browser": "npm run _test-package-interfaces && npm run _build-2 && npm run _update-example-htmls-2 && gulp devSingleThemeOnce",
|
29
|
+
"update-example-htmls": "npm run _update-example-htmls && npm run open-firefox-for-snapshots",
|
30
|
+
"update-example-htmls-2": "npm run _update-example-htmls-2 && npm run open-firefox-for-snapshots",
|
31
|
+
"test": "npm run eslint && npm run _test-all-without-linting-without-browser && npm run open-firefox-for-snapshots && npm run open-dev-htmls",
|
32
|
+
"build": "npm run eslint && npm run _build && npm run update-example-htmls",
|
33
|
+
"build-2": "npm run eslint && npm run _build-2 && npm run update-example-htmls-2",
|
34
|
+
"每当制作集得之版本之前": "npm i && npm test",
|
35
|
+
"prepublishOnly": "npm i && npm test"
|
36
36
|
},
|
37
37
|
"keywords": [
|
38
38
|
"markdown",
|
@@ -274,13 +274,19 @@ CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 D
|
|
274
274
|
|
275
275
|
### JavaScript 代码片段
|
276
276
|
|
277
|
-
|
277
|
+
#### 列表项中的代码片段1
|
278
|
+
|
279
|
+
- 先定义一个函数:
|
278
280
|
|
279
281
|
```js
|
280
282
|
function getCircleArea(r) {
|
281
283
|
return 3.14159265 * r * r;
|
282
284
|
}
|
285
|
+
```
|
283
286
|
|
287
|
+
然后调用它:
|
288
|
+
|
289
|
+
```
|
284
290
|
getCircleArea(100);
|
285
291
|
```
|
286
292
|
|
@@ -295,7 +301,7 @@ CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 D
|
|
295
301
|
|
296
302
|
> `circumference` [sər'kʌmf(ə)rəns] <i>n.</i> 圆周长
|
297
303
|
|
298
|
-
|
304
|
+
- <details open>
|
299
305
|
<summary>折叠内容中的代码块1</summary>
|
300
306
|
|
301
307
|
```js
|
@@ -306,7 +312,10 @@ CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 D
|
|
306
312
|
|
307
313
|
|
308
314
|
|
309
|
-
|
315
|
+
|
316
|
+
#### 叠内容中的代码块
|
317
|
+
|
318
|
+
下面是在叠内容中的代码块。
|
310
319
|
|
311
320
|
<details open>
|
312
321
|
<summary>折叠内容中的代码块2</summary>
|
@@ -318,6 +327,8 @@ console.log(NaN === NaN); // false
|
|
318
327
|
</details>
|
319
328
|
|
320
329
|
|
330
|
+
#### 在行文结构之所谓“顶层”的代码块
|
331
|
+
|
321
332
|
```js
|
322
333
|
// 这是一句行尾注释。好吧,我承认它恰好在这一行的开头。
|
323
334
|
import something from 'somethingjs'
|
@@ -483,7 +494,7 @@ exports.author = 'wulechun@live.com';
|
|
483
494
|
<meta charset="UTF-8">
|
484
495
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
485
496
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
486
|
-
<title
|
497
|
+
<title>吴乐川的示范文档</title>
|
487
498
|
<!-- 这是简短的单行注释。 -->
|
488
499
|
<style id="my-embedded-styles">
|
489
500
|
div {
|
@@ -592,7 +603,7 @@ exports.author = 'wulechun@live.com';
|
|
592
603
|
<meta charset="UTF-8">
|
593
604
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
594
605
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
595
|
-
<title
|
606
|
+
<title>吴乐川的示范文档</title>
|
596
607
|
</head>
|
597
608
|
<body>
|
598
609
|
<h1>DOM 的概念</h1>
|
@@ -2,7 +2,7 @@ window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost = false
|
|
2
2
|
window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan = 1
|
3
3
|
window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
|
4
4
|
|
5
|
-
;(function setupAndStartApp() {
|
5
|
+
;(function setupAndStartApp () {
|
6
6
|
const gitRepoURIs = [
|
7
7
|
'https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git',
|
8
8
|
// 'https://code.aliyun.com/wulechuan/wulechuan-themes-for-htmls-via-markdowns.git',
|
@@ -81,6 +81,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
|
|
81
81
|
const cssClassNameTOCIsVisible = 'markdown-article-toc-is-visible'
|
82
82
|
const cssClassNameTOCItemHasNestedList = 'has-nested-toc-list'
|
83
83
|
const cssClassNameTOCItemIsCollapsed = 'is-collapsed'
|
84
|
+
const cssClassNameTOCItemIsExpanded = 'is-expanded'
|
84
85
|
const cssClassNameTOCTogglingButton = 'markdown-article-toc-toggling-button'
|
85
86
|
const cssClassNameTOCShowsOnly2LevelsOfItems = 'should-show-2-levels-at-most'
|
86
87
|
|
@@ -143,10 +144,10 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
|
|
143
144
|
|
144
145
|
|
145
146
|
|
146
|
-
function buildTOCPanelTogglingButton() {
|
147
|
+
function buildTOCPanelTogglingButton () {
|
147
148
|
/**
|
148
149
|
* 我倾向于用 Javascript 来临时构建该按钮。
|
149
|
-
*
|
150
|
+
* 因为如果一个苛刻的环境仅允许读文档,而不允许
|
150
151
|
* Javascript 程序运行,那咱们还要切换按钮干嘛?
|
151
152
|
*
|
152
153
|
* ---------------------------------------------
|
@@ -160,7 +161,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
|
|
160
161
|
let tocTogglingButton = document.querySelector(`.${cssClassNameTOCTogglingButton}`)
|
161
162
|
|
162
163
|
/**
|
163
|
-
*
|
164
|
+
* 万一按钮确实已经存在呢?比如工具构建好了静态的按钮?那就不必再创建一个新的了。
|
164
165
|
* What if the button already exists? Then we simply don't create one more.
|
165
166
|
*/
|
166
167
|
if (!tocTogglingButton) {
|
@@ -181,24 +182,24 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
|
|
181
182
|
return tocTogglingButton
|
182
183
|
}
|
183
184
|
|
184
|
-
function onTOCTogglingButtonClick() {
|
185
|
+
function onTOCTogglingButtonClick () {
|
185
186
|
showOrHideTOCPanel(!tocIsVisible)
|
186
187
|
}
|
187
188
|
|
188
|
-
function showOrHideTOCPanel(isToShowIt) {
|
189
|
+
function showOrHideTOCPanel (isToShowIt) {
|
189
190
|
tocStatusCSSClassNamesCarrier.classList.toggle(cssClassNameTOCIsVisible, isToShowIt)
|
190
191
|
tocIsVisible = isToShowIt
|
191
192
|
}
|
192
193
|
|
193
|
-
function isTOCPanelFloatingOverArticle() {
|
194
|
+
function isTOCPanelFloatingOverArticle () {
|
194
195
|
return window.innerWidth <= maxWindowWidthToEnableArticleClickingToHideTOC
|
195
196
|
}
|
196
197
|
|
197
|
-
function isTOCPanelCoveringEntirePage() {
|
198
|
+
function isTOCPanelCoveringEntirePage () {
|
198
199
|
return window.innerWidth <= maxWindowWidthWhenTOCPanelCoversEntirePage
|
199
200
|
}
|
200
201
|
|
201
|
-
function onArticleClick() {
|
202
|
+
function onArticleClick () {
|
202
203
|
if (!isTOCPanelFloatingOverArticle()) {
|
203
204
|
return
|
204
205
|
}
|
@@ -206,7 +207,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
|
|
206
207
|
showOrHideTOCPanel(false)
|
207
208
|
}
|
208
209
|
|
209
|
-
function onBackToTopLinkClick() {
|
210
|
+
function onBackToTopLinkClick () {
|
210
211
|
if (!isTOCPanelCoveringEntirePage()) {
|
211
212
|
return
|
212
213
|
}
|
@@ -214,7 +215,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
|
|
214
215
|
showOrHideTOCPanel(false)
|
215
216
|
}
|
216
217
|
|
217
|
-
function markLevelIdForTOCAllItems(listRootParent, currentLevel) {
|
218
|
+
function markLevelIdForTOCAllItems (listRootParent, currentLevel) {
|
218
219
|
const listRoot = listRootParent.querySelector('ol, ul')
|
219
220
|
if (!listRoot) { return }
|
220
221
|
|
@@ -234,7 +235,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
|
|
234
235
|
})
|
235
236
|
}
|
236
237
|
|
237
|
-
function makeTOCItemsEachCollapsible() {
|
238
|
+
function makeTOCItemsEachCollapsible () {
|
238
239
|
const lis = Array.prototype.slice.apply(tocRoot.querySelectorAll('li'))
|
239
240
|
lis.forEach(li => {
|
240
241
|
if (li.querySelectorAll('li').length > 0) {
|
@@ -258,14 +259,12 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
|
|
258
259
|
|
259
260
|
Array.prototype.slice.apply(allCollapsibleLis).forEach(li => {
|
260
261
|
li.isCollapsible = true
|
261
|
-
|
262
|
-
|
263
|
-
li.classList.add(cssClassNameTOCItemIsCollapsed)
|
264
|
-
}
|
262
|
+
const liShouldExpand = li.tocLevelId <= window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan
|
263
|
+
collapseOrExpandSingleLiElement(li, liShouldExpand)
|
265
264
|
})
|
266
265
|
}
|
267
266
|
|
268
|
-
function tocItemAnchorClickHandler(e) {
|
267
|
+
function tocItemAnchorClickHandler (e) {
|
269
268
|
e.stopPropagation()
|
270
269
|
|
271
270
|
const { srcElement } = e
|
@@ -297,10 +296,27 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
|
|
297
296
|
}
|
298
297
|
|
299
298
|
if (TOCItemIsCollapsibleInCurrentSituation) {
|
300
|
-
|
301
|
-
|
302
|
-
|
303
|
-
|
299
|
+
const { classList } = liElement
|
300
|
+
const liShouldExpand = classList.contains(cssClassNameTOCItemIsCollapsed) || forceToExpand
|
301
|
+
collapseOrExpandSingleLiElement(liElement, liShouldExpand)
|
302
|
+
}
|
303
|
+
}
|
304
|
+
|
305
|
+
function collapseOrExpandSingleLiElement (liElement, shouldExpand) {
|
306
|
+
const { classList } = liElement
|
307
|
+
if (shouldExpand) {
|
308
|
+
if (!classList.contains(cssClassNameTOCItemIsExpanded)) {
|
309
|
+
classList.add(cssClassNameTOCItemIsExpanded)
|
310
|
+
}
|
311
|
+
if (classList.contains(cssClassNameTOCItemIsCollapsed)) {
|
312
|
+
classList.remove(cssClassNameTOCItemIsCollapsed)
|
313
|
+
}
|
314
|
+
} else {
|
315
|
+
if (!classList.contains(cssClassNameTOCItemIsCollapsed)) {
|
316
|
+
classList.add(cssClassNameTOCItemIsCollapsed)
|
317
|
+
}
|
318
|
+
if (classList.contains(cssClassNameTOCItemIsExpanded)) {
|
319
|
+
classList.remove(cssClassNameTOCItemIsExpanded)
|
304
320
|
}
|
305
321
|
}
|
306
322
|
}
|
@@ -1 +1 @@
|
|
1
|
-
window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost=!1,window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan=1,window.atBeginingShouldExpandTOCWhenWindowIsWideEnough=!1,function(){const e=["https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git","https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git"],t=e.reduce(((e,t)=>Math.max(e,t.length)),0)+0,n=Math.floor(t/2)+6,
|
1
|
+
window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost=!1,window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan=1,window.atBeginingShouldExpandTOCWhenWindowIsWideEnough=!1,function(){const e=["https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git","https://github.com/wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git"],t=e.reduce(((e,t)=>Math.max(e,t.length)),0)+0,n=Math.floor(t/2)+6,o="-".repeat(t),l="=".repeat(t),s="wulechuan@live.com",c="北京时间 2021-03-21",i=[];"中国人——特别是汉族人,理应坚持广泛、规范地使用汉语。凡非必要之情形不说外国话、不用外国字。此乃天经地义!\n然则每当必要,亦不排斥采用外国之语言。不妨博世界之学问,养中国之精神。\n本人亦支持少数民族坚持采用自己民族的传统语言。仍须强调,凡中国人,皆应会用汉语、积极使用汉语,此乃中华各民族之大一统之必由。".split("\n").forEach((e=>{i.push(""),i.push(" "+e.slice(0,n-4));let t=e.slice(n-4);for(;t.length>0;){const e=t.match(/^(,|。|!|,”|。”|!”| 》,|》。| 》!| 》,”| 》。”| 》!”)/);if(e){const n=e[1],o=i[i.length-1];i[i.length-1]=o+n,t=t.slice(n.length)}const o=t.slice(0,n);o&&i.push(o),t=t.slice(o.length)}})),console.log(`\n${l}\n\n欢迎使用吴乐川设计的用于控制文章目录之交互的控制器。\n( Welcome to wulechuan's article TOC controller. )\n\n${" ".repeat(t-s.length)}${s}\n${" ".repeat(t-c.length-3)}${c}\n\n${o}\n\n${e.join("\n")}\n\n${o}\n${i.join("\n")}\n\n${l}\n\n\n`);const a="has-nested-toc-list",r="is-collapsed",u="is-expanded",d="markdown-article-toc-toggling-button",h=1e3,w=document.querySelector(".markdown-article");if(!w)return;const p=document.querySelector("nav.markdown-article-toc");if(!p)return;p.classList.toggle("should-show-2-levels-at-most",window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost);const f=document.querySelector(".markdown-article-back-to-top");f&&(f.onclick=function(){if(!C())return;O(!1)}),w.onclick=function(){if(!(window.innerWidth<=h))return;O(!1)};const m=document.body,g=m,y=m;let v;y.classList.add("markdown-article-toc-exists"),function e(t,n){const o=t.querySelector("ol, ul");if(!o)return;n||(n=1);o.classList.add(`toc-list-level-${n}`);Array.prototype.slice.apply(o.children).filter((e=>"li"===e.tagName.toLowerCase())).forEach((t=>{t.tocLevelId=n,t.classList.add(`toc-list-level-${n}-item`),e(t,n+1)}))}(p),function(){let e;if(Array.prototype.slice.apply(p.querySelectorAll("li")).forEach((e=>{if(e.querySelectorAll("li").length>0){const t=e.querySelector("a");e.classList.add(a),e.hasNestedList=!0,e.isCollapsible=!1,e.selfAnchor=t,e.onclick=k}})),window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost){const t=p.querySelector("ol, ul").children;e=t}else e=p.querySelectorAll("li.has-nested-toc-list");Array.prototype.slice.apply(e).forEach((e=>{e.isCollapsible=!0;$(e,e.tocLevelId<=window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan)}))}(),function(){let e=document.querySelector(`.${d}`);e||(e=document.createElement("button"),e.className=d,g===m?g.insertBefore(e,document.scripts[0]):g.appendChild(e));null===e.onclick&&(e.onclick=S)}();let L="";function S(){O(!v)}function O(e){y.classList.toggle("markdown-article-toc-is-visible",e),v=e}function C(){return window.innerWidth<=600}function k(e){e.stopPropagation();const{srcElement:t}=e,n=this,{selfAnchor:o}=n;if(t!==n&&t!==o)return;const l=o.href;let s="";l.match(/#/)&&(s=`#${l.split("#").pop()}`);const c=!!s&&L!==s;L=s;let i=n.isCollapsible;if(C()&&(i=!1),i){const{classList:e}=n;$(n,e.contains(r)||c)}}function $(e,t){const{classList:n}=e;t?(n.contains(u)||n.add(u),n.contains(r)&&n.remove(r)):(n.contains(r)||n.add(r),n.contains(u)&&n.remove(u))}O(window.atBeginingShouldExpandTOCWhenWindowIsWideEnough&&window.innerWidth>=h)}();
|