Render code markup more similarly to PDST

Author: stefanv

assets/theme-css/styles.css

@@ -20,6 +20,7 @@ table th {
   background-color: var(--pst-color-surface);
   border: 1px solid var(--pst-color-border);
   border-radius: 0.25rem;
+  font-size: 0.875em;
 }
 
 a > code {

layouts/_default/_markup/render-codeblock.html

@@ -0,0 +1,14 @@
+{{ if transform.CanHighlight .Type }}
+{{/* Supported Chroma Language*/}}
+<div class="highlight">
+  <pre class="chroma"><code>
+  {{- with transform.HighlightCodeBlock . -}}
+  {{ .Inner | safeHTML }}
+  {{- end -}}</code></pre>
+</div>
+{{- else -}}
+{{/* Unsupported Language */}}
+<div class="highlight">
+  <pre>{{ .Inner }}</pre>
+</div>
+{{ end }}