Add background-accent color

assets/css/bobastyle.css

@@ -8,6 +8,7 @@
   --background-3: #282828;
   --background-4: #333;
   --background-5: #444;
+  --background-accent: #111d2f;
   --text-normal: #d3d3d3;
   --link-color: #4da6ff;
   --figure-border: #1b5b9b;
@@ -24,6 +25,7 @@
     --background-3: #d8d8d8;
     --background-4: #bbb;
     --background-5: #aaa;
+    --background-accent: #aec9ee;
     --text-normal: #000;
     --link-color: #0057bf;
     --figure-border: #2e7bc9;
@@ -90,21 +92,25 @@
   opacity: .75;
 }
 
-.post-title, .author-name {
+.post-title,
+.author-name {
   margin-bottom: 10px;
 }
 
-.post-title a, .author-name a {
+.post-title a,
+.author-name a {
   color: inherit;
   text-decoration: inherit;
 }
 
-.post-meta-item, .author-meta-item {
+.post-meta-item,
+.author-meta-item {
   margin-right: 10px;
   display: inline-block;
 }
 
-.post-metadata, .author-metadata {
+.post-metadata,
+.author-metadata {
   margin-bottom: 15px;
 }
 
@@ -117,7 +123,8 @@
   margin-top: 15px;
 }
 
-.post-description, .author-description {
+.post-description,
+.author-description {
   margin-top: 10px;
 }
 
@@ -431,6 +438,27 @@ hr {
   border-color: var(--background-5);
 }
 
+table.markdown {
+  border-collapse: collapse;
+  border: 2px solid var(--text-normal);
+}
+
+.markdown thead {
+  background-color: var(--background-4);
+}
+
+.markdown th,
+.markdown td {
+  padding: 8px;
+}
+
+.markdown tbody tr:nth-child(odd) {
+  background-color: var(--background);
+}
+.markdown tbody tr:nth-child(even) {
+  background-color: var(--background-2);
+}
+
 * {
   box-sizing: border-box;
 }
@@ -593,7 +621,8 @@ li.disabled > .page-link:hover {
 
 
 /* Light mode */
-@media print, (prefers-color-scheme: light) {
+@media print,
+(prefers-color-scheme: light) {
   /* Basic elements */
   .section:hover {
     color: inherit;

layouts/shortcodes/abbr.html

@@ -0,0 +1 @@
+<abbr title="{{ .Get "title" }}">{{ .Inner }}</abbr>

layouts/shortcodes/table.html

@@ -0,0 +1,10 @@
+{{/* See https://willschenk.com/articles/2020/styling_tables_with_hugo/ */}}
+
+{{ $class := "markdown" }}
+{{ with .Get "class" }}
+    {{ $class = delimit (slice $class .) " " }}
+{{ end }}
+
+{{ $htmlTable := .Inner | markdownify }}
+{{ $new := printf `<table class="%s">` $class }}
+{{ (replace $htmlTable "<table>" $new) | safeHTML }}