Using CSS when converting Markdown to PDF with Pandoc

Question

I'm trying out Pandoc on OS X, and results thus far are impressive. One blocking problem, however, is getting CSS styles to work on inline code samples. I'm converting from Markdown to PDF.

I have this string in my source:

* Create a simple HTML document (<span class="filename">simple.html</span>) and load it into the browser via the file system

I've also tried this:

* Create a simple HTML document (`simple.html`{.filename}) and load it into the browser via the file system

I'd like to apply the class "filename" to the enclosed text in each case, but it doesn't seem to do anything to the output. However the manual says:

Some output formats can use this information to do syntax highlighting. Currently, the only output formats that uses this information are HTML and LaTeX.

Here's my command:

pandoc \
    --output ./output.pdf \
    --css source/styles.css \
    source/en/docs/input.md

I'm converting to PDF, which is written by LaTeX by Pandoc internally. Can I get this to work? Or, can I use a style defined using a LaTeX command? - it doesn't have to be CSS. However, it must be a style system - it's not workable to change italic/font/colour attributes on each occasion.

I've tried sending output temporarily to HTML, and in that situation the styles are imported directly from the specific style asset. So, my stylesheet specification and span markup is correct, at least for one output format.

Addenda

A couple of afterthoughts:

• The solution does not have to be Pandoc or Markdown. However, it does need to be a trivial text-based markup language that can convert reliably to PDF, as I want to store the document files on Git for easy forking and merging. I'm not keen on HTML as it is verbose, and engines to convert it aren't that great (though, admittedly, my formatting requirements are modest).
• The HTML output from Pandoc is fine, so if I can find something that converts the (simple) HTML/CSS to PDF reliably, I'll be fine. Of course, Pandoc should be able to do this, but inline styles (for the background colour on code fragments) aren't rendered. This might be a faff, as I'll have to reintroduce things like page-breaks, which can be non-trivial in HTML-to-PDF converters.

Answer 1

"I'd like to apply the class "filename" to the enclosed text in each case, but it doesn't seem to do anything to the output."

It works for HTML. Running Pandoc interactively, ^D to see the resulting code:

$>  pandoc -f markdown -t html

* Create a simple HTML document (`simple.html`{.filename}) and load it.

^D

<ul>
<li>Create a simple HTML document (<code class="filename">simple.html</code>) and load it.</li>
</ul>

It doesn't work for LaTeX if you use the .filename class. You need to use one of the known classnames:

$>  pandoc -f markdown -t latex

* Create a simple HTML document (`simple.html`{.filename}) and load it.

^D

\begin{itemize}
\tightlist
\item
  Create a simple HTML document (\texttt{simple.html}) and load it.
\end{itemize}

Now using one of the known classnames, like .bash, .postscript, .php, ...:

$>  pandoc -f markdown -t latex

* Create a simple HTML document (`simple.html`{.bash}) and load it.

^D

\begin{itemize}
\tightlist
\item
  Create a simple HTML document (\VERB|\KeywordTok{simple.html}| and
  load it.
\end{itemize}

---

To convert HTML + CSS into PDF, you can also look into PrinceXML, which is free for non-commercial use.