M site/assets/styles/min-lang.css → site/assets/styles/min-lang.css

@@ -122,7 +122,7 @@ dt {
   margin-top: 1em;
 }
 
-code, pre, .kwd, .cmd, .file, .dir, kbd, .kbd, .ext, .min-terminal, .min-codeblock {
+code, pre, .kwd, .cmd, .file, .dir, kbd, .kbd, .ext, .min-terminal, .min-code, .min-codeblock{
   font-family: 'Source Code Pro',  monospace;
   font-size: 90%;
 }
@@ -275,42 +275,50 @@ border-radius: 3px;
   padding: 0.5rem;
 }
 
-.min-codeblock .min-tkLineComment,
-.min-codeblock .min-tkLineDocComment,
-.min-codeblock .min-tkBlockComment,
-.min-codeblock .min-tkBlockDocComment {
+.min-code {
+  font-size: 80%;
+  background: #1a1c1a;
+  border: 1px solid #313631;
+  border-radius: 3px;
+  padding: 0 0.2rem;
+}
+
+.min-tkLineComment,
+.min-tkLineDocComment,
+.min-tkBlockComment,
+.min-tkBlockDocComment {
   color: #04873f;
 }
 
-.min-codeblock .min-tkBraceRi,
-.min-codeblock .min-tkBracketRi,
-.min-codeblock .min-tkSqBracketRi,
-.min-codeblock .min-tkBraceLe,
-.min-codeblock .min-tkBracketLe,
-.min-codeblock .min-tkSqBracketLe {
+.min-tkBraceRi,
+.min-tkBracketRi,
+.min-tkSqBracketRi,
+.min-tkBraceLe,
+.min-tkBracketLe,
+.min-tkSqBracketLe {
   color: #9c080f;
 }
 
-.min-codeblock .min-tkInt,
-.min-codeblock .min-tkFloat {
+.min-tkInt,
+.min-tkFloat {
   color: #f381f7;
 }
 
-.min-codeblock .min-tkString {
-  color: #c7830e;
+.min-tkString {
+  color: #e6ab09;
 }
 
-.min-codeblock .min-tkCommand {
+.min-tkCommand {
   color: #c7830e;
 }
 
-.min-codeblock .min-tkSymbol {
+.min-tkSymbol {
   color: #9de9fa;
 }
 
-.min-codeblock .min-tkNull,
-.min-codeblock .min-tkTrue,
-.min-codeblock .min-tkFalse {
+.min-tkNull,
+.min-tkTrue,
+.min-tkFalse {
   color: #0cc9a0;
 }
 

M site/contents/learn.md → site/contents/learn.md

@@ -10,12 +10,10 @@ {{m}} is a stack-based, concatenative programming language that uses postfix notation. If you already know [Forth](http://www.forth.org/), [Factor](http://factorcode.org/) or [Joy](http://www.kevinalbrecht.com/code/joy-mirror/), or if you ever used an [RPN](https://en.wikipedia.org/wiki/Reverse_Polish_notation) calculator, then min will look somewhat familiar to you.
 
 If not, well, here's how a short min program looks like:
 
-```min
-; This is a comment
-(1 2 3 4 5) (dup *) map
-#| This is a...
-...multiline comment |#
-```    
+    ; This is a comment
+    (1 2 3 4 5) (dup *) map
+    #| This is a...
+    ...multiline comment |#
 
 This program returns a list containing the square values of the first five integer numbers:
 

M site/rules.min → site/rules.min

@@ -57,7 +57,7 @@ )
 ) ::
 
 (
-  symbol min-highlight
+  symbol min-block-highlight
   (str :code ==> str :result)
   (
     code tokenize 'highlight map "" join :code
@@ -66,11 +66,29 @@ )
 ) ::
 
 (
+  symbol min-inline-highlight
+  (str :code ==> str :result)
+  (
+    code tokenize 'highlight map "" join :code
+    "<span class='min-code'>$#</span>" (code) =% @result
+  )
+) ::
+
+(
   symbol highlight-min-codeblocks
-  (str :markdown ==> str :result)
+  (str :html ==> str :result)
+  (
+    html "<pre>(?:\n|\r\n|\s)*<code>((?:.|\n)*?)<\/code>(?:\n|\r\n|\s)*<\/pre>" 
+    (1 get min-block-highlight) replace-apply @result
+  )
+) ::
+
+(
+  symbol highlight-min-codes
+  (str :html ==> str :result)
   (
-    markdown "```min\n([^`]+)\n```" 
-    (1 get min-highlight) replace-apply @result
+    html "<code>((?:.|\n)*?)<\/code>" 
+    (1 get min-inline-highlight) replace-apply @result
   )
 ) ::
 
@@ -83,7 +101,10 @@ meta (
     (input-fread @contents meta)
     (settings /title %site)
     (settings /version %version)
-    (:temp contents highlight-min-codeblocks temp markdown @contents temp)
+    (
+      :temp contents temp markdown 
+      highlight-min-codes highlight-min-codeblocks @contents temp
+    )
     (contents %contents)
     (:temp tpl temp mustache @page temp)
     (page %contents)