Fix styling for pre

DiscordChatExporter/Resources/ExportService/DarkTheme.css

@@ -14,8 +14,11 @@ a:hover { text-decoration: underline; }
 
 div.pre {
     background-color: #2F3136;
+    color: rgb(131, 148, 150);
     font-family: Consolas, Courier New, Courier, Monospace;
+    margin-top: 4px;
     padding: 8px;
+    white-space: pre;
 }
 
 span.pre {
@@ -23,6 +26,7 @@ span.pre {
     font-family: Consolas, Courier New, Courier, Monospace;
     padding-left: 2px;
     padding-right: 2px;
+    white-space: pre;
 }
 
 div#info {

DiscordChatExporter/Resources/ExportService/LightTheme.css

@@ -14,7 +14,9 @@ a:hover { text-decoration: underline; }
 
 div.pre {
     background-color: #F9F9F9;
+    color: rgb(101, 123, 131);
     font-family: Consolas, Courier New, Courier, Monospace;
+    margin-top: 4px;
     padding: 8px;
 }
 

DiscordChatExporter/Services/ExportService.cs

@@ -218,18 +218,18 @@ namespace DiscordChatExporter.Services
             // Encode HTML
             content = HtmlEncode(content);
 
+            // Preformatted div
+            content = Regex.Replace(content, "```+(?:[^`]*?\\n)?([^`]+)\\n?```+",
+                m => "<div class=\"pre\">" + m.Groups[1].Value + "</div>");
+
+            // Preformatted span
+            content = Regex.Replace(content, "`([^`]+)`",
+                m => "<span class=\"pre\">" + m.Groups[1].Value + "</span>");
+
             // Links from URLs
             content = Regex.Replace(content, "((https?|ftp)://[^\\s/$.?#].[^\\s]*)",
                 "<a href=\"$1\">$1</a>");
 
-            // Preformatted multiline
-            content = Regex.Replace(content, "```([^`]*?)```",
-                m => "<div class=\"pre\">" + m.Groups[1].Value.Trim('\n') + "</div>");
-
-            // Preformatted inline
-            content = Regex.Replace(content, "`([^`]*?)`",
-                m => "<span class=\"pre\">" + m.Groups[1].Value + "</span>");
-
             // Bold
             content = Regex.Replace(content, "\\*\\*([^\\*]*?)\\*\\*", "<b>$1</b>");