Improved HTML table output (line breaks).

This commit is contained in:
John MacFarlane 2011-02-04 23:25:28 -08:00
parent bb89fd9959
commit bdf23d3a5d
7 changed files with 187 additions and 70 deletions

View file

@ -366,11 +366,12 @@ blockToHtml opts (BlockQuote blocks) =
[OrderedList attribs lst] ->
blockToHtml (opts {writerIncremental = inc})
(OrderedList attribs lst)
_ -> blockListToHtml opts blocks >>=
(return . blockquote)
_ -> do contents <- blockListToHtml opts blocks
return $ blockquote (nl opts +++
contents +++ nl opts)
else do
contents <- blockListToHtml opts blocks
return $ blockquote contents
return $ blockquote (nl opts +++ contents +++ nl opts)
blockToHtml opts (Header level lst) = do
contents <- inlineListToHtml opts lst
secnum <- liftM stSecNum get
@ -431,7 +432,9 @@ blockToHtml opts (DefinitionList lst) = do
blockToHtml opts (Table capt aligns widths headers rows') = do
captionDoc <- if null capt
then return noHtml
else inlineListToHtml opts capt >>= return . caption
else do
cs <- inlineListToHtml opts capt
return $ caption cs +++ nl opts
let percent w = show (truncate (100*w) :: Integer) ++ "%"
let widthAttrs w = if writerHtml5 opts
then [thestyle $ "width: " ++ percent w]
@ -439,13 +442,17 @@ blockToHtml opts (Table capt aligns widths headers rows') = do
let coltags = if all (== 0.0) widths
then noHtml
else concatHtml $ map
(\w -> col ! (widthAttrs w) $ noHtml) widths
(\w -> (col ! (widthAttrs w)) noHtml +++ nl opts)
widths
head' <- if all null headers
then return noHtml
else liftM (thead <<) $ tableRowToHtml opts aligns 0 headers
body' <- liftM (tbody <<) $
else do
contents <- tableRowToHtml opts aligns 0 headers
return $ thead << (nl opts +++ contents) +++ nl opts
body' <- liftM (\x -> tbody << (nl opts +++ x)) $
zipWithM (tableRowToHtml opts aligns) [1..] rows'
return $ table $ captionDoc +++ coltags +++ head' +++ body'
return $ table $ nl opts +++ captionDoc +++ coltags +++ head' +++
body' +++ nl opts
tableRowToHtml :: WriterOptions
-> [Alignment]
@ -461,7 +468,8 @@ tableRowToHtml opts aligns rownum cols' = do
cols'' <- sequence $ zipWith
(\alignment item -> tableItemToHtml opts mkcell alignment item)
aligns cols'
return $ (tr ! [theclass rowclass] $ toHtmlFromList cols'') +++ nl opts
return $ (tr ! [theclass rowclass] $ nl opts +++ toHtmlFromList cols'')
+++ nl opts
alignmentToString :: Alignment -> [Char]
alignmentToString alignment = case alignment of

View file

@ -26,19 +26,14 @@ code.sourceCode span.er { color: red; font-weight: bold; }
</head>
<body>
<h1 id="lhs-test">lhs test</h1>
<p><code>unsplit</code> is an arrow that takes a pair of values and combines them to return a single value:</p>
<pre class="sourceCode"><code class="sourceCode haskell"><span class="ot">unsplit </span><span class="ot">::</span> (<span class="dt">Arrow</span> a) <span class="ot">=&gt;</span> (b <span class="ot">-&gt;</span> c <span class="ot">-&gt;</span> d) <span class="ot">-&gt;</span> a (b, c) d<br />unsplit <span class="fu">=</span> arr <span class="fu">.</span> <span class="fu">uncurry</span> <br /> <span class="co">-- arr (\op (x,y) -&gt; x `op` y) </span></code></pre>
<p><code>(***)</code> combines two arrows into a new arrow by running the two arrows on a pair of values (one arrow on the first item of the pair and one arrow on the second item of the pair).</p>
<pre><code>f *** g = first f &gt;&gt;&gt; second g
</code></pre>
<p>Block quote:</p>
<blockquote>
<p>foo bar</p></blockquote>
<p>foo bar</p>
</blockquote>
</body>
</html>

View file

@ -26,19 +26,14 @@ code.sourceCode span.er { color: red; font-weight: bold; }
</head>
<body>
<h1 id="lhs-test">lhs test</h1>
<p><code>unsplit</code> is an arrow that takes a pair of values and combines them to return a single value:</p>
<pre class="sourceCode"><code class="sourceCode haskell">&gt; <span class="ot">unsplit </span><span class="ot">::</span> (<span class="dt">Arrow</span> a) <span class="ot">=&gt;</span> (b <span class="ot">-&gt;</span> c <span class="ot">-&gt;</span> d) <span class="ot">-&gt;</span> a (b, c) d<br />&gt; unsplit <span class="fu">=</span> arr <span class="fu">.</span> <span class="fu">uncurry</span> <br />&gt; <span class="co">-- arr (\op (x,y) -&gt; x `op` y) </span></code></pre>
<p><code>(***)</code> combines two arrows into a new arrow by running the two arrows on a pair of values (one arrow on the first item of the pair and one arrow on the second item of the pair).</p>
<pre><code>f *** g = first f &gt;&gt;&gt; second g
</code></pre>
<p>Block quote:</p>
<blockquote>
<p>foo bar</p></blockquote>
<p>foo bar</p>
</blockquote>
</body>
</html>

View file

@ -4,18 +4,36 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="pandoc" />
<title></title>
<style type="text/css">
table.sourceCode, tr.sourceCode, td.lineNumbers, td.sourceCode, table.sourceCode pre
{ margin: 0; padding: 0; border: 0; vertical-align: baseline; border: none; }
td.lineNumbers { border-right: 1px solid #AAAAAA; text-align: right; color: #AAAAAA; padding-right: 5px; padding-left: 5px; }
td.sourceCode { padding-left: 5px; }
code.sourceCode span.kw { color: #007020; font-weight: bold; }
code.sourceCode span.dt { color: #902000; }
code.sourceCode span.dv { color: #40a070; }
code.sourceCode span.bn { color: #40a070; }
code.sourceCode span.fl { color: #40a070; }
code.sourceCode span.ch { color: #4070a0; }
code.sourceCode span.st { color: #4070a0; }
code.sourceCode span.co { color: #60a0b0; font-style: italic; }
code.sourceCode span.ot { color: #007020; }
code.sourceCode span.al { color: red; font-weight: bold; }
code.sourceCode span.fu { color: #06287e; }
code.sourceCode span.re { }
code.sourceCode span.er { color: red; font-weight: bold; }
</style>
</head>
<body>
<h1 id="lhs-test">lhs test</h1>
<p><code>unsplit</code> is an arrow that takes a pair of values and combines them to return a single value:</p>
<pre class="sourceCode haskell"><code>unsplit :: (Arrow a) =&gt; (b -&gt; c -&gt; d) -&gt; a (b, c) d
unsplit = arr . uncurry
-- arr (\op (x,y) -&gt; x `op` y)
</code></pre>
<pre class="sourceCode"><code class="sourceCode haskell"><span class="ot">unsplit </span><span class="ot">::</span> (<span class="dt">Arrow</span> a) <span class="ot">=&gt;</span> (b <span class="ot">-&gt;</span> c <span class="ot">-&gt;</span> d) <span class="ot">-&gt;</span> a (b, c) d<br />unsplit <span class="fu">=</span> arr <span class="fu">.</span> <span class="fu">uncurry</span> <br /> <span class="co">-- arr (\op (x,y) -&gt; x `op` y) </span></code></pre>
<p><code>(***)</code> combines two arrows into a new arrow by running the two arrows on a pair of values (one arrow on the first item of the pair and one arrow on the second item of the pair).</p>
<pre><code>f *** g = first f &gt;&gt;&gt; second g
</code></pre>
<p>Block quote:</p>
<blockquote><p>foo bar</p></blockquote>
<blockquote>
<p>foo bar</p>
</blockquote>
</body>
</html>

View file

@ -4,18 +4,36 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="pandoc" />
<title></title>
<style type="text/css">
table.sourceCode, tr.sourceCode, td.lineNumbers, td.sourceCode, table.sourceCode pre
{ margin: 0; padding: 0; border: 0; vertical-align: baseline; border: none; }
td.lineNumbers { border-right: 1px solid #AAAAAA; text-align: right; color: #AAAAAA; padding-right: 5px; padding-left: 5px; }
td.sourceCode { padding-left: 5px; }
code.sourceCode span.kw { color: #007020; font-weight: bold; }
code.sourceCode span.dt { color: #902000; }
code.sourceCode span.dv { color: #40a070; }
code.sourceCode span.bn { color: #40a070; }
code.sourceCode span.fl { color: #40a070; }
code.sourceCode span.ch { color: #4070a0; }
code.sourceCode span.st { color: #4070a0; }
code.sourceCode span.co { color: #60a0b0; font-style: italic; }
code.sourceCode span.ot { color: #007020; }
code.sourceCode span.al { color: red; font-weight: bold; }
code.sourceCode span.fu { color: #06287e; }
code.sourceCode span.re { }
code.sourceCode span.er { color: red; font-weight: bold; }
</style>
</head>
<body>
<h1 id="lhs-test">lhs test</h1>
<p><code>unsplit</code> is an arrow that takes a pair of values and combines them to return a single value:</p>
<pre class="sourceCode literate haskell"><code>&gt; unsplit :: (Arrow a) =&gt; (b -&gt; c -&gt; d) -&gt; a (b, c) d
&gt; unsplit = arr . uncurry
&gt; -- arr (\op (x,y) -&gt; x `op` y)
</code></pre>
<pre class="sourceCode"><code class="sourceCode haskell">&gt; <span class="ot">unsplit </span><span class="ot">::</span> (<span class="dt">Arrow</span> a) <span class="ot">=&gt;</span> (b <span class="ot">-&gt;</span> c <span class="ot">-&gt;</span> d) <span class="ot">-&gt;</span> a (b, c) d<br />&gt; unsplit <span class="fu">=</span> arr <span class="fu">.</span> <span class="fu">uncurry</span> <br />&gt; <span class="co">-- arr (\op (x,y) -&gt; x `op` y) </span></code></pre>
<p><code>(***)</code> combines two arrows into a new arrow by running the two arrows on a pair of values (one arrow on the first item of the pair and one arrow on the second item of the pair).</p>
<pre><code>f *** g = first f &gt;&gt;&gt; second g
</code></pre>
<p>Block quote:</p>
<blockquote><p>foo bar</p></blockquote>
<blockquote>
<p>foo bar</p>
</blockquote>
</body>
</html>

View file

@ -1,129 +1,198 @@
<p>Simple table with caption:</p>
<table><caption>Demonstration of simple table syntax.</caption><thead><tr class="header"><th align="right">Right</th>
<table>
<caption>Demonstration of simple table syntax.</caption>
<thead>
<tr class="header">
<th align="right">Right</th>
<th align="left">Left</th>
<th align="center">Center</th>
<th align="left">Default</th>
</tr>
</thead><tbody><tr class="odd"><td align="right">12</td>
</thead>
<tbody>
<tr class="odd">
<td align="right">12</td>
<td align="left">12</td>
<td align="center">12</td>
<td align="left">12</td>
</tr>
<tr class="even"><td align="right">123</td>
<tr class="even">
<td align="right">123</td>
<td align="left">123</td>
<td align="center">123</td>
<td align="left">123</td>
</tr>
<tr class="odd"><td align="right">1</td>
<tr class="odd">
<td align="right">1</td>
<td align="left">1</td>
<td align="center">1</td>
<td align="left">1</td>
</tr>
</tbody></table>
</tbody>
</table>
<p>Simple table without caption:</p>
<table><thead><tr class="header"><th align="right">Right</th>
<table>
<thead>
<tr class="header">
<th align="right">Right</th>
<th align="left">Left</th>
<th align="center">Center</th>
<th align="left">Default</th>
</tr>
</thead><tbody><tr class="odd"><td align="right">12</td>
</thead>
<tbody>
<tr class="odd">
<td align="right">12</td>
<td align="left">12</td>
<td align="center">12</td>
<td align="left">12</td>
</tr>
<tr class="even"><td align="right">123</td>
<tr class="even">
<td align="right">123</td>
<td align="left">123</td>
<td align="center">123</td>
<td align="left">123</td>
</tr>
<tr class="odd"><td align="right">1</td>
<tr class="odd">
<td align="right">1</td>
<td align="left">1</td>
<td align="center">1</td>
<td align="left">1</td>
</tr>
</tbody></table>
</tbody>
</table>
<p>Simple table indented two spaces:</p>
<table><caption>Demonstration of simple table syntax.</caption><thead><tr class="header"><th align="right">Right</th>
<table>
<caption>Demonstration of simple table syntax.</caption>
<thead>
<tr class="header">
<th align="right">Right</th>
<th align="left">Left</th>
<th align="center">Center</th>
<th align="left">Default</th>
</tr>
</thead><tbody><tr class="odd"><td align="right">12</td>
</thead>
<tbody>
<tr class="odd">
<td align="right">12</td>
<td align="left">12</td>
<td align="center">12</td>
<td align="left">12</td>
</tr>
<tr class="even"><td align="right">123</td>
<tr class="even">
<td align="right">123</td>
<td align="left">123</td>
<td align="center">123</td>
<td align="left">123</td>
</tr>
<tr class="odd"><td align="right">1</td>
<tr class="odd">
<td align="right">1</td>
<td align="left">1</td>
<td align="center">1</td>
<td align="left">1</td>
</tr>
</tbody></table>
</tbody>
</table>
<p>Multiline table with caption:</p>
<table><caption>Here's the caption. It may span multiple lines.</caption><col width="15%" /><col width="13%" /><col width="16%" /><col width="33%" /><thead><tr class="header"><th align="center">Centered Header</th>
<table>
<caption>Here's the caption. It may span multiple lines.</caption>
<col width="15%" />
<col width="13%" />
<col width="16%" />
<col width="33%" />
<thead>
<tr class="header">
<th align="center">Centered Header</th>
<th align="left">Left Aligned</th>
<th align="right">Right Aligned</th>
<th align="left">Default aligned</th>
</tr>
</thead><tbody><tr class="odd"><td align="center">First</td>
</thead>
<tbody>
<tr class="odd">
<td align="center">First</td>
<td align="left">row</td>
<td align="right">12.0</td>
<td align="left">Example of a row that spans multiple lines.</td>
</tr>
<tr class="even"><td align="center">Second</td>
<tr class="even">
<td align="center">Second</td>
<td align="left">row</td>
<td align="right">5.0</td>
<td align="left">Here's another one. Note the blank line between rows.</td>
</tr>
</tbody></table>
</tbody>
</table>
<p>Multiline table without caption:</p>
<table><col width="15%" /><col width="13%" /><col width="16%" /><col width="33%" /><thead><tr class="header"><th align="center">Centered Header</th>
<table>
<col width="15%" />
<col width="13%" />
<col width="16%" />
<col width="33%" />
<thead>
<tr class="header">
<th align="center">Centered Header</th>
<th align="left">Left Aligned</th>
<th align="right">Right Aligned</th>
<th align="left">Default aligned</th>
</tr>
</thead><tbody><tr class="odd"><td align="center">First</td>
</thead>
<tbody>
<tr class="odd">
<td align="center">First</td>
<td align="left">row</td>
<td align="right">12.0</td>
<td align="left">Example of a row that spans multiple lines.</td>
</tr>
<tr class="even"><td align="center">Second</td>
<tr class="even">
<td align="center">Second</td>
<td align="left">row</td>
<td align="right">5.0</td>
<td align="left">Here's another one. Note the blank line between rows.</td>
</tr>
</tbody></table>
</tbody>
</table>
<p>Table without column headers:</p>
<table><tbody><tr class="odd"><td align="right">12</td>
<table>
<tbody>
<tr class="odd">
<td align="right">12</td>
<td align="left">12</td>
<td align="center">12</td>
<td align="right">12</td>
</tr>
<tr class="even"><td align="right">123</td>
<tr class="even">
<td align="right">123</td>
<td align="left">123</td>
<td align="center">123</td>
<td align="right">123</td>
</tr>
<tr class="odd"><td align="right">1</td>
<tr class="odd">
<td align="right">1</td>
<td align="left">1</td>
<td align="center">1</td>
<td align="right">1</td>
</tr>
</tbody></table>
</tbody>
</table>
<p>Multiline table without column headers:</p>
<table><col width="15%" /><col width="13%" /><col width="16%" /><col width="33%" /><tbody><tr class="odd"><td align="center">First</td>
<table>
<col width="15%" />
<col width="13%" />
<col width="16%" />
<col width="33%" />
<tbody>
<tr class="odd">
<td align="center">First</td>
<td align="left">row</td>
<td align="right">12.0</td>
<td align="left">Example of a row that spans multiple lines.</td>
</tr>
<tr class="even"><td align="center">Second</td>
<tr class="even">
<td align="center">Second</td>
<td align="left">row</td>
<td align="right">5.0</td>
<td align="left">Here's another one. Note the blank line between rows.</td>
</tr>
</tbody></table>
</tbody>
</table>

View file

@ -32,8 +32,11 @@
<hr />
<h1 id="block-quotes">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>
<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;;
}
@ -44,8 +47,13 @@
<li>item two</li>
</ol>
<p>Nested block quotes:</p>
<blockquote><p>nested</p></blockquote>
<blockquote><p>nested</p></blockquote></blockquote>
<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 />
@ -262,7 +270,9 @@ These should not be escaped: \$ \\ \&gt; \[ \{
<dd><p>orange fruit</p>
<pre><code>{ orange code block }
</code></pre>
<blockquote><p>orange block quote</p></blockquote>
<blockquote>
<p>orange block quote</p>
</blockquote>
</dd>
</dl>
<p>Multiple definitions, tight:</p>
@ -523,7 +533,9 @@ h='&#110;&#x6f;&#x77;&#104;&#x65;&#114;&#x65;&#46;&#110;&#x65;&#116;';a='&#64;';
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 class="url">http://example.com/</code></a></p></blockquote>
<blockquote>
<p>Blockquoted: <a href="http://example.com/"><code class="url">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>
@ -537,7 +549,9 @@ document.write('<a h'+'ref'+'="ma'+'ilto'+':'+e+'">'+'<code>'+e+'</code>'+'<\/'+
<hr />
<h1 id="footnotes">Footnotes</h1>
<p>Here is a footnote reference,<sup><a href="#fn1" class="footnoteRef" id="fnref1">1</a></sup> and another.<sup><a href="#fn2" class="footnoteRef" id="fnref2">2</a></sup> This should <em>not</em> be a footnote reference, because it contains a space.[^my note] Here is an inline note.<sup><a href="#fn3" class="footnoteRef" id="fnref3">3</a></sup></p>
<blockquote><p>Notes can go in quotes.<sup><a href="#fn4" class="footnoteRef" id="fnref4">4</a></sup></p></blockquote>
<blockquote>
<p>Notes can go in quotes.<sup><a href="#fn4" class="footnoteRef" id="fnref4">4</a></sup></p>
</blockquote>
<ol style="list-style-type: decimal">
<li>And in list items.<sup><a href="#fn5" class="footnoteRef" id="fnref5">5</a></sup></li>
</ol>