From d699414c285c0820a8994a6e876e10ada3f45773 Mon Sep 17 00:00:00 2001
From: terminaldweller <thabogre@gmail.com>
Date: Wed, 6 Apr 2022 21:33:01 +0430
Subject: wip

---
 spring-front/src/components/Editor.js | 38 +++++++++++++++++++----------------
 spring-front/src/index.css            |  3 +++
 2 files changed, 24 insertions(+), 17 deletions(-)

(limited to 'spring-front/src')

diff --git a/spring-front/src/components/Editor.js b/spring-front/src/components/Editor.js
index c02bdbe..30a11ec 100644
--- a/spring-front/src/components/Editor.js
+++ b/spring-front/src/components/Editor.js
@@ -6,6 +6,8 @@ import "highlight.js/styles/devibeans.css";
 import markdown from "highlight.js/lib/languages/markdown.js";
 import javascript from "highlight.js/lib/languages/javascript.js";
 import python from "highlight.js/lib/languages/python.js";
+import C from "highlight.js/lib/languages/c.js";
+import bash from "highlight.js/lib/languages/bash.js";
 import "../index.css";
 import mit from "markdown-it";
 import mithljs from "markdown-it-highlightjs";
@@ -16,15 +18,18 @@ import katex from "katex";
 hljs.registerLanguage("markdown", markdown);
 hljs.registerLanguage("javascript", javascript);
 hljs.registerLanguage("python", python);
+hljs.registerLanguage("c", C);
+hljs.registerLanguage("bash", bash);
 
-mit({ html: true });
-mit().use(mittexmath, {
-  engine: katex,
-  delimiters: "gitlab",
-  katexOptions: { macros: { "\\RR": "\\mathbb{R}" } },
-});
-mit().use(mitmmdtable);
-mit().use(mithljs, { inline: true, auto: false, code: false, hljs: hljs });
+const md = new mit({ html: true })
+  .enable(["table"])
+  .use(mittexmath, {
+    engine: katex,
+    delimiters: "gitlab",
+    katexOptions: { macros: { "\\RR": "\\mathbb{R}" } },
+  })
+  .use(mitmmdtable)
+  .use(mithljs, { inline: true, auto: true, code: true, hljs: hljs });
 
 export default class Editor extends React.Component {
   constructor(props) {
@@ -41,17 +46,16 @@ export default class Editor extends React.Component {
 
   // TODO-use web worker instead
   updateCodeSyntaxHighlighting() {
-    // document.querySelectorAll("pre code").forEach((block) => {
-    //   console.log(block);
-    //   hljs.highlightElement(block);
-    // });
-    hljs.highlightAll();
+    document.querySelectorAll("pre code").forEach((block) => {
+      console.log(block);
+      hljs.highlightElement(block);
+    });
+    // hljs.highlightAll();
   }
 
   // TODO-use web worker instead
   parseMarkdown(event) {
     let element = document.getElementById("markdown-placeholder");
-    let md = new mit();
     let htm = md.render(event.target.value);
     element.innerHTML = htm;
   }
@@ -116,9 +120,9 @@ export default class Editor extends React.Component {
             direction="rtl"
           ></textarea>
         </div>
-        <div className="split right">
-          <div direction="rtl" id="markdown-placeholder"></div>
-        </div>
+        <a className="split right">
+          <a direction="rtl" id="markdown-placeholder"></a>
+        </a>
       </div>
     );
   }
diff --git a/spring-front/src/index.css b/spring-front/src/index.css
index 9715148..732a794 100644
--- a/spring-front/src/index.css
+++ b/spring-front/src/index.css
@@ -49,6 +49,7 @@ pre,textarea,code {
   margin: 0px;
   border: 0px;
   padding: 0px;
+  overflow-y: scroll;
 }
 
 #editor, #highlight {
@@ -62,6 +63,7 @@ pre,textarea,code {
   margin: 0px;
   border: 0px;
   padding: 0px;
+  overflow-y: scroll;
 }
 
 #editor {
@@ -82,4 +84,5 @@ pre,textarea,code {
   direction: rtl;
   overflow-wrap: break-word;
   white-space: pre-wrap;
+  overflow-y: scroll;
 }
-- 
cgit v1.2.3