diff options
author | Jacob Thornton <jacobthornton@gmail.com> | 2011-06-30 21:44:04 +0400 |
---|---|---|
committer | Jacob Thornton <jacobthornton@gmail.com> | 2011-06-30 21:44:04 +0400 |
commit | 9282876b443daed99cbfac10ff6adace8b916f6b (patch) | |
tree | 106c9ceb1f9c55e7e1f6894abe5e65de4e65834c | |
parent | 518c882da08390d45194d318ab575ed10766a382 (diff) | |
parent | 588b2da937dd5c34766863fba3a9daaf2276d900 (diff) |
Merge branch 'master' of http://git.local.twitter.com/bootstrap
Conflicts:
lib/bootstrap.less
-rw-r--r-- | bootstrap-1.0.0.css | 21 | ||||
-rw-r--r-- | bootstrap-1.0.0.min.css | 6 | ||||
-rw-r--r-- | docs/assets/css/docs.css | 31 | ||||
-rw-r--r-- | docs/assets/js/application.js | 9 | ||||
-rw-r--r-- | docs/index.html | 61 | ||||
-rw-r--r-- | lib/bootstrap.less | 21 | ||||
-rw-r--r-- | lib/forms.less | 8 | ||||
-rw-r--r-- | lib/scaffolding.less | 5 |
8 files changed, 79 insertions, 83 deletions
diff --git a/bootstrap-1.0.0.css b/bootstrap-1.0.0.css index d470903835..be3c96fd36 100644 --- a/bootstrap-1.0.0.css +++ b/bootstrap-1.0.0.css @@ -1,11 +1,11 @@ /* - * Master Stylesheet - * This file is only for importing all required stylesheets for LESS to include and then compile. + * Bootstrap v1.0.0 * * Copyright 2011 Twitter, Inc - * Open-sourced under Apache License v2.0: http://www.apache.org/licenses/LICENSE-2.0 + * Licensed under the Apache License v2.0 + * http://www.apache.org/licenses/LICENSE-2.0 * - * Designed and built @twitter by @mdo and @fat, like bosses. + * Designed and built with all the love in the world @twitter by @mdo and @fat. */ /* * Reset.less @@ -626,7 +626,7 @@ form .uneditable-input { line-height: 18px; height: 18px; color: #808080; - border: 1px solid #bbb; + border: 1px solid #ccc; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; @@ -653,13 +653,16 @@ form textarea { -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; -moz-transition: border linear 0.2s, box-shadow linear 0.2s; transition: border linear 0.2s, box-shadow linear 0.2s; + -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); + -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); + box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); } form input[type=text]:focus, form input[type=password]:focus, form textarea:focus { outline: none; - border-color: rgba(82, 168, 236, 0.75); - -webkit-box-shadow: 0 0 8px rgba(82, 168, 236, 0.5); - -moz-box-shadow: 0 0 8px rgba(82, 168, 236, 0.5); - box-shadow: 0 0 8px rgba(82, 168, 236, 0.5); + border-color: rgba(82, 168, 236, 0.8); + -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); + -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); + box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); } form div.error { background: #fae5e3; diff --git a/bootstrap-1.0.0.min.css b/bootstrap-1.0.0.min.css index ddb1ea0d41..9c8e15ea2f 100644 --- a/bootstrap-1.0.0.min.css +++ b/bootstrap-1.0.0.min.css @@ -72,12 +72,12 @@ form label,form input,form select,form textarea{font-family:"Helvetica Neue",Hel form label{padding-top:6px;font-size:13px;line-height:18px;float:left;width:130px;text-align:right;color:#404040;} form div.input{margin-left:150px;} form input[type=checkbox],form input[type=radio]{cursor:pointer;} -form input[type=text],form input[type=password],form textarea,form select,form .uneditable-input{display:inline-block;width:210px;margin:0;padding:4px;font-size:13px;line-height:18px;height:18px;color:#808080;border:1px solid #bbb;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;} +form input[type=text],form input[type=password],form textarea,form select,form .uneditable-input{display:inline-block;width:210px;margin:0;padding:4px;font-size:13px;line-height:18px;height:18px;color:#808080;border:1px solid #ccc;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;} form select,form input[type=file]{height:27px;line-height:27px;} form textarea{height:auto;} form .uneditable-input{background-color:#eee;display:block;border-color:#ccc;-webkit-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.075);-moz-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.075);box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.075);} -form input[type=text],form input[type=password],form select,form textarea{-webkit-transition:border linear 0.2s,box-shadow linear 0.2s;-moz-transition:border linear 0.2s,box-shadow linear 0.2s;transition:border linear 0.2s,box-shadow linear 0.2s;} -form input[type=text]:focus,form input[type=password]:focus,form textarea:focus{outline:none;border-color:rgba(82, 168, 236, 0.75);-webkit-box-shadow:0 0 8px rgba(82, 168, 236, 0.5);-moz-box-shadow:0 0 8px rgba(82, 168, 236, 0.5);box-shadow:0 0 8px rgba(82, 168, 236, 0.5);} +form input[type=text],form input[type=password],form select,form textarea{-webkit-transition:border linear 0.2s,box-shadow linear 0.2s;-moz-transition:border linear 0.2s,box-shadow linear 0.2s;transition:border linear 0.2s,box-shadow linear 0.2s;-webkit-box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.1);-moz-box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.1);box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.1);} +form input[type=text]:focus,form input[type=password]:focus,form textarea:focus{outline:none;border-color:rgba(82, 168, 236, 0.8);-webkit-box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.1),0 0 8px rgba(82, 168, 236, 0.6);-moz-box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.1),0 0 8px rgba(82, 168, 236, 0.6);box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.1),0 0 8px rgba(82, 168, 236, 0.6);} form div.error{background:#fae5e3;padding:10px 0;margin:-10px 0 10px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}form div.error>label,form div.error span.help-inline,form div.error span.help-block{color:#9d261d;} form div.error input[type=text],form div.error input[type=password],form div.error textarea{border-color:#c87872;-webkit-box-shadow:0 0 3px rgba(171, 41, 32, 0.25);-moz-box-shadow:0 0 3px rgba(171, 41, 32, 0.25);box-shadow:0 0 3px rgba(171, 41, 32, 0.25);}form div.error input[type=text]:focus,form div.error input[type=password]:focus,form div.error textarea:focus{border-color:#b9554d;-webkit-box-shadow:0 0 6px rgba(171, 41, 32, 0.5);-moz-box-shadow:0 0 6px rgba(171, 41, 32, 0.5);box-shadow:0 0 6px rgba(171, 41, 32, 0.5);} form div.error div.input-prepend span.add-on,form div.error div.input-append span.add-on{background:#f4c8c5;border-color:#c87872;color:#b9554d;} diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css index 92f9d95605..66b8b7ccfb 100644 --- a/docs/assets/css/docs.css +++ b/docs/assets/css/docs.css @@ -17,20 +17,20 @@ section { #masthead, #footer { background-color: #049cd9; background-repeat: no-repeat; - background-image: -webkit-gradient(linear, left top, left bottom, from(#0056b0), to(#049cd9)); - background-image: -webkit-linear-gradient(#0056b0, #049cd9); - background-image: -moz-linear-gradient(#0056b0, #049cd9); - background-image: -o-linear-gradient(top, #0056b0, #049cd9); - background-image: -khtml-gradient(linear, left top, left bottom, from(#0056b0), to(#049cd9)); - filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#0056b0', EndColorStr='#049cd9', GradientType=0); - -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#0056b0', EndColorStr='#049cd9', GradientType=0))"; + background-image: -webkit-gradient(linear, left top, left bottom, from(#004D9F), to(#049cd9)); + background-image: -webkit-linear-gradient(#004D9F, #049cd9); + background-image: -moz-linear-gradient(#004D9F, #049cd9); + background-image: -o-linear-gradient(top, #004D9F, #049cd9); + background-image: -khtml-gradient(linear, left top, left bottom, from(#004D9F), to(#049cd9)); + filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#004D9F', EndColorStr='#049cd9', GradientType=0); + -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#004D9F', EndColorStr='#049cd9', GradientType=0))"; } #masthead div.inner, #footer div.inner { background: transparent url(../img/grid-18px.png) top center; padding: 45px 0; - -webkit-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.25); - -moz-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.25); - box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.25); + -webkit-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.3); + -moz-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.3); + box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.3); } #masthead h1, #footer h1, @@ -89,7 +89,7 @@ div.quickstart div.row { } div.quickstart div.columns { width: 285px; - height: 100px; + height: 117px; margin-left: 0; padding: 17px 20px 26px; border-left: 1px solid #eee; @@ -114,15 +114,11 @@ div.quickstart h6 { div.quickstart form textarea { display: block; width: 275px; - height: 21px; + height: auto; margin: 0 0 9px; line-height: 21px; white-space: nowrap; overflow: hidden; - border-color: #ddd; - -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.1); - -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.1); - box-shadow: inset 0 1px 3px rgba(0,0,0,.1); } #footer { margin-top: 80px; @@ -131,6 +127,9 @@ div.quickstart form textarea { margin-bottom: 0; color: rgba(255,255,255,.8) } +#footer p.right { + float: right; +} /* Special grid styles -------------------------------------------------- */ .show-grid { diff --git a/docs/assets/js/application.js b/docs/assets/js/application.js index 2372bdb96f..3993c353e7 100644 --- a/docs/assets/js/application.js +++ b/docs/assets/js/application.js @@ -35,6 +35,15 @@ $(document).ready(function(){ }); + // Copy code blocks in docs + $(".copy-code").focus(function() { + $(this).select(); + }); + $(".copy-code").mouseup(function(e) { + e.preventDefault(); + }); + + // scroll spyer var activeTarget, $window = $(window), diff --git a/docs/index.html b/docs/index.html index 465e53ef2e..aab4ae4904 100644 --- a/docs/index.html +++ b/docs/index.html @@ -42,27 +42,12 @@ <div id="masthead"> <div class="inner"> <div class="container"> -<!-- - <div class="row"> - <div class="span11 columns"> ---> - <h1>Twitter Bootstrap</h1> - <p class="lead"> - Bootstrap is a toolkit from Twitter designed to kickstart development of websites and apps.<br /> - It includes base CSS and HTML for typography, forms, buttons, tables, grids, navigation, and more.<br /> - </p> - <p><strong>Nerd alert:</strong> Bootstrap is <a href="#less" title="Read about using Bootstrap with LESS">built with LESS</a> and was designed to work out of the gate with only modern browsers in mind.</p> -<!-- - </div> - <div class="span5 columns"> - <a href="" class="btn large primary">Download Bootstrap ZIP »</a> - <small> - <a href="">Visit project page on Github »</a><br /> - (Current version: 1.0.0) - </small> - </div> - </div> ---> + <h1>Twitter Bootstrap</h1> + <p class="lead"> + Bootstrap is a toolkit from Twitter designed to kickstart development of websites and apps.<br /> + It includes base CSS and HTML for typography, forms, buttons, tables, grids, navigation, and more.<br /> + </p> + <p><strong>Nerd alert:</strong> Bootstrap is <a href="#less" title="Read about using Bootstrap with LESS">built with LESS</a> and was designed to work out of the gate with only modern browsers in mind.</p> </div> <!-- /container --> </div> </div> @@ -74,15 +59,15 @@ <h6>Hotlink the CSS</h6> <p>For the quickest and easiest start, just copy this snippet into your webpage.</p> <form> - <textarea><link type="text/css" href="http://twitter.github.com/bootstrap-1.0.0.css</textarea> + <textarea class="copy-code" rows="1"><link type="text/css" href="http://twitter.github.com/bootstrap-1.0.0.css</textarea> </form> </div> <div class="span5 columns"> <h6>Use it with LESS</h6> <p>A fan of using LESS.js? No problem, just clone the repo and add these lines:</p> <form> - <textarea><link type="text/css" href="http://twitter.github.com/bootstrap-1.0.0.css -<link type="text/css" href="http://twitter.github.com/bootstrap-1.0.0.css</textarea> + <textarea class="copy-code" rows="2"><link rel="stylesheet/less" type="text/css" href="http://twitter.github.com/bootstrap.less> +<script src="less.js"></script></textarea> </form> </div> <div class="span5 columns"> @@ -1111,7 +1096,8 @@ </div> <div class="row"> <div class="span4 columns"> - <p><a href="http://markdotto.com/bootstrap/">Preboot</a> is a super awesome pack of mixins and variables to be used in conjunction with <a href="http://lesscss.org" target="_blank">LESS</a>, a CSS preprocessor for faster and easier web development, that we used to build Bootstrap.</p> + <p>Bootstrap was built with <a href="http://markdotto.com/bootstrap/">Preboot</a>, an open-source pack of mixins and variables to be used in conjunction with <a href="http://lesscss.org" target="_blank">LESS</a>, a CSS preprocessor for faster and easier web development.</p> + <p>Check out how we used Preboot in Bootstrap and how you can make use of it should you choose to run LESS on your next project.</p> </div> <div class="span12 columns"> <h2>How to use it</h2> @@ -1200,22 +1186,22 @@ background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+ background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+ background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10 - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor)); /* IE6 & IE7 */ - -ms-filter: %("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor); /* IE8+ */ + -ms-filter: %("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor); // IE8+ + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",@startColor,@endColor)); // IE6 & IE7 background-image: linear-gradient(left, @startColor, @endColor); // Le standard } .vertical (@startColor: #555, @endColor: #333) { background-color: @endColor; background-repeat: repeat-x; - background-image: -khtml-gradient(linear, left top, left bottom, from(@startColor), to(@endColor)); /* Konqueror */ - background-image: -moz-linear-gradient(@startColor, @endColor); /* FF 3.6+ */ - background-image: -ms-linear-gradient(@startColor, @endColor); /* IE10 */ - background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @startColor), color-stop(100%, @endColor)); /* Safari 4+, Chrome 2+ */ - background-image: -webkit-linear-gradient(@startColor, @endColor); /* Safari 5.1+, Chrome 10+ */ - background-image: -o-linear-gradient(@startColor, @endColor); /* Opera 11.10 */ - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); /* IE6 & IE7 */ - -ms-filter: %("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor); /* IE8+ */ - background-image: linear-gradient(@startColor, @endColor); /* the standard */ + background-image: -khtml-gradient(linear, left top, left bottom, from(@startColor), to(@endColor)); // Konqueror + background-image: -moz-linear-gradient(@startColor, @endColor); // FF 3.6+ + background-image: -ms-linear-gradient(@startColor, @endColor); // IE10 + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+ + background-image: -webkit-linear-gradient(@startColor, @endColor); // Safari 5.1+, Chrome 10+ + background-image: -o-linear-gradient(@startColor, @endColor); // Opera 11.10 + -ms-filter: %("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor); // IE8+ + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE6 & IE7 + background-image: linear-gradient(@startColor, @endColor); // The standard } .directional (@startColor: #555, @endColor: #333, @deg: 45deg) { ... @@ -1227,7 +1213,7 @@ </pre> <h3>Operations and grid system</h3> -<p>Get fancy and perform some match to generate flexible and powerful mixins like the one below.</p> +<p>Get fancy and perform some math to generate flexible and powerful mixins like the one below.</p> <pre class="css"> // Griditude @gridColumns: 16; @@ -1263,6 +1249,7 @@ <div id="footer"> <div class="inner"> <div class="container"> + <p class="right"><a href="#">Back to top</a></p> <p> Designed and built <a href="http://twitter.com/twitter" target="_blank">@twitter</a> by <a href="http://twitter.com/mdo" target="_blank">@mdo</a> and <a href="http://twitter.com/fat" target="_blank">@fat</a>, like bosses.<br /> Open-sourced under the <a href="http://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache License v2.0</a>. diff --git a/lib/bootstrap.less b/lib/bootstrap.less index 4c69ef86de..834d950803 100644 --- a/lib/bootstrap.less +++ b/lib/bootstrap.less @@ -1,14 +1,13 @@ - /*! - * Bootstrap v0.0.1 - * - * Copyright 2011 Twitter, Inc - * Licensed under the Apache License v2.0 - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Made with love by two broheims, @mdo and @fat - * Date: {{ date }} - */ - +/*! + * Bootstrap v1.0.0 + * + * Copyright 2011 Twitter, Inc + * Licensed under the Apache License v2.0 + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Designed and built with all the love in the world @twitter by @mdo and @fat. + * Date: {{ date }} + */ // CSS Reset @import "reset.less"; diff --git a/lib/forms.less b/lib/forms.less index 6052978c6f..ab82c6a09b 100644 --- a/lib/forms.less +++ b/lib/forms.less @@ -62,7 +62,7 @@ form { line-height: @baseline; height: @baseline; color: @gray; - border: 1px solid #bbb; + border: 1px solid #ccc; .border-radius(3px); } select, @@ -85,13 +85,15 @@ form { select, textarea { @transition: border linear .2s, box-shadow linear .2s; .transition(@transition); + .box-shadow(inset 0 1px 3px rgba(0,0,0,.1)); } input[type=text]:focus, input[type=password]:focus, textarea:focus { outline: none; - border-color: rgba(82,168,236,.75); - .box-shadow(0 0 8px rgba(82,168,236,.5)); + border-color: rgba(82,168,236,.8); + @shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6); + .box-shadow(@shadow); } // Error styles div.error { diff --git a/lib/scaffolding.less b/lib/scaffolding.less index 4adfdeb797..ed73a996b4 100644 --- a/lib/scaffolding.less +++ b/lib/scaffolding.less @@ -104,15 +104,12 @@ a { .opacity(65); cursor: default; } - &:focus { - - } &:active { @shadow: inset 0 3px 7px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.05); .box-shadow(@shadow); } } -// Help Firefox not be a douche about adding extra padding to buttons +// Help Firefox not be a jerk about adding extra padding to buttons button.btn, input[type=submit].btn { &::-moz-focus-inner { |