fix: render of katex (#390)

doocs · Sep 8, 2024 · 33206c7 · 33206c7
1 parent 744785b
commit 33206c7
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 12 deletions.
diff --git a/index.html b/index.html
@@ -15,12 +15,6 @@
       rel="apple-touch-icon-precomposed"
       href="https://cdn-doocs.oss-cn-shenzhen.aliyuncs.com/gh/doocs/md/images/1648303220922-7e14aefa-816e-44c1-8604-ade709ca1c69.png"
     />
-    <link
-      rel="stylesheet"
-      href="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.css"
-      integrity="sha384-nB0miv6/jRmo5UMMR1wu3Gz6NLsoTkbqJghGIsx//Rlm+ZU03BU6SQNC66uf4l5+"
-      crossorigin="anonymous"
-    />
     <style>
       .loading {
         position: fixed;
@@ -93,11 +87,12 @@
     </script>
     <script>
       MathJax = {
+        loader: { load: ['[tex]/ams'] },
+        tex: { packages: { '[+]': ['ams'] }, tags: 'ams' },
         svg: { fontCache: 'none' },
-        tex: { tags: 'ams' },
       }
     </script>
-    <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js"></script>
+    <script id="MathJax-script" src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js"></script>
     <script type="module" src="/src/main.js"></script>
   </body>
   <script src="https://cdn-doocs.oss-cn-shenzhen.aliyuncs.com/gh/wechatsync/article-syncjs@latest/dist/main.js"></script>

diff --git a/src/utils/MDKatex.js b/src/utils/MDKatex.js
@@ -16,9 +16,8 @@ function createRenderer(display) {
     if (display) {
       return `<section style="text-align: center; overflow: auto;">${svg.outerHTML}</section>`
     }
-    else {
-      return `<span style="display: inline-block; vertical-align: middle; line-height: 1;">${svg.outerHTML}</span>`
-    }
+
+    return `<span style="vertical-align: middle; line-height: 1;">${svg.outerHTML}</span>`
   }
 }
 

diff --git a/src/utils/renderer.ts b/src/utils/renderer.ts
@@ -80,7 +80,7 @@ function transform(legend: string, text: string | null, title: string | null): s
 }
 
 const macCodeSvg = `
-<svg xmlns="http://www.w3.org/2000/svg" version="1.1" x="0px" y="0px" width="45px" height="13px" viewBox="0 0 450 130">
+  <svg xmlns="http://www.w3.org/2000/svg" version="1.1" x="0px" y="0px" width="45px" height="13px" viewBox="0 0 450 130">
     <ellipse cx="65" cy="65" rx="50" ry="52" stroke="rgb(220,60,54)" stroke-width="2" fill="rgb(237,108,96)" />
     <ellipse cx="225" cy="65" rx="50" ry="52" stroke="rgb(218,151,33)" stroke-width="2" fill="rgb(247,193,81)" />
     <ellipse cx="385" cy="65" rx="50" ry="52" stroke="rgb(27,161,37)" stroke-width="2" fill="rgb(100,200,86)" />