v0.3.0: fix piled issues and add some new feature

resources/sample-chinese.md

@@ -47,7 +47,7 @@ description: 这个 block 块是 YAML front matters
 2.   有序列表项2
     +   无序列表项1
     +   无序列表项2. 
-        *   [x] 表示已完成。 ***==(请尽量不要使用此功能，因为它的对齐效果不佳)==***
+        *   [x] 表示已完成。
         *   [ ] 表示未完成。
 
 *   项目1 

src/scss/blockquote.scss

@@ -1,12 +1,28 @@
-/* basic 样式采用一般的引言，具有左边框、左缩进 */
+/* 一个>的引言仅为两字符缩进，使用>>的引言为传统引言样式，具有左竖线、左缩进 */
+
 blockquote {
   font-style: normal;
-  font-family: var(--quote-font), var(--base-Latin-font),
-    var(--base-Chinese-font), -apple-system, serif;
+  font-family: var(--quote-font), var(--base-Latin-font), var(--base-Chinese-font), -apple-system, serif;
   font-size: var(--quote-font-size);
   /* 文字离左边框的距离 */
-  padding-left: 16px;
-  padding-right: 20pt;
+  padding-left: 2em;
+  padding-right: 2em;
   /* 左边框离页面边的距离 */
-  margin-left: 20px;
+  margin-left: 0;
 }
+
+blockquote p:first-child {
+  padding-top: 1ch;
+}
+
+blockquote p:last-child {
+  padding-bottom: 1ch;
+}
+
+blockquote blockquote {
+  border-left: 4px solid hsl(0, 0%, 70%);
+  padding-left: calc(2ch - 4px);
+  padding-right: 0;
+  margin-left: -4px;
+  border-radius: 0;
+}

src/scss/code.scss

@@ -26,3 +26,16 @@ li code {
   /* 圆角 */
   border-radius: 2px 2px 2px 2px;
 }
+
+/* 代码块样式 */
+.md-fences,
+.CodeMirror pre {
+  font-size: 1em;
+}
+.CodeMirror-wrap {
+  /* padding: 10px; */ // FIXME 当代码太长跨页的时候好像也会有点问题
+  font-size: 1em;
+}
+.CodeMirror-code pre {
+  font-family: var(--code-font), var(--ui-font), monospace;
+}

src/scss/footnote.scss

@@ -1,9 +1,10 @@
-// 参考文献块
+/* 参考文献（脚注）块 */
+.footnotes {
+  font-size: 0.95em;
+}
 .footnotes-area {
   .footnote-line {
-    // 把参考资料块的文字大小和文字颜色与正文统一
     color: var(--text-color);
-    font-size: var(--base-font-size);
   }
 
   // 默认情况下，Typora 会给参考文献块顶部加一条横线，这里把它隐藏掉

src/scss/heading.scss

@@ -49,15 +49,6 @@
     line-height: var(--h5-font-size);
   }
 
-  // 代码块样式
-  .CodeMirror-wrap {
-    padding: 10px; // FIXME 当代码太长跨页的时候好像也会有点问题
-  }
-
-  .CodeMirror-code pre {
-    font-family: var(--code-font), var(--ui-font), monospace;
-  }
-
   // 下面是标题自动编号，初始化计数器。使用多级编号，编号后加空格模仿LaTeX
   // 首先全局进行一次reset，这样即使不添加h1标题也可以使用较低级别的标题
   counter-reset: h2 0 h3 0 h4 0 h5 0 h6 0;
@@ -115,30 +106,30 @@ h6.md-focus.md-heading:before {
 %h2-with-count {
   counter-increment: h2;
   content: counter(h2);
-  margin-right: 2rem;
+  margin-right: 1.2em;
 }
 
 %h3-with-count {
   counter-increment: h3;
   content: counter(h2) "." counter(h3);
-  margin-right: 2rem;
+  margin-right: 1.2em;
 }
 
 %h4-with-count {
   counter-increment: h4;
   content: counter(h2) "." counter(h3) "." counter(h4);
-  margin-right: 2rem;
+  margin-right: 1.2em;
 }
 
 %h5-with-count {
   counter-increment: h5;
   content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5);
-  margin-right: 2rem;
+  margin-right: 1.2em;
 }
 
 %h6-with-count {
   counter-increment: h6;
   content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "."
     counter(h6);
-  margin-right: 2rem;
+  margin-right: 1.2em;
 }

