Dark and light syntax highlighting

1 files changed, 51 insertions, 6 deletions

diff --git a/z.scm b/z.scm
index 59f93be..b2804a6 100644
--- a/z.scm
+++ b/z.scm
@@ -208,7 +208,7 @@ body
   BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial,
   \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\",
   \"Segoe UI Symbol\", \"Noto Color Emoji\"
-; display: flex; flex-direction: column; justify-content: center
+; display: flex; flex-direction: column
 }
 main,nav,aside { font-family: 'Source Sans Pro', sans-serif; }
 nav { order: -1 }
@@ -216,17 +216,62 @@ h1,h2,h3 { line-height: 1.2 }
 p, li { line-height: 1.4rem }
 p { margin: 0 0 1.8rem 0 }
 .serif { font-family: 'Source Sans Pro', serif }
+pre { font-family: 'Source Sans Pro', monospace }
+pre a, pre a:hover, pre a:visited { text-decoration: none }
+@media (min-width: 768px) {
+  body { flex-direction: row; flex: 1; justify-content: center }
+  main { flex: 1 }
+  nav, aside { flex: 0 0 12em }
+}
+/* Base16 Spacemacs Scheme: Nasser Alshammari (https://github.com/nashamri/spacemacs-theme) */
+table.sourceCode, tr.sourceCode, td.sourceCode, table.sourceCode pre
+{ margin: 0; padding: 0; border: 0; vertical-align: baseline; border: none; background-color: #f8f8f8; color: #444155 }
+td.nums { text-align: right; padding-right: 5px; padding-left: 5px; background-color: #e8e8e8; }
+td.sourceCode { padding-left: 5px; }
+code.sourceCode { background-color: #f8f8f8; }
+pre.sourceCode { background-color: #f8f8f8; line-height: 125% }
+td.nums pre { background-color: #e8e8e8; line-height: 125% }
+code.sourceCode span.kw { color: #4f97d7; font-weight: bold } /* Keyword */
+code.sourceCode span.dt { color: #a31db1} /* Keyword.Type */
+code.sourceCode span.dv { color: #ffa500 } /* Literal.Number.Integer */
+code.sourceCode span.bn { color: #ffa500 } /* Literal.Number.Hex */
+code.sourceCode span.fl { color: #ffa500 } /* Literal.Number.Float */
+code.sourceCode span.ch { color: #67b11d} /* Literal.String.Char */
+code.sourceCode span.st { color: #67b11d } /* Literal.String */
+code.sourceCode span.co { color: #585858 } /* Comment */
+code.sourceCode span.ot { color: #b03060 } /* Comment.Preproc */
+code.sourceCode span.al { color: #a31db1 } /* Generic.Error */
+code.sourceCode span.fu { color: #b1951d } /* Name.Function */
+code.sourceCode span.re { color: #2d9574}
+code.sourceCode span.er { color: #f2241f; border: 1px solid #a31db1 } /* Error */
 @media (prefers-color-scheme: dark)
 {
   body { color: white; background: #444 }
   a:link { color: #5bf }
   a:visited { color: #ccf }
+  /* Base16 Spacemacs Scheme: Nasser Alshammari (https://github.com/nashamri/spacemacs-theme) */
+  table.sourceCode, tr.sourceCode, td.sourceCode, table.sourceCode pre
+  { margin: 0; padding: 0; border: 0; vertical-align: baseline; border: none; background-color: #1f2022; color: #a3a3a3 }
+  td.nums { text-align: right; padding-right: 5px; padding-left: 5px; background-color: #282828; }
+  td.sourceCode { padding-left: 5px; }
+  code.sourceCode { background-color: #1f2022; }
+  pre.sourceCode { background-color: #1f2022; line-height: 125% }
+  td.nums pre { background-color: #282828; line-height: 125% }
+  code.sourceCode span.kw { color: #4f97d7; font-weight: bold } /* Keyword */
+  code.sourceCode span.dt { color: #a31db1} /* Keyword.Type */
+  code.sourceCode span.dv { color: #ffa500 } /* Literal.Number.Integer */
+  code.sourceCode span.bn { color: #ffa500 } /* Literal.Number.Hex */
+  code.sourceCode span.fl { color: #ffa500 } /* Literal.Number.Float */
+  code.sourceCode span.ch { color: #67b11d} /* Literal.String.Char */
+  code.sourceCode span.st { color: #67b11d } /* Literal.String */
+  code.sourceCode span.co { color: #585858 } /* Comment */
+  code.sourceCode span.ot { color: #b03060 } /* Comment.Preproc */
+  code.sourceCode span.al { color: #a31db1 } /* Generic.Error */
+  code.sourceCode span.fu { color: #b1951d } /* Name.Function */
+  code.sourceCode span.re { color: #2d9574}
+  code.sourceCode span.er { color: #f2241f; border: 1px solid #a31db1 } /* Erro  r */
 }
-@media (min-width: 768px) {
-  body { flex-direction: row; flex: 1 }
-  main { flex: 1 }
-  nav, aside { flex: 0 0 12em }
-}
+
 ")
 
 ;; global navbar on the left side