hugo-theme-mofo

commit 5633b8cae7f6cb5e4927672837765e4c7acacfcf
parent 33c43d9538efb09ad0ebdffa994228e7ad04c915
Author: Chris Bracken <chris@bracken.jp>
Date:   Fri,  1 May 2020 18:16:27 -0700

Use smaller font, grey background for pre

Use 12.5px font, line hight of 1.1 for <pre> blocks.

Diffstat:
M
static/css/site.css
 | 
18
++++++++++++++++--

1 file changed, 16 insertions(+), 2 deletions(-)
diff --git a/static/css/site.css b/static/css/site.css
@@ -1,13 +1,18 @@
 /* Light/Dark mode support */
 :root {
   color-scheme: light dark;
+  --border-color: #ccc;
+  --pre-background-color: #f5f5f5;
   --text-color: #333;
   --link-color: #0044dd;
 }
 @media (prefers-color-scheme: dark) {
   :root {
+    --border-color: #333;
+    --pre-background-color: #1a1a1a;
     --text-color: #ccc;
     --link-color: #3377dd;
+    background-color:#121212;
   }
 }
 
@@ -17,10 +22,19 @@ body {
   font-size: 16px;
   line-height: 1.6;
   margin: 40px auto;
-  max-width: 650px;
+  max-width: 700px;
   padding: 0 10px
 }
-pre,code { font-size: 14px; line-height: 1.0; }
+pre {
+  background-color: var(--pre-background-color);
+  border: 1px solid var(--border-color);
+  border-radius: 2px;
+  font-size: 12.5px;
+  line-height: 1.1;
+  padding: 10px;
+}
+code { font-size: 14px; line-height: 1.2; }
+pre > code { font-size: 12.5px; }
 a {
   color: var(--link-color);
   text-decoration: none;