src/scss/list.scss

@@ -1,62 +1,51 @@
+/* 无序列表 */
 ul {
-  /* 无序列表第一级：实心圆点 */
   list-style: disc;
   ul {
     /*list-style: circle;*/
     /* 请勿删除“–”后的空格, 他们对缩进有一定影响, 下同 */
     //FIXME 如果您可以改成没有空格，而仅用缩进控制的样式会更好
-    list-style: "–　 ";
-    /*left: -0.8rem;*/
+    list-style: "–   ";
     ul {
-      /* 无序列表第三极：小圈 */
-      list-style: "◦　";
-      left: 0.1rem;
+      list-style: "◦  ";
     }
   }
 }
 
+/* 有序列表 */
 ol {
-  /* 有序列表第一级：数字 */
   list-style: decimal;
-
   ol {
     counter-reset: liist;
     list-style: none;
-
     li {
       counter-increment: liist;
       position: relative;
     }
-
     li::before {
-      /* 有序列表第二级：括号加小写字母 */
-      content: "(" counter(liist, lower-alpha) ")　　";
+      content: "(" counter(liist, lower-alpha) ")";
       position: absolute;
-      margin-right: 2rem;
-      left: -2.4rem;
+      left: -1.8em;
     }
 
     ol {
       counter-reset: liiist;
       list-style: none;
       margin: 0;
-
       li {
         counter-increment: liiist;
         position: relative;
       }
-
       li::before {
-        /* 有序列表第三级：小写罗马数字 */
-        content: counter(liiist, lower-roman) ".　　";
+        content: counter(liiist, lower-roman) ".";
         align-self: flex-end;
         position: absolute;
-        left: -3rem;
+        left: -4.5em;
         /* -moz-box-sizing: border-box;
           -webkit-box-sizing: border-box;
           box-sizing: border-box;*/
         /* 为了让项目编号是重新用句点对齐而不是左对齐 */
-        width: 4.2rem;
+        width: 4em;
         text-align: right;
       }
     }
@@ -66,3 +55,14 @@ ol {
 li {
   position: relative;
 }
+ol, ul {
+  padding-inline-start: 2em;
+}
+
+/* task列表 */
+.md-task-list-item>input{
+  margin-top: 0.42em;
+  margin-left: -1.5em;
+  width: 1em !important;
+  height: 1em !important;
+}

src/scss/settings.scss

@@ -24,14 +24,17 @@
   /* 基准字体 */
   /* 备选：Times, "Times New Roman" */
   --base-Latin-font: "Latin Modern Roman", "Latin Modern Roman 10";
-  --base-Chinese-font: "宋体-简", "华文宋体", "Noto Serif CJK SC";
+  --base-Chinese-font: "家族宋", "宋体-简", "华文宋体", "Noto Serif CJK SC";
   --base-font-size: 9.5pt;
 
   /* 引言字体 */
   --quote-font: "Latin Modern Roman", "Latin Modern Roman 10", Times,
     "Times New Roman", "华文仿宋";
-  /* 这里字体用了10pt,比正文字体稍大 */
-  --quote-font-size: 10pt;
+  /* em单位为一个正文字符（--base-font-size）大小，
+  例如，如果您设置 --base-font-size 为 9.5pt，那么 1.05em = 1.05*9.5pt ≈ 10pt。下面的标题字体等设置也遵循该规则。
+  这样，您就可以仅通过调整基准字体大小，而动态对其他元素大小做出调整。
+  当然，您也可以直接设置以pt或px为单位的数值，将元素的大小固定下来，如 --quote-font-size: 10pt; */
+  --quote-font-size: 1.05em;
 
   /* 代码字体（代码中的中文会调用 ui-font） */
   --code-font: "Latin Modern Mono", "Latin Modern Mono 10", "Courier New";
@@ -55,6 +58,9 @@
   /* 默认调用 base-font */
   --table-font: "";
 
+    /* 公式字体 */
+  --math-font-size: 1em;
+
   /* 标题字体（总设置） */
   @if $os == "macos" {
     /* 注意，如果您使用macOS系统并更改了英文字体，请在此处更换标题英文字体粗体字重的postscript值 */
@@ -71,33 +77,35 @@
   /* 标题字体分别设置 */
   /* 大标题（h1）字体 */
   --title-Chinese-font: "#{$heading-Chinese-font}";
-  --title-font-size: 18pt;
+  --title-font-size: 1.9em;
   /* h2字体 */
   --h2-Chinese-font: "#{$chapter-Chinese-font}";
-  --h2-font-size: 14pt;
+  --h2-font-size: 1.5em;
   /* h3字体 */
   --h3-Chinese-font: "#{$chapter-Chinese-font}";
-  --h3-font-size: 12pt;
+  --h3-font-size: 1.25em;
   /* h4字体 */
   --h4-Chinese-font: "#{$sub-chapter-Chinese-font}";
-  --h4-font-size: 10pt;
+  --h4-font-size: 1.15em;
   /* h5字体 */
   --h5-Chinese-font: "#{$sub-sub-chapter-Chinese-font}";
-  --h5-font-size: 10pt;
+  --h5-font-size: 1.10em;
   /* h6字体 */
   --h6-Chinese-font: "#{$sub-sub-chapter-Chinese-font}";
-  --h6-font-size: 9.5pt;
+  --h6-font-size: 1.05em;
 
   /* 粗体样式设置 */
   /* 加粗风格时使用的字重；400等同于 normal，700等同于 bold，900等同于 heavy */
   --strong-weight: 900;
 
   /* 基础行距 */
-  --base-line-height: 16pt;
+  --base-line-height: 1.618em;
 
   /* == 页面设置 == */
   /* 打印页边距 */
   --set-margin: 1.8cm 2cm 1.2cm 2cm !important;
+  /* 页面放大倍率 */
+  --set-zoom: 1.13;
 
   /* == 控制设置 == */
   /* 目录中是否显示一级标题 */
@@ -124,7 +132,7 @@
     --text-color: #dcdcdc;
     --select-text-bg-color: #9ab1cf;
     --select-text-font-color: #161616;
-    --bg-color: hsl(0, 0%, 15%);
+    --bg-color: #1e1e1e;
     --mermaid-theme: night;
   }
 }

src/scss/text.scss

@@ -1,12 +1,11 @@
 body {
   padding: 0 !important;
   margin: 0 !important;
-  line-height: var(--base-line-height);
+  // line-height: var(--base-line-height);
   /* counter-reset: tableHead 0 imgHead 0; */
   @if $theme == "dark" {
     color: #dddddd;
     background-color: #282828;
-    // background:url(mermaidAPI.initialize({'fontFamily': '宋体-简, serif;'}););
   }
 }
 
@@ -35,8 +34,15 @@ body {
     display: inline-block; */
   /* 这里可以试分栏的，但确实不适合实现 */
 
+  .md-math-block,
+  .md-rawblock,
+  p {
+    margin-top: 1em;
+    margin-bottom: 1em;
+  }
   p {
     text-align: left;
+    line-height: var(--base-line-height);
   }
 
   // 超链接
@@ -51,12 +57,19 @@ body {
   }
 }
 
+// 公式
+.MathJax {
+  font-size: var(--math-font-size);
+}
+
 hr {
   @if $theme == "light" {
-    border-top: solid 0.7px #eee;
+    border-top: solid 1px #ddd;
   } @else if $theme == "dark" {
-    border-top: solid 0.7px #888888;
+    border-top: solid 1px #888888;
   }
+  margin-top: 1.8em;
+  margin-bottom: 1.8em;
 }
 
 img {