@wulechuan/css-stylus-markdown-themes 7.2.8 → 7.4.0

package/ReadMe.md

@@ -10,7 +10,7 @@
 
 ## Multilingual Editions of this Article
 
-- [English version of this ReadMe](./文档/说明书/en-US/ReadMe.md)
+- [English version of this ReadMe](./文档集集/说明书/en-US/ReadMe.md)
 
 
 
@@ -39,15 +39,15 @@
 
 
 
-## 文档章节
+## 文档集章节
 
 > 以下章节均存在于单独的文件中，并非本文章之部分。
 
-- 《[本工具之简介](./文档/说明书/汉语/本工具之简介.md)》
-- 《[关于文章排版与配色效果示例集的说明（含最终视觉效果）](./文档/说明书/汉语/关于文章排版与配色效果示例集的说明.md)》
-- 《[本工具构建层叠样式表时所采用之内在规则之介绍](./文档/说明书/汉语/本工具构建层叠样式表时所采用之内在规则之介绍.md)》
-- 《[业已支持的应用场景](./文档/说明书/汉语/业已支持的应用场景.md)》
-- 《[采用本工具开发一套新的文章排版与配色方案之详细步骤](./文档/说明书/汉语/采用本工具开发一套新的文章排版与配色方案之详细步骤.md)》
+- 《[本工具之简介](./文档集/说明书/汉语/本工具之简介.md)》
+- 《[关于文章排版与配色效果示例集的说明（含最终视觉效果）](./文档集/说明书/汉语/关于文章排版与配色效果示例集的说明.md)》
+- 《[本工具构建层叠样式表时所采用之内在规则之介绍](./文档集/说明书/汉语/本工具构建层叠样式表时所采用之内在规则之介绍.md)》
+- 《[业已支持的应用场景](./文档集/说明书/汉语/业已支持的应用场景.md)》
+- 《[采用本工具开发一套新的文章排版与配色方案之详细步骤](./文档集/说明书/汉语/采用本工具开发一套新的文章排版与配色方案之详细步骤.md)》
 
 
 
@@ -60,24 +60,24 @@
 
 ### 应用默认浅色主题的范文截图
 
-- [示例：简体中文范文配默认浅色主题，在宽大尺寸浏览器中的效果（目录已收叠）](./文档/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/示例：简体中文范文配默认浅色主题，1-在宽大尺寸浏览器中的效果（目录已收叠）.png)
-- [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)
+- [示例：简体中文范文配默认浅色主题，在宽大尺寸浏览器中的效果（目录已收叠）](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/示例：简体中文范文配默认浅色主题，1-在宽大尺寸浏览器中的效果（目录已收叠）.png)
+- [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)
 
 
 ### 应用默认深色主题的范文截图
 
-- [示例：简体中文范文配默认深色主题，在宽大尺寸浏览器中的效果（目录已收叠）](./文档/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/示例：简体中文范文配默认深色主题，1-在宽大尺寸浏览器中的效果（目录已收叠）.png)
-- [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)
+- [示例：简体中文范文配默认深色主题，在宽大尺寸浏览器中的效果（目录已收叠）](./文档集/文章排版与配色效果示例集/以-html-格式渲染好的文章成品/各文章最终呈现效果之截图/示例：简体中文范文配默认深色主题，1-在宽大尺寸浏览器中的效果（目录已收叠）.png)
+- [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)
 
 
 ### 范文的所有截图
 
 两篇范文之截图不止于上文中提及的四幅。更多图例，见：
 
-- 《[应用效果示例（汉语版）](./文档/说明书/汉语/关于文章排版与配色效果示例集的说明.md)》
-- 《[Application Examples (en-US)](./文档/说明书/en-US/application-examples.md)》
+- 《[应用效果示例（汉语版）](./文档集/说明书/汉语/关于文章排版与配色效果示例集的说明.md)》
+- 《[Application Examples (en-US)](./文档集/说明书/en-US/application-examples.md)》
 
