Merge branch 'master' of http://git.local.twitter.com/bootstrap

Conflicts: lib/bootstrap.less
mansilladev · Jun 30, 2011 · 9282876 · 9282876
2 parents 518c882 + 588b2da
commit 9282876
Show file tree

Hide file tree

Showing 8 changed files with 79 additions and 83 deletions.
diff --git 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
diff --git 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
@@ -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
@@ -42,27 +42,12 @@ <h3><a class="logo" href="#">
     <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 &raquo;</a>
-              <small>
-                <a href="">Visit project page on Github &raquo;</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 @@ <h1>Twitter Bootstrap</h1>
             <h6>Hotlink the CSS</h6>
             <p>For the quickest and easiest start, just copy this snippet into your webpage.</p>
             <form>
-              <textarea>&lt;link type="text/css" href="http://twitter.github.com/bootstrap-1.0.0.css</textarea>
+              <textarea class="copy-code" rows="1">&lt;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>&lt;link type="text/css" href="http://twitter.github.com/bootstrap-1.0.0.css
-&lt;link type="text/css" href="http://twitter.github.com/bootstrap-1.0.0.css</textarea>
+              <textarea class="copy-code" rows="2">&lt;link rel="stylesheet/less" type="text/css" href="http://twitter.github.com/bootstrap.less&gt;
+&lt;script src="less.js"&gt;&lt;/script&gt;</textarea>
             </form>
           </div>
           <div class="span5 columns">
@@ -1111,7 +1096,8 @@ <h1>Using Bootstrap with LESS <small>Supercharge your CSS with variables, mixins
 </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 @@ <h4>Gradients</h4>
     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 @@ <h4>Gradients</h4>
 </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 @@ <h3>Operations and grid system</h3>
     <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
@@ -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
@@ -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
@@ -103,16 +103,13 @@ a {
     background-image: none;
     .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 {