Merge branch '2.0-wip' of https://github.com/twitter/bootstrap into 2.0-wip

Conflicts:
	bootstrap.css
	docs/assets/js/application.js
	docs/base-css.html
	docs/components.html
	docs/index.html
	docs/javascript.html
	docs/less.html
	docs/scaffolding.html
	docs/upgrading.html

9 files changed, 236 insertions, 75 deletions

diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index 8432f92ea..b3c464941 100644
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -315,7 +315,12 @@ h2 + table {
 
 /* Example sites showcase */
 .example-sites img {
-  width: 290px;
+  max-width: 290px;
+}
+.built-with {
+  margin: -18px 0 27px;
+  color: #999;
+  text-align: center;
 }
 
 .scrollspy-example {
@@ -382,12 +387,15 @@ h2 + table {
   .example-sites {
     margin-left: 0;
   }
-  .example-sites a {
+  .example-sites > li {
     float: none;
     display: block;
     max-width: 300px;
     margin: 0 auto 18px;
   }
+  .example-sites img {
+    max-width: 270px;
+  }
 
   table code {
     white-space: normal;
diff --git a/docs/assets/js/application.js b/docs/assets/js/application.js
index c653233e6..c8e796a39 100644
--- a/docs/assets/js/application.js
+++ b/docs/assets/js/application.js
@@ -4,6 +4,18 @@ $(function(){
   // IT'S ALL JUST JUNK FOR OUR DOCS!
   // ++++++++++++++++++++++++++++++++++++++++++
 
+  // Hide the Mobile Safari address bar once loaded
+  // ==============================================
+
+  // Set a timeout...
+  setTimeout(function(){
+    // Hide the address bar!
+    window.scrollTo(0, 1);
+  }, 0);
+
+  // table sort example
+  // ==================
+
   // make code pretty
   prettyPrint && prettyPrint()
 
@@ -61,4 +73,4 @@ $(function(){
     }
   }
 
-})
\ No newline at end of file
+})
diff --git a/docs/base-css.html b/docs/base-css.html
index 6173a4de6..34e844df3 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -762,6 +762,43 @@
     <h1>Forms</h1>
   </div>
 
+<!--
+
+Types of forms
+  default (stacked)
+  horizontal (change the class)
+  search
+  inline
+Form elements
+  form
+  fieldset
+  legend
+  label
+  input
+    text (password, email, etc)
+    radio
+    checkbox
+  textarea
+    rows
+  select
+    single
+    multiple
+    size
+Custom form elements
+  Input prepend and append (for @ and $)
+  checkbox and radio lists
+Explaining the default Bootstrap form structure
+  Bulletproofing our forms means adding a bit of extra structure and providing more classes for customization and event handling
+  Form vertical and horizontal forms, we require a wrapping element.
+    we suggest a fieldset
+    but could be anthing so long as it uses the proper class
+Form states
+  warning
+  error
+  success
+
+-->
+
   <h2>Four types of forms</h2>
   <table class="bordered-table striped-table">
     <thead>
@@ -842,7 +879,7 @@
     </div>
     <div class="span9">
       <form class="horizontal-form">
-        <legend>Example form</legend>
+        <legend>Example form section</legend>
         <fieldset class="control-group">
           <label class="control-label" for="input01">Text input</label>
           <div class="controls">
@@ -851,6 +888,16 @@
           </div>
         </fieldset>
         <fieldset class="control-group">
+          <label class="control-label" for="prependedInput">Prepended text</label>
+          <div class="controls">
+            <div class="input-prepend">
+              <span class="add-on">@</span>
+              <input class="input-small" id="prependedInput" name="prependedInput" size="16" type="text">
+            </div>
+            <span class="help-block">Here's some help text</span>
+          </div>
+        </fieldset>
+        <fieldset class="control-group">
           <label class="control-label" for="select01">Select list</label>
           <div class="controls">
             <select name="select01">
@@ -874,23 +921,44 @@
             </select>
           </div>
         </fieldset>
-        <legend>Example form</legend>
+        <legend>Example form section</legend>
+        <fieldset class="control-group">
+          <label class="control-label" for="textarea">Textarea</label>
+          <div class="controls">
+            <textarea class="input-xlarge" name="textarea" id="textarea" rows="3"></textarea>
+          </div>
+        </fieldset>
+        <fieldset class="control-group">
+          <label class="control-label" for="fileInput">Disabled input</label>
+          <div class="controls">
+            <input class="input-xlarge disabled" id="disabledInput" name="disabledInput" size="30" type="text" placeholder="Disabled input here... carry on." disabled>
+          </div>
+        </fieldset>
         <fieldset class="control-group">
           <label class="control-label" for="fileInput">File input</label>
           <div class="controls">
             <input class="input-file" id="fileInput" name="fileInput" type="file">
           </div>
         </fieldset>
-        <fieldset class="control-group has-error">
+        <fieldset class="control-group warning">
+          <label class="control-label" for="inputError">Input with warning</label>
+          <div class="controls">
+            <input type="text" name="inputError">
+            <span class="help-inline">Something may have gone wrong</span>
+          </div>
+        </fieldset>
+        <fieldset class="control-group error">
           <label class="control-label" for="inputError">Input with error</label>
           <div class="controls">
             <input type="text" name="inputError">
+            <span class="help-inline">Please correct the error</span>
           </div>
         </fieldset>
-        <fieldset class="control-group has-error">
-          <label class="control-label" for="textareaError">Textarea with error</label>
+        <fieldset class="control-group success">
+          <label class="control-label" for="inputError">Input with success</label>
           <div class="controls">
-            <textarea class="input-xlarge" rows="3"></textarea>
+            <input type="text" name="inputError">
+            <span class="help-inline">Woohoo!</span>
           </div>
         </fieldset>
         <fieldset class="control-group">
@@ -1110,8 +1178,7 @@
 
     <!-- Le javascript -->
     <!-- Placed at the end of the document so the pages load faster -->
-    <!-- <script src="http://code.jquery.com/jquery-1.7.min.js"></script> -->
-    <script src="../js/tests/vendor/jquery.js"></script>
+    <script src="http://code.jquery.com/jquery-1.7.min.js"></script>
     <script src="assets/js/google-code-prettify/prettify.js"></script>
     <script>$(function () { prettyPrint() })</script>
     <script src="assets/js/application.js"></script>
diff --git a/docs/components.html b/docs/components.html
index 4d2c60823..26a657cb5 100644
--- a/docs/components.html
+++ b/docs/components.html
@@ -22,6 +22,18 @@
     <link rel="apple-touch-icon" href="assets/ico/bootstrap-apple-57x57.png">
     <link rel="apple-touch-icon" sizes="72x72" href="assets/ico/bootstrap-apple-72x72.png">
     <link rel="apple-touch-icon" sizes="114x114" href="assets/ico/bootstrap-apple-114x114.png">
+
+    <!-- Le javascript -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <script src="http://code.jquery.com/jquery-1.7.min.js"></script>
+    <script src="http://autobahn.tablesorter.com/jquery.tablesorter.min.js"></script>
+    <script src="assets/js/google-code-prettify/prettify.js"></script>
+    <script>$(function () { prettyPrint() })</script>
+    <script src="../js/bootstrap-transitions.js"></script>
+    <script src="../js/bootstrap-dropdown.js"></script>
+    <script src="../js/bootstrap-twipsy.js"></script>
+    <script src="../js/bootstrap-scrollspy.js"></script>
+    <script src="assets/js/application.js"></script>
   </head>
 
   <body>
@@ -201,11 +213,33 @@
 
 
 
-<!-- Navigation
+<!-- Autocomplete
+================================================== -->
+<section id="autocomplete">
+  <div class="page-header">
+    <h1>Autocomplete <small></small></h1>
+  </div>
+
+</section>
+
+
+
+<!-- Carousel
 ================================================== -->
-<section id="navigation">
+<section id="carousel">
   <div class="page-header">
-    <h1>Navigation</h1>
+    <h1>Carousel <small></small></h1>
+  </div>
+
+</section>
+
+
+
+<!-- Navbar
+================================================== -->
+<section id="navbar">
+  <div class="page-header">
+    <h1>Navbar</h1>
   </div>
   <h2>Fixed navbar</h2>
   <div class="navbar navbar-static" >
@@ -262,11 +296,19 @@
   </div>
   <p><strong>Note:</strong> When using the navbar on any page, be sure to account for the overlap it causes by adding <code>padding-top: 40px;</code> to your <code>&lt;body&gt;</code>.</p>
 
-  <br>
+</section>
+
+
+
+<!-- Tabs & Pills
+================================================== -->
+<section id="tabsAndPills">
+  <div class="page-header">
+    <h1>Tabs and pills <small></small></h1>
+  </div>
 
   <div class="row">
     <div class="span3">
-      <h2>Tabs and pills</h2>
       <p>Create simple secondary navigation with a <code>&lt;ul&gt;</code>. Swap between tabs or pills by adding the appropriate class.</p>
       <p>Great for sub-sections of content like our account settings pages and user timelines for toggling between pages of like content. Available in tabbed or pill styles.</p>
     </div>
@@ -428,10 +470,19 @@
     </div>
   </div><!-- /row -->
 
-  <!-- Breadcrumbs -->
+</section>
+
+
+
+<!-- Breadcrumbs
+================================================== -->
+<section id="breadcrumbs">
+  <div class="page-header">
+    <h1>Breadcrumbs <small></small></h1>
+  </div>
+
   <div class="row">
     <div class="span3">
-      <h2>Breadcrumbs</h2>
       <p>Breadcrumb navigation is used as a way to show users where they are within an app or a site, but not for primary navigation.</p>
     </div>
     <div class="span9">
@@ -464,10 +515,20 @@
     </div>
   </div>
 
+</section>
+
+
+
+<!-- Step nav
+================================================== -->
+<section id="stepNav">
+  <div class="page-header">
+    <h1>Step nav <small></small></h1>
+  </div>
+
   <!-- Step nav -->
   <div class="row">
     <div class="span3">
-      <h2>Step nav</h2>
       <p>Placeholder for now!</p>
     </div>
     <div class="span9">
@@ -486,7 +547,17 @@
     </div>
   </div>
 
-  <!-- Pagination -->
+</section>
+
+
+
+<!-- Pagination
+================================================== -->
+<section id="carousel">
+  <div class="page-header">
+    <h1>Pagination <small></small></h1>
+  </div>
+
   <div class="row">
     <div class="span3">
       <h2>Pagination</h2>
@@ -644,11 +715,11 @@
 </section>
 
 
-<!-- Popovers
+<!-- Modals
 ================================================== -->
 <section id="popovers">
   <div class="page-header">
-    <h1>Popovers <small>Components for displaying content in modals, tooltips, and popovers</small></h1>
+    <h1>Modals <small></small></h1>
   </div>
   <div class="row">
     <div class="span3">
@@ -676,7 +747,17 @@
     </div>
   </div><!-- /row -->
 
-  <!-- Tooltips -->
+</section>
+
+
+
+<!-- Twipsies
+================================================== -->
+<section id="carousel">
+  <div class="page-header">
+    <h1>Twipsy tooltips <small></small></h1>
+  </div>
+
   <div class="row">
     <div class="span3">
       <h2>Tooltips</h2>
@@ -694,7 +775,17 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
     </div>
   </div><!-- /row -->
 
-  <!-- Popovers -->
+</section>
+
+
+
+<!-- Popovers
+================================================== -->
+<section id="popovers">
+  <div class="page-header">
+    <h1>Popovers <small></small></h1>
+  </div>
+
   <div class="row">
     <div class="span3">
       <h2>Popovers</h2>
@@ -721,6 +812,8 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
 </section>
 
 
+
+
       <!-- Footer
       ================================================== -->
       <footer class="footer">
@@ -730,19 +823,5 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
         <p>Icons from <a href="http://glyphicons.com">Glyphicons Free</a>, licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
       </footer>
     </div><!-- /container -->
-
-    <!-- Le javascript -->
-    <!-- Placed at the end of the document so the pages load faster -->
-    <!-- <script src="http://code.jquery.com/jquery-1.7.min.js"></script> -->
-    <script src="../js/tests/vendor/jquery.js"></script>
-
-    <script src="assets/js/google-code-prettify/prettify.js"></script>
-
-    <script src="../js/bootstrap-transition.js"></script>
-    <script src="../js/bootstrap-twipsy.js"></script>
-    <script src="../js/bootstrap-dropdown.js"></script>
-    <script src="../js/bootstrap-tab.js"></script>
-
-    <script src="assets/js/application.js"></script>
   </body>
 </html>
diff --git a/docs/index.html b/docs/index.html
index 81d7df41e..0d340fa1a 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -107,39 +107,23 @@
 
         <div class="marketing">
           <h1>Built with Bootstrap</h1>
-          <ul class="media-grid example-sites">
-            <li>
-              <a href="http://kippt.com/" target="_blank">
+          <p class="built-with">For even more sites built with Bootstrap, <a href="http://builtwithbootstrap.tumblr.com/" target="_blank">visit the unofficial Tumblr</a>.</p>
+          <ul class="thumbnails example-sites">
+            <li class="span4">
+              <a class="thumbnail" href="http://kippt.com/" target="_blank">
                 <img src="assets/img/example-sites/kippt.png" alt="Kippt">
               </a>
             </li>
-            <li>
-              <a href="http://www.fleetio.com/" target="_blank">
+            <li class="span4">
+              <a class="thumbnail" href="http://www.fleetio.com/" target="_blank">
                 <img src="assets/img/example-sites/fleetio.png" alt="Fleetio">
               </a>
             </li>
-            <li>
-              <a href="http://www.jshint.com/" target="_blank">
+            <li class="span4">
+              <a class="thumbnail" href="http://www.jshint.com/" target="_blank">
                 <img src="assets/img/example-sites/jshint.png" alt="JS Hint">
               </a>
             </li>
-<!--
-            <li>
-              <a href="http://bartop.co/" target="_blank">
-                <img src="assets/img/example-sites/bartop.png" alt="Bartop.co">
-              </a>
-            </li>
-            <li>
-              <a href="http://railwayjs.com/" target="_blank">
-                <img src="assets/img/example-sites/railwayjs.png" alt="RailwayJS">
-              </a>
-            </li>
-            <li>
-              <a href="http://www.totalwireframe.com/" target="_blank">
-                <img src="assets/img/example-sites/totalwireframe.png" alt="Total Wireframe">
-              </a>
-            </li>
- -->
           </ul>
 
           <h1>Designed for everyone, everywhere</h1>
@@ -234,5 +218,7 @@
     <!-- Le javascript -->
     <!-- Placed at the end of the document so the pages load faster -->
     <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
+    <script src="http://code.jquery.com/jquery-1.7.min.js"></script>
+    <script src="assets/js/application.js"></script>
   </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/docs/javascript.html b/docs/javascript.html
index c9bb425a4..e33900432 100644
--- a/docs/javascript.html
+++ b/docs/javascript.html
@@ -102,7 +102,7 @@
            </tr>
            <tr>
              <td><a href="./javascript.html#popover">bootstrap-popover.js</a></td>
-             <td>The popover plugin provides a simple interface for adding popovers to your application. It extends the <a href="#twipsy">boostrap-twipsy.js</a> plugin, so be sure to grab that file as well when including popovers in your project!</td>
+             <td>The popover plugin provides a simple interface for adding popovers to your application. It extends the <a href="#twipsy">bootstrap-twipsy.js</a> plugin, so be sure to grab that file as well when including popovers in your project!</td>
            </tr>
            </tr>
            <tr>
@@ -260,7 +260,7 @@ $('#myModal').on('hidden', function () {
           <a href="../js/bootstrap-dropdown.js" target="_blank" class="btn primary">Download</a>
         </div>
         <div class="span9 columns">
-          <h3>Using boostrap-dropdown.js</h3>
+          <h3>Using bootstrap-dropdown.js</h3>
           <pre class="prettyprint linenums">$('.dropdown-toggle').dropdown()</pre>
           <h3>Markup</h3>
           <p>To quickly add dropdown functionality to any element just add <code>data-toggle="dropdown"</code> and any valid bootstrap dropdown will automatically be activated.</p>
@@ -336,7 +336,7 @@ $('#myModal').on('hidden', function () {
           <a href="../js/bootstrap-scrollspy.js" target="_blank" class="btn primary">Download</a>
         </div>
         <div class="span9 columns">
-          <h2>Using boostrap-scrollspy.js</h2>
+          <h2>Using bootstrap-scrollspy.js</h2>
           <pre class="prettyprint linenums">$('#navbar').dropdown()</pre>
           <h3>Markup</h3>
           <p>To easily add scrollspy behavior to your topbar navigation, just add <code>data-spy="scroll"</code> to the element you want to spy on (most typically this would be the body).
@@ -410,7 +410,7 @@ $('#myModal').on('hidden', function () {
           <a href="../js/bootstrap-tab.js" target="_blank" class="btn primary">Download</a>
         </div>
         <div class="span9 columns">
-          <h3>Using boostrap-tab.js</h3>
+          <h3>Using bootstrap-tab.js</h3>
           <pre class="prettyprint linenums">$('#myTab').tab('show')</pre>
           <h3>Markup</h3>
           <p>You can activate a tab or pill navigation without writing any javascript by simply specifying <code>data-toggle="tab"</code> or <code>data-toggle="pill"</code> on an element.</p>
@@ -608,11 +608,11 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
       </div>
       <div class="row">
         <div class="span3 columns">
-          <p>The popover plugin provides a simple interface for adding popovers to your application. It extends the <a href="#twipsy">boostrap-twipsy.js</a> plugin, so be sure to grab that file as well when including popovers in your project!</p>
+          <p>The popover plugin provides a simple interface for adding popovers to your application. It extends the <a href="#twipsy">bootstrap-twipsy.js</a> plugin, so be sure to grab that file as well when including popovers in your project!</p>
           <a href="../js/bootstrap-popover.js" target="_blank" class="btn primary">Download</a>
         </div>
         <div class="span9 columns">
-          <h3>Using boostrap-popover.js</h3>
+          <h3>Using bootstrap-popover.js</h3>
           <pre class="prettyprint linenums">$('#example').popover(options)</pre>
           <h3>Options</h3>
           <table class="bordered-table striped-table">
diff --git a/docs/less.html b/docs/less.html
index 13dfee282..7d3efd296 100644
--- a/docs/less.html
+++ b/docs/less.html
@@ -466,8 +466,7 @@
 
     <!-- Le javascript -->
     <!-- Placed at the end of the document so the pages load faster -->
-    <!-- <script src="http://code.jquery.com/jquery-1.7.min.js"></script> -->
-    <script src="../js/tests/vendor/jquery.js"></script>
+    <script src="http://code.jquery.com/jquery-1.7.min.js"></script>
     <script src="assets/js/google-code-prettify/prettify.js"></script>
     <script src="assets/js/application.js"></script>
   </body>
diff --git a/docs/scaffolding.html b/docs/scaffolding.html
index 311a6954c..dc35bd577 100644
--- a/docs/scaffolding.html
+++ b/docs/scaffolding.html
@@ -370,11 +370,10 @@
 
     <!-- Le javascript -->
     <!-- Placed at the end of the document so the pages load faster -->
-    <!-- <script src="http://code.jquery.com/jquery-1.7.min.js"></script> -->
-    <script src="../js/tests/vendor/jquery.js"></script>
+    <script src="http://code.jquery.com/jquery-1.7.min.js"></script>
     <script src="assets/js/google-code-prettify/prettify.js"></script>
     <script src="../js/bootstrap-transition.js"></script>
     <script src="../js/bootstrap-twipsy.js"></script>
     <script src="assets/js/application.js"></script>
   </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/docs/upgrading.html b/docs/upgrading.html
index 4dedb37d8..7be1fd708 100644
--- a/docs/upgrading.html
+++ b/docs/upgrading.html
@@ -38,7 +38,7 @@
             <li><a href="./base-css.html">Base CSS</a></li>
             <li><a href="./components.html">Components</a></li>
             <li><a href="./javascript.html">Javascript plugins</a></li>
-            <li class="active"><a href="./less.html">Using LESS</a></li>
+            <li><a href="./less.html">Using LESS</a></li>
           </ul>
         </div>
       </div>
@@ -100,6 +100,16 @@
     </ul>
   </li>
 </ul>
+<!--
+  <li>
+    <ul>
+      <li></li>
+    </ul>
+  </li>
+-->
+</ul>
+
+
       <!-- Footer
       ================================================== -->
       <footer class="footer">
@@ -109,5 +119,6 @@
         <p>Icons from <a href="http://glyphicons.com">Glyphicons Free</a>, licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
       </footer>
     </div><!-- /container -->
+
   </body>
 </html>