pandoc/tests/writer.html
fiddlosopher 43d5e3d279 HTML writer changes for templates.
Note:  now a single meta tag is used for multiple authors.
Previously one tag per author was used.

Fixed title in HTML template to avoid excess blank space.

git-svn-id: https://pandoc.googlecode.com/svn/trunk@1703 788f1e2b-df1e-0410-8736-df70ead52e1b
2009-12-31 01:13:26 +00:00

1247 lines
22 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Pandoc Test Suite</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="pandoc" />
<meta name="author" content="John MacFarlane; Anonymous" />
<meta name="date" content="July 17, 2006" />
</head>
<body>
<h1 class="title">Pandoc Test Suite</h1>
<p
>This is a set of tests for pandoc. Most of them are adapted from John Gruber&rsquo;s markdown test suite.</p
><hr
/><div id="headers"
><h1
>Headers</h1
><div id="level-2-with-an-embedded-link"
><h2
>Level 2 with an <a href="/url"
>embedded link</a
></h2
><div id="level-3-with-emphasis"
><h3
>Level 3 with <em
>emphasis</em
></h3
><div id="level-4"
><h4
>Level 4</h4
><div id="level-5"
><h5
>Level 5</h5
></div
></div
></div
></div
></div
><div id="level-1"
><h1
>Level 1</h1
><div id="level-2-with-emphasis"
><h2
>Level 2 with <em
>emphasis</em
></h2
><div id="level-3"
><h3
>Level 3</h3
><p
>with no blank line</p
></div
></div
><div id="level-2"
><h2
>Level 2</h2
><p
>with no blank line</p
><hr
/></div
></div
><div id="paragraphs"
><h1
>Paragraphs</h1
><p
>Here&rsquo;s a regular paragraph.</p
><p
>In Markdown 1.0.0 and earlier. Version 8. This line turns into a list item. Because a hard-wrapped line in the middle of a paragraph looked like a list item.</p
><p
>Here&rsquo;s one with a bullet. * criminey.</p
><p
>There should be a hard line break<br
/>here.</p
><hr
/></div
><div id="block-quotes"
><h1
>Block Quotes</h1
><p
>E-mail style:</p
><blockquote
><p
>This is a block quote. It is pretty short.</p
></blockquote
><blockquote
><p
>Code in a block quote:</p
><pre
><code
>sub status {
print &quot;working&quot;;
}
</code
></pre
><p
>A list:</p
><ol style="list-style-type: decimal;"
><li
>item one</li
><li
>item two</li
></ol
><p
>Nested block quotes:</p
><blockquote
><p
>nested</p
></blockquote
><blockquote
><p
>nested</p
></blockquote
></blockquote
><p
>This should not be a block quote: 2 &gt; 1.</p
><p
>And a following paragraph.</p
><hr
/></div
><div id="code-blocks"
><h1
>Code Blocks</h1
><p
>Code:</p
><pre
><code
>---- (should be four hyphens)
sub status {
print &quot;working&quot;;
}
this code block is indented by one tab
</code
></pre
><p
>And:</p
><pre
><code
> this code block is indented by two tabs
These should not be escaped: \$ \\ \&gt; \[ \{
</code
></pre
><hr
/></div
><div id="lists"
><h1
>Lists</h1
><div id="unordered"
><h2
>Unordered</h2
><p
>Asterisks tight:</p
><ul
><li
>asterisk 1</li
><li
>asterisk 2</li
><li
>asterisk 3</li
></ul
><p
>Asterisks loose:</p
><ul
><li
><p
>asterisk 1</p
></li
><li
><p
>asterisk 2</p
></li
><li
><p
>asterisk 3</p
></li
></ul
><p
>Pluses tight:</p
><ul
><li
>Plus 1</li
><li
>Plus 2</li
><li
>Plus 3</li
></ul
><p
>Pluses loose:</p
><ul
><li
><p
>Plus 1</p
></li
><li
><p
>Plus 2</p
></li
><li
><p
>Plus 3</p
></li
></ul
><p
>Minuses tight:</p
><ul
><li
>Minus 1</li
><li
>Minus 2</li
><li
>Minus 3</li
></ul
><p
>Minuses loose:</p
><ul
><li
><p
>Minus 1</p
></li
><li
><p
>Minus 2</p
></li
><li
><p
>Minus 3</p
></li
></ul
></div
><div id="ordered"
><h2
>Ordered</h2
><p
>Tight:</p
><ol style="list-style-type: decimal;"
><li
>First</li
><li
>Second</li
><li
>Third</li
></ol
><p
>and:</p
><ol style="list-style-type: decimal;"
><li
>One</li
><li
>Two</li
><li
>Three</li
></ol
><p
>Loose using tabs:</p
><ol style="list-style-type: decimal;"
><li
><p
>First</p
></li
><li
><p
>Second</p
></li
><li
><p
>Third</p
></li
></ol
><p
>and using spaces:</p
><ol style="list-style-type: decimal;"
><li
><p
>One</p
></li
><li
><p
>Two</p
></li
><li
><p
>Three</p
></li
></ol
><p
>Multiple paragraphs:</p
><ol style="list-style-type: decimal;"
><li
><p
>Item 1, graf one.</p
><p
>Item 1. graf two. The quick brown fox jumped over the lazy dog&rsquo;s back.</p
></li
><li
><p
>Item 2.</p
></li
><li
><p
>Item 3.</p
></li
></ol
></div
><div id="nested"
><h2
>Nested</h2
><ul
><li
>Tab<ul
><li
>Tab<ul
><li
>Tab</li
></ul
></li
></ul
></li
></ul
><p
>Here&rsquo;s another:</p
><ol style="list-style-type: decimal;"
><li
>First</li
><li
>Second:<ul
><li
>Fee</li
><li
>Fie</li
><li
>Foe</li
></ul
></li
><li
>Third</li
></ol
><p
>Same thing but with paragraphs:</p
><ol style="list-style-type: decimal;"
><li
><p
>First</p
></li
><li
><p
>Second:</p
><ul
><li
>Fee</li
><li
>Fie</li
><li
>Foe</li
></ul
></li
><li
><p
>Third</p
></li
></ol
></div
><div id="tabs-and-spaces"
><h2
>Tabs and spaces</h2
><ul
><li
><p
>this is a list item indented with tabs</p
></li
><li
><p
>this is a list item indented with spaces</p
><ul
><li
><p
>this is an example list item indented with tabs</p
></li
><li
><p
>this is an example list item indented with spaces</p
></li
></ul
></li
></ul
></div
><div id="fancy-list-markers"
><h2
>Fancy list markers</h2
><ol start="2" style="list-style-type: decimal;"
><li
>begins with 2</li
><li
><p
>and now 3</p
><p
>with a continuation</p
><ol start="4" style="list-style-type: lower-roman;"
><li
>sublist with roman numerals, starting with 4</li
><li
>more items<ol style="list-style-type: upper-alpha;"
><li
>a subsublist</li
><li
>a subsublist</li
></ol
></li
></ol
></li
></ol
><p
>Nesting:</p
><ol style="list-style-type: upper-alpha;"
><li
>Upper Alpha<ol style="list-style-type: upper-roman;"
><li
>Upper Roman.<ol start="6" style="list-style-type: decimal;"
><li
>Decimal start with 6<ol start="3" style="list-style-type: lower-alpha;"
><li
>Lower alpha with paren</li
></ol
></li
></ol
></li
></ol
></li
></ol
><p
>Autonumbering:</p
><ol
><li
>Autonumber.</li
><li
>More.<ol
><li
>Nested.</li
></ol
></li
></ol
><p
>Should not be a list item:</p
><p
>M.A.&nbsp;2007</p
><p
>B. Williams</p
><hr
/></div
></div
><div id="definition-lists"
><h1
>Definition Lists</h1
><p
>Tight using spaces:</p
><dl
><dt
>apple</dt
><dd
>red fruit</dd
><dt
>orange</dt
><dd
>orange fruit</dd
><dt
>banana</dt
><dd
>yellow fruit</dd
></dl
><p
>Tight using tabs:</p
><dl
><dt
>apple</dt
><dd
>red fruit</dd
><dt
>orange</dt
><dd
>orange fruit</dd
><dt
>banana</dt
><dd
>yellow fruit</dd
></dl
><p
>Loose:</p
><dl
><dt
>apple</dt
><dd
><p
>red fruit</p
></dd
><dt
>orange</dt
><dd
><p
>orange fruit</p
></dd
><dt
>banana</dt
><dd
><p
>yellow fruit</p
></dd
></dl
><p
>Multiple blocks with italics:</p
><dl
><dt
><em
>apple</em
></dt
><dd
><p
>red fruit</p
><p
>contains seeds, crisp, pleasant to taste</p
></dd
><dt
><em
>orange</em
></dt
><dd
><p
>orange fruit</p
><pre
><code
>{ orange code block }
</code
></pre
><blockquote
><p
>orange block quote</p
></blockquote
></dd
></dl
><p
>Multiple definitions, tight:</p
><dl
><dt
>apple</dt
><dd
>red fruit</dd
><dd
>computer</dd
><dt
>orange</dt
><dd
>orange fruit</dd
><dd
>bank</dd
></dl
><p
>Multiple definitions, loose:</p
><dl
><dt
>apple</dt
><dd
><p
>red fruit</p
></dd
><dd
><p
>computer</p
></dd
><dt
>orange</dt
><dd
><p
>orange fruit</p
></dd
><dd
><p
>bank</p
></dd
></dl
><p
>Blank line after term, indented marker, alternate markers:</p
><dl
><dt
>apple</dt
><dd
><p
>red fruit</p
></dd
><dd
><p
>computer</p
></dd
><dt
>orange</dt
><dd
><p
>orange fruit</p
><ol style="list-style-type: decimal;"
><li
>sublist</li
><li
>sublist</li
></ol
></dd
></dl
></div
><div id="html-blocks"
><h1
>HTML Blocks</h1
><p
>Simple block on one line:</p
><div>foo</div>
<p
>And nested without indentation:</p
><div>
<div>
<div>foo</div>
</div>
<div>bar</div>
</div>
<p
>Interpreted markdown in a table:</p
><table>
<tr>
<td>This is <em
>emphasized</em
></td>
<td>And this is <strong
>strong</strong
></td>
</tr>
</table>
<script type="text/javascript">document.write('This *should not* be interpreted as markdown');</script>
<p
>Here&rsquo;s a simple block:</p
><div>
foo</div>
<p
>This should be a code block, though:</p
><pre
><code
>&lt;div&gt;
foo
&lt;/div&gt;
</code
></pre
><p
>As should this:</p
><pre
><code
>&lt;div&gt;foo&lt;/div&gt;
</code
></pre
><p
>Now, nested:</p
><div>
<div>
<div>
foo</div>
</div>
</div>
<p
>This should just be an HTML comment:</p
><!-- Comment -->
<p
>Multiline:</p
><!--
Blah
Blah
-->
<!--
This is another comment.
-->
<p
>Code block:</p
><pre
><code
>&lt;!-- Comment --&gt;
</code
></pre
><p
>Just plain comment, with trailing spaces on the line:</p
><!-- foo -->
<p
>Code:</p
><pre
><code
>&lt;hr /&gt;
</code
></pre
><p
>Hr&rsquo;s:</p
><hr>
<hr />
<hr />
<hr>
<hr />
<hr />
<hr class="foo" id="bar" />
<hr class="foo" id="bar" />
<hr class="foo" id="bar">
<hr
/></div
><div id="inline-markup"
><h1
>Inline Markup</h1
><p
>This is <em
>emphasized</em
>, and so <em
>is this</em
>.</p
><p
>This is <strong
>strong</strong
>, and so <strong
>is this</strong
>.</p
><p
>An <em
><a href="/url"
>emphasized link</a
></em
>.</p
><p
><strong
><em
>This is strong and em.</em
></strong
></p
><p
>So is <strong
><em
>this</em
></strong
> word.</p
><p
><strong
><em
>This is strong and em.</em
></strong
></p
><p
>So is <strong
><em
>this</em
></strong
> word.</p
><p
>This is code: <code
>&gt;</code
>, <code
>$</code
>, <code
>\</code
>, <code
>\$</code
>, <code
>&lt;html&gt;</code
>.</p
><p
><span style="text-decoration: line-through;"
>This is <em
>strikeout</em
>.</span
></p
><p
>Superscripts: a<sup
>bc</sup
>d a<sup
><em
>hello</em
></sup
> a<sup
>hello&nbsp;there</sup
>.</p
><p
>Subscripts: H<sub
>2</sub
>O, H<sub
>23</sub
>O, H<sub
>many&nbsp;of&nbsp;them</sub
>O.</p
><p
>These should not be superscripts or subscripts, because of the unescaped spaces: a^b c^d, a~b c~d.</p
><hr
/></div
><div id="smart-quotes-ellipses-dashes"
><h1
>Smart quotes, ellipses, dashes</h1
><p
>&ldquo;Hello,&rdquo; said the spider. &ldquo;&lsquo;Shelob&rsquo; is my name.&rdquo;</p
><p
>&lsquo;A&rsquo;, &lsquo;B&rsquo;, and &lsquo;C&rsquo; are letters.</p
><p
>&lsquo;Oak,&rsquo; &lsquo;elm,&rsquo; and &lsquo;beech&rsquo; are names of trees. So is &lsquo;pine.&rsquo;</p
><p
>&lsquo;He said, &ldquo;I want to go.&rdquo;&rsquo; Were you alive in the 70&rsquo;s?</p
><p
>Here is some quoted &lsquo;<code
>code</code
>&rsquo; and a &ldquo;<a href="http://example.com/?foo=1&amp;bar=2"
>quoted link</a
>&rdquo;.</p
><p
>Some dashes: one&mdash;two &mdash; three&mdash;four &mdash; five.</p
><p
>Dashes between numbers: 5&ndash;7, 255&ndash;66, 1987&ndash;1999.</p
><p
>Ellipses&hellip;and&hellip;and&hellip;.</p
><hr
/></div
><div id="latex"
><h1
>LaTeX</h1
><ul
><li
></li
><li
><span class="math"
>2+2=4</span
></li
><li
><span class="math"
><em
>x</em
>&#8201;&#8712;&#8201;<em
>y</em
></span
></li
><li
><span class="math"
>&#945;&#8201;&#8743;&#8201;&#969;</span
></li
><li
><span class="math"
>223</span
></li
><li
><span class="math"
><em
>p</em
></span
>-Tree</li
><li
>Here&rsquo;s some display math: <span class="math"
>\frac{<em
>d</em
>}{<em
>dx</em
>}<em
>f</em
>(<em
>x</em
>)=\lim<sub
><em
>h</em
>&#8201;&#8594;&#8201;0</sub
>\frac{<em
>f</em
>(<em
>x</em
>+<em
>h</em
>)-<em
>f</em
>(<em
>x</em
>)}{<em
>h</em
>}</span
></li
><li
>Here&rsquo;s one that has a line break in it: <span class="math"
>&#945;+&#969;&#8201;×&#8201;<em
>x</em
><sup
>2</sup
></span
>.</li
></ul
><p
>These shouldn&rsquo;t be math:</p
><ul
><li
>To get the famous equation, write <code
>$e = mc^2$</code
>.</li
><li
>$22,000 is a <em
>lot</em
> of money. So is $34,000. (It worked if &ldquo;lot&rdquo; is emphasized.)</li
><li
>Shoes ($20) and socks ($5).</li
><li
>Escaped <code
>$</code
>: $73 <em
>this should be emphasized</em
> 23$.</li
></ul
><p
>Here&rsquo;s a LaTeX table:</p
><p
></p
><hr
/></div
><div id="special-characters"
><h1
>Special Characters</h1
><p
>Here is some unicode:</p
><ul
><li
>I hat: Î</li
><li
>o umlaut: ö</li
><li
>section: §</li
><li
>set membership: &#8712;</li
><li
>copyright: ©</li
></ul
><p
>AT&amp;T has an ampersand in their name.</p
><p
>AT&amp;T is another way to write it.</p
><p
>This &amp; that.</p
><p
>4 &lt; 5.</p
><p
>6 &gt; 5.</p
><p
>Backslash: \</p
><p
>Backtick: `</p
><p
>Asterisk: *</p
><p
>Underscore: _</p
><p
>Left brace: {</p
><p
>Right brace: }</p
><p
>Left bracket: [</p
><p
>Right bracket: ]</p
><p
>Left paren: (</p
><p
>Right paren: )</p
><p
>Greater-than: &gt;</p
><p
>Hash: #</p
><p
>Period: .</p
><p
>Bang: !</p
><p
>Plus: +</p
><p
>Minus: -</p
><hr
/></div
><div id="links"
><h1
>Links</h1
><div id="explicit"
><h2
>Explicit</h2
><p
>Just a <a href="/url/"
>URL</a
>.</p
><p
><a href="/url/" title="title"
>URL and title</a
>.</p
><p
><a href="/url/" title="title preceded by two spaces"
>URL and title</a
>.</p
><p
><a href="/url/" title="title preceded by a tab"
>URL and title</a
>.</p
><p
><a href="/url/" title="title with &quot;quotes&quot; in it"
>URL and title</a
></p
><p
><a href="/url/" title="title with single quotes"
>URL and title</a
></p
><p
><a href="/url/with_underscore"
>with_underscore</a
></p
><p
><script type="text/javascript"
>
<!--
h='&#110;&#x6f;&#x77;&#104;&#x65;&#114;&#x65;&#46;&#110;&#x65;&#116;';a='&#64;';n='&#110;&#x6f;&#98;&#x6f;&#100;&#x79;';e=n+a+h;
document.write('<a h'+'ref'+'="ma'+'ilto'+':'+e+'">'+'Email link'+'<\/'+'a'+'>');
// -->
</script
><noscript
>&#x45;&#x6d;&#x61;&#x69;&#108;&#32;&#108;&#x69;&#110;&#x6b;&#32;&#40;&#110;&#x6f;&#98;&#x6f;&#100;&#x79;&#32;&#x61;&#116;&#32;&#110;&#x6f;&#x77;&#104;&#x65;&#114;&#x65;&#32;&#100;&#x6f;&#116;&#32;&#110;&#x65;&#116;&#x29;</noscript
></p
><p
><a href=""
>Empty</a
>.</p
></div
><div id="reference"
><h2
>Reference</h2
><p
>Foo <a href="/url/"
>bar</a
>.</p
><p
>Foo <a href="/url/"
>bar</a
>.</p
><p
>Foo <a href="/url/"
>bar</a
>.</p
><p
>With <a href="/url/"
>embedded [brackets]</a
>.</p
><p
><a href="/url/"
>b</a
> by itself should be a link.</p
><p
>Indented <a href="/url"
>once</a
>.</p
><p
>Indented <a href="/url"
>twice</a
>.</p
><p
>Indented <a href="/url"
>thrice</a
>.</p
><p
>This should [not][] be a link.</p
><pre
><code
>[not]: /url
</code
></pre
><p
>Foo <a href="/url/" title="Title with &quot;quotes&quot; inside"
>bar</a
>.</p
><p
>Foo <a href="/url/" title="Title with &quot;quote&quot; inside"
>biz</a
>.</p
></div
><div id="with-ampersands"
><h2
>With ampersands</h2
><p
>Here&rsquo;s a <a href="http://example.com/?foo=1&amp;bar=2"
>link with an ampersand in the URL</a
>.</p
><p
>Here&rsquo;s a link with an amersand in the link text: <a href="http://att.com/" title="AT&amp;T"
>AT&amp;T</a
>.</p
><p
>Here&rsquo;s an <a href="/script?foo=1&amp;bar=2"
>inline link</a
>.</p
><p
>Here&rsquo;s an <a href="/script?foo=1&amp;bar=2"
>inline link in pointy braces</a
>.</p
></div
><div id="autolinks"
><h2
>Autolinks</h2
><p
>With an ampersand: <a href="http://example.com/?foo=1&amp;bar=2"
><code
>http://example.com/?foo=1&amp;bar=2</code
></a
></p
><ul
><li
>In a list?</li
><li
><a href="http://example.com/"
><code
>http://example.com/</code
></a
></li
><li
>It should.</li
></ul
><p
>An e-mail address: <script type="text/javascript"
>
<!--
h='&#110;&#x6f;&#x77;&#104;&#x65;&#114;&#x65;&#46;&#110;&#x65;&#116;';a='&#64;';n='&#110;&#x6f;&#98;&#x6f;&#100;&#x79;';e=n+a+h;
document.write('<a h'+'ref'+'="ma'+'ilto'+':'+e+'">'+'<code>'+e+'</code>'+'<\/'+'a'+'>');
// -->
</script
><noscript
>&#110;&#x6f;&#98;&#x6f;&#100;&#x79;&#32;&#x61;&#116;&#32;&#110;&#x6f;&#x77;&#104;&#x65;&#114;&#x65;&#32;&#100;&#x6f;&#116;&#32;&#110;&#x65;&#116;</noscript
></p
><blockquote
><p
>Blockquoted: <a href="http://example.com/"
><code
>http://example.com/</code
></a
></p
></blockquote
><p
>Auto-links should not occur here: <code
>&lt;http://example.com/&gt;</code
></p
><pre
><code
>or here: &lt;http://example.com/&gt;
</code
></pre
><hr
/></div
></div
><div id="images"
><h1
>Images</h1
><p
>From &ldquo;Voyage dans la Lune&rdquo; by Georges Melies (1902):</p
><p
><img src="lalune.jpg" title="Voyage dans la Lune" alt="lalune"
/></p
><p
>Here is a movie <img src="movie.jpg" alt="movie"
/> icon.</p
><hr
/></div
><div id="footnotes"
><h1
>Footnotes</h1
><p
>Here is a footnote reference,<a href="#fn1" class="footnoteRef" id="fnref1"
><sup
>1</sup
></a
> and another.<a href="#fn2" class="footnoteRef" id="fnref2"
><sup
>2</sup
></a
> This should <em
>not</em
> be a footnote reference, because it contains a space.[^my note] Here is an inline note.<a href="#fn3" class="footnoteRef" id="fnref3"
><sup
>3</sup
></a
></p
><blockquote
><p
>Notes can go in quotes.<a href="#fn4" class="footnoteRef" id="fnref4"
><sup
>4</sup
></a
></p
></blockquote
><ol style="list-style-type: decimal;"
><li
>And in list items.<a href="#fn5" class="footnoteRef" id="fnref5"
><sup
>5</sup
></a
></li
></ol
><p
>This paragraph should not be part of the note, as it is not indented.</p
></div
><div class="footnotes"
><hr
/><ol
><li id="fn1"
><p
>Here is the footnote. It can go anywhere after the footnote reference. It need not be placed at the end of the document. <a href="#fnref1" class="footnoteBackLink" title="Jump back to footnote 1">&#8617;</a></p
></li
><li id="fn2"
><p
>Here&rsquo;s the long note. This one contains multiple blocks.</p
><p
>Subsequent blocks are indented to show that they belong to the footnote (as with list items).</p
><pre
><code
> { &lt;code&gt; }
</code
></pre
><p
>If you want, you can indent every line, but you can also be lazy and just indent the first line of each block. <a href="#fnref2" class="footnoteBackLink" title="Jump back to footnote 2">&#8617;</a></p
></li
><li id="fn3"
><p
>This is <em
>easier</em
> to type. Inline notes may contain <a href="http://google.com"
>links</a
> and <code
>]</code
> verbatim characters, as well as [bracketed text]. <a href="#fnref3" class="footnoteBackLink" title="Jump back to footnote 3">&#8617;</a></p
></li
><li id="fn4"
><p
>In quote. <a href="#fnref4" class="footnoteBackLink" title="Jump back to footnote 4">&#8617;</a></p
></li
><li id="fn5"
><p
>In list. <a href="#fnref5" class="footnoteBackLink" title="Jump back to footnote 5">&#8617;</a></p
></li
></ol
></div
>
</body>
</html>