upd

static/css/style.css

@@ -1,3 +1,10 @@
+@font-face {
+  font-family: 'Inconsolata-LGC';
+  src: local('Inconsolata-LGC'), 
+    url(/fonts/Inconsolata-LGC.woff2) format('woff2'),
+    url(/fonts/Inconsolata-LGC.woff) format('woff');
+  font-display: swap;
+}
 :root {
   --b: #000;
   --w: #fff;
@@ -10,12 +17,17 @@
     --a: #0b6adc;
   }
 }
+@media screen and (max-width: 840px) {
+  img {
+    width: 100%;
+  }
+}
 body {
   color: var(--b);
-  background-color: var(--w);
+  background: var(--w);
   padding: 1rem;
   max-width: 79ch;
-  font-family: 'Source Code Pro', monospace;
+  font-family: 'Inconsolata-LGC', monospace;
   font-size: 16px;
   line-height: 1.3;
 }
@@ -54,19 +66,16 @@ section#posts {
 ul#posts li {
   list-style: none;
   padding: 0;
-  margin: .5rem 0;
+  margin: 1rem 0;
 }
 ul#posts {
   padding: 0;
 }
-dt { /* Defenition list title */
+dt {
   font-weight: bold;
 }
-span.meta {
-  font-size: 80%;
-}
-span.docutils.literal { /* Inline literal */
-  background-color: #d0d7de;
+span.docutils.literal {
+  background: #d0d7de;
   border-radius: 4px;
   padding: 0 4px 2px 4px;
   font-family: monospace;
@@ -89,7 +98,7 @@ pre > code {
 }
 blockquote {
   padding: 0 1em;
-  border-left: .25em solid #d0d7de;
+  border-left: .25em solid var(--b);
 }
 table, th, td {
   border: 1px solid;
@@ -99,7 +108,7 @@ table, th, td {
 }
 th {
   font-weight: 600;
-  background-color: #d0d7de;
+  background: #ebeff2;
 }
 td p {
   margin: .5rem 0;
@@ -107,12 +116,20 @@ td p {
 hr {
     color: #d0d7de;
 }
+img {
+  max-width: 79ch;
+}
 .admonition {
   padding: .5rem 1rem;
+  border-radius: 8px;
+  background: #ebeff2;
 }
 .admonition-title {
   font-weight: bold;
 }
+.admonition-title::before {
+    content: '🛈 ';
+}
 .highlight {
   border-radius: 8px;
 }