rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-28 10:24:19 +01:00
Code Issues Actions Packages Releases Activity

move overflow and max-height on modal to modal-body instead

Browse Source
This commit is contained in:
Mark Otto 2012-02-19 21:55:09 -08:00
parent 1c7d346767
commit 9b09d1de86
5 changed files with 26 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
docs/assets/bootstrap.zip
View File

Binary file not shown.

4
docs/assets/css/bootstrap.css vendored
View File

@ -860,7 +860,6 @@ input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, selec
display: block;
margin-top: 5px;
margin-bottom: 0;
color: #999999;
}
.help-inline {
display: inline-block;
@ -2873,7 +2872,6 @@ button.btn.small, input[type="submit"].btn.small {
top: 50%;
left: 50%;
z-index: 1050;
max-height: 500px;
overflow: auto;
width: 560px;
margin: -250px 0 0 -280px;
@ -2912,6 +2910,8 @@ button.btn.small, input[type="submit"].btn.small {
margin-top: 2px;
}
.modal-body {
overflow-y: auto;
max-height: 400px;
padding: 15px;
}
.modal-body .modal-form {

11
docs/javascript.html
View File

@ -237,6 +237,17 @@
<h4>Tooltips in a modal</h4>
<p><a href="#" class="tooltip-test" title="Tooltip">This link</a> and <a href="#" class="tooltip-test" title="Tooltip">that link</a> should have tooltips on hover.</p>
<hr>
<h4>Overflowing text to show optional scrollbar</h4>
<p>We set a fixed <code>max-height</code> on the <code>.modal-body</code>. Watch it overflow with all this extra lorem ipsum text we've included.</p>
<p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
<p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
<p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
<p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
</div>
<div class="modal-footer">
<a href="#" class="btn btn-primary">Save changes</a>

11
docs/templates/pages/javascript.mustache vendored
View File

@ -161,6 +161,17 @@
<h4>{{_i}}Tooltips in a modal{{/i}}</h4>
<p>{{_i}}<a href="#" class="tooltip-test" title="Tooltip">This link</a> and <a href="#" class="tooltip-test" title="Tooltip">that link</a> should have tooltips on hover.{{/i}}</p>
<hr>
<h4>{{_i}}Overflowing text to show optional scrollbar{{/i}}</h4>
<p>{{_i}}We set a fixed <code>max-height</code> on the <code>.modal-body</code>. Watch it overflow with all this extra lorem ipsum text we've included.{{/i}}</p>
<p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
<p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
<p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
<p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
</div>
<div class="modal-footer">
<a href="#" class="btn btn-primary">{{_i}}Save changes{{/i}}</a>

3
less/modals.less
View File

@ -33,7 +33,6 @@
top: 50%;
left: 50%;
z-index: @zindexModal;
max-height: 500px;
overflow: auto;
width: 560px;
margin: -250px 0 0 -280px;
@ -59,6 +58,8 @@
// Body (where all modal content resises)
.modal-body {
overflow-y: auto;
max-height: 400px;
padding: 15px;
}
// Remove bottom margin if need be