First line indentation in Prism

[gemmaro]

When using Prism for syntax highlighting, the indentation of the first line of programlisting does not seem to be aligned with the second and subsequent lines.

The same problem does not occur with Pygments and highlight.js.

Below is an example and my temporary workaround. (If there is anything I have missed, please let me know.)

File structure:

.
├── custom.css  # <- I' ll use this later to adjust the style.
├── index.xml
├── Makefile
├── public/...  # <- All the files that will be generated are here
└── vendor
   └── docbook-xslTNG-1.3.1/...

Makefile:

xsltng := vendor/docbook-xslTNG-1.3.1

build:
	mkdir -p public

	saxon \
		index.xml \
		-xsl:vendor/docbook-xslTNG-1.3.1/xslt/docbook.xsl \
		-o:public/index.html \
		-xi \
		verbatim-syntax-highlighter=prism

	cp -r $(xsltng)/resources/* public
	# cp custom.css public/css   # <- I' ll use this later to adjust the style.

index.xml:

<?xml version="1.0" encoding="UTF-8"?>
<article xmlns='http://docbook.org/ns/docbook' version="5.0">
  <title/>
  <programlisting language="ruby">puts "hello"
puts "world"</programlisting>
</article>

Compiling it with $ make, the result is as follows.

I work around this by using the following custom.css.

custom.css:

pre > code {
    padding: initial;
}

The Makefile will be changed accordingly.

	saxon \
		index.xml \
		-xsl:vendor/docbook-xslTNG-1.3.1/xslt/docbook.xsl \
		-o:public/index.html \
		-xi \
		verbatim-syntax-highlighter=prism \
		css-links="css/docbook.css css/docbook-screen.css css/custom.css"

Now the result will be as follows.