WIP: Post style

static/css/blog/post.css

@@ -1,14 +1,16 @@
 @media (prefers-color-scheme: light) {
   :root {
     --selection: rgba(92, 54, 131, 0.7);
-    --visited: #005cc5;
+    --bg: #ffffff;
+    --font-color: #18181b;
   }
 }
 
 @media (prefers-color-scheme: dark) {
   :root {
     --selection: rgba(124, 75, 173, 0.5);
-    --visited: #8be9fd;
+    --bg: #171e26;
+    --font-color: #a1a1aa;
   }
 }
 
@@ -21,9 +23,88 @@ html {
     "Segoe UI Symbol";
   font-size: var(--font-size);
   scroll-behavior: smooth;
+  background-color: var(--bg);
 }
 
 ::selection {
   color: rgb(255, 255, 255);
   background: var(--selection);
 }
+
+/* Anchors */
+h1:hover > a::before,
+h2:hover > a::before,
+h3:hover > a::before,
+h4:hover > a::before,
+h5:hover > a::before,
+h6:hover > a::before {
+  visibility: visible;
+  text-decoration: none;
+}
+
+h1 > a::before,
+h2 > a::before,
+h3 > a::before,
+h4 > a::before,
+h5 > a::before,
+h6 > a::before {
+  content: "#";
+  visibility: hidden;
+  padding-right: 0.1em;
+}
+
+h1 > a,
+h2 > a,
+h3 > a,
+h4 > a,
+h5 > a,
+h6 > a {
+  text-decoration: none;
+}
+
+* {
+  color: var(--font-color);
+}
+
+p {
+  color: var(--font-color);
+  font-size: var(--font-size);
+}
+
+body {
+  margin: 0 auto;
+  max-width: 720px;
+}
+
+footer {
+  text-align: center;
+}
+
+.hljs {
+  margin-inline: 0.4em;
+}
+
+/* for block of numbers */
+.hljs-ln-numbers {
+  text-align: right;
+}
+
+.hljs-ln
+  > tbody
+  > tr:last-child:has(td:last-child > span:-moz-only-whitespace) {
+  visibility: collapse;
+}
+
+/* Temporary fix for layout.css.has-selector.enabled available only on
+ * Firefox under certain circumstances */
+.hljs-ln > tbody > tr:last-child {
+  visibility: collapse;
+}
+
+/* code,
+kbd,
+samp,
+pre {
+  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo,
+    monospace;
+} */