feat: finish table styling

src/components/Table.svelte

@@ -1,19 +1,47 @@
 <script>
 </script>
 
-<table id="table">
+<div>
-	<slot />
+	<table id="table">
-</table>
+		<slot />
+	</table>
+</div>
 
 <style>
-	table {
+	div {
-		background-color: var(--light-color);
+		border-radius: 0.5rem;
-		border-radius: 1rem;
 		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>

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">