From 5f6f23ab50d5bca7ec755768ce46d448a1db53c1 Mon Sep 17 00:00:00 2001
From: Terry-Bui <terry.bui96@gmail.com>
Date: Fri, 7 Sep 2018 10:12:37 +1000
Subject: [PATCH] kramdown highlighed code block, line numbers shows too much
 whitespace, fix by adding css
 https://github.com/mmistakes/minimal-mistakes/issues/1437

---
 _config.yml            | 40 ++++++++++++++++++++--------------------
 assets/css/lesson.scss | 37 +++++++++++++++++++++++++++++++++++++
 2 files changed, 57 insertions(+), 20 deletions(-)

diff --git a/_config.yml b/_config.yml
index 7ae63b3..1da473d 100755
--- a/_config.yml
+++ b/_config.yml
@@ -136,23 +136,23 @@ highlighter: rouge
 markdown: kramdown
 # !github-pages! mandatory › https://help.github.com/articles/using-jekyll-with-pages/#configuration-settings-you-cannot-change
 # Since Jekyll 3 the default highlighter is Rouge (replaced Pygments.rb in v44)
-# highlighter: rouge
-#
-# # More › http://kramdown.gettalong.org/quickref.html
-# # Options › http://kramdown.gettalong.org/options.html
-# kramdown:
-#   input:          GFM
-#   # https://github.com/jekyll/jekyll/pull/4090
-#   syntax_highlighter: rouge
-#
-#   # Rouge Highlighter in Kramdown › http://kramdown.gettalong.org/syntax_highlighter/rouge.html
-#   # span, block element options fall back to global
-#   syntax_highlighter_opts:
-#     # Rouge Options › https://github.com/jneen/rouge#full-options
-#     css_class: 'highlight'
-#     #line_numbers: true # bad idea, spans don't need linenos and would inherit this option
-#     span:
-#       line_numbers: false
-#     block:
-#       line_numbers: true
-#       start_line: 1
+highlighter: rouge
+
+# More › http://kramdown.gettalong.org/quickref.html
+# Options › http://kramdown.gettalong.org/options.html
+kramdown:
+  input:          GFM
+  # https://github.com/jekyll/jekyll/pull/4090
+  syntax_highlighter: rouge
+
+  # Rouge Highlighter in Kramdown › http://kramdown.gettalong.org/syntax_highlighter/rouge.html
+  # span, block element options fall back to global
+  syntax_highlighter_opts:
+    # Rouge Options › https://github.com/jneen/rouge#full-options
+    css_class: 'highlight'
+    #line_numbers: true # bad idea, spans don't need linenos and would inherit this option
+    span:
+      line_numbers: false
+    block:
+      line_numbers: true
+      start_line: 1
diff --git a/assets/css/lesson.scss b/assets/css/lesson.scss
index 439430c..f4686fe 100755
--- a/assets/css/lesson.scss
+++ b/assets/css/lesson.scss
@@ -144,6 +144,43 @@ img {
   max-width: 100%;
 }
 
+.highlight table {
+  margin-bottom: 0;
+  font-size: 1em;
+  border: 0;
+
+  td {
+    padding: 0;
+    width: calc(100% - 1em);
+    border: 0;
+
+    /* line numbers*/
+    &.gutter,
+    &.rouge-gutter {
+      padding-left: 0em;
+      padding-right: 0em;
+      width: 1em;
+      text-align: right;
+    }
+
+    /* code */
+    &.code,
+    &.rouge-code {
+      padding-left: 1em;
+    }
+  }
+
+  pre {
+    margin: 0;
+    
+  }
+}
+
+.highlight pre {
+  width: 100%;
+  margin-bottom: 5px;
+}
+
 //----------------------------------------
 // Miscellaneous.
 //----------------------------------------