From 02297ed94a799dbf4919a612855cfa2b09bcec08 Mon Sep 17 00:00:00 2001
From: Nate Weaver <wevah@derailer.org>
Date: Mon, 20 Jan 2020 21:32:02 -0600
Subject: [PATCH] Add table styles

---
 iOS/Resources/styleSheet.css | 38 +++++++++++++++++++++++++++++++++---
 1 file changed, 35 insertions(+), 3 deletions(-)

diff --git a/iOS/Resources/styleSheet.css b/iOS/Resources/styleSheet.css
index c7f8d9412..5b0f92a8e 100644
--- a/iOS/Resources/styleSheet.css
+++ b/iOS/Resources/styleSheet.css
@@ -45,6 +45,7 @@ a:hover {
 	--system-message-color: #cbcbcb;
 	--feedlink-color: rgba(0, 0, 0, 0.6);
 	--article-title-color: #333;
+	--table-border-color: lightgray;
 }
 
 @media(prefers-color-scheme: dark) {
@@ -56,6 +57,7 @@ a:hover {
 		--body-code-color: #b2b2b2;
 		--system-message-color: #5f5f5f;
 		--article-title-color: #e0e0e0;
+		--table-border-color: dimgray;
 	}
 }
 
@@ -138,14 +140,44 @@ pre {
 	word-wrap: normal;
 	word-break: normal;
 }
-.nnw-overflow {
-	overflow-x: auto;
-}
 code, pre {
 	font-family: "SF Mono", Menlo, "Courier New", Courier, monospace;
 	font-size: .8235rem;
 	-webkit-hyphens: none;
 }
+
+.nnw-overflow {
+	overflow-x: auto;
+}
+/*
+ Instead of the last-child bits, border-collapse: collapse
+ could have been used. However, then the inter-cell borders
+ overlap the table border, which looks bad.
+ */
+.nnw-overflow table {
+	margin-bottom: 1px;
+	border-spacing: 0;
+	border: 1px solid var(--secondary-accent-color);
+}
+.nnw-overflow td, .nnw-overflow th {
+	-webkit-hyphens: none;
+	word-break: normal;
+	border: 1px solid var(--table-border-color);
+	border-top: none;
+	border-left: none;
+	padding: 5px;
+}
+.nnw-overflow tr td:last-child, .nnw-overflow tr th:last-child {
+	border-right: none;
+}
+.nnw-overflow tr:last-child td, .nnw-overflow tr:last-child th {
+	border-bottom: none;
+}
+.nnw-overflow td pre {
+	border: none;
+	padding: 0;
+}
+
 img, figure, iframe, div {
 	max-width: 100%;
 	height: auto !important;