Basic working code view

resources/code.css

@@ -0,0 +1,22 @@
+/* Set the font for code blocks */
+code {
+    font-family: "Iosevka Web", monospace;
+}
+
+/* Styling for inline code blocks */
+:not(pre) > code {
+    padding: 0 0.25rem;
+}
+
+/* Styling for fenced code blocks */
+pre > code {
+    display: block;
+    white-space: pre-wrap;
+    padding: 1rem;
+    border-radius: 0.55rem / 0.5rem;
+    word-wrap: normal;
+    overflow: auto;
+}
+pre {
+    width: 90%;
+}

resources/colors.css

@@ -65,3 +65,9 @@ a:visited {
 .post-body > h3, .post-body > h3, .post-body > h4 {
     color: var(--fg-1);
 }
+
+/* Colorization for code blocks */
+code {
+  color: var(--code-fg-0);
+  background-color: var(--code-bg-0);
+}

resources/main.css

@@ -11,6 +11,13 @@
     --box-radius: 1rem;
 }
 
+/* slightly larger than content-width to account for padding/margins */
+@media screen and (max-width: 62rem) {
+    :root {
+        --content-width: 95vw;
+    }
+}
+
 /* Main Body and Post Flexboxs */
 body, .post {
     display: flex;
@@ -92,7 +99,6 @@ body, .post {
     flex-direction: column;
     align-items: center;
     gap: var(--box-gap);
-    width: 100%;
     max-width: var(--content-width);
     padding: var(--box-padding-vert) var(--box-padding-horz);
     border-radius: var(--box-radius);