Make highlightCodeBlock render enclosing div tags on separate lines

This commit is contained in:
Niklas Fasching 2018-12-11 16:08:58 +01:00
parent 53b61abfd0
commit b1a03e2d27
6 changed files with 18 additions and 8 deletions

View file

@ -50,5 +50,5 @@ func highlightCodeBlock(source, lang string) string {
l = chroma.Coalesce(l) l = chroma.Coalesce(l)
it, _ := l.Tokenise(nil, source) it, _ := l.Tokenise(nil, source)
_ = html.New().Format(&w, styles.Get("friendly"), it) _ = html.New().Format(&w, styles.Get("friendly"), it)
return `<div class="highlight">` + w.String() + `</div>` return `<div class="highlight">` + "\n" + w.String() + "\n" + `</div>`
} }

View file

@ -34,7 +34,7 @@ var listTags = map[string][]string{
func NewHTMLWriter() *HTMLWriter { func NewHTMLWriter() *HTMLWriter {
return &HTMLWriter{ return &HTMLWriter{
HighlightCodeBlock: func(source, lang string) string { HighlightCodeBlock: func(source, lang string) string {
return fmt.Sprintf(`<div class="highlight"><pre>%s</pre></div>`, html.EscapeString(source)) return fmt.Sprintf(`<div class="highlight">%s<pre>%s</pre>%s</div>`, "\n", html.EscapeString(source), "\n")
}, },
} }
} }

View file

@ -1,12 +1,16 @@
<div class="captioned"> <div class="captioned">
<div class="highlight"><pre>echo a bash source block</pre></div> <div class="highlight">
<pre>echo a bash source block</pre>
</div>
<p class="caption"> <p class="caption">
block! block!
</p> </p>
</div> </div>
<div class="highlight"><pre>a source block without a language <div class="highlight">
<pre>a source block without a language
and a second line and a second line
and a third one</pre></div> and a third one</pre>
</div>
<pre class="example"> <pre class="example">
an example block an example block
with multiple lines with multiple lines

View file

@ -2,7 +2,9 @@
Anything can be captioned. Also captions are not real, correct captions but just a paragraph below the element (bothe wrapped into a div) Anything can be captioned. Also captions are not real, correct captions but just a paragraph below the element (bothe wrapped into a div)
</p> </p>
<div class="captioned"> <div class="captioned">
<div class="highlight"><pre>echo &#34;i have a caption!&#34;</pre></div> <div class="highlight">
<pre>echo &#34;i have a caption!&#34;</pre>
</div>
<p class="caption"> <p class="caption">
captioned soure block captioned soure block
</p> </p>

View file

@ -40,7 +40,9 @@ and other elements
<p> <p>
like blocks like blocks
</p> </p>
<div class="highlight"><pre>other non-plain</pre></div> <div class="highlight">
<pre>other non-plain</pre>
</div>
</li> </li>
<li> <li>
<p> <p>

View file

@ -48,7 +48,9 @@ and some lines of text
<p> <p>
and another subitem and another subitem
</p> </p>
<div class="highlight"><pre>echo with a block</pre></div> <div class="highlight">
<pre>echo with a block</pre>
</div>
</li> </li>
<li> <li>
<p> <p>