[S] katex style

package.json

@@ -14,6 +14,7 @@
   "dependencies": {
     "@fortawesome/fontawesome-free": "^6.5.2",
     "element-plus": "^2.7.1",
+    "katex": "^0.16.10",
     "lxgw-wenkai-webfont": "^1.7.0",
     "moment": "^2.30.1",
     "sweetalert2": "11.10.8",
@@ -28,6 +29,7 @@
     "@iconify/vue": "^4.1.2",
     "@types/fs-extra": "^11.0.4",
     "@types/gtag.js": "^0.0.19",
+    "@types/katex": "^0",
     "@types/marked": "^4.3.2",
     "@types/node": "^20.12.7",
     "@types/url-join": "^4.0.3",

src/css/global.sass

@@ -1,5 +1,6 @@
 @import colors
 @import fonts/font-custom
+@import node_modules/katex/dist/katex.css
 
 // Container width (This is normally 50vw,
 //   but when it's smaller than 900px, use 100vw - 50px, because 50px is the margin)
@@ -182,11 +183,8 @@ svg.icon
   @extend .clickable
   height: 1em
 
-.katex
-  font-family: 'katex-math' !important
-
-  .katex-html
-    display: none
+.katex-html
+  display: none
 
 @media (prefers-color-scheme: dark)
   .color-hightlight

yarn.lock

@@ -1214,6 +1214,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/katex@npm:^0":
+  version: 0.16.7
+  resolution: "@types/katex@npm:0.16.7"
+  checksum: 10c0/68dcb9f68a90513ec78ca0196a142e15c2a2c270b1520d752bafd47a99207115085a64087b50140359017d7e9c870b3c68e7e4d36668c9e348a9ef0c48919b5a
+  languageName: node
+  linkType: hard
+
 "@types/lodash-es@npm:^4.17.6":
   version: 4.17.7
   resolution: "@types/lodash-es@npm:4.17.7"
@@ -2480,6 +2487,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"commander@npm:^8.3.0":
+  version: 8.3.0
+  resolution: "commander@npm:8.3.0"
+  checksum: 10c0/8b043bb8322ea1c39664a1598a95e0495bfe4ca2fad0d84a92d7d1d8d213e2a155b441d2470c8e08de7c4a28cf2bc6e169211c49e1b21d9f7edc6ae4d9356060
+  languageName: node
+  linkType: hard
+
 "computeds@npm:^0.0.1":
   version: 0.0.1
   resolution: "computeds@npm:0.0.1"
@@ -4261,6 +4275,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"katex@npm:^0.16.10":
+  version: 0.16.10
+  resolution: "katex@npm:0.16.10"
+  dependencies:
+    commander: "npm:^8.3.0"
+  bin:
+    katex: cli.js
+  checksum: 10c0/b465213157e5245bbb31ff6563c33ae81807c06d6f2246325b3a2397497e8929a34eebbb262f5e0991ec00fbc0cc85f388246e6dfc38ec86c28d3e481cb70afa
+  languageName: node
+  linkType: hard
+
 "keycode-js@npm:^3.1.0":
   version: 3.1.0
   resolution: "keycode-js@npm:3.1.0"
@@ -4889,6 +4914,7 @@ __metadata:
     "@iconify/vue": "npm:^4.1.2"
     "@types/fs-extra": "npm:^11.0.4"
     "@types/gtag.js": "npm:^0.0.19"
+    "@types/katex": "npm:^0"
     "@types/marked": "npm:^4.3.2"
     "@types/node": "npm:^20.12.7"
     "@types/url-join": "npm:^4.0.3"
@@ -4905,6 +4931,7 @@ __metadata:
     fs-extra: "npm:^11.2.0"
     html-to-text: "npm:^9.0.5"
     http-terminator: "npm:^3.2.0"
+    katex: "npm:^0.16.10"
     lxgw-wenkai-webfont: "npm:^1.7.0"
     markdown-yaml-metadata-parser: "npm:^3.0.0"
     marked: "npm:^4.3.0"