From 334da5e9033b12e7040d06179226f3a6b4e32701 Mon Sep 17 00:00:00 2001
From: "M. Gschwandtner" <84477901+m-gschwandtner@users.noreply.github.com>
Date: Thu, 15 Dec 2022 01:45:20 +0100
Subject: [PATCH] fix: add a span as wrapper to fix whitespace (#747)

---
 web/src/labs/marked/marked.test.ts          | 8 ++++----
 web/src/labs/marked/parser/DoneList.ts      | 2 +-
 web/src/labs/marked/parser/OrderedList.ts   | 2 +-
 web/src/labs/marked/parser/TodoList.ts      | 4 +++-
 web/src/labs/marked/parser/UnorderedList.ts | 2 +-
 5 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/web/src/labs/marked/marked.test.ts b/web/src/labs/marked/marked.test.ts
index 1e6f33d7..01c211cd 100644
--- a/web/src/labs/marked/marked.test.ts
+++ b/web/src/labs/marked/marked.test.ts
@@ -60,8 +60,8 @@ console.log("hello world!")
 - [ ] finish my homework
 - [x] yahaha`,
         want: `<p>My task:</p>
-<p class='li-container'><span class='todo-block todo' data-value='TODO'></span>finish my homework</p>
-<p class='li-container'><span class='todo-block done' data-value='DONE'>✓</span>yahaha</p>`,
+<p class='li-container'><span class='todo-block todo' data-value='TODO'></span><span>finish my homework</span></p>
+<p class='li-container'><span class='todo-block done' data-value='DONE'>✓</span><span>yahaha</span></p>`,
       },
     ];
 
@@ -76,8 +76,8 @@ console.log("hello world!")
 * list 123
 1. 123123`,
         want: `<p>This is a list</p>
-<p class='li-container'><span class='ul-block'>•</span>list 123</p>
-<p class='li-container'><span class='ol-block'>1.</span>123123</p>`,
+<p class='li-container'><span class='ul-block'>•</span><span>list 123</span></p>
+<p class='li-container'><span class='ol-block'>1.</span><span>123123</span></p>`,
       },
     ];
 
diff --git a/web/src/labs/marked/parser/DoneList.ts b/web/src/labs/marked/parser/DoneList.ts
index 293b8995..a1e58a80 100644
--- a/web/src/labs/marked/parser/DoneList.ts
+++ b/web/src/labs/marked/parser/DoneList.ts
@@ -10,7 +10,7 @@ const renderer = (rawStr: string): string => {
   }
 
   const parsedContent = marked(matchResult[1], [], inlineElementParserList);
-  return `<p class='li-container'><span class='todo-block done' data-value='DONE'>✓</span>${parsedContent}</p>${matchResult[2]}`;
+  return `<p class='li-container'><span class='todo-block done' data-value='DONE'>✓</span><span>${parsedContent}</span></p>${matchResult[2]}`;
 };
 
 export default {
diff --git a/web/src/labs/marked/parser/OrderedList.ts b/web/src/labs/marked/parser/OrderedList.ts
index 9871692c..020b5b1a 100644
--- a/web/src/labs/marked/parser/OrderedList.ts
+++ b/web/src/labs/marked/parser/OrderedList.ts
@@ -10,7 +10,7 @@ const renderer = (rawStr: string): string => {
   }
 
   const parsedContent = marked(matchResult[2], [], inlineElementParserList);
-  return `<p class='li-container'><span class='ol-block'>${matchResult[1]}.</span>${parsedContent}</p>${matchResult[3]}`;
+  return `<p class='li-container'><span class='ol-block'>${matchResult[1]}.</span><span>${parsedContent}</span></p>${matchResult[3]}`;
 };
 
 export default {
diff --git a/web/src/labs/marked/parser/TodoList.ts b/web/src/labs/marked/parser/TodoList.ts
index 47f2c934..c8a3497d 100644
--- a/web/src/labs/marked/parser/TodoList.ts
+++ b/web/src/labs/marked/parser/TodoList.ts
@@ -11,7 +11,9 @@ const renderer = (rawStr: string): string => {
   }
 
   const parsedContent = marked(matchResult[1], [], inlineElementParserList);
-  return `<p class='li-container'><span class='todo-block todo' data-value='TODO'></span>${parsedContent}</p>${escape(matchResult[2])}`;
+  return `<p class='li-container'><span class='todo-block todo' data-value='TODO'></span><span>${parsedContent}</span></p>${escape(
+    matchResult[2]
+  )}`;
 };
 
 export default {
diff --git a/web/src/labs/marked/parser/UnorderedList.ts b/web/src/labs/marked/parser/UnorderedList.ts
index 26467d2c..736d490d 100644
--- a/web/src/labs/marked/parser/UnorderedList.ts
+++ b/web/src/labs/marked/parser/UnorderedList.ts
@@ -11,7 +11,7 @@ const renderer = (rawStr: string): string => {
   }
 
   const parsedContent = marked(matchResult[1], [], inlineElementParserList);
-  return `<p class='li-container'><span class='ul-block'>•</span>${parsedContent}</p>${escape(matchResult[2])}`;
+  return `<p class='li-container'><span class='ul-block'>•</span><span>${parsedContent}</span></p>${escape(matchResult[2])}`;
 };
 
 export default {