Tweak the docs and address the new forms list of controls: radios and checkboxes...

diff --git a/bootstrap.css b/bootstrap.css
index 55706e2a3ca7bd9b837a66fd685173ff4f1109ca..ea084d5f059571cf58f1284d071dead5dd18d4bf 100644 (file)
--- a/bootstrap.css
+++ b/bootstrap.css
@@ -6,7 +6,7 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  *
  * Designed and built with all the love in the world @twitter by @mdo and @fat.
- * Date: Thu Jan  5 10:00:31 PST 2012
+ * Date: Thu Jan  5 14:10:04 PST 2012
  */
 html, body {
   margin: 0;
@@ -615,6 +615,16 @@ input[type=image] {
 textarea {
   height: auto;
 }
+.radio, .checkbox {
+  padding-left: 18px;
+}
+.radio input[type=radio], .checkbox input[type=checkbox] {
+  float: left;
+  margin-left: -18px;
+}
+.controls > .radio:first-child, .controls > .checkbox:first-child {
+  padding-top: 6px;
+}
 input, textarea {
   -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);
@@ -986,9 +996,6 @@ textarea[readonly] {
 .horizontal-form .controls {
   margin-left: 150px;
 }
-.horizontal-form .controls > .radio:first-child, .horizontal-form .controls > .checkbox:first-child {
-  padding-top: 6px;
-}
 .horizontal-form .form-actions {
   padding-left: 150px;
 }

diff --git a/bootstrap.min.css b/bootstrap.min.css
index d0ba4dc53e87b1f453269776b1d54e5e4bf236b8..a021bf774fb88b7084dbf755d7ad391762e1583e 100644 (file)
--- a/bootstrap.min.css
+++ b/bootstrap.min.css
@@ -104,6 +104,9 @@ select{background-color:#ffffff;vertical-align:middle;}
 select[multiple],select[size]{height:inherit;}
 input[type=image]{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
 textarea{height:auto;}
+.radio,.checkbox{padding-left:18px;}
+.radio input[type=radio],.checkbox input[type=checkbox]{float:left;margin-left:-18px;}
+.controls>.radio:first-child,.controls>.checkbox:first-child{padding-top:6px;}
 input,textarea{-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);-webkit-transition:border linear 0.2s,box-shadow linear 0.2s;-moz-transition:border linear 0.2s,box-shadow linear 0.2s;-ms-transition:border linear 0.2s,box-shadow linear 0.2s;-o-transition:border linear 0.2s,box-shadow linear 0.2s;transition:border linear 0.2s,box-shadow linear 0.2s;}
 input:focus,textarea:focus{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);outline:0;}
 input[type=file]:focus,input[type=checkbox]:focus,select:focus{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;outline:1px dotted #666;}
@@ -159,7 +162,6 @@ input[disabled],select[disabled],textarea[disabled],input[readonly],select[reado
 .control-group>label{font-weight:bold;}
 .horizontal-form .control-group>label{float:left;width:130px;padding-top:5px;text-align:right;}
 .horizontal-form .controls{margin-left:150px;}
-.horizontal-form .controls>.radio:first-child,.horizontal-form .controls>.checkbox:first-child{padding-top:6px;}
 .horizontal-form .form-actions{padding-left:150px;}
 table{width:100%;margin-bottom:18px;}
 th,td{padding:8px;line-height:18px;text-align:left;border-top:1px solid #ddd;}

diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index a4573448f2a3b18e0a704262f101a7283e21aca7..9501ec5dc49b6a4c622deec50202938ca2189d28 100644 (file)
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -36,7 +36,11 @@ body > .navbar-fixed .brand:hover {
 /* Space out sub-sections more
 -------------------------------------------------- */
 .page-header {
-  margin-top: 36px;
+  margin: 36px 0 18px;
+  border-bottom: 1px solid #eee;
+}
+.page-header h1 {
+  margin-bottom: 9px;
 }
 
 

diff --git a/docs/base-css.html b/docs/base-css.html
index 58d42c2b06a8a5108c07d467752fa1c6f13d86d3..1ec808a39495c837639504fe828ce79eff42edc9 100644 (file)
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -795,9 +795,16 @@ Form states
   warning
   error
   success
-
 -->
 
+<div class="row">
+  <div class="span4">
+    <h3>Flexible markup and styles</h3>
+    <p>The best part about forms in Bootstrap is that all your inputs and controls look great no matter how you build them in your markup. No superfluous HTML is required, but we provide the patterns for those who require it.</p>
+  </div>
+</div>
+
+  
   <h2>Four types of forms</h2>
   <table class="bordered-table striped-table">
     <thead>

diff --git a/lib/forms.less b/lib/forms.less
index 0c624fa884441ebcf047516e7e9f303d86df8d27..32acbdaba990ebb0741763f8b2a778771fcaa201 100644 (file)
--- a/lib/forms.less
+++ b/lib/forms.less
@@ -116,6 +116,28 @@ textarea {
 
 
 
+// CHECKBOXES & RADIOS
+// -------------------
+
+// Indent the labels to position radios/checkboxes as hanging
+.radio,
+.checkbox {
+  padding-left: 18px;
+}
+.radio input[type=radio],
+.checkbox input[type=checkbox] {
+  float: left;
+  margin-left: -18px;
+}
+
+// Move the options list down to align with labels
+.controls > .radio:first-child,
+.controls > .checkbox:first-child {
+  padding-top: 6px; // has to be padding because margin collaspes
+}
+
+
+
 // FOCUS STATE
 // -----------
 
@@ -390,11 +412,6 @@ textarea[readonly] {
   .controls {
     margin-left: 150px;
   }
-  // Move the options list down to align with labels
-  .controls > .radio:first-child,
-  .controls > .checkbox:first-child {
-    padding-top: 6px; // has to be padding because margin collaspes
-  }
   // Move over buttons in .form-actions to align with .controls
   .form-actions {
     padding-left: 150px;

diff --git a/lib/patterns.less b/lib/patterns.less
index 72c3e8ec5ff220aa12a4357111c54ca235c93684..7a039ce265d1912c64a425c192e38453bf3dad17 100644 (file)
--- a/lib/patterns.less
+++ b/lib/patterns.less
@@ -28,16 +28,3 @@ footer {
   margin-top: @baseLineHeight - 1;
   border-top: 1px solid #eee;
 }
-
-
-// PAGE HEADERS
-// ------------
-
-.page-header {
-  margin-bottom: @baseLineHeight * 1.5;
-  border-bottom: 1px solid #eee;
-  .box-shadow(0 1px 0 rgba(255,255,255,.5));
-  h1 {
-    margin-bottom: @baseLineHeight * .75;
-  }
-}