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:
parent
ee4988164e
commit
0f53402fc0
@ -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)
|
@ -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.
|
||||
|
@ -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>
|
||||
|
@ -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
|
||||
|
@ -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.
|
||||
|
Loading…
Reference in New Issue
Block a user