*: Some simple styling with tables

1 files changed, 20 insertions, 6 deletions

diff --git a/static/style.css b/static/style.css
index bde80a8..d0d20ba 100644
--- a/static/style.css
+++ b/static/style.css
@@ -1,17 +1,19 @@
 html {
 	font-family: sans-serif;
-	--link-color: #7c3e66;
-	--text-decoration-color: #b8b8b8;
-	--box-background-color: #e6e6e6;
+	--link-color: hsl(320, 50%, 36%);
+	--border-color: hsl(0, 0%, 72%);
+	--text-decoration-color: hsl(0, 0%, 72%);
+	--darker-box-background-color: hsl(0, 0%, 92%);
+	--lighter-box-background-color: hsl(0, 0%, 95%);
 }
 html, code, pre {
-	font-size: 1rem;
+	font-size: 1rem; /* TODO: Not always correct */
 }
 
 .padding-wrapper {
 	padding: 0 1rem;
 	max-width: 50em;
-	margin: 0 auto;
+	margin: 1rem auto;
 }
 .padding-wrapper > * {
 	width: 100%;
@@ -21,7 +23,19 @@ a:link, a:visited {
 	color: var(--link-color);
 }
 code:not(pre > code) {
-	background-color: var(--box-background-color);
+	background-color: var(--lighter-box-background-color);
 	border-radius: 2px;
 	padding: 2px;
 }
+table {
+	border: var(--border-color) solid 1px;
+	border-spacing: 0px;
+	border-collapse: collapse;
+}
+td, th {
+	padding: 3px 5px;
+	border: var(--border-color) solid 1px;
+}
+th {
+	background-color: var(--darker-box-background-color);
+}