diff options
| -rw-r--r-- | Bugzilla/Install/Requirements.pm | 6 | ||||
| -rw-r--r-- | Bugzilla/Markdown.pm | 4 | ||||
| -rw-r--r-- | skins/standard/global.css | 14 | ||||
| -rw-r--r-- | template/en/default/pages/markdown.html.tmpl | 123 |
4 files changed, 142 insertions, 5 deletions
diff --git a/Bugzilla/Install/Requirements.pm b/Bugzilla/Install/Requirements.pm index e9cf230c4..e8a90cab7 100644 --- a/Bugzilla/Install/Requirements.pm +++ b/Bugzilla/Install/Requirements.pm @@ -404,9 +404,9 @@ sub OPTIONAL_MODULES { # Markdown { - package => 'Text-Markdown', - module => 'Text::Markdown', - version => '1.0.26', + package => 'Text-MultiMarkdown', + module => 'Text::MultiMarkdown', + version => '1.000035', feature => ['markdown'], }, diff --git a/Bugzilla/Markdown.pm b/Bugzilla/Markdown.pm index ed5608025..e9b0d1a17 100644 --- a/Bugzilla/Markdown.pm +++ b/Bugzilla/Markdown.pm @@ -16,7 +16,7 @@ use Bugzilla::Template; use Digest::MD5 qw(md5_hex); -use parent qw(Text::Markdown); +use parent qw(Text::MultiMarkdown); @Bugzilla::Markdown::EXPORT = qw(new); @@ -489,7 +489,7 @@ Bugzilla::Markdown - Generates HTML output from structured plain-text input. Bugzilla::Markdown implements a Markdown engine that produces an HTML-based output from a given plain-text input. -The majority of the implementation is done by C<Text::Markdown> +The majority of the implementation is done by C<Text::MultiMarkdown> CPAN module. It also applies the linkifications done in L<Bugzilla::Template> to the input resulting in an output which is a combination of both Markdown structures and those defined by Bugzilla itself. diff --git a/skins/standard/global.css b/skins/standard/global.css index 3d9a4b1ed..6d0e64a86 100644 --- a/skins/standard/global.css +++ b/skins/standard/global.css @@ -336,6 +336,20 @@ pre.bz_comment_text, .uneditable_textarea, tbody.file pre { display: block; } +.bz_comment_text table { + border-collapse:collapse; +} + +.bz_comment_text table, .bz_comment_text th, .bz_comment_text td { + border: 1px solid #969696; + padding: 2px; +} + +.bz_comment_text thead, .bz_comment_text tbody { + border-top: 2px solid black; + border-bottom: 2px solid black; +} + .bz_comment_user, .bz_comment_time, .bz_comment_number, .bz_private_checkbox, .bz_comment_actions { diff --git a/template/en/default/pages/markdown.html.tmpl b/template/en/default/pages/markdown.html.tmpl index 8b43f5f17..5b01ed43d 100644 --- a/template/en/default/pages/markdown.html.tmpl +++ b/template/en/default/pages/markdown.html.tmpl @@ -25,6 +25,8 @@ <li><a href="#code">Code</a></li> <li><a href="#strikethroughs">Strikethroughs</a></li> <li><a href="#links">Links</a></li> + <li><a href="#tables">Tables</a></li> + <li><a href="#definitions">Definitions</a></li> </ul> <h2 id="headers">Headers</h2> @@ -262,4 +264,125 @@ </pre> </p> +<h2 id="tables">Tables</h2> + +Tables can be defined using these special syntax: + +<pre><code> + | | Grouping || + First Header | Second Header | Third Header | + ------------ | :-----------: | -----------: | + Content | *Long Cell* || + Content | **Cell** | Cell | + + New section | More | Data | + And more | More | **Data** | +</code></pre> + +<p>which gets converted into:</p> + +<div class="bz_comment_text"> + <table style="margin-left: 5em"> + <colgroup> + <col style="text-align:left;"/> + <col style="text-align:center;"/> + <col style="text-align:right;"/> + </colgroup> + + <thead> + <tr> + <th style="text-align:left;"></th> + <th style="text-align:center;" colspan="2">Grouping</th> + </tr> + <tr> + <th style="text-align:left;">First Header</th> + <th style="text-align:center;">Second Header</th> + <th style="text-align:right;">Third Header</th> + </tr> + </thead> + <tbody> + <tr> + <td style="text-align:left;">Content</td> + <td style="text-align:center;" colspan="2"><em>Long Cell</em></td> + </tr> + <tr> + <td style="text-align:left;">Content</td> + <td style="text-align:center;"><strong>Cell</strong></td> + <td style="text-align:right;">Cell</td> + </tr> + </tbody> + <tbody> + <tr> + <td style="text-align:left;">New section</td> + <td style="text-align:center;">More</td> + <td style="text-align:right;">Data</td> + </tr> + <tr> + <td style="text-align:left;">And more</td> + <td style="text-align:center;">More</td> + <td style="text-align:right;"><strong>Data</strong></td> + </tr> + </tbody> + </table> +</div> + +<p>The table rules are:</p> + +<ul> + <li>There must be at least one <code>|</code> per line</li> + <li>The “separator” line between headers and table content must contain only <code>|</code>,<code>-</code>, <code>=</code>, <code>:</code>,<code>.</code>, <code>+</code>, or spaces</li> + <li>Cell content must be on one line only</li> + <li>Columns are separated by <code>|</code></li> + <li>The first line of the table, and the alignment/divider line, must start at + the beginning of the line</li> +</ul> + +<p>Other notes:</p> + +<ul> + <li>It is optional whether you have <code>|</code> characters at the beginning and end of lines.</li> + <li>The “separator” line uses <code>----</code> or <code>====</code> to indicate the line between a header and cell. The length of the line doesn’t matter, but must have at least one character per cell.</li> + <li>To set alignment, you can use a colon to designate left or right alignment, or a colon at each end to designate center alignment, as above. If no colon is present, the default alignment of your system is selected (left in most cases). </li> + <li>To indicate that a cell should span multiple columns, then simply add additional pipes (<code>|</code>) at the end of the cell, as shown in the example. If the cell in question is at the end of the row, then of course that means that pipes are not optional at the end of that row…. The number of pipes equals the number of columns the cell should span.</li> + <li>You can use Markdown markup within the table cells.</li> + <li>Cells can be empty.</li> +</ul> + +<h2 id="definitions">Definition Lists</h2> + +Definition lists uses this syntax: + +<pre><code> + Apple + : Pomaceous fruit of plants of the genus Malus in + the family Rosaceae. + : An american computer company. + + Orange + : The fruit of an evergreen tree of the genus Citrus. +</code></pre> + +<p>becomes:</p> + +<div class="bz_comment_text"> + <dl style="margin-left: 5em"> + <dt>Apple</dt> + <dd>Pomaceous fruit of plants of the genus Malus in + the family Rosaceae.</dd> + + <dd>An american computer company.</dd> + + <dt>Orange</dt> + <dd>The fruit of an evergreen tree of the genus Citrus.</dd> + </dl> +</div> + +<p>You can have more than one term per definition by placing each term on a + separate line. Each definition starts with a colon, and you can have more than + one definition per term. You may optionally have a blank line between the last + term and the first definition.</p> + +<p>Definitions may contain other block level elements, such as lists, + blockquotes, or other definition lists.</p> + [% PROCESS global/footer.html.tmpl %] |