Merge pull request sivan#98 from xiaolai/letterspacing-for-different-…

…languages 中英文混排之时，中文字符之间有字间距，英文字符之间没有字间距。
Mu-L · Dec 19, 2022 · 98f61e5 · 98f61e5
2 parents 35c2634 + 9e6ac77
commit 98f61e5
Show file tree

Hide file tree

Showing 4 changed files with 47 additions and 3 deletions.
diff --git a/_site/heti-addon.js b/_site/heti-addon.js
@@ -767,13 +767,15 @@
 	  }
 
 	  autoSpacing () {
-	    document.addEventListener('DOMContentLoaded', () => {
+	    const callback = () => {
 	      const $$rootList = document.querySelectorAll(this.rootSelector);
 
 	      for (let $$root of $$rootList) {
 	        this.spacingElement($$root);
 	      }
-	    });
+	    };
+	    if (document.readyState === 'complete') setTimeout(callback);
+	    else document.addEventListener('DOMContentLoaded', callback);
 	  }
 	}
 

diff --git a/_site/heti.css b/_site/heti.css
@@ -131,7 +131,7 @@
   src: local("Source Han Sans KR Heavy"), local("Noto Sans CJK KR Heavy");
 }
 
-font-face {
+@font-face {
   font-family: "Heti Hei SC Black Fallback";
   font-weight: 800;
   src: local("Microsoft YaHei"), local("Droid Sans Fallback");
@@ -204,6 +204,7 @@ font-face {
   overflow-wrap: break-word;
   word-wrap: break-word;
   hyphens: auto;
+  letter-spacing: 0.02em;
 }
 
 .heti::before, .heti::after {
@@ -327,6 +328,22 @@ font-face {
   color: inherit;
 }
 
+.heti:not(:lang(zh)):not(:lang(ja)):not(:lang(kr)), .heti:not(:lang(zh)) {
+  letter-spacing: 0;
+}
+
+.heti a,
+.heti abbr,
+.heti code,
+.heti heti-spacing,
+.heti [lang="en-US"] {
+  /* 
+      There should be no leeter-spacing between
+      English characters.
+    */
+  letter-spacing: normal;
+}
+
 .heti h1,
 .heti h2,
 .heti h3,

diff --git a/lib/_base.scss b/lib/_base.scss
@@ -106,4 +106,23 @@
       }
     }
   }
+
+  // 非中文时不加间距
+  letter-spacing: $letter-spacing-medium;
+  @include non-cjk-block {
+  letter-spacing: $letter-spacing-normal;
+
+  }
+
+  a, 
+  abbr, 
+  code, 
+  heti-spacing, 
+  [lang="en-US"] {
+    /* 
+      There should be no leeter-spacing between
+      English characters.
+    */
+    letter-spacing: normal; 
+  }  
 }
diff --git a/lib/_variables.scss b/lib/_variables.scss
@@ -54,6 +54,12 @@ $line-height-expanded-ultra: 2.25 !default;
 //$line-height-condensed: 1.25 !default;
 //$line-height-condensed-ultra: 1 !default;
 
+// 字符间距
+$letter-spacing-normal: 0 !default;
+$letter-spacing-small: 0.01em !default;
+$letter-spacing-medium: 0.02em !default;
+$letter-spacing-large: 0.05em !default;
+
 $line-height-size-normal: $font-size-normal * $line-height-normal !default;
 $line-height-size-large: $line-height-size-normal !default;
 $line-height-size-x-large: $font-size-x-large * $line-height-normal !default;