chore: enhance table styling

Author: openscript

example.md

@@ -106,9 +106,20 @@ Hover on the bottom-left corner to see the navigation's controls panel
 1. is
 1. an enumerated list.
 
+---
+
+# Tables
+
+| Header 1 | Header 2 | Header 3 |
+| -------- | -------- | -------- |
+| Row 1    | Row 1    | Row 1    |
+| Row 2    | Row 2    | Row 2    |
+| Row 3    | Row 3    | Row 3    |
+| Row 4    | Row 4    | Row 4    |
+
 ---
 layout: image-right
-image: 'https://source.unsplash.com/collection/94734566/1920x1080'
+image: 'https://images.unsplash.com/photo-1527095655060-4026c4af2b25?q=80&w=1740'
 ---
 
 # Code `Code`

styles/layout.css

@@ -60,6 +60,13 @@
   --slidev-theme-primary: #539350;
   --slidev-theme-primary-alternative: #8bca88;
   --slidev-theme-secondary: #fa5100;
+  --slidev-theme-background-gray: #e2e2e2;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --slidev-theme-background-gray: #2e2e2e;
+  }
 }
 
 html {
@@ -159,10 +166,28 @@ h6 {
   margin: 0;
 }
 
+.slidev-layout th {
+  font-weight: bold;
+  padding: 0.3rem;
+  background-color: var(--slidev-theme-background-gray);
+}
+
+.slidev-layout th:empty {
+  background-color: transparent;
+}
+
+.slidev-layout td {
+  padding: 0.3rem;
+}
+
 .slidev-layout.cover {
   background-repeat: no-repeat;
 }
 
+.slidev-layout + .h-full {
+  z-index: -1;
+}
+
 .col-right pre:first-of-type, .col-left pre:first-of-type {
   margin-top: 1rem;
 }