From 10ab05eefae3fc7e442c10e2ad4e86ad7fc1d195 Mon Sep 17 00:00:00 2001
From: BurnyLlama <burnyllama@protonmail.com>
Date: Tue, 10 Aug 2021 22:49:20 +0200
Subject: [PATCH] Themed tables,

---
 assets/css/theme.css                 | 14 ++++++++++----
 content/pages/articles/xmpp/intro.md |  1 +
 libs/markedRenderer.js               |  9 +++++++++
 3 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/assets/css/theme.css b/assets/css/theme.css
index 2d5c4cd..aa643ae 100644
--- a/assets/css/theme.css
+++ b/assets/css/theme.css
@@ -99,11 +99,15 @@ ul ul, ul ol, ol ol, ol ul {
 }
 
 table {
-    display: block;
+    margin: 1rem 0;
     width: 100%;
+
+    display: block;
     overflow-x: auto;
     white-space: nowrap;
+
     border-collapse: collapse;
+    box-shadow: 0 1rem 2rem var(--grey1);
 }
 
 table tbody {
@@ -112,21 +116,23 @@ table tbody {
 }
 
 tr {
-    width: 200%;
     background-color: var(--grey3);
 }
 
 tr:nth-child(even) {
-    background-color: var(--grey4);
+    background-color: var(--grey2);
 }
 
 th {
-    border-bottom: .1rem solid var(--text);
+    font-family: 'Manrope SemiBold';
 }
 
 th, td {
     text-align: left;
+    vertical-align: middle;
+
     padding: .25rem 1rem;
+    border: 1px solid var(--grey4);
 }
 
 code {
diff --git a/content/pages/articles/xmpp/intro.md b/content/pages/articles/xmpp/intro.md
index 8a49aab..d856e68 100644
--- a/content/pages/articles/xmpp/intro.md
+++ b/content/pages/articles/xmpp/intro.md
@@ -91,6 +91,7 @@ If you use OMEMO, the calls will be encrypted.
 
 # Tor
 You can also connect using Tor, use the following information:
+
 | Port |                            Hostname                            |
 |------|----------------------------------------------------------------|
 | 5222 | qwikxcv6qo7ochwil3ihobsclz6ulfkszvngy6cna4rx6a6a4bedktad.onion |
diff --git a/libs/markedRenderer.js b/libs/markedRenderer.js
index a19789b..f98fc8b 100644
--- a/libs/markedRenderer.js
+++ b/libs/markedRenderer.js
@@ -18,5 +18,14 @@ export const markedRenderer = {
                 <code class="language-${lang}">${highlight(code, lang)}</code>
             </pre>
         `
+    },
+
+    table(header, body) {
+        return `
+            <table>
+                ${header}
+                ${body}
+            </table>
+        `
     }
 }
\ No newline at end of file