diff options
author | Mark Otto <markdotto@gmail.com> | 2022-04-21 20:05:14 +0300 |
---|---|---|
committer | Mark Otto <otto@github.com> | 2022-04-22 05:56:05 +0300 |
commit | 9a614a7e1dd21d6a4b2f6e36c0ad390fd4767528 (patch) | |
tree | f46e7f9cfb6823b44303b2c5750f21c3e929a884 | |
parent | 554736834dd929263ab307593f4d4d3f28f61479 (diff) |
Add .show class to offcanvas example, and disable it's normal behavior in our JS
-rw-r--r-- | site/assets/js/application.js | 8 | ||||
-rw-r--r-- | site/content/docs/5.1/components/offcanvas.md | 2 |
2 files changed, 9 insertions, 1 deletions
diff --git a/site/assets/js/application.js b/site/assets/js/application.js index 55e8969802..20d917990e 100644 --- a/site/assets/js/application.js +++ b/site/assets/js/application.js @@ -131,4 +131,12 @@ modalBodyInput.value = recipient }) } + + // Offcanvas demo + const myOffcanvas = document.querySelector('.bd-example-offcanvas #offcanvas') + if (myOffcanvas) { + myOffcanvas.addEventListener('show.bs.offcanvas', event => { + event.preventDefault() + }, false) + } })() diff --git a/site/content/docs/5.1/components/offcanvas.md b/site/content/docs/5.1/components/offcanvas.md index 10d184ed57..5df9aecc1e 100644 --- a/site/content/docs/5.1/components/offcanvas.md +++ b/site/content/docs/5.1/components/offcanvas.md @@ -28,7 +28,7 @@ Offcanvas is a sidebar component that can be toggled via JavaScript to appear fr Below is an offcanvas example that is shown by default (via `.show` on `.offcanvas`). Offcanvas includes support for a header with a close button and an optional body class for some initial `padding`. We suggest that you include offcanvas headers with dismiss actions whenever possible, or provide an explicit dismiss action. {{< example class="bd-example-offcanvas p-0 bg-light overflow-hidden" >}} -<div class="offcanvas offcanvas-start" tabindex="-1" id="offcanvas" aria-labelledby="offcanvasLabel"> +<div class="offcanvas offcanvas-start show" tabindex="-1" id="offcanvas" aria-labelledby="offcanvasLabel"> <div class="offcanvas-header"> <h5 class="offcanvas-title" id="offcanvasLabel">Offcanvas</h5> <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button> |