0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-28 10:24:19 +01:00

Use Jekyll's markdownify filter instead of a custom plugin (#25319)

This commit is contained in:
m5o 2018-01-19 18:30:17 +01:00 committed by XhmikosR
parent ee4988164e
commit 0f53402fc0
5 changed files with 28 additions and 51 deletions

View File

@ -1,20 +0,0 @@
module Jekyll
class MarkdownBlock < Liquid::Block
alias_method :render_block, :render
def initialize(tag_name, markup, tokens)
super
end
# Uses the default Jekyll markdown parser to
# parse the contents of this block
#
def render(context)
site = context.registers[:site]
converter = site.find_converter_instance(::Jekyll::Converters::Markdown)
converter.convert(render_block(context))
end
end
end
Liquid::Template.register_tag('markdown', Jekyll::MarkdownBlock)

View File

@ -63,37 +63,37 @@ All heading elements—e.g., `<h1>`—and `<p>` are reset to have their `margin-
<tbody>
<tr>
<td>
{% markdown %}`<h1></h1>`{% endmarkdown %}
{{ "`<h1></h1>`" | markdownify }}
</td>
<td><span class="h1">h1. Bootstrap heading</span></td>
</tr>
<tr>
<td>
{% markdown %}`<h2></h2>`{% endmarkdown %}
{{ "`<h2></h2>`" | markdownify }}
</td>
<td><span class="h2">h2. Bootstrap heading</span></td>
</tr>
<tr>
<td>
{% markdown %}`<h3></h3>`{% endmarkdown %}
{{ "`<h3></h3>`" | markdownify }}
</td>
<td><span class="h3">h3. Bootstrap heading</span></td>
</tr>
<tr>
<td>
{% markdown %}`<h4></h4>`{% endmarkdown %}
{{ "`<h4></h4>`" | markdownify }}
</td>
<td><span class="h4">h4. Bootstrap heading</span></td>
</tr>
<tr>
<td>
{% markdown %}`<h5></h5>`{% endmarkdown %}
{{ "`<h5></h5>`" | markdownify }}
</td>
<td><span class="h5">h5. Bootstrap heading</span></td>
</tr>
<tr>
<td>
{% markdown %}`<h6></h6>`{% endmarkdown %}
{{ "`<h6></h6>`" | markdownify }}
</td>
<td><span class="h6">h6. Bootstrap heading</span></td>
</tr>
@ -105,7 +105,7 @@ All heading elements—e.g., `<h1>`—and `<p>` are reset to have their `margin-
All lists—`<ul>`, `<ol>`, and `<dl>`—have their `margin-top` removed and a `margin-bottom: 1rem`. Nested lists have no `margin-bottom`.
<div class="bd-example">
{% markdown %}
{% capture markdown %}
* Lorem ipsum dolor sit amet
* Consectetur adipiscing elit
* Integer molestie lorem at massa
@ -127,23 +127,22 @@ All lists—`<ul>`, `<ol>`, and `<dl>`—have their `margin-top` removed and a `
6. Faucibus porta lacus fringilla vel
7. Aenean sit amet erat nunc
8. Eget porttitor lorem
{% endmarkdown %}
{% endcapture %}
{{ markdown | markdownify }}
</div>
For simpler styling, clear hierarchy, and better spacing, description lists have updated `margin`s. `<dd>`s reset `margin-left` to `0` and add `margin-bottom: .5rem`. `<dt>`s are **bolded**.
<div class="bd-example">
{% markdown %}
<dl>
<dt>Description lists</dt>
<dd>A description list is perfect for defining terms.</dd>
<dt>Euismod</dt>
<dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem.</dd>
<dd>Donec id elit non mi porta gravida at eget metus.</dd>
<dt>Malesuada porta</dt>
<dd>Etiam porta sem malesuada magna mollis euismod.</dd>
</dl>
{% endmarkdown %}
<dl>
<dt>Description lists</dt>
<dd>A description list is perfect for defining terms.</dd>
<dt>Euismod</dt>
<dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem.</dd>
<dd>Donec id elit non mi porta gravida at eget metus.</dd>
<dt>Malesuada porta</dt>
<dd>Etiam porta sem malesuada magna mollis euismod.</dd>
</dl>
</div>
## Preformatted text
@ -151,13 +150,11 @@ For simpler styling, clear hierarchy, and better spacing, description lists have
The `<pre>` element is reset to remove its `margin-top` and use `rem` units for its `margin-bottom`.
<div class="bd-example">
{% markdown %}
<pre>
.example-element {
margin-bottom: 1rem;
}
</pre>
{% endmarkdown %}
</div>
## Tables
@ -363,4 +360,4 @@ HTML5 adds [a new global attribute named `[hidden]`](https://developer.mozilla.o
`[hidden]` is not compatible with jQuery's `$(...).hide()` and `$(...).show()` methods. Therefore, we don't currently especially endorse `[hidden]` over other techniques for managing the `display` of elements.
{% endcallout %}
To merely toggle the visibility of an element, meaning its `display` is not modified and the element can still affect the flow of the document, use [the `.invisible` class]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/visibility/) instead.
To merely toggle the visibility of an element, meaning its `display` is not modified and the element can still affect the flow of the document, use [the `.invisible` class]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/visibility/) instead.

View File

@ -32,37 +32,37 @@ All HTML headings, `<h1>` through `<h6>`, are available.
<tbody>
<tr>
<td>
{% markdown %}`<h1></h1>`{% endmarkdown %}
{{ "`<h1></h1>`" | markdownify }}
</td>
<td><span class="h1">h1. Bootstrap heading</span></td>
</tr>
<tr>
<td>
{% markdown %}`<h2></h2>`{% endmarkdown %}
{{ "`<h2></h2>`" | markdownify }}
</td>
<td><span class="h2">h2. Bootstrap heading</span></td>
</tr>
<tr>
<td>
{% markdown %}`<h3></h3>`{% endmarkdown %}
{{ "`<h3></h3>`" | markdownify }}
</td>
<td><span class="h3">h3. Bootstrap heading</span></td>
</tr>
<tr>
<td>
{% markdown %}`<h4></h4>`{% endmarkdown %}
{{ "`<h4></h4>`" | markdownify }}
</td>
<td><span class="h4">h4. Bootstrap heading</span></td>
</tr>
<tr>
<td>
{% markdown %}`<h5></h5>`{% endmarkdown %}
{{ "`<h5></h5>`" | markdownify }}
</td>
<td><span class="h5">h5. Bootstrap heading</span></td>
</tr>
<tr>
<td>
{% markdown %}`<h6></h6>`{% endmarkdown %}
{{ "`<h6></h6>`" | markdownify }}
</td>
<td><span class="h6">h6. Bootstrap heading</span></td>
</tr>

View File

@ -39,7 +39,7 @@ Curious which components explicitly require jQuery, our JS, and Popper.js? Click
<details>
<summary class="text-primary mb-3">Show components requiring JavaScript</summary>
{% markdown %}
{% capture markdown %}
- Alerts for dismissing
- Buttons for toggling states and checkbox/radio functionality
- Carousel for all slide behaviors, controls, and indicators
@ -49,7 +49,8 @@ Curious which components explicitly require jQuery, our JS, and Popper.js? Click
- Navbar for extending our Collapse plugin to implement responsive behavior
- Tooltips and popovers for displaying and positioning (also requires [Popper.js](https://popper.js.org/))
- Scrollspy for scroll behavior and navigation updates
{% endmarkdown %}
{% endcapture %}
{{ markdown | markdownify }}
</details>
## Starter template

View File

@ -313,7 +313,6 @@ Our documentation received an upgrade across the board as well. Here's the low d
- `bugify.rb` is used to efficiently list out the entries on our [browser bugs]({{ site.baseurl }}/docs/{{ site.docs_version }}/browser-bugs/) page.
- `example.rb` is a custom fork of the default `highlight.rb` plugin, allowing for easier example-code handling.
- `callout.rb` is a similar custom fork of that, but designed for our special docs callouts.
- `markdown-block.rb` is used to to render Markdown snippets within HTML elements like tables.
- [jekyll-toc](https://github.com/toshimaru/jekyll-toc) is used to generate our table of contents.
- All docs content has been rewritten in Markdown (instead of HTML) for easier editing.
- Pages have been reorganized for simpler content and a more approachable hierarchy.