mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-17 19:21:23 +03:00
Code Activity

Do some CSS and Migration guide cleanup (#36191)

Browse Source 
* Do some CSS and Migration guide cleanup

- More code snippet tweaks
- Fix some homepage hero bugs
- Do a cleanup on Migration guide content to highlight more changes and fix some issues from merge conflicts
This commit is contained in:
Mark Otto
2022-04-18 20:56:18 -07:00
committed by GitHub
parent 3990ff04a0
commit 3362c8cf13
5 changed files with 30 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/content/docs/5.1/components/offcanvas.md
+4 -18
View File
@@ -143,24 +143,10 @@ When backdrop is set to static, the offcanvas will not close when clicking outsi
Responsive offcanvas classes hide content outside the viewport from a specified breakpoint and down. Above that breakpoint, the contents within will behave as usual. For example, `.offcanvas-lg` hides content in an offcanvas below the `lg` breakpoint, but shows the content above the `lg` breakpoint.
<div class="bd-example">
<button class="btn btn-primary d-lg-none" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasResponsive" aria-controls="offcanvasResponsive">Toggle offcanvas</button>
{{< example >}}
<button class="btn btn-primary d-lg-none" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasResponsive" aria-controls="offcanvasResponsive">Toggle offcanvas</button>
<div class="alert alert-info d-none d-lg-block">Resize your browser to show the responsive offcanvas toggle.</div>
<div class="offcanvas-lg offcanvas-end" tabindex="-1" id="offcanvasResponsive" aria-labelledby="offcanvasResponsiveLabel">
<div class="offcanvas-header">
<h5 class="offcanvas-title" id="offcanvasResponsiveLabel">Responsive offcanvas</h5>
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body">
<p class="mb-0">This is content within an <code>.offcanvas-lg</code>.</p>
</div>
</div>
</div>
```html
<button class="btn btn-primary" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasResponsive" aria-controls="offcanvasResponsive">Toggle offcanvas</button>
<div class="alert alert-info d-none d-lg-block">Resize your browser to show the responsive offcanvas toggle.</div>
<div class="offcanvas-lg offcanvas-end" tabindex="-1" id="offcanvasResponsive" aria-labelledby="offcanvasResponsiveLabel">
<div class="offcanvas-header">
@@ -171,7 +157,7 @@ Responsive offcanvas classes hide content outside the viewport from a specified
<p class="mb-0">This is content within an <code>.offcanvas-lg</code>.</p>
</div>
</div>
```
{{< /example >}}
Responsive offcanvas classes are available across for each breakpoint.