diff options
author | Jacob Thornton <jacobthornton@gmail.com> | 2011-06-28 12:15:03 +0400 |
---|---|---|
committer | Jacob Thornton <jacobthornton@gmail.com> | 2011-06-28 12:15:03 +0400 |
commit | e33808447e13f340755861f389d7b4db4557f10c (patch) | |
tree | 21f914608ab71426cbc090f6efd4b2ff062bc6fb | |
parent | 471563eb819092894d9c89683c1159612cecaffb (diff) |
started workign on modals
-rw-r--r-- | bootstrap-1.0.0.css | 19 | ||||
-rw-r--r-- | bootstrap-1.0.0.min.css | 3 | ||||
-rw-r--r-- | docs/index.html | 26 | ||||
-rw-r--r-- | lib/patterns.less | 19 |
4 files changed, 65 insertions, 2 deletions
diff --git a/bootstrap-1.0.0.css b/bootstrap-1.0.0.css index 42189886a3..7bb30d7fe4 100644 --- a/bootstrap-1.0.0.css +++ b/bootstrap-1.0.0.css @@ -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; } diff --git a/bootstrap-1.0.0.min.css b/bootstrap-1.0.0.min.css index fe5786c159..fd9d5238e3 100644 --- a/bootstrap-1.0.0.min.css +++ b/bootstrap-1.0.0.min.css @@ -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;} diff --git a/docs/index.html b/docs/index.html index b77c831d02..c8444a89c6 100644 --- a/docs/index.html +++ b/docs/index.html @@ -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">×</a> + </div> + <div class="modal-body"> + </div> + <div class="modal-footer"> + </div> + </div> + </div> + </div> + </div> +</section> </div> <!-- /container --> diff --git a/lib/patterns.less b/lib/patterns.less index 29a705f448..7163d45987 100644 --- a/lib/patterns.less +++ b/lib/patterns.less @@ -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)) +}
\ No newline at end of file |