changed the way styling works for the markdown component

src/components/app/MessageTemplate.vue

@@ -505,36 +505,4 @@ export default {
 
 @media (max-width: 468px) {
 }
-</style>
-
-<style>
-.code-inline {
-  background: rgba(0, 0, 0, 0.322);
-}
-.msg-link {
-  color: rgb(86, 159, 253);
-}
-
-pre {
-  padding: 0;
-  margin: 0;
-}
-
-.codeblock {
-  background-color: rgba(0, 0, 0, 0.397);
-  padding: 5px;
-  border-radius: 5px;
-  word-wrap: break-word;
-  word-break: break-word;
-  white-space: pre-wrap;
-  overflow-wrap: anywhere;
-}
-
-.content-message img.emoji {
-  object-fit: contain;
-  height: 2em;
-  width: 2em;
-  margin: 1px;
-  vertical-align: -9px;
-}
-</style>
+</style>

src/components/app/SimpleMarkdown.vue

@@ -18,4 +18,38 @@
 			}
 		}
 	}
-</script>
+</script>
+
+<style>
+	pre {
+	  padding: 0;
+	  margin: 0;
+	}
+
+	.codeblock {
+	  background-color: rgba(0, 0, 0, 0.397);
+	  padding: 5px;
+	  border-radius: 5px;
+	  word-wrap: break-word;
+	  word-break: break-word;
+	  white-space: pre-wrap;
+	  overflow-wrap: anywhere;
+	}
+
+	.content-message img.emoji {
+	  object-fit: contain;
+	  height: 2em;
+	  width: 2em;
+	  margin: 1px;
+	  vertical-align: -9px;
+	}
+
+
+	.inline-code {
+		background: rgba(0, 0, 0, 0.322);
+	}
+
+	.link {
+	  color: rgb(86, 159, 253);
+	}
+</style>

src/utils/markdown-rules/customEmoji.js

@@ -15,7 +15,7 @@ export default (order) => { return {
 	},
 	html: function(node, output) {
 		return SimpleMarkdown.htmlTag('img', '', {
-			class: "emoji",
+			class: "emoji custom-emoji",
 			title: node.name,
 			src: `${config.domain}/media/${node.id}`,
 			alt: node.name

src/utils/markdown-rules/link.js

@@ -34,7 +34,7 @@ export default (order) => { return {
 	html: function(node, output) {
 		return SimpleMarkdown.htmlTag("a", output(node.content), {
 			href: node.url,
-			class: "msg-link",
+			class: "link",
 			target: "_blank"
 		})
 	}

src/utils/markdown-rules/strikeout.js

@@ -13,6 +13,8 @@ export default (order) => { return {
 	},
 
 	html: function(node, output) {
-		return SimpleMarkdown.htmlTag("s", output(node.content))
+		return SimpleMarkdown.htmlTag("s", output(node.content), {
+			class: "strikeout"
+		})
 	}
 }}

src/utils/markdown-rules/underline.js

@@ -13,6 +13,8 @@ export default (order) => { return {
 	},
 
 	html: function(node, output) {
-		return SimpleMarkdown.htmlTag("u", output(node.content))
+		return SimpleMarkdown.htmlTag("u", output(node.content), {
+			class: "underline"
+		})
 	}
 }}

src/utils/messageFormatter.js

@@ -33,6 +33,11 @@ const rules = {
 
     inlineCode: Object.assign({}, SimpleMarkdown.defaultRules.inlineCode, {
         order: order++,
+        html: function(node, parse, state) {
+          return SimpleMarkdown.htmlTag("code", SimpleMarkdown.sanitizeText(node.content), {
+            class: "inline-code"
+          }) 
+        }
     }),
 
     text: Object.assign({}, SimpleMarkdown.defaultRules.text, {