npm - @wulechuan/css-stylus-markdown-themes - Versions diffs - 7.7.0 → 7.8.0 - Mend

@wulechuan/css-stylus-markdown-themes 7.7.0 → 7.8.0

Files changed (33) hide show

package/ReadMe.md CHANGED Viewed

@@ -353,7 +353,7 @@ declare type 范_吴乐川用于美化文章的层叠样式表集_拾取默认Ja
 ```
-#### 重大变更记录
+## 重大变更记录
 - 2022 年 4 月 27 日，本工具之版本从 `v7.4.2` 升迁至 `v7.5.0` 时， JavaScript 代码没有任何变动。**但针对 TypeScript 的类型定义全部更名。** 由原来的以“`类型定义之`”开头，统一变更为以“`范_`”开头。故而有此版本变动。
@@ -387,7 +387,7 @@ declare type 范_吴乐川用于美化文章的层叠样式表集_拾取默认Ja
 1.  旧版代码不复存在。
 2.  当前的范文截图常常与代码所能产出之真正面貌有所差异，因为范文更新进度多半时候落后于代码，也落后于 NPM 版本发布。
-    > 最末发布的截图系针对本工具之 `v7.6.0` 版，各图均制作于 2022 年 5 月 1 日。
+    > 最末发布的截图系针对本工具之 `v7.8.0` 版，各图均制作于 2022 年 5 月 8 日。
     >
     > 但若再有新图发布替换旧图，亦可因为本人遗漏对此文之修订而令上述版本、发布日期均不实。

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@wulechuan/css-stylus-markdown-themes",
-  "version": "7.7.0",
+  "version": "7.8.0",
   "author": "吴乐川 <wulechuan@live.com>",
   "license": "WTFPL",
   "description": "此为吴乐川的《HTML 文章排版与配色之方案集与相关制作工具》。本工具可用于构建一组层叠样式表（即 CSS ）文件。本工具亦提供了一组现成的层叠样式表文件。凡这些样式表，均可用于美化超文本标记语言（即 HTML）格式的文章。于单一文章，不必同时取用多个样式表文件，仅取其一足矣。",
@@ -40,13 +40,13 @@
     "globby": "^11.1.0"
   },
   "devDependencies": {
-    "@wulechuan/cli-scripts--git-push": "^2.0.3",
-    "@wulechuan/generate-html-via-markdown": "^3.2.3",
+    "@wulechuan/cli-scripts--git-push": "^2.0.4",
+    "@wulechuan/generate-html-via-markdown": "^3.2.4",
     "@wulechuan/gulp-classical-task-cycle": "^0.3.0",
     "chalk": "^4.1.2",
     "cssnano": "^5.1.7",
     "del": "^6.0.0",
-    "eslint": "^8.14.0",
+    "eslint": "^8.15.0",
     "esm": "^3.2.25",
     "fs-extra": "^10.1.0",
     "gulp": "^4.0.2",

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 CHANGED Viewed

@@ -16,14 +16,14 @@ A link to a section of the page itselfs should look a bit different from a link
 See some lists below:
-- Reprehenderit aute ea pariatur tempor labore. Ullamco do incididunt sint velit duis ipsum irure amet voluptate. Cupidatat et do occaecat `nulla`. Nulla voluptate enim aute `magna do` non nisi qui qui et et irure. Dolore mollit dolore adipisicing consectetur sit. Aliquip fugiat Lorem in sunt Lorem aliqua ex in sunt.
+- Reprehenderit aute ea pariatur tempor labore. Ullamco do incididunt sint velit duis ipsum irure amet voluptate. Cupidatat et do occaecat `nulla`. Nulla voluptate enim aute **emphasized texts _italic phrase_ nisi qui qui et et irure. Dolore mollit dolore adipisicing consectetur sit.** Aliquip fugiat Lorem in sunt Lorem aliqua ex in sunt.
-    Nisi minim nulla elit non ut labore **aliquip et deserunt** culpa. Sint amet est laborum eu irure voluptate. In id et proident nulla pariatur ex cupidatat labore aliqua.
+    Nisi minim nulla elit non ut labore **aliquip et deserunt** culpa. Sint amet est laborum eu irure voluptate. In id et proident nulla pariatur ex cupi-datat labore aliqua.
-- Non adipisicing consectetur laborum quis anim ea consequat.
+- Non adipisicing consectetur [`SOFTIMAGE.com`](https://www.softimage.com/) quis anim ea consequat.
     - Aliqua excepteur nostrud ad `ullamco` minim commodo esse
-    - elit elit ea nulla.
+    - elit ~~[a linkage that simply does not exist](https://www.1.2.3.4.org/)~~ nulla.
     - Sint est elit sint minim.
 - Sunt ex eiusmod reprehenderit ullamco _fugiat_ ex duis cupidatat velit. Cillum commodo mollit dolore occaecat. Nulla Lorem deserunt minim ea nostrud reprehenderit do qui anim duis dolor.

@@ -158,21 +158,21 @@
 6.  第 1 级第 6 项。“`81192`，收到请返航。”
-### 多级标题（这是 h3）
+### 多级标题（这是 &lt;h3&gt;）
-#### 电影《哪吒之魔童降世》的剧情简介（这是 h4）
+#### 动画片《九色鹿》（这是 &lt;h4&gt;）
-天地灵气孕育出一颗能量巨大的混元珠，元始天尊将混元珠提炼成灵珠和魔丸，灵珠投胎为人，助周伐纣时可堪大用；而魔丸则会诞出魔王，为祸人间。元始天尊启动了天劫咒语，3 年后天雷将会降临，摧毁魔丸。太乙受命将灵珠托生于陈塘关李靖家的儿子哪吒身上。然而阴差阳错，灵珠和魔丸竟然被掉包。本应是灵珠英雄的哪吒却成了混世大魔王。调皮捣蛋顽劣不堪的哪吒却徒有一颗做英雄的心。然而面对众人对魔丸的误解和即将来临的天雷的降临，哪吒是否命中注定会立地成魔？他将何去何从？
+《九色鹿》是根据敦煌壁画《鹿王本生》故事改编，由中国上海美术电影制片厂 1981 年出品的动画美术作品。由钱家骏、戴铁郎担任导演，潘絜兹任编剧。该片采用敦煌壁画的形式，用中国古代佛教绘画的风格讲述了九色鹿经常帮助遇到困难的人，在帮助过弄蛇人后，弄蛇人向国王告密出卖九色鹿，九色鹿用神力化险，弄蛇人受到应有报应的故事。
-#### Web API 可以分为很多类（这是 h4）
+#### Web API 可以分为很多类（这是 &lt;h4&gt;）
-##### 文档对象模型（这是 h5）
+##### 假如某标题非常长，则该标题可能折行，即占据多行，尤其是在窄小的浏览器窗口中（这是 &lt;h5&gt;）
 文档对象模型（DOM）将 web 页面与到脚本或编程语言连接起来。通常是指  JavaScript，但将 HTML、SVG 或 XML 文档建模为对象并不是 JavaScript 语言的一部分。DOM 模型用一个逻辑树来表示一个文档，树的每个分支的终点都是一个节点（node），每个节点都包含着对象（object）。DOM 的方法（method）让你可以用特定方式操作这个树，用这些方法你可以改变文档的结构、样式或者内容。节点可以关联上事件处理器，一旦某一事件被触发了，那些事件处理器就会被执行。<sup>[1]</sup>
-##### 层叠样式表对象模型（这是 h5）
+##### 层叠样式表对象模型（这是 &lt;h5&gt;）
 CSS Object Model 是一组允许用 JavaScript 操纵 CSS 的 API。 它是继 DOM 和 HTML API 之后，又一个操纵 CSS 的接口，使得我们能够动态地读取和修改 CSS 样式。<sup>[2]</sup>

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 CHANGED Viewed

@@ -17,7 +17,7 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
     const printDoubleLine = '='.repeat(fullWidth)
     const emailAddress = 'wulechuan@live.com'
-    const timeStamp = '北京时间 2022-05-06'
+    const timeStamp = '北京时间 2022-05-08'
     const welcomeZhHansCN = '欢迎使用吴乐川设计的用于“控制文章目录之交互”的控制器。'
     const welcomeEn = 'Welcome to wulechuan\'s article TOC controller.'
@@ -336,3 +336,28 @@ window.atBeginingShouldExpandTOCWhenWindowIsWideEnough = false
         }
     }
 })()
+;(function () {
+    const allH1ToH6Elements = Array.from(
+        document.querySelectorAll('h1, h2, h3, h4, h5, h6')
+    )
+    allH1ToH6Elements.forEach(hElement => {
+        const headeLinkAnchor = hElement.querySelector('.header-anchor')
+        if (headeLinkAnchor) {
+            const firstTextElement = headeLinkAnchor.nextSibling
+            // console.debug(`${hElement.tagName} "${firstTextElement.nodeValue}"`)
+            const firstTextElementContent = firstTextElement.nodeValue
+            if (/^ /.test(firstTextElementContent)) {
+                const singleSpacebar = document.createElement('span')
+                singleSpacebar.className = 'hidden-spacebar-between-head-linkage-and-head-text'
+                singleSpacebar.innerText = ' '
+                hElement.insertBefore(singleSpacebar, firstTextElement)
+                firstTextElement.nodeValue = firstTextElementContent.slice(1)
+            }
+        }
+    })
+})()

	@@ -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"],n=e.reduce(((e,n)=>Math.max(e,n.length)),0)+0,t=Math.floor(n/2)+6,o="-".repeat(n),l="=".repeat(n),s="wulechuan@live.com",i="北京时间 2022-05-06",c=[];"中国人——特别是汉族人，理应坚持广泛、规范地使用汉语。凡非必要之情形不说外国话、不用外国字。此乃天经地义！\n然则每当必要，亦不排斥采用外国之语言。不妨博世界之学问，养中国之精神。\n本人亦支持少数民族坚持采用自己民族的传统语言。仍须强调，凡中国人，皆应会用汉语、积极使用汉语，此乃中华各民族之大一统之必由。".split("\n").forEach((e=>{c.push(""),c.push(" "+e.slice(0,t-4));let n=e.slice(t-4);for(;n.length>0;){const e=n.match(/^(，\|。\|！\|，”\|。”\|！”\| 》，\|》。\| 》！\| 》，”\| 》。”\| 》！”)/);if(e){const t=e[1],o=c[c.length-1];c[c.length-1]=o+t,n=n.slice(t.length)}const o=n.slice(0,t);o&&c.push(o),n=n.slice(o.length)}})),console.log(`\n${l}\n\n%c欢迎使用吴乐川设计的用于“控制文章目录之交互”的控制器。%c\n（ Welcome to wulechuan's article TOC controller. ）\n\n${" ".repeat(n-s.length)}${s}\n${" ".repeat(n-i.length-3)}${i}\n\n${o}\n\n${e.join("\n")}\n\n${o}\n${c.join("\n")}\n\n${l}\n\n\n`,["font-family: sans-serif;","font-size: 1.25em;","display: inline-block;","vertical-align: baseline;","color: #000;","text-shadow: 0.5px 0.5px 2px rgba(0, 0, 0, 0.51);","background-color: #ffe0be;","border-radius: 3px;","margin: 0.5em 0;","padding: 0.5em 1em 0.5em 1.5em;"].join(""),null);const a="has-nested-toc-list",r="is-collapsed",d="is-expanded",u="markdown-article-toc-toggling-button",h=1e3,m=document.querySelector(".markdown-article");if(!m)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(!O())return;k(!1)}),m.onclick=function(){if(!(window.innerWidth<=h))return;k(!1)};const w=document.body,g=w,y=w;let v;y.classList.add("markdown-article-toc-exists"),function e(n,t){const o=n.querySelector("ol, ul");if(!o)return;t\|\|(t=1);o.classList.add(`toc-list-level-${t}`);Array.prototype.slice.apply(o.children).filter((e=>"li"===e.tagName.toLowerCase())).forEach((n=>{n.tocLevelId=t,n.classList.add(`toc-list-level-${t}-item`),e(n,t+1)}))}(p),function(){let e;if(Array.prototype.slice.apply(p.querySelectorAll("li")).forEach((e=>{if(e.querySelectorAll("li").length>0){const n=e.querySelector("a");e.classList.add(a),e.hasNestedList=!0,e.isCollapsible=!1,e.selfAnchor=n,e.onclick=b}})),window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost){const n=p.querySelector("ol, ul").children;e=n}else e=p.querySelectorAll("li.has-nested-toc-list");Array.prototype.slice.apply(e).forEach((e=>{e.isCollapsible=!0;C(e,e.tocLevelId<=window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan)}))}(),function(){let e=document.querySelector(`.${u}`);e\|\|(e=document.createElement("button"),e.className=u,g===w?g.insertBefore(e,document.scripts[0]):g.appendChild(e));null===e.onclick&&(e.onclick=S)}();let L="";function S(){k(!v)}function k(e){y.classList.toggle("markdown-article-toc-is-visible",e),v=e}function O(){return window.innerWidth<=600}function b(e){e.stopPropagation();const{srcElement:n}=e,t=this,{selfAnchor:o}=t;if(n!==t&&n!==o)return;const l=o.href;let s="";l.match(/#/)&&(s=`#${l.split("#").pop()}`);const i=!!s&&L!==s;L=s;let c=t.isCollapsible;if(O()&&(c=!1),c){const{classList:e}=t;C(t,e.contains(r)\|\|i)}}function C(e,n){const{classList:t}=e;n?(t.contains(d)\|\|t.add(d),t.contains(r)&&t.remove(r)):(t.contains(r)\|\|t.add(r),t.contains(d)&&t.remove(d))}k(window.atBeginingShouldExpandTOCWhenWindowIsWideEnough&&window.innerWidth>=h)}();
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"],n=e.reduce(((e,n)=>Math.max(e,n.length)),0)+0,t=Math.floor(n/2)+6,o="-".repeat(n),l="=".repeat(n),s="wulechuan@live.com",i="北京时间 2022-05-08",c=[];"中国人——特别是汉族人，理应坚持广泛、规范地使用汉语。凡非必要之情形不说外国话、不用外国字。此乃天经地义！\n然则每当必要，亦不排斥采用外国之语言。不妨博世界之学问，养中国之精神。\n本人亦支持少数民族坚持采用自己民族的传统语言。仍须强调，凡中国人，皆应会用汉语、积极使用汉语，此乃中华各民族之大一统之必由。".split("\n").forEach((e=>{c.push(""),c.push(" "+e.slice(0,t-4));let n=e.slice(t-4);for(;n.length>0;){const e=n.match(/^(，\|。\|！\|，”\|。”\|！”\| 》，\|》。\| 》！\| 》，”\| 》。”\| 》！”)/);if(e){const t=e[1],o=c[c.length-1];c[c.length-1]=o+t,n=n.slice(t.length)}const o=n.slice(0,t);o&&c.push(o),n=n.slice(o.length)}})),console.log(`\n${l}\n\n%c欢迎使用吴乐川设计的用于“控制文章目录之交互”的控制器。%c\n（ Welcome to wulechuan's article TOC controller. ）\n\n${" ".repeat(n-s.length)}${s}\n${" ".repeat(n-i.length-3)}${i}\n\n${o}\n\n${e.join("\n")}\n\n${o}\n${c.join("\n")}\n\n${l}\n\n\n`,["font-family: sans-serif;","font-size: 1.25em;","display: inline-block;","vertical-align: baseline;","color: #000;","text-shadow: 0.5px 0.5px 2px rgba(0, 0, 0, 0.51);","background-color: #ffe0be;","border-radius: 3px;","margin: 0.5em 0;","padding: 0.5em 1em 0.5em 1.5em;"].join(""),null);const a="has-nested-toc-list",r="is-collapsed",d="is-expanded",h="markdown-article-toc-toggling-button",u=1e3,m=document.querySelector(".markdown-article");if(!m)return;const f=document.querySelector("nav.markdown-article-toc");if(!f)return;f.classList.toggle("should-show-2-levels-at-most",window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost);const p=document.querySelector(".markdown-article-back-to-top");p&&(p.onclick=function(){if(!L())return;k(!1)}),m.onclick=function(){if(!(window.innerWidth<=u))return;k(!1)};const w=document.body,g=w,y=w;let S;y.classList.add("markdown-article-toc-exists"),function e(n,t){const o=n.querySelector("ol, ul");if(!o)return;t\|\|(t=1);o.classList.add(`toc-list-level-${t}`);Array.prototype.slice.apply(o.children).filter((e=>"li"===e.tagName.toLowerCase())).forEach((n=>{n.tocLevelId=t,n.classList.add(`toc-list-level-${t}-item`),e(n,t+1)}))}(f),function(){let e;if(Array.prototype.slice.apply(f.querySelectorAll("li")).forEach((e=>{if(e.querySelectorAll("li").length>0){const n=e.querySelector("a");e.classList.add(a),e.hasNestedList=!0,e.isCollapsible=!1,e.selfAnchor=n,e.onclick=O}})),window.shouldShowOnlyTwoLevelsOfTOCItemsAtMost){const n=f.querySelector("ol, ul").children;e=n}else e=f.querySelectorAll("li.has-nested-toc-list");Array.prototype.slice.apply(e).forEach((e=>{e.isCollapsible=!0;A(e,e.tocLevelId<=window.atBeginingShouldCollapseAllTOCItemsOfLevelsGreaterThan)}))}(),function(){let e=document.querySelector(`.${h}`);e\|\|(e=document.createElement("button"),e.className=h,g===w?g.insertBefore(e,document.scripts[0]):g.appendChild(e));null===e.onclick&&(e.onclick=v)}();let b="";function v(){k(!S)}function k(e){y.classList.toggle("markdown-article-toc-is-visible",e),S=e}function L(){return window.innerWidth<=600}function O(e){e.stopPropagation();const{srcElement:n}=e,t=this,{selfAnchor:o}=t;if(n!==t&&n!==o)return;const l=o.href;let s="";l.match(/#/)&&(s=`#${l.split("#").pop()}`);const i=!!s&&b!==s;b=s;let c=t.isCollapsible;if(L()&&(c=!1),c){const{classList:e}=t;A(t,e.contains(r)\|\|i)}}function A(e,n){const{classList:t}=e;n?(t.contains(d)\|\|t.add(d),t.contains(r)&&t.remove(r)):(t.contains(r)\|\|t.add(r),t.contains(d)&&t.remove(d))}k(window.atBeginingShouldExpandTOCWhenWindowIsWideEnough&&window.innerWidth>=u)}(),Array.from(document.querySelectorAll("h1, h2, h3, h4, h5, h6")).forEach((e=>{const n=e.querySelector(".header-anchor");if(n){const t=n.nextSibling,o=t.nodeValue;if(/^ /.test(o)){const n=document.createElement("span");n.className="hidden-spacebar-between-head-linkage-and-head-text",n.innerText=" ",e.insertBefore(n,t),t.nodeValue=o.slice(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--firefox-addon.default.css CHANGED Viewed

