From c342dadf21cadb0ae85d881925a78f1b8f0dcaa9 Mon Sep 17 00:00:00 2001
From: Alexander Daichendt <alexander.daichendt@tum.de>
Date: Tue, 26 Jul 2022 19:22:43 +0200
Subject: [PATCH] feat: finish table styling

---
 src/components/Table.svelte                  | 42 ++++++++++++++++----
 src/routes/blog/software-recommendations.svx |  2 +-
 2 files changed, 36 insertions(+), 8 deletions(-)

diff --git a/src/components/Table.svelte b/src/components/Table.svelte
index 923409b..31bbb95 100644
--- a/src/components/Table.svelte
+++ b/src/components/Table.svelte
@@ -1,19 +1,47 @@
 <script>
 </script>
 
-<table id="table">
-	<slot />
-</table>
+<div>
+	<table id="table">
+		<slot />
+	</table>
+</div>
 
 <style>
-	table {
-		background-color: var(--light-color);
-		border-radius: 1rem;
+	div {
+		border-radius: 0.5rem;
 		padding: 1rem;
 		box-shadow: 0px 0px 2px var(--shadow-color);
 		border: 1px solid var(--outline-color);
 	}
+	table {
+		border-collapse: collapse;
+		width: 100%;
+	}
+
+	:global(#table thead th) {
+		padding-bottom: 0.25rem;
+		border: solid;
+		width: 350px;
+		margin: auto;
+		border-top: none;
+		border-left: none;
+		border-right: none;
+		border-bottom: none;
+		background: linear-gradient(var(--special-color), var(--special-color)) bottom
+			/* left or right or else */ no-repeat;
+		background-size: 50% 2px;
+	}
+
 	:global(#table tbody tr) {
-		margin: 1rem;
+		border-bottom: 1px solid var(--outline-color);
+	}
+
+	:global(#table tbody tr:last-child) {
+		border-bottom: none;
+	}
+
+	:global(#table tbody td) {
+		padding: 0.5rem;
 	}
 </style>
diff --git a/src/routes/blog/software-recommendations.svx b/src/routes/blog/software-recommendations.svx
index e3e1a2b..a03e8c0 100644
--- a/src/routes/blog/software-recommendations.svx
+++ b/src/routes/blog/software-recommendations.svx
@@ -4,7 +4,7 @@ title: 'Software recommendations for a privacy conscious digital life'
 description: ''
 keywords:
   - privacy
-hidden: false
+hidden: true
 ---
 
 <script context="module" lang="ts">