Use skylighting 0.4.2.

This prevents the problem with extra space around highlighted
code blocks (closes #3996).

Note that we no longer put an enclosing div around highlighted
code blocks.  The pre is the outer element, just as for unhighlighted
blocks.

4 files changed, 13 insertions, 15 deletions

diff --git a/pandoc.cabal b/pandoc.cabal
index d4dba30eb..a317ea31c 100644
--- a/pandoc.cabal
+++ b/pandoc.cabal
@@ -318,7 +318,7 @@ library
                  tagsoup >= 0.13.7 && < 0.15,
                  base64-bytestring >= 0.1 && < 1.1,
                  zlib >= 0.5 && < 0.7,
-                 skylighting >= 0.4 && <0.5,
+                 skylighting >= 0.4.2 && <0.5,
                  data-default >= 0.4 && < 0.8,
                  temporary >= 1.1 && < 1.3,
                  blaze-html >= 0.5 && < 0.10,
@@ -556,7 +556,7 @@ test-suite test-pandoc
                   filepath >= 1.1 && < 1.5,
                   hslua >= 0.9 && < 0.10,
                   process >= 1.2.3 && < 1.7,
-                  skylighting >= 0.4 && < 0.5,
+                  skylighting >= 0.4.2 && < 0.5,
                   temporary >= 1.1 && < 1.3,
                   Diff >= 0.2 && < 0.4,
                   tasty >= 0.11 && < 0.12,
diff --git a/stack.yaml b/stack.yaml
index 4b820c764..5e25529f5 100644
--- a/stack.yaml
+++ b/stack.yaml
@@ -9,7 +9,7 @@ packages:
 extra-deps:
 - pandoc-types-1.17.2
 - hslua-0.9.2
-- skylighting-0.4.1
+- skylighting-0.4.2
 - cmark-gfm-0.1.1
 - QuickCheck-2.10.0.1
 - tasty-quickcheck-0.9.1
diff --git a/test/lhs-test.html b/test/lhs-test.html
index 4d032c8e3..28cfdf7a4 100644
--- a/test/lhs-test.html
+++ b/test/lhs-test.html
@@ -12,7 +12,6 @@
       .column{display: inline-block;}
   </style>
   <style type="text/css">
-div.sourceCode { overflow-x: auto; }
 div.sourceLine, a.sourceLine { display: inline-block; min-height: 1.25em; }
 a.sourceLine { pointer-events: none; color: inherit; text-decoration: inherit; }
 .sourceCode { overflow: visible; }
@@ -21,9 +20,9 @@ code.sourceCode { white-space: pre; }
 code.sourceCode { white-space: pre-wrap; }
 div.sourceLine, a.sourceLine { text-indent: -1em; padding-left: 1em; }
 }
-.numberSource div.sourceLine, .numberSource a.sourceLine
+pre.numberSource div.sourceLine, .numberSource a.sourceLine
   { position: relative; }
-.numberSource div.sourceLine::before, .numberSource a.sourceLine::before
+pre.numberSource div.sourceLine::before, .numberSource a.sourceLine::before
   { content: attr(data-line-number);
     position: absolute; left: -5em; text-align: right; vertical-align: baseline;
     border: none; pointer-events: all;
@@ -31,7 +30,7 @@ div.sourceLine, a.sourceLine { text-indent: -1em; padding-left: 1em; }
     -khtml-user-select: none; -moz-user-select: none;
     -ms-user-select: none; user-select: none;
     padding: 0 4px; width: 4em; }
