diff --git a/app.css b/app.css
index 51ed45d..c623dc3 100644
--- a/app.css
+++ b/app.css
@@ -172,6 +172,9 @@ main {
   padding: 0 1em;
 }
 
+/* Overrule pandoc style */
+div.sourceCode { margin: inherit; }
+
 main * {
   text-align: left;
   margin-left: auto;
@@ -306,7 +309,7 @@ figure figcaption {
 }
 
 pre {
-  background-color: aliceblue;
+  /* background-color: aliceblue; */
   padding: 1em;
   border: 1px solid lightgray;
   border-radius: 3px;
@@ -456,279 +459,3 @@ table > caption {
   font-variant-caps: small-caps;
 }
 
-/*highlighting.css*/
-
-pre > code.sourceCode {
-  white-space: pre;
-  position: relative;
-}
-
-pre > code.sourceCode > span {
-  display: inline-block;
-  line-height: 1.25;
-}
-
-pre > code.sourceCode > span:empty {
-  height: 1.2em;
-}
-
-code.sourceCode > span {
-  color: inherit;
-  text-decoration: inherit;
-}
-
-div.sourceCode {
-  margin: 1em auto;
-}
-
-pre.sourceCode {
-  margin: 0;
-}
-
-@media screen {
-  div.sourceCode {
-    overflow: auto;
-  }
-}
-
-@media print {
-  pre > code.sourceCode {
-    white-space: pre-wrap;
-  }
-
-  pre > code.sourceCode > span {
-    text-indent: -5em;
-    padding-left: 5em;
-  }
-}
-
-pre.numberSource code
-  {
-  counter-reset: source-line 0;
-}
-
-pre.numberSource code > span
-  {
-  position: relative;
-  left: -4em;
-  counter-increment: source-line;
-}
-
-pre.numberSource code > span > a:first-child::before
-  {
-  content: counter(source-line);
-  position: relative;
-  left: -1em;
-  text-align: right;
-  vertical-align: baseline;
-  border: none;
-  display: inline-block;
-  -webkit-touch-callout: none;
-  -webkit-user-select: none;
-  -moz-user-select: none;
-  user-select: none;
-  padding: 0 4px;
-  width: 4em;
-  color: #aaaaaa;
-}
-
-pre.numberSource {
-  margin-left: 3em;
-  border-left: 1px solid #aaaaaa;
-  padding-left: 4px;
-}
-
-div.sourceCode
-  {
-}
-
-@media screen {
-  pre > code.sourceCode > span > a:first-child::before {
-    text-decoration: underline;
-  }
-}
-
-code span.al {
-  color: #ff0000;
-  font-weight: bold;
-}
-
-/* Alert */
-
-code span.an {
-  color: #60a0b0;
-  font-weight: bold;
-  font-style: italic;
-}
-
-/* Annotation */
-
-code span.at {
-  color: #7d9029;
-}
-
-/* Attribute */
-
-code span.bn {
-  color: #40a070;
-}
-
-/* BaseN */
-
-code span.bu {
-}
-
-/* BuiltIn */
-
-code span.cf {
-  color: #007020;
-  font-weight: bold;
-}
-
-/* ControlFlow */
-
-code span.ch {
-  color: #4070a0;
-}
-
-/* Char */
-
-code span.cn {
-  color: #880000;
-}
-
-/* Constant */
-
-code span.co {
-  color: #60a0b0;
-  font-style: italic;
-}
-
-/* Comment */
-
-code span.cv {
-  color: #60a0b0;
-  font-weight: bold;
-  font-style: italic;
-}
-
-/* CommentVar */
-
-code span.do {
-  color: #ba2121;
-  font-style: italic;
-}
-
-/* Documentation */
-
-code span.dt {
-  color: #902000;
-}
-
-/* DataType */
-
-code span.dv {
-  color: #40a070;
-}
-
-/* DecVal */
-
-code span.er {
-  color: #ff0000;
-  font-weight: bold;
-}
-
-/* Error */
-
-code span.ex {
-}
-
-/* Extension */
-
-code span.fl {
-  color: #40a070;
-}
-
-/* Float */
-
-code span.fu {
-  color: #06287e;
-}
-
-/* Function */
-
-code span.im {
-}
-
-/* Import */
-
-code span.in {
-  color: #60a0b0;
-  font-weight: bold;
-  font-style: italic;
-}
-
-/* Information */
-
-code span.kw {
-  color: #007020;
-  font-weight: bold;
-}
-
-/* Keyword */
-
-code span.op {
-  color: #666666;
-}
-
-/* Operator */
-
-code span.ot {
-  color: #007020;
-}
-
-/* Other */
-
-code span.pp {
-  color: #bc7a00;
-}
-
-/* Preprocessor */
-
-code span.sc {
-  color: #4070a0;
-}
-
-/* SpecialChar */
-
-code span.ss {
-  color: #bb6688;
-}
-
-/* SpecialString */
-
-code span.st {
-  color: #4070a0;
-}
-
-/* String */
-
-code span.va {
-  color: #19177c;
-}
-
-/* Variable */
-
-code span.vs {
-  color: #4070a0;
-}
-
-/* VerbatimString */
-
-code span.wa {
-  color: #60a0b0;
-  font-weight: bold;
-  font-style: italic;
-}
-
-/* Warning */
diff --git a/code.md b/code.md
index c643eae..ee95121 100644
--- a/code.md
+++ b/code.md
@@ -1,3 +1,9 @@
+## `nothing`
+
+```
+this is jsut some test
+```
+
 ## `heex`
 
 ```heex
diff --git a/html/.gitignore b/html/.gitignore
index 295048a..f3eda8e 100644
--- a/html/.gitignore
+++ b/html/.gitignore
@@ -2,4 +2,18 @@ app.css
 code.html
 index.html
 moonscript.css
+pandoc-old.css
+pandoc.css
+posts/build-a-neovim-qt-appimage-from-source.html
+posts/build-static-website-generator-part-1.html
+posts/deploy-elixir-generated-html-with-docker-on-digitalocean.html
+posts/fix-distortion-introduced-when-transforming-multiview-projections-to-isometric.html
+posts/index.html
+posts/open-an-iex-shell-from-an-elixir-script.html
+posts/publish-markdown-documents-as-static-web-pages-with-pandoc-and-phoenix.html
+posts/recursively-list-all-files-in-a-directory-with-elixir.html
+posts/resize-a-qemu-disk-image.html
+posts/set-up-a-gitweb-server.html
+posts/start-erlangs-dialyzer-with-gui-from-a-docker-container.html
+posts/test-mix-task-file-modify.html
 pygments.css
\ No newline at end of file
diff --git a/pandoc-old.css b/pandoc-old.css
new file mode 100644
index 0000000..2ce5654
--- /dev/null
+++ b/pandoc-old.css
@@ -0,0 +1,277 @@
+
+/*highlighting.css*/
+
+pre > code.sourceCode {
+  white-space: pre;
+  position: relative;
+}
+
+pre > code.sourceCode > span {
+  display: inline-block;
+  line-height: 1.25;
+}
+
+pre > code.sourceCode > span:empty {
+  height: 1.2em;
+}
+
+code.sourceCode > span {
+  /* color: inherit; */
+  /* text-decoration: inherit; */
+}
+
+div.sourceCode {
+  margin: 1em auto;
+}
+
+pre.sourceCode {
+  margin: 0;
+}
+
+@media screen {
+  div.sourceCode {
+    overflow: auto;
+  }
+}
+
+@media print {
+  pre > code.sourceCode {
+    white-space: pre-wrap;
+  }
+
+  pre > code.sourceCode > span {
+    text-indent: -5em;
+    padding-left: 5em;
+  }
+}
+
+pre.numberSource code
+  {
+  counter-reset: source-line 0;
+}
+
+pre.numberSource code > span
+  {
+  position: relative;
+  left: -4em;
+  counter-increment: source-line;
+}
+
+pre.numberSource code > span > a:first-child::before
+  {
+  content: counter(source-line);
+  position: relative;
+  left: -1em;
+  text-align: right;
+  vertical-align: baseline;
+  border: none;
+  display: inline-block;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  user-select: none;
+  padding: 0 4px;
+  width: 4em;
+  color: #aaaaaa;
+}
+
+pre.numberSource {
+  margin-left: 3em;
+  border-left: 1px solid #aaaaaa;
+  padding-left: 4px;
+}
+
+div.sourceCode
+  {
+}
+
+@media screen {
+  pre > code.sourceCode > span > a:first-child::before {
+    text-decoration: underline;
+  }
+}
+
+code span.al {
+  color: #ff0000;
+  font-weight: bold;
+}
+
+/* Alert */
+
+code span.an {
+  color: #60a0b0;
+  font-weight: bold;
+  font-style: italic;
+}
+
+/* Annotation */
+
+code span.at {
+  color: #7d9029;
+}
+
+/* Attribute */
+
+code span.bn {
+  color: #40a070;
+}
+
+/* BaseN */
+
+code span.bu {
+}
+
+/* BuiltIn */
+
+code span.cf {
+  color: #007020;
+  font-weight: bold;
+}
+
+/* ControlFlow */
+
+code span.ch {
+  color: #4070a0;
+}
+
+/* Char */
+
+code span.cn {
+  color: #880000;
+}
+
+/* Constant */
+
+code span.co {
+  color: #60a0b0;
+  font-style: italic;
+}
+
+/* Comment */
+
+code span.cv {
+  color: #60a0b0;
+  font-weight: bold;
+  font-style: italic;
+}
+
+/* CommentVar */
+
+code span.do {
+  color: #ba2121;
+  font-style: italic;
+}
+
+/* Documentation */
+
+code span.dt {
+  color: #902000;
+}
+
+/* DataType */
+
+code span.dv {
+  color: #40a070;
+}
+
+/* DecVal */
+
+code span.er {
+  color: #ff0000;
+  font-weight: bold;
+}
+
+/* Error */
+
+code span.ex {
+}
+
+/* Extension */
+
+code span.fl {
+  color: #40a070;
+}
+
+/* Float */
+
+code span.fu {
+  color: #06287e;
+}
+
+/* Function */
+
+code span.im {
+}
+
+/* Import */
+
+code span.in {
+  color: #60a0b0;
+  font-weight: bold;
+  font-style: italic;
+}
+
+/* Information */
+
+code span.kw {
+  color: #007020;
+  font-weight: bold;
+}
+
+/* Keyword */
+
+code span.op {
+  color: #666666;
+}
+
+/* Operator */
+
+code span.ot {
+  color: #007020;
+}
+
+/* Other */
+
+code span.pp {
+  color: #bc7a00;
+}
+
+/* Preprocessor */
+
+code span.sc {
+  color: #4070a0;
+}
+
+/* SpecialChar */
+
+code span.ss {
+  color: #bb6688;
+}
+
+/* SpecialString */
+
+code span.st {
+  color: #4070a0;
+}
+
+/* String */
+
+code span.va {
+  color: #19177c;
+}
+
+/* Variable */
+
+code span.vs {
+  color: #4070a0;
+}
+
+/* VerbatimString */
+
+code span.wa {
+  color: #60a0b0;
+  font-weight: bold;
+  font-style: italic;
+}
+
+/* Warning */
diff --git a/pandoc.css b/pandoc.css
new file mode 100644
index 0000000..ea45610
--- /dev/null
+++ b/pandoc.css
@@ -0,0 +1,67 @@
+html { -webkit-text-size-adjust: 100%; }
+pre > code.sourceCode { white-space: pre; position: relative; }
+pre > code.sourceCode > span { display: inline-block; line-height: 1.25; }
+pre > code.sourceCode > span:empty { height: 1.2em; }
+.sourceCode { overflow: visible; }
+code.sourceCode > span { color: inherit; text-decoration: inherit; }
+div.sourceCode { margin: 1em 0; }
+pre.sourceCode { margin: 0; }
+@media screen {
+div.sourceCode { overflow: auto; }
+}
+@media print {
+pre > code.sourceCode { white-space: pre-wrap; }
+pre > code.sourceCode > span { text-indent: -5em; padding-left: 5em; }
+}
+pre.numberSource code
+  { counter-reset: source-line 0; }
+pre.numberSource code > span
+  { position: relative; left: -4em; counter-increment: source-line; }
+pre.numberSource code > span > a:first-child::before
+  { content: counter(source-line);
+    position: relative; left: -1em; text-align: right; vertical-align: baseline;
+    border: none; display: inline-block;
+    -webkit-touch-callout: none; -webkit-user-select: none;
+    -khtml-user-select: none; -moz-user-select: none;
+    -ms-user-select: none; user-select: none;
+    padding: 0 4px; width: 4em;
+    background-color: #232629;
+    color: #7a7c7d;
+  }
+pre.numberSource { margin-left: 3em; border-left: 1px solid #7a7c7d;  padding-left: 4px; }
+div.sourceCode
+  { color: #cfcfc2; background-color: #232629; }
+@media screen {
+pre > code.sourceCode > span > a:first-child::before { text-decoration: underline; }
+}
+code span { color: #cfcfc2; } /* Normal */
+code span.al { color: #95da4c; background-color: #4d1f24; font-weight: bold; } /* Alert */
+code span.an { color: #3f8058; } /* Annotation */
+code span.at { color: #2980b9; } /* Attribute */
+code span.bn { color: #f67400; } /* BaseN */
+code span.bu { color: #7f8c8d; } /* BuiltIn */
+code span.cf { color: #fdbc4b; font-weight: bold; } /* ControlFlow */
+code span.ch { color: #3daee9; } /* Char */
+code span.cn { color: #27aeae; font-weight: bold; } /* Constant */
+code span.co { color: #7a7c7d; } /* Comment */
+code span.cv { color: #7f8c8d; } /* CommentVar */
+code span.do { color: #a43340; } /* Documentation */
+code span.dt { color: #2980b9; } /* DataType */
+code span.dv { color: #f67400; } /* DecVal */
+code span.er { color: #da4453; text-decoration: underline; } /* Error */
+code span.ex { color: #0099ff; font-weight: bold; } /* Extension */
+code span.fl { color: #f67400; } /* Float */
+code span.fu { color: #8e44ad; } /* Function */
+code span.im { color: #27ae60; } /* Import */
+code span.in { color: #c45b00; } /* Information */
+code span.kw { color: #cfcfc2; font-weight: bold; } /* Keyword */
+code span.op { color: #cfcfc2; } /* Operator */
+code span.ot { color: #27ae60; } /* Other */
+code span.pp { color: #27ae60; } /* Preprocessor */
+code span.re { color: #2980b9; background-color: #153042; } /* RegionMarker */
+code span.sc { color: #3daee9; } /* SpecialChar */
+code span.ss { color: #da4453; } /* SpecialString */
+code span.st { color: #f44f4f; } /* String */
+code span.va { color: #27aeae; } /* Variable */
+code span.vs { color: #da4453; } /* VerbatimString */
+code span.wa { color: #da4453; } /* Warning */
diff --git a/pygments.css b/pygments.css
index e2cc7b8..cdc602a 100644
--- a/pygments.css
+++ b/pygments.css
@@ -1,73 +1,87 @@
+/*
+* Generated with:
+* $ pygmentize -f html -S dracula -O classprefix=py- -a .highlight
+*/
 pre { line-height: 125%; }
-td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
-span.linenos { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
-td.linenos .special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
-span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
-.hll { background-color: #ffffcc }
-.c { color: #3D7B7B; font-style: italic } /* Comment */
-.err { border: 1px solid #FF0000 } /* Error */
-.k { color: #008000; font-weight: bold } /* Keyword */
-.o { color: #666666 } /* Operator */
-.ch { color: #3D7B7B; font-style: italic } /* Comment.Hashbang */
-.cm { color: #3D7B7B; font-style: italic } /* Comment.Multiline */
-.cp { color: #9C6500 } /* Comment.Preproc */
-.cpf { color: #3D7B7B; font-style: italic } /* Comment.PreprocFile */
-.c1 { color: #3D7B7B; font-style: italic } /* Comment.Single */
-.cs { color: #3D7B7B; font-style: italic } /* Comment.Special */
-.gd { color: #A00000 } /* Generic.Deleted */
-.ge { font-style: italic } /* Generic.Emph */
-.gr { color: #E40000 } /* Generic.Error */
-.gh { color: #000080; font-weight: bold } /* Generic.Heading */
-.gi { color: #008400 } /* Generic.Inserted */
-.go { color: #717171 } /* Generic.Output */
-.gp { color: #000080; font-weight: bold } /* Generic.Prompt */
-.gs { font-weight: bold } /* Generic.Strong */
-.gu { color: #800080; font-weight: bold } /* Generic.Subheading */
-.gt { color: #0044DD } /* Generic.Traceback */
-.kc { color: #008000; font-weight: bold } /* Keyword.Constant */
-.kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
-.kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
-.kp { color: #008000 } /* Keyword.Pseudo */
-.kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
-.kt { color: #B00040 } /* Keyword.Type */
-.m { color: #666666 } /* Literal.Number */
-.s { color: #BA2121 } /* Literal.String */
-.na { color: #687822 } /* Name.Attribute */
-.nb { color: #008000 } /* Name.Builtin */
-.nc { color: #0000FF; font-weight: bold } /* Name.Class */
-.no { color: #880000 } /* Name.Constant */
-.nd { color: #AA22FF } /* Name.Decorator */
-.ni { color: #717171; font-weight: bold } /* Name.Entity */
-.ne { color: #CB3F38; font-weight: bold } /* Name.Exception */
-.nf { color: #0000FF } /* Name.Function */
-.nl { color: #767600 } /* Name.Label */
-.nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
-.nt { color: #008000; font-weight: bold } /* Name.Tag */
-.nv { color: #19177C } /* Name.Variable */
-.ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
-.w { color: #bbbbbb } /* Text.Whitespace */
-.mb { color: #666666 } /* Literal.Number.Bin */
-.mf { color: #666666 } /* Literal.Number.Float */
-.mh { color: #666666 } /* Literal.Number.Hex */
-.mi { color: #666666 } /* Literal.Number.Integer */
-.mo { color: #666666 } /* Literal.Number.Oct */
-.sa { color: #BA2121 } /* Literal.String.Affix */
-.sb { color: #BA2121 } /* Literal.String.Backtick */
-.sc { color: #BA2121 } /* Literal.String.Char */
-.dl { color: #BA2121 } /* Literal.String.Delimiter */
-.sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
-.s2 { color: #BA2121 } /* Literal.String.Double */
-.se { color: #AA5D1F; font-weight: bold } /* Literal.String.Escape */
-.sh { color: #BA2121 } /* Literal.String.Heredoc */
-.si { color: #A45A77; font-weight: bold } /* Literal.String.Interpol */
-.sx { color: #008000 } /* Literal.String.Other */
-.sr { color: #A45A77 } /* Literal.String.Regex */
-.s1 { color: #BA2121 } /* Literal.String.Single */
-.ss { color: #19177C } /* Literal.String.Symbol */
-.bp { color: #008000 } /* Name.Builtin.Pseudo */
-.fm { color: #0000FF } /* Name.Function.Magic */
-.vc { color: #19177C } /* Name.Variable.Class */
-.vg { color: #19177C } /* Name.Variable.Global */
-.vi { color: #19177C } /* Name.Variable.Instance */
-.vm { color: #19177C } /* Name.Variable.Magic */
-.il { color: #666666 } /* Literal.Number.Integer.Long */
+td.linenos .normal { color: #f1fa8c; background-color: #44475a; padding-left: 5px; padding-right: 5px; }
+span.linenos { color: #f1fa8c; background-color: #44475a; padding-left: 5px; padding-right: 5px; }
+td.linenos .special { color: #50fa7b; background-color: #6272a4; padding-left: 5px; padding-right: 5px; }
+span.linenos.special { color: #50fa7b; background-color: #6272a4; padding-left: 5px; padding-right: 5px; }
+.highlight .hll { background-color: #44475a }
+.highlight { background: #282a36; color: #f8f8f2 }
+.highlight .py-c { color: #6272a4 } /* Comment */
+.highlight .py-err { color: #f8f8f2 } /* Error */
+.highlight .py-g { color: #f8f8f2 } /* Generic */
+.highlight .py-k { color: #ff79c6 } /* Keyword */
+.highlight .py-l { color: #f8f8f2 } /* Literal */
+.highlight .py-n { color: #f8f8f2 } /* Name */
+.highlight .py-o { color: #ff79c6 } /* Operator */
+.highlight .py-x { color: #f8f8f2 } /* Other */
+.highlight .py-p { color: #f8f8f2 } /* Punctuation */
+.highlight .py-ch { color: #6272a4 } /* Comment.Hashbang */
+.highlight .py-cm { color: #6272a4 } /* Comment.Multiline */
+.highlight .py-cp { color: #ff79c6 } /* Comment.Preproc */
+.highlight .py-cpf { color: #6272a4 } /* Comment.PreprocFile */
+.highlight .py-c1 { color: #6272a4 } /* Comment.Single */
+.highlight .py-cs { color: #6272a4 } /* Comment.Special */
+.highlight .py-gd { color: #8b080b } /* Generic.Deleted */
+.highlight .py-ge { color: #f8f8f2; text-decoration: underline } /* Generic.Emph */
+.highlight .py-gr { color: #f8f8f2 } /* Generic.Error */
+.highlight .py-gh { color: #f8f8f2; font-weight: bold } /* Generic.Heading */
+.highlight .py-gi { color: #f8f8f2; font-weight: bold } /* Generic.Inserted */
+.highlight .py-go { color: #44475a } /* Generic.Output */
+.highlight .py-gp { color: #f8f8f2 } /* Generic.Prompt */
+.highlight .py-gs { color: #f8f8f2 } /* Generic.Strong */
+.highlight .py-gu { color: #f8f8f2; font-weight: bold } /* Generic.Subheading */
+.highlight .py-gt { color: #f8f8f2 } /* Generic.Traceback */
+.highlight .py-kc { color: #ff79c6 } /* Keyword.Constant */
+.highlight .py-kd { color: #8be9fd; font-style: italic } /* Keyword.Declaration */
+.highlight .py-kn { color: #ff79c6 } /* Keyword.Namespace */
+.highlight .py-kp { color: #ff79c6 } /* Keyword.Pseudo */
+.highlight .py-kr { color: #ff79c6 } /* Keyword.Reserved */
+.highlight .py-kt { color: #8be9fd } /* Keyword.Type */
+.highlight .py-ld { color: #f8f8f2 } /* Literal.Date */
+.highlight .py-m { color: #ffb86c } /* Literal.Number */
+.highlight .py-s { color: #bd93f9 } /* Literal.String */
+.highlight .py-na { color: #50fa7b } /* Name.Attribute */
+.highlight .py-nb { color: #8be9fd; font-style: italic } /* Name.Builtin */
+.highlight .py-nc { color: #50fa7b } /* Name.Class */
+.highlight .py-no { color: #f8f8f2 } /* Name.Constant */
+.highlight .py-nd { color: #f8f8f2 } /* Name.Decorator */
+.highlight .py-ni { color: #f8f8f2 } /* Name.Entity */
+.highlight .py-ne { color: #f8f8f2 } /* Name.Exception */
+.highlight .py-nf { color: #50fa7b } /* Name.Function */
+.highlight .py-nl { color: #8be9fd; font-style: italic } /* Name.Label */
+.highlight .py-nn { color: #f8f8f2 } /* Name.Namespace */
+.highlight .py-nx { color: #f8f8f2 } /* Name.Other */
+.highlight .py-py { color: #f8f8f2 } /* Name.Property */
+.highlight .py-nt { color: #ff79c6 } /* Name.Tag */
+.highlight .py-nv { color: #8be9fd; font-style: italic } /* Name.Variable */
+.highlight .py-ow { color: #ff79c6 } /* Operator.Word */
+.highlight .py-pm { color: #f8f8f2 } /* Punctuation.Marker */
+.highlight .py-w { color: #f8f8f2 } /* Text.Whitespace */
+.highlight .py-mb { color: #ffb86c } /* Literal.Number.Bin */
+.highlight .py-mf { color: #ffb86c } /* Literal.Number.Float */
+.highlight .py-mh { color: #ffb86c } /* Literal.Number.Hex */
+.highlight .py-mi { color: #ffb86c } /* Literal.Number.Integer */
+.highlight .py-mo { color: #ffb86c } /* Literal.Number.Oct */
+.highlight .py-sa { color: #bd93f9 } /* Literal.String.Affix */
+.highlight .py-sb { color: #bd93f9 } /* Literal.String.Backtick */
+.highlight .py-sc { color: #bd93f9 } /* Literal.String.Char */
+.highlight .py-dl { color: #bd93f9 } /* Literal.String.Delimiter */
+.highlight .py-sd { color: #bd93f9 } /* Literal.String.Doc */
+.highlight .py-s2 { color: #bd93f9 } /* Literal.String.Double */
+.highlight .py-se { color: #bd93f9 } /* Literal.String.Escape */
+.highlight .py-sh { color: #bd93f9 } /* Literal.String.Heredoc */
+.highlight .py-si { color: #bd93f9 } /* Literal.String.Interpol */
+.highlight .py-sx { color: #bd93f9 } /* Literal.String.Other */
+.highlight .py-sr { color: #bd93f9 } /* Literal.String.Regex */
+.highlight .py-s1 { color: #bd93f9 } /* Literal.String.Single */
+.highlight .py-ss { color: #bd93f9 } /* Literal.String.Symbol */
+.highlight .py-bp { color: #f8f8f2; font-style: italic } /* Name.Builtin.Pseudo */
+.highlight .py-fm { color: #50fa7b } /* Name.Function.Magic */
+.highlight .py-vc { color: #8be9fd; font-style: italic } /* Name.Variable.Class */
+.highlight .py-vg { color: #8be9fd; font-style: italic } /* Name.Variable.Global */
+.highlight .py-vi { color: #8be9fd; font-style: italic } /* Name.Variable.Instance */
+.highlight .py-vm { color: #8be9fd; font-style: italic } /* Name.Variable.Magic */
+.highlight .py-il { color: #ffb86c } /* Literal.Number.Integer.Long */
diff --git a/pygments.lua b/pygments.lua
index 0b145af..f2d396e 100644
--- a/pygments.lua
+++ b/pygments.lua
@@ -7,18 +7,27 @@ return {
       _with_0:close()
     end
     if block.classes[1] == "moon" or block.classes[1] == "moonscript" then
-      local p = io.popen(("pygmentize -f html -l moonscript.py %s -x"):format(fname))
+      local p = io.popen(("pygmentize -f html -O style=dracula,wrapcode,classprefix=py- -l moonscript.py %s -x"):format(fname))
       local out = p:read("*a")
       p:close()
       return pandoc.RawBlock("html", out)
     else
-      local status, handle_or_error = pcall(function()
-        return io.popen(("pygmentize -f html -l %s %s"):format(block.classes[1], fname))
-      end)
-      local sout = handle_or_error:read("*a")
-      if block.classes[1] == "heex" then
-        return block
+      if block.classes[1] == nil or block.classes[1] == "heex" then
+        if block.classes[1] == nil then
+          local cb = pandoc.CodeBlock(block.text, {
+            class = "sourceCode"
+          })
+          return pandoc.Div(cb, {
+            class = "sourceCode"
+          })
+        else
+          return block
+        end
       else
+        local status, handle_or_error = pcall(function()
+          return io.popen(("pygmentize -f html -O style=dracula,wrapcode,classprefix=py- -l %s %s"):format(block.classes[1], fname))
+        end)
+        local sout = handle_or_error:read("*a")
         return pandoc.RawBlock("html", sout)
       end
     end
diff --git a/pygments.moon b/pygments.moon
index 8e8bbaa..3e7e6be 100644
--- a/pygments.moon
+++ b/pygments.moon
@@ -5,7 +5,7 @@ CodeBlock: (block) ->
     \close!
 
   if block.classes[1] == "moon" or block.classes[1] == "moonscript"
-    p = io.popen ("pygmentize -f html -l moonscript.py %s -x")\format fname
+    p = io.popen ("pygmentize -f html -O style=dracula,wrapcode,classprefix=py- -l moonscript.py %s -x")\format fname
 
     -- p = io.open fname
     out = p\read"*a"
@@ -13,19 +13,33 @@ CodeBlock: (block) ->
     pandoc.RawBlock "html", out
     -- pandoc.RawBlock "html", "moonscript"
   else
-    status, handle_or_error = pcall ->
-      io.popen ("pygmentize -f html -l %s %s")\format block.classes[1], fname
+    if block.classes[1] == nil or block.classes[1] == "heex"
+      -- pandoc.RawBlock "text", block.text
+      -- require("moon").p [k for k,v in pairs block]
+
+      -- tb = pandoc.RawBlock "html",
+      if block.classes[1] == nil
+        cb = pandoc.CodeBlock(block.text, class: "sourceCode")
+        pandoc.Div cb, class: "sourceCode"
+      else
+        block
+      -- pandoc.CodeBlock block.text, "text"
+    else
+      status, handle_or_error = pcall ->
+        io.popen ("pygmentize -f html -O style=dracula,wrapcode,classprefix=py- -l %s %s")\format block.classes[1], fname
       -- io.open fname
 
-    sout = handle_or_error\read"*a"
+      sout = handle_or_error\read"*a"
     -- handle_or_error\close!
     -- if sout\len! == 0 then block else pandoc.RawBlock "html", sout
-    if block.classes[1] == "heex"
-      -- pandoc.RawBlock "html", "heex"
-      block
-    else
+      -- if mat = sout\match('<div class="highlight"><pre>(.-)\n?</pre></div>')
+      --   rep = '<div class="sourceCode"><pre class="sourceCode ' .. block.classes[1] .. '"><code class="sourceCode ' .. block.classes[1] .. '">' .. mat .. '</code></pre></div>'
+      --   sout = sout\gsub('<div class="highlight"><pre>(.-)\n?</pre></div>', rep)
       pandoc.RawBlock "html", sout
 
+    -- if mat = out\match('<div class="highlight"><pre>(.-)\n?</pre></div>')
+    --   rep = '<div class="sourceCode"><pre class="sourceCode ' .. 'moonscript"><code class="sourceCode ' .. 'moonscript">' .. mat .. '</code></pre></div>'
+    --   out = out\gsub('<div class="highlight"><pre>(.-)\n?</pre></div>', rep)
 
   -- p = io.open fname
   -- out = p\read"*a"
diff --git a/site.moon b/site.moon
index b9f2f7c..a110617 100644
--- a/site.moon
+++ b/site.moon
@@ -120,16 +120,18 @@ sitegen.create =>
     } for path in *files
 
   add "index.html", title: "Catalin Mititiuc"
-  -- add "blog.html", title: "Posts", target: "posts/index", template: "blog"
+  add "blog.html", title: "Posts", target: "posts/index", template: "blog"
   add "code.md",
     template: "post"
     title: "Code Syntax Highlight Samples"
     publish_date: format_date date true
-  -- add_all files_from "docs"
+  add_all files_from "docs"
 
   copy "app.css"
   copy "moonscript.css"
   copy "pygments.css"
+  copy "pandoc.css"
+  copy "pandoc-old.css"
 
   -- replace post markdown yaml headers with moonscript headers
   filter "docs", (body) =>
diff --git a/templates/root.html b/templates/root.html
index c46440e..db0f414 100644
--- a/templates/root.html
+++ b/templates/root.html
@@ -11,8 +11,9 @@
       type="text/css"
       media="screen"
     />
+    <link rel="stylesheet" href="$root/pandoc.css?$generate_date" />
+    <link rel="stylesheet" href="$root/pygments.css?$generate_date" />
     <link rel="stylesheet" href="$root/app.css?$generate_date" />
-    <link rel="stylesheet" href="$root/moonscript.css?$generate_date" />
   </head>
   <body class="bg-white">
     <header>