mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
modal refinements in docs and general responsiveness
This commit is contained in:
parent
18d95a163b
commit
967030cb53
5 changed files with 19 additions and 8 deletions
7
docs/assets/css/bootstrap-responsive.css
vendored
7
docs/assets/css/bootstrap-responsive.css
vendored
|
@ -24,9 +24,9 @@
|
|||
}
|
||||
.modal {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
right: 20px;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
right: 10px;
|
||||
width: auto;
|
||||
margin: 0;
|
||||
}
|
||||
|
@ -35,6 +35,7 @@
|
|||
}
|
||||
.modal-header .close {
|
||||
padding: 10px;
|
||||
margin: -10px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
|
|
|
@ -723,6 +723,15 @@ form.well {
|
|||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
/* Modal example */
|
||||
.modal-example .modal {
|
||||
position: relative;
|
||||
top: auto;
|
||||
right: auto;
|
||||
bottom: auto;
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
@ -193,7 +193,7 @@
|
|||
<div class="span9 columns">
|
||||
<h2>Static example</h2>
|
||||
<p>Below is a statically rendered modal.</p>
|
||||
<div class="well" style="background-color: #888; border: none;">
|
||||
<div class="well modal-example" style="background-color: #888; border: none;">
|
||||
<div class="modal" style="position: relative; top: auto; left: auto; margin: 0 auto; z-index: 1">
|
||||
<div class="modal-header">
|
||||
<a href="#" class="close" data-dismiss="modal">×</a>
|
||||
|
|
2
docs/templates/pages/javascript.mustache
vendored
2
docs/templates/pages/javascript.mustache
vendored
|
@ -128,7 +128,7 @@
|
|||
<div class="span9 columns">
|
||||
<h2>{{_i}}Static example{{/i}}</h2>
|
||||
<p>{{_i}}Below is a statically rendered modal.{{/i}}</p>
|
||||
<div class="well" style="background-color: #888; border: none;">
|
||||
<div class="well modal-example" style="background-color: #888; border: none;">
|
||||
<div class="modal" style="position: relative; top: auto; left: auto; margin: 0 auto; z-index: 1">
|
||||
<div class="modal-header">
|
||||
<a href="#" class="close" data-dismiss="modal">×</a>
|
||||
|
|
|
@ -56,15 +56,16 @@
|
|||
// Modals
|
||||
.modal {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
right: 20px;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
right: 10px;
|
||||
width: auto;
|
||||
margin: 0;
|
||||
&.fade.in { top: auto; }
|
||||
}
|
||||
.modal-header .close {
|
||||
padding: 10px;
|
||||
margin: -10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Add table
Reference in a new issue