-另附《[示范文章之截图之制作指南](./文档/说明书/汉语/示范文章之截图之制作指南.md)》
+另附《[示范文章之截图之制作指南](./文档集/说明书/汉语/示范文章之截图之制作指南.md)》
 
 
 

package/package.json

@@ -2,37 +2,37 @@
   "name": "@wulechuan/css-stylus-markdown-themes",
   "author": "吴乐川 <wulechuan@live.com>",
   "license": "WTFPL",
-  "version": "7.2.8",
-  "description": "吴乐川的 HTML 文章排版与配色之方案集。本工具用于构建一组层叠样式表（即 CSS ）文件，本工具亦现场提供了一组层叠样式表文件。凡这些样式表，均可用于美化采用超文本标记语言（即 HTML ）格式存储的文章。且不必同时取用多个样式表文件，仅取其一足矣。",
+  "version": "7.4.0",
+  "description": "此为吴乐川的 HTML 文章排版与配色之方案集。本工具可用于构建一组层叠样式表（即 CSS ）文件，本工具亦提供了一组现成的层叠样式表文件。凡这些样式表，均可用于美化采用超文本标记语言（即 HTML ）格式存储的文章。且不必同时取用多个样式表文件，仅取其一足矣。",
   "directories": {
     "source": "源代码/原始的源代码",
     "dist": "源代码/发布的源代码",
     "test": "测试集",
-    "doc": "文档"
+    "doc": "文档集"
   },
   "main": "源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/index.js",
   "types": "源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/index.d.ts",
   "scripts": {
-    "eslint": "eslint    ./.eslintrc.js    ./gulpfile.esm.js/**/*.js    ./文档/文章排版与配色效果示例集/*.js    ./测试集/*.js    ./源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/*.js    ./源代码/原始的源代码/用于设计文章排版与配色方案的代码/js/**/*.js    ./本项目之全局配置项集.js",
-    "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",
-    "open-dev-htmls": "start        ./测试集/产生的临时文件/示例性-html-文件集（仅限于当前正在开发的排版与配色方案）/default-theming-example.--DEV--.en-us.html    &&    start       ./测试集/产生的临时文件/示例性-html-文件集（仅限于当前正在开发的排版与配色方案）/default-theming-example.--DEV--.zh-hans-cn.html",
-    "clean": "gulp                  --silent  cleanAll",
-    "clean2": "gulp                           cleanAll",
-    "_build": "gulp                 --silent  buildAllThemesOnce",
-    "_build2": "gulp                          buildAllThemesOnce",
-    "_update-example-htmls": "gulp  --silent  updateExampleHTMLs",
-    "_update-example-htmls2": "gulp           updateExampleHTMLs",
-    "start2": "gulp                 --silent  devSingleThemeOnce    &&    npm  run  open-dev-htmls    &&    gulp  --silent  devSingleTheme",
-    "start": "gulp                            devSingleThemeOnce    &&    npm  run  open-dev-htmls    &&    gulp            devSingleTheme",
+    "eslint": "eslint    ./.eslintrc.js    ./gulpfile.esm.js/**/*.js    ./文档集/文章排版与配色效果示例集/*.js    ./测试集/*.js    ./源代码/发布的源代码/本工具作为其他-javascript-工具之依赖模块时的代码/*.js    ./源代码/原始的源代码/用于设计文章排版与配色方案的代码/js/**/*.js    ./本项目之全局配置项集.js",
+    "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",
+    "open-dev-htmls": "start                           ./测试集/产生的临时文件/示例性-html-文件集（仅限于当前正在开发的排版与配色方案）/default-theming-example.--DEV--.en-us.html    &&    start       ./测试集/产生的临时文件/示例性-html-文件集（仅限于当前正在开发的排版与配色方案）/default-theming-example.--DEV--.zh-hans-cn.html",
+    "clean": "gulp                   --silent  cleanAll",
+    "clean-2": "gulp                           cleanAll",
+    "_build": "gulp                  --silent  buildAllThemesOnce",
+    "_build-2": "gulp                          buildAllThemesOnce",
+    "_update-example-htmls": "gulp   --silent  updateExampleHTMLs",
+    "_update-example-htmls-2": "gulp           updateExampleHTMLs",
+    "start-2": "gulp                 --silent  devSingleThemeOnce    &&    npm  run  open-dev-htmls    &&    gulp  --silent  devSingleTheme",
+    "start": "gulp                             devSingleThemeOnce    &&    npm  run  open-dev-htmls    &&    gulp            devSingleTheme",
     "_test-package-interfaces": "node  ./测试集/用于测试本项目之-javascript-接口的测试代码集.js",
-    "_test-all-without-linting-without-browser": "npm  run  _test-package-interfaces                &&    npm  run  _build2    &&    npm  run  _update-example-htmls2    &&    gulp  devSingleThemeOnce",
-    "update-example-htmls": "npm                  run  _update-example-htmls                        &&    npm  run  firefox",
-    "update-example-htmls2": "npm                 run  _update-example-htmls2                       &&    npm  run  firefox",
-    "test": "npm    run  eslint        &&    npm  run  _test-all-without-linting-without-browser    &&    npm  run  firefox    &&    npm  run  open-dev-htmls",
-    "build": "npm   run  eslint        &&    npm  run  _build                                       &&    npm  run  update-example-htmls",
-    "build2": "npm  run  eslint        &&    npm  run  _build2                                      &&    npm  run  update-example-htmls2",
-    "before-git-commit": "npm  i    &&    npm  test",
-    "prepublishOnly": "npm     i    &&    npm  test"
+    "_test-all-without-linting-without-browser": "npm  run  _test-package-interfaces                     &&    npm  run  _build-2    &&    npm  run  _update-example-htmls-2    &&    gulp  devSingleThemeOnce",
+    "update-example-htmls": "npm                       run  _update-example-htmls                        &&    npm  run  open-firefox-for-snapshots",
+    "update-example-htmls-2": "npm                     run  _update-example-htmls-2                      &&    npm  run  open-firefox-for-snapshots",
+    "test": "npm     run  eslint        &&        npm  run  _test-all-without-linting-without-browser    &&    npm  run  open-firefox-for-snapshots    &&    npm  run  open-dev-htmls",
+    "build": "npm    run  eslint        &&        npm  run  _build                                       &&    npm  run  update-example-htmls",
+    "build-2": "npm  run  eslint        &&        npm  run  _build-2                                     &&    npm  run  update-example-htmls-2",
+    "每当制作集得之版本之前": "npm  i    &&    npm  test",
+    "prepublishOnly": "npm       i    &&    npm  test"
   },
   "keywords": [
     "markdown",
@@ -77,15 +77,15 @@
     "globby": "^11.1.0"
   },
   "devDependencies": {
-    "@wulechuan/cli-scripts--git-push": "^1.0.1",
+    "@wulechuan/cli-scripts--git-push": "^2.0.0",
     "@wulechuan/generate-html-via-markdown": "^3.0.9",
     "@wulechuan/gulp-classical-task-cycle": "^0.3.0",
     "chalk": "^4.1.2",
-    "cssnano": "^5.1.0",
+    "cssnano": "^5.1.7",
     "del": "^6.0.0",
-    "eslint": "^8.10.0",
+    "eslint": "^8.14.0",
     "esm": "^3.2.25",
-    "fs-extra": "^10.0.1",
+    "fs-extra": "^10.1.0",
     "gulp": "^4.0.2",
     "gulp-concat": "^2.6.1",
     "gulp-pipe": "^1.0.4",
@@ -93,6 +93,6 @@
     "gulp-rename": "^2.0.0",
     "gulp-stylus": "^2.7.1",
     "gulp-terser": "^2.1.0",
-    "postcss": "^8.4.8"
+    "postcss": "^8.4.12"
   }
 }

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

