We want original whitespace to be rendered in some cases (e.g. verse blocks). This requires information about the original whitespace to be preserved during paragraph parsing. As html ignores (collapses) whitespace by default we don't have to adapt the html writer and can just selectively enable rendering of the preseverved whitespace wherever we want it using css (white-space: pre). To differentiate meaningful whitespace from document structure based indentation (i.e. list item base indentation) we need to introduce document.baseLvl. A paragraph by itself does not have enough information to differentiate both kinds of whitespace and needs this information as context [0]. As we're already touching list indentation i went along and improved (fixed?) descriptive list item indentation rendering in the org writer (it should match emacs tab behavior - i.e. indent subsequent lines up to the `:: `). [0] e.g. list items can contain blank lines - a paragraph starting with a blank line would not know that it is part of a list item / has a base indentation - the blank line would suggest a baseLvl of 0.
191 lines
2.8 KiB
HTML
191 lines
2.8 KiB
HTML
<figure>
|
|
<div class="src src-bash">
|
|
<div class="highlight">
|
|
<pre>
|
|
echo "a bash source block"
|
|
|
|
function hello {
|
|
echo Hello World!
|
|
}
|
|
|
|
hello
|
|
</pre>
|
|
</div>
|
|
</div>
|
|
<figcaption>
|
|
block caption
|
|
</figcaption>
|
|
</figure>
|
|
<div class="src src-text">
|
|
<div class="highlight">
|
|
<pre>
|
|
a source block without a language
|
|
</pre>
|
|
</div>
|
|
</div>
|
|
<pre class="example">
|
|
an example block with
|
|
multiple lines including
|
|
|
|
|
|
empty lines!
|
|
|
|
it also has multiple parameters
|
|
|
|
src, example & export blocks treat their content as raw text
|
|
/inline/ *markup* is ignored
|
|
and whitespace is honored and not removed
|
|
</pre>
|
|
<pre class="example">
|
|
examples like this
|
|
are also supported
|
|
|
|
note that /inline/ *markup* ignored
|
|
</pre>
|
|
<blockquote>
|
|
<p>
|
|
Mongodb is <strong>webscale</strong>. (source: <a href="http://www.mongodb-is-web-scale.com/">mongodb-is-web-scale</a>)
|
|
</p>
|
|
<p>
|
|
blocks like the quote block parse their content and can contain
|
|
</p>
|
|
<ul>
|
|
<li>
|
|
<p>
|
|
lists
|
|
</p>
|
|
</li>
|
|
<li>
|
|
<p>
|
|
inline <em>markup</em>
|
|
</p>
|
|
</li>
|
|
<li>
|
|
<p>
|
|
tables
|
|
</p>
|
|
<table>
|
|
<tbody>
|
|
<tr>
|
|
<td>foo</td>
|
|
</tr>
|
|
<tr>
|
|
<td>bar</td>
|
|
</tr>
|
|
<tr>
|
|
<td>baz</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</li>
|
|
<li>
|
|
<p>
|
|
paragraphs
|
|
</p>
|
|
</li>
|
|
<li>
|
|
<p>
|
|
…
|
|
</p>
|
|
<p>
|
|
whitespace is honored and not removed (but is not displayed because that's how html works by default)
|
|
it can be made visible using css (e.g. <code class="verbatim">white-space: pre</code>).
|
|
</p>
|
|
</li>
|
|
</ul>
|
|
</blockquote>
|
|
<script>
|
|
console.log("Hello World!")
|
|
</script>
|
|
<ul>
|
|
<li>
|
|
<p>
|
|
list item 1
|
|
blocks can contain unindented lines that would normally end a list item
|
|
</p>
|
|
<pre class="example">
|
|
this line is not indented - if it was outside of a block the list item would end
|
|
</pre>
|
|
<blockquote>
|
|
<p>
|
|
this line is not indented - if it was outside of a block the list item would end
|
|
</p>
|
|
</blockquote>
|
|
<p>
|
|
now we're outside the block again and the following unindented line will be outside of the list item
|
|
</p>
|
|
</li>
|
|
</ul>
|
|
<p>
|
|
this unindented line is outside of the list item
|
|
</p>
|
|
<ul>
|
|
<li>
|
|
<p>
|
|
list item 2
|
|
</p>
|
|
<div class="src src-text">
|
|
<div class="highlight">
|
|
<pre>
|
|
#+BEGIN_EXAMPLE
|
|
</pre>
|
|
</div>
|
|
</div>
|
|
<p>
|
|
#+END_EXAMPLE
|
|
</p>
|
|
<blockquote>
|
|
<pre class="example">
|
|
#+END_QUOTE
|
|
</pre>
|
|
</blockquote>
|
|
</li>
|
|
<li>
|
|
<p>
|
|
verse blocks
|
|
</p>
|
|
<ul>
|
|
<li>
|
|
<p>
|
|
emacs / ox-hugo rendering
|
|
</p>
|
|
<p class="verse">
|
|
Great clouds overhead<br />
|
|
Tiny black birds rise and fall<br />
|
|
Snow covers Emacs<br />
|
|
<br />
|
|
---AlexSchroeder<br />
|
|
</p>
|
|
</li>
|
|
<li>
|
|
<p>
|
|
go-org rendering
|
|
</p>
|
|
<div class="src src-html">
|
|
<div class="highlight">
|
|
<pre>
|
|
<style>
|
|
.verse-block p { white-space: pre; }
|
|
.verse-block p + p { margin: 0; }
|
|
</style>
|
|
</pre>
|
|
</div>
|
|
</div>
|
|
<style>
|
|
.verse-block p { white-space: pre; }
|
|
.verse-block p + p { margin: 0; }
|
|
</style>
|
|
<div class="verse-block">
|
|
<p>
|
|
Great clouds overhead
|
|
Tiny black birds rise and fall
|
|
Snow covers Emacs
|
|
</p>
|
|
<p>
|
|
—AlexSchroeder
|
|
</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|