feat(markdown): various styling improvements

- tables actually look good now!!!
- headers are now bold
- code blocks now use JetBrains Mono
- ordered list numbers now use Open Sans

this was all possible thanks to the refactor in 7d9bc21, which made the code much easier to understand/work with

src/components/common/MarkdownView.tsx

@@ -116,6 +116,7 @@ export const MarkdownView = (props: any) => {
   }
 
   newProps.style.body = {
+    fontFamily: 'Open Sans',
     color: currentTheme.foregroundPrimary,
     ...newProps.style.body,
   };
@@ -127,30 +128,56 @@ export const MarkdownView = (props: any) => {
     ...newProps.style.paragraph,
   };
 
+  newProps.style.heading1 = {
+    fontWeight: 'bold',
+    ...newProps.style.heading1,
+  };
+
+  newProps.style.heading2 = {
+    fontWeight: 'bold',
+    ...newProps.style.heading2,
+  };
+
+  newProps.style.heading3 = {
+    fontWeight: 'bold',
+    ...newProps.style.heading3,
+  };
+
+  newProps.style.heading4 = {
+    fontWeight: 'bold',
+    ...newProps.style.heading4,
+  };
+
+  newProps.style.heading5 = {
+    fontWeight: 'bold',
+    ...newProps.style.heading5,
+  };
+
+  newProps.style.heading6 = {
+    fontWeight: 'bold',
+    ...newProps.style.heading6,
+  };
+
   newProps.style.link = {
     color: currentTheme.accentColor,
     ...newProps.style.link,
   };
 
   newProps.style.code_inline = {
+    fontFamily: 'JetBrains Mono',
     backgroundColor: currentTheme.backgroundSecondary,
     ...newProps.style.code_inline,
   };
 
   newProps.style.fence = {
+    fontFamily: 'JetBrains Mono',
     backgroundColor: currentTheme.backgroundSecondary,
     borderWidth: 0,
     borderRadius: 4,
     marginBottom: 2,
     ...newProps.style.fence,
   };
 
-  newProps.style.code_block = {
-    borderColor: currentTheme.foregroundPrimary,
-    backgroundColor: currentTheme.backgroundSecondary,
-    ...newProps.style.code_block,
-  };
-
   newProps.style.blockquote = {
     marginBottom: 2,
     paddingVertical: 6,
@@ -160,6 +187,36 @@ export const MarkdownView = (props: any) => {
     ...newProps.style.blockquote,
   };
 
+  newProps.style.table = {
+    borderTopWidth: 2,
+    borderEndWidth: 2,
+    borderColor: currentTheme.foregroundSecondary,
+    borderRadius: 4,
+    ...newProps.style.table,
+  };
+
+  newProps.style.thead = {
+    fontWeight: 'bold',
+    ...newProps.style.thead,
+  };
+
+  newProps.style.th = {
+    borderStartWidth: 1,
+    borderColor: currentTheme.foregroundSecondary,
+    ...newProps.style.th,
+  };
+
+  newProps.style.td = {
+    borderStartWidth: 1,
+    borderColor: currentTheme.foregroundSecondary,
+    ...newProps.style.td,
+  };
+
+  newProps.style.tr = {
+    borderColor: currentTheme.foregroundSecondary,
+    ...newProps.style.tr,
+  };
+
   try {
     return <Markdown {...newProps}>{newProps.children}</Markdown>;
   } catch (e) {