docs: update style

Author: hanwenguo

typ/_template/template.typ

@@ -387,7 +387,6 @@
   show-metadata: true,
   expanded: true,
   disable-numbering: false,
-  level: 2,
   ..attrs,
 ) = {
   context counter("transclusion-depth").update(x => x + 1)
@@ -398,7 +397,7 @@
     show-metadata: show-metadata,
     expanded: expanded,
     disable-numbering: disable-numbering,
-    body,
+    html.div(body),
     ..attrs,
   )
 
@@ -499,8 +498,9 @@
         html.link(rel: "preconnect", href: "https://fonts.gstatic.com", crossorigin: "anonymous")
         html.link(
           rel: "stylesheet",
-          href: "https://fonts.googleapis.com/css2?family=Libertinus+Sans:ital,wght@0,400;0,700;1,400&family=Libertinus+Math&family=Libertinus+Serif+Display&family=Libertinus+Serif:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap",
+          href: "https://fonts.googleapis.com/css2?family=Source+Sans+3:ital,wght@0,200..900;1,200..900&family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap",
         )
+        html.link(rel: "stylesheet", href: "/css/stix-two-math.css")
         html.meta(name: "identifier", content: identifier)
         html.meta(name: "lang", content: lang)
         html.title(plain-text(title))

typ/public/css/stix-two-math.css

@@ -0,0 +1,8 @@
+@font-face {
+    font-family: STIX Two Math;
+    src: local('STIX Two Math'),
+         url('/fonts/STIXTwoMath-Regular.woff2'),
+         url('/fonts/STIXTwoMath-Regular.woff');
+    font-weight: normal;
+    font-style: normal;
+}

typ/public/css/weibian.css

@@ -40,8 +40,12 @@
     --color-mark: light-dark(#dae5ec, #2f3849); /* bg-hl-line */
 
     /* Typography */
-    --font-body: "Libertinus Sans", sans-serif;
-    --font-heading: "Libertinus Serif Display", "Libertinus Serif", serif;
+    --font-body-sans: "Source Sans 3", sans-serif;
+    --font-body-serif: "Source Serif 4", serif;
+    --font-body: var(--font-body-sans);
+    --font-heading: "Source Serif 4", serif;
+
+    --font-math: "STIX Two Math", math;
     --font-size-base: 1.125rem;
     --font-size-sm: 1rem;
     --font-size-xs: 0.875rem;
@@ -133,7 +137,7 @@ pre {
 }
 
 math {
-    font-family: "Libertinus Math", math;
+    font-family: var(--font-math);
 }
 
 .math-display {
@@ -237,7 +241,7 @@ address {
 
     #grid-wrapper {
         display: grid;
-        grid-template-columns: 1fr minmax(auto, 90ex) 1fr;
+        grid-template-columns: 1fr minmax(auto, 80ex) 1fr;
         gap: var(--space-sm);
     }
 
@@ -925,3 +929,43 @@ footer > section {
         bottom: 0.1rem;
     }
 }
+
+/* ========================================
+   Chinese Font Support
+   ======================================== */
+section:lang(zh) {
+    /* Chinese Font Classes (https://github.com/zenozeng/fonts.css) */
+    --font-hei:
+        -apple-system, "Noto Sans", "Helvetica Neue", Helvetica,
+        "Nimbus Sans L", Arial, "Liberation Sans", "PingFang SC",
+        "Hiragino Sans GB", "Noto Sans CJK SC", "Source Han Sans SC",
+        "Source Han Sans CN", "Microsoft YaHei", "Wenquanyi Micro Hei",
+        "WenQuanYi Zen Hei", "ST Heiti", SimHei, "WenQuanYi Zen Hei Sharp",
+        sans-serif;
+    --font-kai:
+        Baskerville, Georgia, "Liberation Serif", "Kaiti SC", STKaiti,
+        "AR PL UKai CN", "AR PL UKai HK", "AR PL UKai TW", "AR PL UKai TW MBE",
+        "AR PL KaitiM GB", KaiTi, KaiTi_GB2312, DFKai-SB, "TW\-Kai", serif;
+    --font-song:
+        Georgia, "Nimbus Roman No9 L", "Songti SC", "Noto Serif CJK SC",
+        "Source Han Serif SC", "Source Han Serif CN", STSong, "AR PL New Sung",
+        "AR PL SungtiL GB", NSimSun, SimSun, "TW\-Sung",
+        "WenQuanYi Bitmap Song", "AR PL UMing CN", "AR PL UMing HK",
+        "AR PL UMing TW", "AR PL UMing TW MBE", PMingLiU, MingLiU, serif;
+    --font-fang-song:
+        Baskerville, "Times New Roman", "Liberation Serif", STFangsong,
+        FangSong, FangSong_GB2312, "CWTEX\-F", serif;
+
+    font-family: var(--font-body), var(--font-hei);
+
+    .poem {
+        font-family: var(--font-body-serif), var(--font-song);
+        p {
+            white-space: pre;
+        }
+    }
+
+    :is(h1, h2, h3, h4, h5, h6) {
+        font-family: var(--font-heading), var(--font-song);
+    }
+}