@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.
Files changed (21) hide show
  1. package/ReadMe.md +14 -14
  2. package/package.json +22 -22
  3. 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
  4. 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
  5. 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
  6. 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
  7. 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
  8. 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
  9. 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
  10. 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
  11. 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
  12. 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
  13. 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
  14. 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
  15. 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
  16. 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
  17. 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
  18. 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
  19. 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
  20. 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
  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//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](./文档/说明书/en-US/ReadMe.md)
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
- - 《[本工具之简介](./文档/说明书/汉语/本工具之简介.md)》
47
- - 《[关于文章排版与配色效果示例集的说明(含最终视觉效果)](./文档/说明书/汉语/关于文章排版与配色效果示例集的说明.md)》
48
- - 《[本工具构建层叠样式表时所采用之内在规则之介绍](./文档/说明书/汉语/本工具构建层叠样式表时所采用之内在规则之介绍.md)》
49
- - 《[业已支持的应用场景](./文档/说明书/汉语/业已支持的应用场景.md)》
50
- - 《[采用本工具开发一套新的文章排版与配色方案之详细步骤](./文档/说明书/汉语/采用本工具开发一套新的文章排版与配色方案之详细步骤.md)》
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
- - [示例:简体中文范文配默认浅色主题,在宽大尺寸浏览器中的效果(目录已收叠)](./文档/文章排版与配色效果示例集/以-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)
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
- - [示例:简体中文范文配默认深色主题,在宽大尺寸浏览器中的效果(目录已收叠)](./文档/文章排版与配色效果示例集/以-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)
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
- - 《[应用效果示例(汉语版)](./文档/说明书/汉语/关于文章排版与配色效果示例集的说明.md)》
78
- - 《[Application Examples (en-US)](./文档/说明书/en-US/application-examples.md)》
77
+ - 《[应用效果示例(汉语版)](./文档集/说明书/汉语/关于文章排版与配色效果示例集的说明.md)》
78
+ - 《[Application Examples (en-US)](./文档集/说明书/en-US/application-examples.md)》
79
79
 
80
- 另附《[示范文章之截图之制作指南](./文档/说明书/汉语/示范文章之截图之制作指南.md)》
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.3.2",
6
- "description": "吴乐川的 HTML 文章排版与配色之方案集。本工具用于构建一组层叠样式表(即 CSS )文件,本工具亦现场提供了一组层叠样式表文件。凡这些样式表,均可用于美化采用超文本标记语言(即 HTML )格式存储的文章。且不必同时取用多个样式表文件,仅取其一足矣。",
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 ./文档/文章排版与配色效果示例集/*.js ./测试集/*.js ./源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/*.js ./源代码/原始的源代码/用于设计文章排版与配色方案的代码/js/**/*.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 ./测试集/产生的临时文件/示例性-html-文件集(仅限于当前正在开发的排版与配色方案)/default-theming-example.--DEV--.en-us.html && start ./测试集/产生的临时文件/示例性-html-文件集(仅限于当前正在开发的排版与配色方案)/default-theming-example.--DEV--.zh-hans-cn.html",
19
- "clean": "gulp --silent cleanAll",
20
- "clean2": "gulp cleanAll",
21
- "_build": "gulp --silent buildAllThemesOnce",
22
- "_build2": "gulp buildAllThemesOnce",
23
- "_update-example-htmls": "gulp --silent updateExampleHTMLs",
24
- "_update-example-htmls2": "gulp updateExampleHTMLs",
25
- "start2": "gulp --silent devSingleThemeOnce && npm run open-dev-htmls && gulp --silent devSingleTheme",
26
- "start": "gulp devSingleThemeOnce && npm run open-dev-htmls && gulp devSingleTheme",
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 && npm run _build2 && npm run _update-example-htmls2 && gulp devSingleThemeOnce",
29
- "update-example-htmls": "npm run _update-example-htmls && npm run firefox",
30
- "update-example-htmls2": "npm run _update-example-htmls2 && npm run firefox",
31
- "test": "npm run eslint && npm run _test-all-without-linting-without-browser && npm run firefox && npm run open-dev-htmls",
32
- "build": "npm run eslint && npm run _build && npm run update-example-htmls",
33
- "build2": "npm run eslint && npm run _build2 && npm run update-example-htmls2",
34
- "before-git-commit": "npm i && npm test",
35
- "prepublishOnly": "npm i && npm test"
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&apos;kʌmf(ə)rəns] <i>n.</i> 圆周长
297
303
 
