rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-21 18:54:30 +01:00
Code Issues Actions Packages Releases Activity

Fix modal overflow with our navbar documentation and fix typo (#22864)

Browse Source 
* Fix modal overflow with our navbar documentation and fix typo

* Fix z-index backdrop and modal with popover/tooltip example
This commit is contained in:
Johann-S 2017-06-21 11:47:14 +02:00 committed by GitHub
parent 16d77b4cb0
commit 38ddf9ec28
3 changed files with 16 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
assets/scss/_component-examples.scss
View File

@ -285,6 +285,19 @@
} }
} }
.modal.show {
z-index: 1072;
.tooltip, .popover {
z-index: 1073;
}
}
.modal-backdrop {
z-index: 1071;
}
// Example tabbable tabs // Example tabbable tabs
.bd-example-tabs .nav-tabs { .bd-example-tabs .nav-tabs {
margin-bottom: 1rem; margin-bottom: 1rem;

4
docs/4.0/components/modal.md
View File

@ -226,10 +226,10 @@ When modals become too long for the user's viewport or device, they scroll indep
</div> </div>
<div class="modal-body"> <div class="modal-body">
<h5>Popover in a modal</h5> <h5>Popover in a modal</h5>
<p>This <a href="#" role="button" class="btn btn-secondary popover-test" title="Popover title" data-content="Popover body content is set in this attribute.">button</a> triggers a popover on click.</p> <p>This <a href="#" role="button" class="btn btn-secondary popover-test" title="Popover title" data-content="Popover body content is set in this attribute." data-container="#exampleModalPopovers">button</a> triggers a popover on click.</p>
<hr> <hr>
<h5>Tooltips in a modal</h5> <h5>Tooltips in a modal</h5>
<p><a href="#" class="tooltip-test" title="Tooltip">This link</a> and <a href="#" class="tooltip-test" title="Tooltip">that link</a> have tooltips on hover.</p> <p><a href="#" class="tooltip-test" title="Tooltip" data-container="#exampleModalPopovers">This link</a> and <a href="#" class="tooltip-test" title="Tooltip" data-container="#exampleModalPopovers">that link</a> have tooltips on hover.</p>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>

2
docs/4.0/getting-started/webpack.md
View File

@ -12,7 +12,7 @@ toc: true
## Importing JavaScript ## Importing JavaScript
Import [Bootstrap's JavaScript](/getting-started/javascript/) by adding this line to your app's entry point (usally `index.js` or `app.js`): Import [Bootstrap's JavaScript](/getting-started/javascript/) by adding this line to your app's entry point (usually `index.js` or `app.js`):
{% highlight js %} {% highlight js %}
import 'bootstrap'; import 'bootstrap';