aboutsummaryrefslogtreecommitdiff
path: root/site
diff options
context:
space:
mode:
authorkyletsang <[email protected]>2021-10-09 22:05:50 -0700
committerMark Otto <[email protected]>2021-11-02 13:56:47 -0700
commit889286cef1ea4f7a647c90870a13c95de9827fc2 (patch)
treecb90f1a928ddd3a0853bc1019f075adcede1953f /site
parent05f1b15ddad0decd04feb0cc50a9b52703067638 (diff)
downloadbootstrap-889286cef1ea4f7a647c90870a13c95de9827fc2.tar.xz
bootstrap-889286cef1ea4f7a647c90870a13c95de9827fc2.zip
Add top placement info to offcanvas docs
Diffstat (limited to 'site')
-rw-r--r--site/content/docs/5.1/components/offcanvas.md3
1 files changed, 2 insertions, 1 deletions
diff --git a/site/content/docs/5.1/components/offcanvas.md b/site/content/docs/5.1/components/offcanvas.md
index b1dd9c601..fd18fe5c9 100644
--- a/site/content/docs/5.1/components/offcanvas.md
+++ b/site/content/docs/5.1/components/offcanvas.md
@@ -8,7 +8,7 @@ toc: true
## How it works
-Offcanvas is a sidebar component that can be toggled via JavaScript to appear from the left, right, or bottom edge of the viewport. Buttons or anchors are used as triggers that are attached to specific elements you toggle, and `data` attributes are used to invoke our JavaScript.
+Offcanvas is a sidebar component that can be toggled via JavaScript to appear from the left, right, top, or bottom edge of the viewport. Buttons or anchors are used as triggers that are attached to specific elements you toggle, and `data` attributes are used to invoke our JavaScript.
- Offcanvas shares some of the same JavaScript code as modals. Conceptually, they are quite similar, but they are separate plugins.
- Similarly, some [source Sass](#sass) variables for offcanvas's styles and dimensions are inherited from the modal's variables.
@@ -188,6 +188,7 @@ The offcanvas plugin utilizes a few classes and attributes to handle the heavy l
- `.offcanvas.show` shows the content
- `.offcanvas-start` hides the offcanvas on the left
- `.offcanvas-end` hides the offcanvas on the right
+- `.offcanvas-top` hides the offcanvas on the top
- `.offcanvas-bottom` hides the offcanvas on the bottom
Add a dismiss button with the `data-bs-dismiss="offcanvas"` attribute, which triggers the JavaScript functionality. Be sure to use the `<button>` element with it for proper behavior across all devices.