298
- <details open>
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>乐川的示范文档</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>乐川的示范文档</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
- * 万一按钮确实已j经存在呢?比如工具构建好了静态的按钮?那就不必再创建一个新的了。
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
- if (li.tocLevelId > window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan) {
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
- if (liElement.classList.contains(cssClassNameTOCItemIsCollapsed) || forceToExpand) {
301
- liElement.classList.remove(cssClassNameTOCItemIsCollapsed)
302
- } else {
303
- liElement.classList.add(cssClassNameTOCItemIsCollapsed)
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,l="-".repeat(t),o="=".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],l=i[i.length-1];i[i.length-1]=l+n,t=t.slice(n.length)}const l=t.slice(0,n);l&&i.push(l),t=t.slice(l.length)}})),console.log(`\n${o}\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${l}\n\n${e.join("\n")}\n\n${l}\n${i.join("\n")}\n\n${o}\n\n\n`);const r="has-nested-toc-list",a="is-collapsed",u="markdown-article-toc-toggling-button",d=1e3,h=document.querySelector(".markdown-article");if(!h)return;const w=document.querySelector("nav.markdown-article-toc");if(!w)return;w.classList.toggle("should-show-2-levels-at-most",window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost);const p=document.querySelector(".markdown-article-back-to-top");p&&(p.onclick=function(){if(!O())return;v(!1)}),h.onclick=function(){if(!(window.innerWidth<=d))return;v(!1)};const m=document.body,f=m,g=m;let y;g.classList.add("markdown-article-toc-exists"),function e(t,n){const l=t.querySelector("ol, ul");if(!l)return;n||(n=1);l.classList.add(`toc-list-level-${n}`);Array.prototype.slice.apply(l.children).filter((e=>"li"===e.tagName.toLowerCase())).forEach((t=>{t.tocLevelId=n,t.classList.add(`toc-list-level-${n}-item`),e(t,n+1)}))}(w),function(){let e;if(Array.prototype.slice.apply(w.querySelectorAll("li")).forEach((e=>{if(e.querySelectorAll("li").length>0){const t=e.querySelector("a");e.classList.add(r),e.hasNestedList=!0,e.isCollapsible=!1,e.selfAnchor=t,e.onclick=C}})),window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost){const t=w.querySelector("ol, ul").children;e=t}else e=w.querySelectorAll("li.has-nested-toc-list");Array.prototype.slice.apply(e).forEach((e=>{e.isCollapsible=!0,e.tocLevelId>window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan&&e.classList.add(a)}))}(),function(){let e=document.querySelector(`.${u}`);e||(e=document.createElement("button"),e.className=u,f===m?f.insertBefore(e,document.scripts[0]):f.appendChild(e));null===e.onclick&&(e.onclick=S)}();let L="";function S(){v(!y)}function v(e){g.classList.toggle("markdown-article-toc-is-visible",e),y=e}function O(){return window.innerWidth<=600}function C(e){e.stopPropagation();const{srcElement:t}=e,n=this,{selfAnchor:l}=n;if(t!==n&&t!==l)return;const o=l.href;let s="";o.match(/#/)&&(s=`#${o.split("#").pop()}`);const c=!!s&&L!==s;L=s;let i=n.isCollapsible;O()&&(i=!1),i&&(n.classList.contains(a)||c?n.classList.remove(a):n.classList.add(a))}v(window.atBeginingShouldExpandTOCWhenWindowIsWideEnough&&window.innerWidth>=d)}();
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)}();