diff options
| author | Mark Otto <markdotto@gmail.com> | 2022-04-12 05:18:12 +0300 |
|---|---|---|
| committer | Mark Otto <markdotto@gmail.com> | 2022-04-12 05:18:12 +0300 |
| commit | 2d75007f0a2b92a839d9e3421f02f930fd4cb61d (patch) | |
| tree | e7a0a116c206bf46c192b5ec050c3a60ccbb43e8 | |
| parent | e206a6021bda6b9ccb07b3821477f4e38bc9d413 (diff) | |
Update offcanvas example to include .show classoffcanvas-docs-show-class
| -rw-r--r-- | site/content/docs/5.1/components/offcanvas.md | 18 |
1 files changed, 15 insertions, 3 deletions
diff --git a/site/content/docs/5.1/components/offcanvas.md b/site/content/docs/5.1/components/offcanvas.md index 7a8cbc68a7..f9c1b2bf4a 100644 --- a/site/content/docs/5.1/components/offcanvas.md +++ b/site/content/docs/5.1/components/offcanvas.md @@ -27,8 +27,20 @@ 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="bd-example bd-example-offcanvas p-0 bg-light overflow-hidden"> + <div class="offcanvas offcanvas-start" 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> + </div> + <div class="offcanvas-body"> + Content for the offcanvas goes here. You can place just about any Bootstrap component or custom elements here. + </div> + </div> +</div> + +```html +<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> @@ -37,7 +49,7 @@ Below is an offcanvas example that is shown by default (via `.show` on `.offcanv Content for the offcanvas goes here. You can place just about any Bootstrap component or custom elements here. </div> </div> -{{< /example >}} +``` ### Live demo |