-.numberSource pre.sourceCode { margin-left: 3em; border-left: 1px solid #aaaaaa; color: #aaaaaa;  padding-left: 4px; }
+pre.numberSource { margin-left: 3em; border-left: 1px solid #aaaaaa; color: #aaaaaa;  padding-left: 4px; }
 @media screen {
 a.sourceLine::before { text-decoration: underline; color = initial; }
 }
@@ -73,9 +72,9 @@ code span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Infor
 <h1 id="lhs-test">lhs test</h1>
 <p><code>unsplit</code> is an arrow that takes a pair of values and combines them to
 return a single value:</p>
-<div class="sourceCode"><pre class="sourceCode literate haskell"><code class="sourceCode haskell"><div class="sourceLine" id="1" href="#1" data-line-number="1"><span class="ot">unsplit ::</span> (<span class="dt">Arrow</span> a) <span class="ot">=&gt;</span> (b <span class="ot">-&gt;</span> c <span class="ot">-&gt;</span> d) <span class="ot">-&gt;</span> a (b, c) d</div>
+<pre class="sourceCode literate haskell"><code class="sourceCode haskell"><div class="sourceLine" id="1" href="#1" data-line-number="1"><span class="ot">unsplit ::</span> (<span class="dt">Arrow</span> a) <span class="ot">=&gt;</span> (b <span class="ot">-&gt;</span> c <span class="ot">-&gt;</span> d) <span class="ot">-&gt;</span> a (b, c) d</div>
 <div class="sourceLine" id="2" href="#2" data-line-number="2">unsplit <span class="fu">=</span> arr <span class="fu">.</span> uncurry</div>
-<div class="sourceLine" id="3" href="#3" data-line-number="3">          <span class="co">-- arr (\op (x,y) -&gt; x `op` y)</span></div></code></pre></div>
+<div class="sourceLine" id="3" href="#3" data-line-number="3">          <span class="co">-- arr (\op (x,y) -&gt; x `op` y)</span></div></code></pre>
 <p><code>(***)</code> combines two arrows into a new arrow by running the two arrows on a
 pair of values (one arrow on the first item of the pair and one arrow on the
 second item of the pair).</p>
diff --git a/test/lhs-test.html+lhs b/test/lhs-test.html+lhs
index 2f57b627b..f7a8302a4 100644
--- a/test/lhs-test.html+lhs
+++ b/test/lhs-test.html+lhs
@@ -12,7 +12,6 @@
       .column{display: inline-block;}
   </style>
   <style type="text/css">
-div.sourceCode { overflow-x: auto; }
 div.sourceLine, a.sourceLine { display: inline-block; min-height: 1.25em; }
 a.sourceLine { pointer-events: none; color: inherit; text-decoration: inherit; }
 .sourceCode { overflow: visible; }
@@ -21,9 +20,9 @@ code.sourceCode { white-space: pre; }
 code.sourceCode { white-space: pre-wrap; }
 div.sourceLine, a.sourceLine { text-indent: -1em; padding-left: 1em; }
 }
-.numberSource div.sourceLine, .numberSource a.sourceLine
+pre.numberSource div.sourceLine, .numberSource a.sourceLine
   { position: relative; }
-.numberSource div.sourceLine::before, .numberSource a.sourceLine::before
+pre.numberSource div.sourceLine::before, .numberSource a.sourceLine::before
   { content: attr(data-line-number);
     position: absolute; left: -5em; text-align: right; vertical-align: baseline;
     border: none; pointer-events: all;
@@ -31,7 +30,7 @@ div.sourceLine, a.sourceLine { text-indent: -1em; padding-left: 1em; }
     -khtml-user-select: none; -moz-user-select: none;
     -ms-user-select: none; user-select: none;
     padding: 0 4px; width: 4em; }
-.numberSource pre.sourceCode { margin-left: 3em; border-left: 1px solid #aaaaaa; color: #aaaaaa;  padding-left: 4px; }
+pre.numberSource { margin-left: 3em; border-left: 1px solid #aaaaaa; color: #aaaaaa;  padding-left: 4px; }
 @media screen {
 a.sourceLine::before { text-decoration: underline; color = initial; }
 }
@@ -73,9 +72,9 @@ code span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Infor
 <h1 id="lhs-test">lhs test</h1>
 <p><code>unsplit</code> is an arrow that takes a pair of values and combines them to
 return a single value:</p>
-<div class="sourceCode"><pre class="sourceCode literate literatehaskell"><code class="sourceCode literatehaskell"><div class="sourceLine" id="1" href="#1" data-line-number="1"><span class="ot">&gt; unsplit ::</span> (<span class="dt">Arrow</span> a) <span class="ot">=&gt;</span> (b <span class="ot">-&gt;</span> c <span class="ot">-&gt;</span> d) <span class="ot">-&gt;</span> a (b, c) d</div>
+<pre class="sourceCode literate literatehaskell"><code class="sourceCode literatehaskell"><div class="sourceLine" id="1" href="#1" data-line-number="1"><span class="ot">&gt; unsplit ::</span> (<span class="dt">Arrow</span> a) <span class="ot">=&gt;</span> (b <span class="ot">-&gt;</span> c <span class="ot">-&gt;</span> d) <span class="ot">-&gt;</span> a (b, c) d</div>
 <div class="sourceLine" id="2" href="#2" data-line-number="2"><span class="ot">&gt;</span> unsplit <span class="fu">=</span> arr <span class="fu">.</span> uncurry</div>
-<div class="sourceLine" id="3" href="#3" data-line-number="3"><span class="ot">&gt;</span>           <span class="co">-- arr (\op (x,y) -&gt; x `op` y)</span></div></code></pre></div>
+<div class="sourceLine" id="3" href="#3" data-line-number="3"><span class="ot">&gt;</span>           <span class="co">-- arr (\op (x,y) -&gt; x `op` y)</span></div></code></pre>
 <p><code>(***)</code> combines two arrows into a new arrow by running the two arrows on a
 pair of values (one arrow on the first item of the pair and one arrow on the
 second item of the pair).</p>