aboutsummaryrefslogtreecommitdiff
path: root/_includes
diff options
context:
space:
mode:
authorm5o <[email protected]>2018-01-16 00:49:36 +0200
committerXhmikosR <[email protected]>2018-03-12 21:50:21 +0200
commitb5e6eb22a6da98c489c00e6266daa4599e3ce097 (patch)
treeca46ac63204c54c0e6c63a78f33f2a2262d82ac3 /_includes
parent7b2427cc6b790b2b66dee32ba55b8fa694b789e2 (diff)
downloadbootstrap-b5e6eb22a6da98c489c00e6266daa4599e3ce097.tar.xz
bootstrap-b5e6eb22a6da98c489c00e6266daa4599e3ce097.zip
Use callout without custom Jekyll plugin.
Diffstat (limited to '_includes')
-rw-r--r--_includes/callout-danger-async-methods.md5
-rw-r--r--_includes/callout-info-mediaqueries-breakpoints.md5
-rw-r--r--_includes/callout-warning-color-assistive-technologies.md5
-rw-r--r--_includes/callout.html5
4 files changed, 14 insertions, 6 deletions
diff --git a/_includes/callout-danger-async-methods.md b/_includes/callout-danger-async-methods.md
index 89d2e2cab..ca35e0b77 100644
--- a/_includes/callout-danger-async-methods.md
+++ b/_includes/callout-danger-async-methods.md
@@ -1,7 +1,8 @@
-{% callout danger %}
+{% capture callout %}
#### Asynchronous methods and transitions
All API methods are **asynchronous** and start a **transition**. They return to the caller as soon as the transition is started but **before it ends**. In addition, a method call on a **transitioning component will be ignored**.
[See our JavaScript documentation for more information.]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/)
-{% endcallout %}
+{% endcapture %}
+{% include callout.html content=callout type="danger" %}
diff --git a/_includes/callout-info-mediaqueries-breakpoints.md b/_includes/callout-info-mediaqueries-breakpoints.md
index ddf2b3745..d3988ce1a 100644
--- a/_includes/callout-info-mediaqueries-breakpoints.md
+++ b/_includes/callout-info-mediaqueries-breakpoints.md
@@ -1,3 +1,4 @@
-{% callout info %}
+{% capture callout %}
Note that since browsers do not currently support [range context queries](https://www.w3.org/TR/mediaqueries-4/#range-context), we work around the limitations of [`min-` and `max-` prefixes](https://www.w3.org/TR/mediaqueries-4/#mq-min-max) and viewports with fractional widths (which can occur under certain conditions on high-dpi devices, for instance) by using values with higher precision for these comparisons.
-{% endcallout %} \ No newline at end of file
+{% endcapture %}
+{% include callout.html content=callout type="info" %}
diff --git a/_includes/callout-warning-color-assistive-technologies.md b/_includes/callout-warning-color-assistive-technologies.md
index adbc708f6..98214eb58 100644
--- a/_includes/callout-warning-color-assistive-technologies.md
+++ b/_includes/callout-warning-color-assistive-technologies.md
@@ -1,5 +1,6 @@
-{% callout warning %}
+{% capture callout %}
##### Conveying meaning to assistive technologies
Using color to add meaning only provides a visual indication, which will not be conveyed to users of assistive technologies – such as screen readers. Ensure that information denoted by the color is either obvious from the content itself (e.g. the visible text), or is included through alternative means, such as additional text hidden with the `.sr-only` class.
-{% endcallout %}
+{% endcapture %}
+{% include callout.html content=callout type="warning" %}
diff --git a/_includes/callout.html b/_includes/callout.html
new file mode 100644
index 000000000..8ee72de99
--- /dev/null
+++ b/_includes/callout.html
@@ -0,0 +1,5 @@
+{% comment %} allowed: info danger warning {% endcomment %}
+{% assign css_class = include.type | default: "info" %}
+<div class="bd-callout bd-callout-{{ css_class }}">
+ {{ include.content | markdownify }}
+</div>