Add highlighting of code snippets with numbered lines enabled.

layouts/partials/footer.html

@@ -8,15 +8,9 @@
 </footer>
 <script src="https://cdn.bootcss.com/instantclick/3.0.1/instantclick.min.js" data-no-instant></script>
 <script data-no-instant>InstantClick.init();</script>
-<script src="https://cdn.bootcss.com/highlight.js/9.12.0/highlight.min.js" data-no-instant></script>
 <script data-no-instant>
-  hljs.initHighlightingOnLoad();
   addMenuListener();
   InstantClick.on('change', function() {
-    var blocks = document.querySelectorAll('pre code');
-    for (var i = 0; i < blocks.length; i++) {
-      hljs.highlightBlock(blocks[i]);
-    }
     addMenuListener();
   });
   function addMenuListener() {

layouts/partials/header.html

@@ -24,7 +24,6 @@
   {{ end -}}
   <!-- Styles -->
   <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700,700i" rel="stylesheet">
-  <link href="https://cdn.bootcss.com/highlight.js/9.12.0/styles/atom-one-dark.min.css" rel="stylesheet">
   <link href="{{.Site.BaseURL}}css/style.css" rel="stylesheet">
   <!-- Favicons -->
   <link rel="apple-touch-icon" href="{{.Site.BaseURL}}img/apple-touch-icon.png">

static/css/style.css

@@ -488,3 +488,26 @@ pre, code {
     display: none;
   }
 }
+
+/* Highlight
+------------------------------ */
+.post-content pre code {
+  display: block;
+}
+.post-content table code {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+.post-content pre {
+  margin: 30px 0px;
+  border-radius: 6px;
+}
+.post-content table pre {
+  margin: 20px 0px;
+}
+.highlight table {
+  margin: 30px 0 !important; 
+}
+.highlight div {
+  border-radius: 6px;
+}