From c5a765eb9f995d6ff6b36166631b6620881e3f1a Mon Sep 17 00:00:00 2001
From: Gabriel Arazas <foo.dogsquared@gmail.com>
Date: Mon, 13 Jun 2022 20:33:16 +0800
Subject: [PATCH] Update table formatting

---
 CHANGELOG.adoc        |  2 ++
 assets/scss/base.scss | 30 ++++++++++++++++++------------
 2 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/CHANGELOG.adoc b/CHANGELOG.adoc
index a1c5187..6a998b4 100644
--- a/CHANGELOG.adoc
+++ b/CHANGELOG.adoc
@@ -36,6 +36,8 @@ This is more like someone forgot to update it from the previous release but pay
 
 * More styling for paged media.
 
+* Cleaner formatting for tables.
+
 
 
 
diff --git a/assets/scss/base.scss b/assets/scss/base.scss
index cdc1a4a..beeb164 100644
--- a/assets/scss/base.scss
+++ b/assets/scss/base.scss
@@ -79,10 +79,6 @@ kbd {
   padding: 0 0.25em;
 }
 
-tr:nth-child(even) {
-  background: var(--base01);
-}
-
 code, pre {
   font-family: var(--mono-family);
 }
@@ -140,23 +136,33 @@ img, video, audio, iframe {
 }
 
 table {
-  border: var(--border-style);
   border-collapse: collapse;
+  border-spacing: 0.5em;
   margin: auto;
+  overflow: auto;
+  width: 100%;
+
+  caption {
+    margin: 1em;
+  }
 }
 
-thead, tbody {
-  margin: 0 auto;
+@mixin table-item-align {
+  text-align: left;
 }
 
 thead {
-  background: var(--base07);
-  color: var(--background);
+  font-weight: bold;
+
+  & tr th {
+    @include table-item-align;
+  }
 }
 
-th, td {
-  border: var(--border-style);
-  padding: 1rem;
+tbody {
+  & tr td {
+    @include table-item-align;
+  }
 }
 
 ol, ul {