@@ -1,4 +1,4 @@
-# Wulechuan's Article CSS Styles Examples
+# Wulechuan's Article CSS Styles Examples
 
 <p class="document-author">wulechuan@live.com</p>
 
@@ -449,7 +449,7 @@ html, body {
     display: flex;
     position: relative;
     width: 100%;
-    font-family: 'Segoe UI', 'Microsoft YaHei UI', serif;
+    font-family: 'Microsoft YaHei UI', 'Segoe UI', serif;
 }
 
 .back-to-top {
@@ -480,7 +480,7 @@ a {
 }
 
 a:hover {
-    text-decoration: underline !important;
+    text-decoration-line: underline !important;
 }
 
 a[href^="#"] {

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

@@ -15,6 +15,8 @@
 
 ### 《千字文》[节选]
 
+<center>
+
 天地玄黄 宇宙洪荒\
 日月盈昃 辰宿列张\
 寒来暑往 秋收冬藏\
@@ -24,6 +26,8 @@
 剑号巨阙 珠称夜光\
 果珍李柰 菜重芥姜
 
+</center>
+
 
 
 ### 《日记（2019年6月18日）》[节选]
@@ -42,7 +46,7 @@
 
 #### 《马诗二十三首·其五》
 
-<em>【唐】 李贺</em>
+<i>【唐】 李贺</i>
 
 大漠沙如雪\
 燕山月似钩\
@@ -52,17 +56,19 @@
 
 ### 杂乱内容，仅用于视觉样式之呈示
 
-一段文字中，有时会有**着重的文字**，也有时会有*斜体的文字*。
+一段文字中会有**着重的文字**，也会有*斜体的文字*，甚至 _**斜体且着重的文字**_ 以及 **_着重且斜体的文字_**。
+
+网页中的文章常常有【超链接】。我以前常常将代码存放在外国的GitHub上，如今则更倾向于采用中国的“码云”。“Github”一词，我本人有意将其译为【[集得中心](https://github.com)】。当然，这并非官方译法，乃鄙人之拙见。
 
-这里是 GitHub，我本人有意将其译为【[吉特中心](https://github.com)】。当然，这并非官方译法，乃鄙人之拙见。
+如果一个超链接指向**本文**某处，不妨称其为**文内链接**，而不应生硬地由英语直译为所谓“本地链接”。另，文内链接看起来与应与指向其它文章或网址的超链接稍有不同，以为明示。暗示不堪用，明示才好。小例一则：跳转至本文《[程序代码片段示例集](#程序代码片段示例集)》。
 
-如果一个链接指向**本文**，不妨称其为**文内链接**，而不应生硬的由英语直译为所谓“本地链接”。另，文内链接看起来与应与指向其它文章或网址的链接稍有不同，以为明示。暗示不堪用，明示才好。小例一则：跳转至本文《[程序代码片段示例集](#程序代码片段示例集)》。
+再来看看行文中的【代码词汇】、【专有名词】和【术语】：例如`grep`、`孙行者`和`中央处理单元`。又如`querySelector`和`querySelectorAll`早已取代了老式的`getElementsById`等函数。术语框中的多个连续空格也应得到保留，例如`这后面有四个空格    这前面有四个空格`。
 
-再来看看行文中的【代码词汇】或【术语】：例如`孙行者`和`计算机`，又如 `querySelector` 和 `querySelectorAll` 早已取代了老式的 `getElementsById` 和 `getElementsByTagName` 等。术语框中的多个连续空格也应得到保留，例如 `这后面有四个空格    这前面有四个空格`。
+术语与超链接还可组合为一体。新中国的建立和成长离不开一群功勋卓著的科学家们。例如伟大的、富有爱国主义精神和民族自信的[`钱学森`](https://baike.baidu.com/item/%E9%92%B1%E5%AD%A6%E6%A3%AE/26105)，他是**中国科学院资深院士**、**中国工程院资深院士**。
 
-计算机键盘快捷键，其视觉样式如是：<kbd>Ctrl</kbd>+<kbd>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</kbd>；又例：如今，<kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>s</kbd> 这一组合键早已广泛用于各种现代计算机软件中，代表（将工作内容或文件）`另存为`（壹文件）之功能。
+计算机键盘快捷键，其视觉样式如是：<kbd>Ctrl</kbd>+<kbd>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</kbd>；又例：如今，<kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>s</kbd>这一组合键早已广泛用于各种现代计算机软件中，代表（将工作内容或文件）`另存为`（壹文件）之功能。
 
-还有时候，有些内容会故意被“杠掉”，即被中划线划去，表示此内容不正确，不应采纳，应作废。例如：~~地球是平的~~。
+还有些内容会故意“杠掉”，即被中划线划去，表示此内容不正确，不应采纳，应作废。例如：~~地球是平的~~。
 
 
 #### 多级列表
@@ -75,7 +81,7 @@
     2.  王昭君，2070 岁
     3.  貂蝉，约 1820 岁
     4.  杨玉环，1300 岁
-    5.  我媳妇儿，永远 20 岁
+    5.  你媳妇儿，永远 20 岁
 
 3.  第 1 级第 3 项
 
@@ -125,7 +131,7 @@
 
 ##### 层叠样式表对象模型（这是 h5）
 
-CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 DOM 和 HTML API 之后，又一个操纵 CSS 的接口，从而能够动态地读取和修改 CSS 样式。<sup>[2]</sup>
+CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 DOM 和 HTML API 之后，又一个操纵 CSS 的接口，使得我们能够动态地读取和修改 CSS 样式。<sup>[2]</sup>
 
 
 
@@ -150,14 +156,14 @@ CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 D
 
 如果引用的文字很短，我目前的设计是令它们位于同一行中。例如：
 
-> circle ['sɜrk(ə)l]：圆。
+> circle ['sɜrk(ə)l] <i>n.</i> 圆。
 
-> area ['eriə]：面积。
+> area ['eriə] <i>n.</i> 面积。
 
 
 -   出现在列表项中的引用文字：
 
-    复旦大学中国研究院院长张维为教授在其所著《中国超越：一个文明型国家的光荣与梦想》中写道：
+    复旦大学中国研究院院长[张维为](https://baike.baidu.com/item/%E5%BC%A0%E7%BB%B4%E4%B8%BA/2650478)教授在其所著《中国超越：一个文明型国家的光荣与梦想》中写道：
 
     > 中国人的爱国主义是长江、黄河、珠穆朗玛峰；是《诗经》、《楚辞》、先秦散文；是唐诗、宋词、元曲、明清小说；是屈原、岳飞、文天祥、毛泽东；是普通话、四川话、广东粤语、上海方言；是万里长城、北京故宫、桂林山水、陕西兵马俑；是川菜、粤菜、鲁菜、淮扬菜；是西湖龙井、黄山毛峰、武夷岩茶、洞庭碧螺春；是《梅花三弄》、《高山流水》、《二泉映月》、《春江花月夜》；是四合院、广东骑楼、徽派大院、江南民居；是昆剧、京剧、粤剧、黄梅戏；是南昌起义、平型关大捷、台儿庄血战、抗美援朝；是两弹一星、北斗导航、神舟号飞船、高铁八纵八横；是己所不欲，勿施于人；是四海之内皆兄弟；是胸怀祖国，放眼世界等等等等。
 
@@ -268,13 +274,19 @@ CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 D
 
 ### JavaScript 代码片段
 
--   列表项中的代码片段
+#### 列表项中的代码片段1
+
+-   先定义一个函数：
 
     ```js
     function getCircleArea(r) {
         return 3.14159265 * r * r;
     }
+    ```
+
+    然后调用它：
 
+    ```
     getCircleArea(100);
     ```
 
@@ -287,9 +299,9 @@ CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 D
     getCircumference(100);
     ```
 
-    > `circumference` _[sər'kʌmf(ə)rəns]_ 圆周长
+    > `circumference` [sər&apos;kʌmf(ə)rəns] <i>n.</i> 圆周长
 
-    <details open>
+-   <details open>
     <summary>折叠内容中的代码块1</summary>
 
     ```js
@@ -300,7 +312,10 @@ CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 D
 
 
 
-下面是不在列表项内的代码片段。
+
+#### 叠内容中的代码块
+
+下面是在叠内容中的代码块。
 
 <details open>
 <summary>折叠内容中的代码块2</summary>
@@ -312,6 +327,8 @@ console.log(NaN === NaN); // false
 </details>
 
 
+#### 在行文结构之所谓“顶层”的代码块
+
 ```js
 // 这是一句行尾注释。好吧，我承认它恰好在这一行的开头。
 import something from 'somethingjs'
@@ -477,7 +494,7 @@ exports.author = 'wulechun@live.com';
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <title>乐川的示范文档</title>
+    <title>吴乐川的示范文档</title>
     <!-- 这是简短的单行注释。 -->
     <style id="my-embedded-styles">
         div {
@@ -586,7 +603,7 @@ exports.author = 'wulechun@live.com';
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
-    <title>乐川的示范文档</title>
+    <title>吴乐川的示范文档</title>
 </head>
 <body>
     <h1>DOM 的概念</h1>
@@ -631,7 +648,7 @@ html, body {
     display: flex;
     position: relative;
     width: 100%;
-    font-family: 'Segoe UI', '微软雅黑', serif;
+    font-family: '微软雅黑', 'Segoe UI', serif;
 }
 
 .back-to-top {
@@ -662,7 +679,7 @@ a {
 }
 
 a:hover {
-    text-decoration: underline !important;
+    text-decoration-line: underline !important;
 }
 
 a[href^="#"] {

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

@@ -2,7 +2,7 @@ window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost = false
 window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan = 1
 window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
 
-;(function setupAndStartApp() {
+;(function setupAndStartApp () {
     const gitRepoURIs = [
         'https://gitee.com/nanchang-wulechuan/wulechuan-css-stylus-themes-for-htmls-via-markdowns.git',
         // 'https://code.aliyun.com/wulechuan/wulechuan-themes-for-htmls-via-markdowns.git',
@@ -81,6 +81,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
     const cssClassNameTOCIsVisible               = 'markdown-article-toc-is-visible'
     const cssClassNameTOCItemHasNestedList       = 'has-nested-toc-list'
     const cssClassNameTOCItemIsCollapsed         = 'is-collapsed'
+    const cssClassNameTOCItemIsExpanded          = 'is-expanded'
     const cssClassNameTOCTogglingButton          = 'markdown-article-toc-toggling-button'
     const cssClassNameTOCShowsOnly2LevelsOfItems = 'should-show-2-levels-at-most'
 
@@ -143,10 +144,10 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
 
 
 
-    function buildTOCPanelTogglingButton() {
+    function buildTOCPanelTogglingButton () {
         /**
          * 我倾向于用 Javascript 来临时构建该按钮。
-         * 因为如果一共苛刻的环境仅允许读文档，而不允许
+         * 因为如果一个苛刻的环境仅允许读文档，而不允许
          * Javascript 程序运行，那咱们还要切换按钮干嘛？
          *
          * ---------------------------------------------
@@ -160,7 +161,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
         let tocTogglingButton = document.querySelector(`.${cssClassNameTOCTogglingButton}`)
 
         /**
-         * 万一按钮确实已j经存在呢？比如工具构建好了静态的按钮？那就不必再创建一个新的了。
+         * 万一按钮确实已经存在呢？比如工具构建好了静态的按钮？那就不必再创建一个新的了。
          * What if the button already exists? Then we simply don't create one more.
          */
         if (!tocTogglingButton) {
@@ -181,24 +182,24 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
         return tocTogglingButton
     }
 
-    function onTOCTogglingButtonClick() {
+    function onTOCTogglingButtonClick () {
         showOrHideTOCPanel(!tocIsVisible)
     }
 
-    function showOrHideTOCPanel(isToShowIt) {
+    function showOrHideTOCPanel (isToShowIt) {
         tocStatusCSSClassNamesCarrier.classList.toggle(cssClassNameTOCIsVisible, isToShowIt)
         tocIsVisible = isToShowIt
     }
 
-    function isTOCPanelFloatingOverArticle() {
+    function isTOCPanelFloatingOverArticle () {
         return window.innerWidth <= maxWindowWidthToEnableArticleClickingToHideTOC
     }
 
-    function isTOCPanelCoveringEntirePage() {
+    function isTOCPanelCoveringEntirePage () {
         return window.innerWidth <= maxWindowWidthWhenTOCPanelCoversEntirePage
     }
 
-    function onArticleClick() {
+    function onArticleClick () {
         if (!isTOCPanelFloatingOverArticle()) {
             return
         }
@@ -206,7 +207,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
         showOrHideTOCPanel(false)
     }
 
-    function onBackToTopLinkClick() {
+    function onBackToTopLinkClick () {
         if (!isTOCPanelCoveringEntirePage()) {
             return
         }
@@ -214,7 +215,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
         showOrHideTOCPanel(false)
     }
 
-    function markLevelIdForTOCAllItems(listRootParent, currentLevel) {
+    function markLevelIdForTOCAllItems (listRootParent, currentLevel) {
         const listRoot = listRootParent.querySelector('ol, ul')
         if (!listRoot) { return }
 
@@ -234,7 +235,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
         })
     }
 
-    function makeTOCItemsEachCollapsible() {
+    function makeTOCItemsEachCollapsible () {
         const lis = Array.prototype.slice.apply(tocRoot.querySelectorAll('li'))
         lis.forEach(li => {
             if (li.querySelectorAll('li').length > 0) {
@@ -258,14 +259,12 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
 
         Array.prototype.slice.apply(allCollapsibleLis).forEach(li => {
             li.isCollapsible = true
-
-            if (li.tocLevelId > window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan) {
-                li.classList.add(cssClassNameTOCItemIsCollapsed)
-            }
+            const liShouldExpand = li.tocLevelId <= window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan
+            collapseOrExpandSingleLiElement(li, liShouldExpand)
         })
     }
 
-    function tocItemAnchorClickHandler(e) {
+    function tocItemAnchorClickHandler (e) {
         e.stopPropagation()
 
         const { srcElement } = e
@@ -297,10 +296,27 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
         }
 
         if (TOCItemIsCollapsibleInCurrentSituation) {
-            if (liElement.classList.contains(cssClassNameTOCItemIsCollapsed) || forceToExpand) {
-                liElement.classList.remove(cssClassNameTOCItemIsCollapsed)
-            } else {
-                liElement.classList.add(cssClassNameTOCItemIsCollapsed)
+            const { classList } = liElement
+            const liShouldExpand = classList.contains(cssClassNameTOCItemIsCollapsed) || forceToExpand
+            collapseOrExpandSingleLiElement(liElement, liShouldExpand)
+        }
+    }
+
+    function collapseOrExpandSingleLiElement (liElement, shouldExpand) {
+        const { classList } = liElement
+        if (shouldExpand) {
+            if (!classList.contains(cssClassNameTOCItemIsExpanded)) {
+                classList.add(cssClassNameTOCItemIsExpanded)
+            }
+            if (classList.contains(cssClassNameTOCItemIsCollapsed)) {
+                classList.remove(cssClassNameTOCItemIsCollapsed)
+            }
+        } else {
+            if (!classList.contains(cssClassNameTOCItemIsCollapsed)) {
+                classList.add(cssClassNameTOCItemIsCollapsed)
+            }
+            if (classList.contains(cssClassNameTOCItemIsExpanded)) {
+                classList.remove(cssClassNameTOCItemIsExpanded)
             }
         }
     }

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 @@
-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)}();
+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)}();