mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-11 18:02:28 +03:00
Code Activity

Improve callout shortcode. (#31802)

Browse Source 
Remove the `markdownify` call, and instead rely on Hugo's proper syntax; `{{% callout %}}` when we want to the content to be processed as Markdown.

This allows for stuff like:

{{% callout info %}}
##### I'm an info callout!

```css
.foo {
  color: #fff;
}
```

{{< example >}}
<div class="alert alert-warning alert-dismissible fade show" role="alert">
  <strong>Holy guacamole!</strong> You should check in on some of those fields below.
  <button type="button" class="btn-close" data-dismiss="alert" aria-label="Close"></button>
</div>
{{< /example >}}
{{% /callout %}}
This commit is contained in:
XhmikosR
2020-10-12 09:06:06 +03:00
committed by GitHub
parent c8523d71e7
commit 5c6925385e
35 changed files with 131 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/content/docs/5.0/components/dropdowns.md
+6 -6
View File
@@ -632,9 +632,9 @@ Add `.disabled` to items in the dropdown to **style them as disabled**.
By default, a dropdown menu is automatically positioned 100% from the top and along the left side of its parent. Add `.dropdown-menu-right` to a `.dropdown-menu` to right align the dropdown menu.
{{< callout info >}}
{{% callout info %}}
**Heads up!** Dropdowns are positioned thanks to Popper.js (except when they are contained in a navbar).
{{< /callout >}}
{{% /callout %}}
{{< example >}}
<div class="btn-group">
@@ -817,9 +817,9 @@ Use `data-offset` or `data-reference` to change the location of the dropdown.
Via data attributes or JavaScript, the dropdown plugin toggles hidden content (dropdown menus) by toggling the `.show` class on the parent list item. The `data-toggle="dropdown"` attribute is relied on for closing dropdown menus at an application level, so it's a good idea to always use it.
{{< callout info >}}
{{% callout info %}}
On touch-enabled devices, opening a dropdown adds empty `mouseover` handlers to the immediate children of the `<body>` element. This admittedly ugly hack is necessary to work around a [quirk in iOS' event delegation](https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html), which would otherwise prevent a tap anywhere outside of the dropdown from triggering the code that closes the dropdown. Once the dropdown is closed, these additional empty `mouseover` handlers are removed.
{{< /callout >}}
{{% /callout %}}
### Via data attributes
@@ -847,11 +847,11 @@ var dropdownList = dropdownElementList.map(function (dropdownToggleEl) {
})
{{< /highlight >}}
{{< callout info >}}
{{% callout info %}}
##### `data-toggle="dropdown"` still required
Regardless of whether you call your dropdown via JavaScript or instead use the data-api, `data-toggle="dropdown"` is always required to be present on the dropdown's trigger element.
{{< /callout >}}
{{% /callout %}}
### Options