ADD: migrated from highlightjs to prismjs

Rules

@@ -44,7 +44,6 @@ compile '/**/*.css' do
 end
 
 compile '/**/*.js' do
-  filter :yui_compressor, type: :js
   write item.identifier.without_ext + '.js'
 end
 

content/blog/controlling-my-home-server-with-syncthing.md

@@ -73,7 +73,7 @@ transition marked by `1 min`, I define an if statement to check the state,
 then perform the action and state change. With such a simple finite state
 machine it didn’t take long to debug.
 
-~~~
+~~~ cmd
 IF EXIST ".\should\sleep.txt" (
   DEL ".\is\*.txt"
   DEL ".\should\*.txt"
@@ -234,4 +234,4 @@ constraints to myself. That is true. I could have set up a simple PHP
 script or build a bot to long-poll Telegram’s API and act accordingly.
 I was too lazy to set those up, or play around with cmd’s syntax trying
 to parse Telegram’s API response. Being limited helped me come up with
-creative solutions like this, and it worked!
+creative solutions like this, and it worked!

content/blog/fixing-wireguard-windows-unable-to-start-as-service.md

@@ -73,7 +73,7 @@ went to look at the config file Wireguard was trying to access.
 inside the system directory `C:\WINDOWS`. Apparently, whichever user Windows
 was trying to start this service with, had not the permission to this file.
 
-~~~
+~~~ plaintext
 "C:\Program Files\WireGuard\wireguard.exe" /tunnelservice C:\WINDOWS\system32\config\systemprofile\AppData\Local\WireGuard\Configurations\Wireguard.conf.dpapi
 ~~~
 
@@ -103,7 +103,7 @@ Inexperienced in software development in Windows, I have no answer to this
 question. I am however aware that on the other side of the Wireguard network,
 I can set a static endpoint for my particular machine.
 
-~~~
+~~~ plaintext
 [Peer]
 PublicKey = dmVyeSByYW5kb20K...
 AllowedIPs = 20.0.0.4/32
@@ -115,4 +115,4 @@ the traffic came from this particular IP. Malicious have to ues my IP
 address to access the network even though they may have my private key.
 
 This is an ugly workaround, especially if my PC's public IP changes
-frequently. What would you do? Any better way to deal with this issue?
+frequently. What would you do? Any better way to deal with this issue?

content/style/_gutenberg-responsive.scss

@@ -175,9 +175,9 @@
     }
   }
 
-  code {
-    @include padding-equal(1);
-  }
+  //code {
+    //@include padding-equal(1);
+  //}
 
   // Attention grabber
   .attention-grabber {

content/style/_gutenberg-style.scss

@@ -133,11 +133,9 @@ blockquote {
 }
 
 pre {
-  font-size: 0.85rem;
   code {
-    padding: 1rem;
-    display: block;
-    border: 1px solid #2d2d2d;
+    margin-bottom: 0 !important;
+    padding: 0 !important;
   }
 }
 
@@ -172,14 +170,14 @@ table td {
   margin-right: 0.5rem;
 }
 
-p code {
-  color: #2d2d2d;
-  background: #cccccc;
-  padding: 0.1rem 0.25rem;
-  border-radius: 4px;
-  font-size: 0.8rem;
-  vertical-align: bottom;
-}
+//p code {
+  //color: #2d2d2d;
+  //background: #cccccc;
+  //padding: 0.1rem 0.25rem;
+  //border-radius: 4px;
+  //font-size: 0.8rem;
+  //vertical-align: bottom;
+//}
 
 .hljs {
   line-height: 1.5em !important;

content/style/prism.css

@@ -0,0 +1,126 @@
+/* PrismJS 1.20.0
+https://prismjs.com/download.html#themes=prism-okaidia&languages=markup+css+clike+javascript+bash+c+cpp+docker+git+java+json+markup-templating+php+properties+python+regex+ruby+sql+yaml */
+/**
+ * okaidia theme for JavaScript, CSS and HTML
+ * Loosely based on Monokai textmate theme by http://www.monokai.nl/
+ * @author ocodia
+ */
+
+code[class*="language-"],
+pre[class*="language-"] {
+	color: #f8f8f2;
+	background: none;
+	text-shadow: 0 1px rgba(0, 0, 0, 0.3);
+	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+	font-size: 1em;
+	text-align: left;
+	white-space: pre;
+	word-spacing: normal;
+	word-break: normal;
+	word-wrap: normal;
+	line-height: 1.5;
+
+	-moz-tab-size: 4;
+	-o-tab-size: 4;
+	tab-size: 4;
+
+	-webkit-hyphens: none;
+	-moz-hyphens: none;
+	-ms-hyphens: none;
+	hyphens: none;
+}
+
+/* Code blocks */
+pre[class*="language-"] {
+	padding: 1em;
+	/*margin: .5em 0;*/
+	overflow: auto;
+	border-radius: 0.3em;
+}
+
+:not(pre) > code[class*="language-"],
+pre[class*="language-"] {
+	background: #272822;
+}
+
+/* Inline code */
+:not(pre) > code[class*="language-"] {
+	padding: .1em;
+	border-radius: .3em;
+	white-space: normal;
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+	color: slategray;
+}
+
+.token.punctuation {
+	color: #f8f8f2;
+}
+
+.token.namespace {
+	opacity: .7;
+}
+
+.token.property,
+.token.tag,
+.token.constant,
+.token.symbol,
+.token.deleted {
+	color: #f92672;
+}
+
+.token.boolean,
+.token.number {
+	color: #ae81ff;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+	color: #a6e22e;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string,
+.token.variable {
+	color: #f8f8f2;
+}
+
+.token.atrule,
+.token.attr-value,
+.token.function,
+.token.class-name {
+	color: #e6db74;
+}
+
+.token.keyword {
+	color: #66d9ef;
+}
+
+.token.regex,
+.token.important {
+	color: #fd971f;
+}
+
+.token.important,
+.token.bold {
+	font-weight: bold;
+}
+.token.italic {
+	font-style: italic;
+}
+
+.token.entity {
+	cursor: help;
+}
+

layouts/blog.slim

@@ -5,7 +5,7 @@ html lang='en'
     title
       = "#{@item[:title]} - Tommy Ku's Blog"
     link rel="stylesheet" href="/style/gutenberg.css"
-    link rel='stylesheet' href='/style/tomorrow-night-eighties.css'
+    link rel='stylesheet' href='/style/prism.css'
     meta name="generator" content="Nanoc #{Nanoc::VERSION}"
   body
     == render '/header.slim'
@@ -33,9 +33,7 @@ html lang='en'
                 - if abstract?(article)
                   p.abstract == abstract(article)
 
-    script type='text/javascript' src='/js/highlight.pack.js'
-    coffee:
-      hljs.initHighlightingOnLoad()
+    script type='text/javascript' src='/js/prism.js'
 
     == render '/disqus.slim'
     hr