@@ -14,7 +14,7 @@
  *
  *                                          吾乃南昌吴乐川是也
  *                                          wulechuan@live.com
- *                                                  2022-05-06
+ *                                                  2022-05-08
  *
  *
  *
@@ -454,12 +454,12 @@ blockquote {
   display: inline-block;
   vertical-align: top;
   border-style: solid;
-  padding: 1px 1.25em 1px 1.15em;
+  padding: 1px 1.25em 1px 1.1em;
   margin-top: 0;
   margin-bottom: 1.5em;
-  margin-left: 3em;
+  margin-left: 2.5em;
   margin-right: 1em;
-  max-width: calc(100% - 4em);
+  max-width: calc(100% - 3.5em);
 }
 details {
   margin: 0.5em 1.5em 1.5em;
@@ -540,6 +540,15 @@ kbd {
   font-size: 80%;
   letter-spacing: 0;
 }
+pre {
+  display: block;
+  box-sizing: border-box;
+  padding: 0 5em 0 0;
+  margin: 0.5em 2em 2em;
+  max-height: 75vh;
+  overflow: auto;
+  white-space: nowrap;
+}
 pre,
 pre > code {
   letter-spacing: 0;
@@ -550,24 +559,23 @@ pre > code {
   position: static;
   top: auto;
   cursor: auto;
+  line-height: 1.6;
 }
 pre > code {
+  display: inline-block;
   box-sizing: border-box;
-  display: block;
-  width: 100%;
-  line-height: inherit;
-  padding: 0.25em 0.5em;
   border: none !important;
-  margin: 0 !important;
   border-radius: 0;
-  overflow-x: auto;
 }
-pre {
-  line-height: 1.6;
-  display: block;
-  box-sizing: border-box;
-  padding: 0.5em;
-  margin: 0.5em 2em 2em;
+pre > code,
+[lang*="zh-" i] pre > code,
+[lang*="-hans" i] pre > code,
+[lang*="-CN" i] pre > code,
+[lang*="zh-"] pre > code,
+[lang*="-hans"] pre > code,
+[lang*="-CN"] pre > code {
+  padding: 0.5em 1em;
+  margin: 0 !important;
 }
 td > pre,
 li > pre {
@@ -576,6 +584,7 @@ li > pre {
 }
 td > pre {
   margin-right: 0;
+  padding-right: 0;
 }
 li > pre:first-child {
   margin-top: 0;
@@ -706,16 +715,24 @@ hr::after {
   background-image: inherit !important;
   transform: scaleX(-1);
 }
+@media (max-width: 900px) {
+  pre {
+    margin-left: 0;
+    margin-right: 0;
+  }
+  table,
+  pre {
+    max-width: 100%;
+  }
+}
 @media (max-width: 600px) {
   h1,
   h2,
-  h3 {
-    padding-left: 1em;
-  }
+  h3,
   h4,
   h5,
   h6 {
-    padding-left: 0.8em;
+    padding-left: 1.25em;
   }
   h1 {
     font-size: 2.25em;
@@ -742,8 +759,8 @@ hr::after {
     padding-right: 0;
   }
   p {
-    margin-left: 0;
-    margin-right: 0;
+    margin-left: 0.25em;
+    margin-right: 0.25em;
   }
   blockquote {
     margin-left: 0;
@@ -757,8 +774,7 @@ hr::after {
     margin-right: 0;
   }
   table {
-    max-width: none;
-    width: 100%;
+    max-width: 100%;
   }
   td {
     max-width: 400px;
@@ -820,12 +836,18 @@ hr::after {
 [lang*="-CN"] .centered {
   text-indent: 0;
 }
+.hidden-spacebar-between-head-linkage-and-head-text {
+  display: none;
+}
 .header-anchor,
 a.header-anchor {
-  margin: -0.2em -0.15em 0em -1.35em;
-  padding: 0.25em 0;
-  width: 1.5em;
+  margin-top: -0.2em;
+  margin-bottom: 0em;
+  margin-left: -1.65em;
+  margin-right: 0.15em;
   box-sizing: border-box;
+  padding: 0.25em 0;
+  min-width: 1.5em;
   text-align: center;
   font-weight: normal;
   border-radius: 0.25em;
@@ -856,6 +878,12 @@ td > h1 .header-anchor {
   display: none;
 }
 @media (max-width: 900px) {
+  .header-anchor,
+  a.header-anchor {
+    margin-left: -1.35em;
+    margin-right: 0.15em;
+    min-width: 1.2em;
+  }
   .markdownRoot {
     padding-top: 3em;
     padding-bottom: 7em;
@@ -867,17 +895,17 @@ td > h1 .header-anchor {
   }
 }
 @media (max-width: 600px) {
+  .header-anchor,
+  a.header-anchor {
+    margin-left: -1.2em;
+    margin-right: 0.2em;
+    min-width: 1em;
+  }
   .markdown-article-toc-is-visible .markdownRoot,
   .markdownRoot {
     padding-left: 1.5em;
     padding-right: 1.5em;
   }
-  .header-anchor,
-  a.header-anchor {
-    margin-left: -1.2em;
-    margin-right: -0.2em;
-    width: 1em;
-  }
 }
 input#__markdown-viewer__show-tools:not(:checked)~.toggleable {
   max-height: 0;
@@ -3335,4 +3363,7 @@ pre,
   h3 {
     page-break-after: avoid;
   }
+  .hidden-spacebar-between-head-linkage-and-head-text {
+    display: inline;
+  }
 }

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--typora.default.css CHANGED Viewed

@@ -14,7 +14,7 @@
  *
  *                                          吾乃南昌吴乐川是也
  *                                          wulechuan@live.com
- *                                                  2022-05-06
+ *                                                  2022-05-08
  *
  *
  *
@@ -449,12 +449,12 @@ blockquote {
   display: inline-block;
   vertical-align: top;
   border-style: solid;
-  padding: 1px 1.25em 1px 1.15em;
+  padding: 1px 1.25em 1px 1.1em;
   margin-top: 0;
   margin-bottom: 1.5em;
-  margin-left: 3em;
+  margin-left: 2.5em;
   margin-right: 1em;
-  max-width: calc(100% - 4em);
+  max-width: calc(100% - 3.5em);
 }
 details {
   margin: 0.5em 1.5em 1.5em;
@@ -535,6 +535,15 @@ kbd {
   font-size: 80%;
   letter-spacing: 0;
 }
+pre {
+  display: block;
+  box-sizing: border-box;
+  padding: 0 5em 0 0;
+  margin: 0.5em 2em 2em;
+  max-height: 75vh;
+  overflow: auto;
+  white-space: nowrap;
+}
 pre,
 pre > code {
   letter-spacing: 0;
@@ -545,24 +554,23 @@ pre > code {
   position: static;
   top: auto;
   cursor: auto;
+  line-height: 1.6;
 }
 pre > code {
+  display: inline-block;
   box-sizing: border-box;
-  display: block;
-  width: 100%;
-  line-height: inherit;
-  padding: 0.25em 0.5em;
   border: none !important;
-  margin: 0 !important;
   border-radius: 0;
-  overflow-x: auto;
 }
-pre {
-  line-height: 1.6;
-  display: block;
-  box-sizing: border-box;
-  padding: 0.5em;
-  margin: 0.5em 2em 2em;
+pre > code,
+[lang*="zh-" i] pre > code,
+[lang*="-hans" i] pre > code,
+[lang*="-CN" i] pre > code,
+[lang*="zh-"] pre > code,
+[lang*="-hans"] pre > code,
+[lang*="-CN"] pre > code {
+  padding: 0.5em 1em;
+  margin: 0 !important;
 }
 td > pre,
 li > pre {
@@ -571,6 +579,7 @@ li > pre {
 }
 td > pre {
   margin-right: 0;
+  padding-right: 0;
 }
 li > pre:first-child {
   margin-top: 0;
@@ -701,16 +710,24 @@ hr::after {
   background-image: inherit !important;
   transform: scaleX(-1);
 }
+@media (max-width: 900px) {
+  pre {
+    margin-left: 0;
+    margin-right: 0;
+  }
+  table,
+  pre {
+    max-width: 100%;
+  }
+}
 @media (max-width: 600px) {
   h1,
   h2,
-  h3 {
-    padding-left: 1em;
-  }
+  h3,
   h4,
   h5,
   h6 {
-    padding-left: 0.8em;
+    padding-left: 1.25em;
   }
   h1 {
     font-size: 2.25em;
@@ -737,8 +754,8 @@ hr::after {
     padding-right: 0;
   }
   p {
-    margin-left: 0;
-    margin-right: 0;
+    margin-left: 0.25em;
+    margin-right: 0.25em;
   }
   blockquote {
     margin-left: 0;
@@ -752,8 +769,7 @@ hr::after {
     margin-right: 0;
   }
   table {
-    max-width: none;
-    width: 100%;
+    max-width: 100%;
   }
   td {
     max-width: 400px;
@@ -815,12 +831,18 @@ hr::after {
 [lang*="-CN"] .centered {
   text-indent: 0;
 }
+.hidden-spacebar-between-head-linkage-and-head-text {
+  display: none;
+}
 .header-anchor,
 a.header-anchor {
-  margin: -0.2em -0.15em 0em -1.35em;
-  padding: 0.25em 0;
-  width: 1.5em;
+  margin-top: -0.2em;
+  margin-bottom: 0em;
+  margin-left: -1.65em;
+  margin-right: 0.15em;
   box-sizing: border-box;
+  padding: 0.25em 0;
+  min-width: 1.5em;
   text-align: center;
   font-weight: normal;
   border-radius: 0.25em;
@@ -851,6 +873,12 @@ td > h1 .header-anchor {
   display: none;
 }
 @media (max-width: 900px) {
+  .header-anchor,
+  a.header-anchor {
+    margin-left: -1.35em;
+    margin-right: 0.15em;
+    min-width: 1.2em;
+  }
   .typora-node   #write {
     padding-top: 3em;
     padding-bottom: 7em;
@@ -862,17 +890,17 @@ td > h1 .header-anchor {
   }
 }
 @media (max-width: 600px) {
+  .header-anchor,
+  a.header-anchor {
+    margin-left: -1.2em;
+    margin-right: 0.2em;
+    min-width: 1em;
+  }
   .markdown-article-toc-is-visible .typora-node   #write,
   .typora-node   #write {
     padding-left: 1.5em;
     padding-right: 1.5em;
   }
-  .header-anchor,
-  a.header-anchor {
-    margin-left: -1.2em;
-    margin-right: -0.2em;
-    width: 1em;
-  }
 }
 pre.CodeMirror-line {
   display: block;
@@ -3095,4 +3123,7 @@ tbody tr:nth-child(even) {
   h3 {
     page-break-after: avoid;
   }
+  .hidden-spacebar-between-head-linkage-and-head-text {
+    display: inline;
+  }
 }