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

started workign on modals

Browse Source
This commit is contained in:
Jacob Thornton 2011-06-28 01:15:03 -07:00
parent 471563eb81
commit e33808447e
4 changed files with 65 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
bootstrap-1.0.0.css vendored
View File

@ -1667,4 +1667,23 @@ div.modal {
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
-moz-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
}
div.modal .modal-header {
border-bottom: 1px solid #eee;
padding: 5px 20px;
}
div.modal .modal-header h2 {
font-size: 20px;
font-weight: 200;
}
div.modal .modal-header a.close {
position: absolute;
right: 10px;
top: 10px;
color: #999;
line-height: 10px;
font-size: 18px;
}

3
bootstrap-1.0.0.min.css vendored
View File

@ -194,4 +194,5 @@ div.pagination ul li.disabled a,div.pagination ul li.disabled a:hover{background
div.pagination ul li.next a,div.pagination ul li:last-child a{border:0;}
div.well{background:#f5f5f5;margin-bottom:20px;padding:19px;min-height:20px;border:1px solid #ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075);}
div.modal-backdrop{background-color:rgba(0, 0, 0, 0.5);position:fixed;top:0;left:0;right:0;bottom:0;z-index:1000;}
div.modal{position:fixed;top:50%;left:50%;z-index:2000;width:620px;height:500px;margin:-310px 0 0 -250px;background-color:#ffffff;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;}
div.modal{position:fixed;top:50%;left:50%;z-index:2000;width:620px;height:500px;margin:-310px 0 0 -250px;background-color:#ffffff;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-webkit-box-shadow:0 2px 6px rgba(0, 0, 0, 0.35);-moz-box-shadow:0 2px 6px rgba(0, 0, 0, 0.35);box-shadow:0 2px 6px rgba(0, 0, 0, 0.35);}div.modal .modal-header{border-bottom:1px solid #eee;padding:5px 20px;}div.modal .modal-header h2{font-size:20px;font-weight:200;}
div.modal .modal-header a.close{position:absolute;right:10px;top:10px;color:#999;line-height:10px;font-size:18px;}

26
docs/index.html
View File

@ -35,6 +35,7 @@
<li><a href="#forms">Forms</a></li>
<li><a href="#navigation">Navigation</a></li>
<li><a href="#alerts">Alerts</a></li>
<li><a href="#modals">Modals</a></li>
</ul>
</div>
</div>
@ -1177,6 +1178,31 @@
</section>
<section id="modals">
<div class="page-header">
<h1>Modals <small>Rules and conditions for displaying content in popovers.</small></h1>
</div>
<div class="row">
<div class="span4 columns">
<h2>Tweet Modal</h2>
<p>This is text about a modal that i am making. mark will say change this text. we will change it. It will be changed O_O</p>
</div>
<div class="span12 columns">
<div class="modal-backdrop" style="position:relative; min-height:200px; padding:40px; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; z-index: 1">
<div class="modal" style="position:relative; top: auto; left: auto; margin: 0 auto; width:565px; height: 265px; z-index: 1">
<div class="modal-header">
<h2>Add new Tweet</h2>
<a href="#" class="close">&times;</a>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
</div>
</div>
</div>
</div>
</div>
</section>
</div> <!-- /container -->

19
lib/patterns.less
View File

@ -491,5 +491,22 @@ div.modal {
height: 500px;
margin: -310px 0 0 -250px;
background-color: @white;
.modal-header {
border-bottom:1px solid #eee;
padding: 5px 20px;
h2 {
font-size: 20px;
font-weight: 200;
}
a.close {
position: absolute;
right: 10px;
top: 10px;
color: #999;
line-height:10px;
font-size: 18px;
}
}
.border-radius(6px);
}
.box-shadow(0 2px 6px rgba(0, 0, 0, 0.35))
}