wip

Author: acharneski

_layouts/post.html

@@ -14,55 +14,55 @@
     {% include seo_head.html %}
     <!-- MathJax Configuration (loaded early) -->
     {% if page.mathjax or site.mathjax %}
-<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/svg-pan-zoom.min.js"></script>
-<style>
-    .mermaid-modal {
-        display: none;
-        position: fixed;
-        z-index: 10000;
-        left: 0;
-        top: 0;
-        width: 100%;
-        height: 100%;
-        overflow: hidden;
-        background-color: rgba(0,0,0,0.9);
-    }
-    .mermaid-modal-content {
-        margin: auto;
-        display: block;
-        width: 95%;
-        height: 95%;
-        position: relative;
-        top: 2.5%;
-        background: white;
-        border-radius: 4px;
-        overflow: hidden;
-    }
-    .mermaid-modal-close {
-        position: absolute;
-        top: 10px;
-        right: 25px;
-        color: #f1f1f1;
-        font-size: 35px;
-        font-weight: bold;
-        transition: 0.3s;
-        z-index: 10001;
-        cursor: pointer;
-    }
-    .mermaid-modal-close:hover,
-    .mermaid-modal-close:focus {
-        color: #bbb;
-        text-decoration: none;
-        cursor: pointer;
-    }
-    .mermaid svg {
-        cursor: pointer;
-    }
-</style>
-<div id="mermaid-modal" class="mermaid-modal">
-    <span class="mermaid-modal-close">&times;</span>
-    <div id="mermaid-modal-content" class="mermaid-modal-content"></div>
-</div>
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/svg-pan-zoom.min.js"></script>
+    <style>
+        .mermaid-modal {
+            display: none;
+            position: fixed;
+            z-index: 10000;
+            left: 0;
+            top: 0;
+            width: 100%;
+            height: 100%;
+            overflow: hidden;
+            background-color: rgba(0,0,0,0.9);
+        }
+        .mermaid-modal-content {
+            margin: auto;
+            display: block;
+            width: 95%;
+            height: 95%;
+            position: relative;
+            top: 2.5%;
+            background: white;
+            border-radius: 4px;
+            overflow: hidden;
+        }
+        .mermaid-modal-close {
+            position: absolute;
+            top: 10px;
+            right: 25px;
+            color: #f1f1f1;
+            font-size: 35px;
+            font-weight: bold;
+            transition: 0.3s;
+            z-index: 10001;
+            cursor: pointer;
+        }
+        .mermaid-modal-close:hover,
+        .mermaid-modal-close:focus {
+            color: #bbb;
+            text-decoration: none;
+            cursor: pointer;
+        }
+        .mermaid svg {
+            cursor: pointer;
+        }
+    </style>
+    <div id="mermaid-modal" class="mermaid-modal">
+        <span class="mermaid-modal-close">&times;</span>
+        <div id="mermaid-modal-content" class="mermaid-modal-content"></div>
+    </div>
     <script>
         window.MathJax = {
             tex: {
@@ -245,10 +245,39 @@ <h3>Related Posts</h3>
         addRandomGlitch();
     }
 </script>
-
+<script>
+    MathJax = {
+      tex: {
+        inlineMath: [['$', '$'], ['\\(', '\\)']],
+        displayMath: [['$$', '$$'], ['\\[', '\\]']],
+        processEscapes: true,
+        processEnvironments: true,
+        tags: 'ams',
+        packages: {'[+]': ['ams', 'newcommand', 'configmacros']}
+      },
+      options: {
+        skipHtmlTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code'],
+        ignoreHtmlClass: 'tex2jax_ignore',
+        processHtmlClass: 'tex2jax_process'
+      },
+      startup: {
+        pageReady: () => {
+          return MathJax.startup.defaultPageReady().then(() => {
+            console.log('MathJax initial typesetting complete');
+          });
+        }
+      },
+      svg: {
+        fontCache: 'global'
+      }
+    };
+</script>
+<script type="text/javascript" id="MathJax-script" async
+        src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">
+</script>
 <!-- Mermaid.js integration -->
- {% if page.mermaid or site.mermaid %}
- <script src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script>
+{% if page.mermaid or site.mermaid %}
+<script src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script>
 <script>
     document.addEventListener('DOMContentLoaded', function() {
         mermaid.initialize({
@@ -328,8 +357,8 @@ <h3>Related Posts</h3>
             });
         });
     });
- </script>
- {% endif %}
+</script>
+{% endif %}
 
 </body>
 </html>