Implement content styles

assets/css/099_content.css

@@ -1,45 +1,28 @@
 
-.content {
-  .heading {
-    align-items: center;
-    gap: 0.25em;
-    display: flex;
-  }
-
-  .heading__anchor {
-    /* font-family: var(--font-family-monospace); */
-    font-size: 60%;
-    text-decoration: none;
+.main--single,
+.main--list,
+.content
+{
+  blockquote,
+  dl,
+  ol,
+  ul
+  {
+    grid-column: main-start / main-end;
   }
 
   .codeblock {
+    color: var(--foreground);
+    background-color: var(--background);
+    border: 1px solid var(--gray6);
     font-family: var(--font-family-monospace);
+    grid-column: gutter-start / gutter-end;
     overflow: auto;
-  }
-}
+    padding-block: var(--space-s);
 
-.content-title {
-  margin-block: var(--space-xl) var(--space-l);
-
-  /* margin-block-start is handled by the grid */
-  &:first-child, &:first-child .title {
-    margin-block-start: 0;
-  }
-
-  .title:has(+ .subtitle) {
-    margin-block-end: var(--space-xs);
-  }
-
-  .title:not(:has(+ .subtitle)), .subtitle {
-    margin-block-end: var(--space-m);
-  }
-
-  .subtitle {
-    color: var(--gray3);
-  }
-
-  .content-date {
-    margin-block-end: var(--space-paragraph);
+    .line {
+      margin-inline: var(--gutter-width);
+    }
   }
 
   .heading {