updated docs pages (still wip), adding misc css classes, added form styles from 1.4, added github buttons to homepage

lib/forms.less

@@ -3,6 +3,7 @@
  * ------------------------------------------------------------- */
 
 
+
 // GENERAL STYLES
 // --------------
 
@@ -84,6 +85,7 @@ input[type=submit] {
   height: auto;
 }
 
+// Set the height of select and file controls to match text inputs
 select,
 input[type=file] {
   height: @baseLineHeight * 1.5; // In IE7, the height of the select element cannot be changed by height, only font-size
@@ -188,42 +190,47 @@ textarea[readonly] {
 
 
 
-// ERROR STATE
-// -----------
+// FORM FIELD FEEDBACK STATES
+// --------------------------
 
-// Set color of error text
-@error-text: desaturate(lighten(@red, 25%), 25%);
-
-// Style the background of control-groups with errors
-.has-error {
-  background: lighten(@red, 55%);
-  padding: (@baseLineHeight / 2) 0;
-  margin: -10px 0 10px;
-  .border-radius(4px);
+// Mixin for form field states
+.formFieldState(@textColor: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) {
+  // Set the text color
   > label,
-  span.help-inline,
-  span.help-block {
-    color: @red;
+  .help-block,
+  .help-inline {
+    color: @textColor;
   }
+  // Style inputs accordingly
   input,
-  textarea,
-  select {
-    border-color: @error-text;
-    .box-shadow(0 0 3px rgba(171,41,32,.25));
+  textarea {
+    color: @textColor;
+    border-color: @borderColor;
     &:focus {
-      border-color: darken(@error-text, 10%);
-      .box-shadow(0 0 6px rgba(171,41,32,.5));
+      border-color: darken(@borderColor, 10%);
+      .box-shadow(0 0 6px lighten(@borderColor, 20%);
     }
   }
-  .input-prepend,
-  .input-append {
-    span.add-on {
-      background: lighten(@red, 50%);
-      border-color: @error-text;
-      color: darken(@error-text, 10%);
-    }
+  // Give a small background color for input-prepend/-append
+  .input-prepend .add-on,
+  .input-append .add-on {
+    color: @textColor;
+    background-color: @backgroundColor;
+    border-color: @textColor;
   }
 }
+// Error
+form .clearfix.error {
+  .formFieldState(#b94a48, #ee5f5b, lighten(#ee5f5b, 30%));
+}
+// Warning
+form .clearfix.warning {
+  .formFieldState(#c09853, #ccae64, lighten(#CCAE64, 5%));
+}
+// Success
+form .clearfix.success {
+  .formFieldState(#468847, #57a957, lighten(#57a957, 30%));
+}
 
 
 
@@ -238,7 +245,6 @@ textarea[readonly] {
   border-top: 1px solid #ddd;
 }
 
-
 // For text that needs to appear as an input but should not be an input
 .uneditable-input {
   background-color: @white;
@@ -281,6 +287,7 @@ textarea[readonly] {
 }
 
 
+
 // INLINE FIELDS
 // -------------
 
@@ -301,6 +308,7 @@ textarea[readonly] {
 }
 
 
+
 // INPUT GROUPS
 // ------------
 
@@ -353,7 +361,6 @@ textarea[readonly] {
 
 
 
-
 // SEARCH FORM
 // -----------
 
@@ -366,7 +373,6 @@ textarea[readonly] {
 // HORIZONTAL & VERTICAL FORMS
 // ---------------------------
 
-
 // Common properties
 // -----------------
 
@@ -374,17 +380,11 @@ textarea[readonly] {
 .control-group {
   margin-bottom: @baseLineHeight;
 }
-
 // Bold the labels so they stand out
 .control-group > label {
   font-weight: bold;
 }
 
-// Lists of controls (checkboxes and radios)
-.control-list {
-}
-
-
 // Horizontal-specific styles
 // --------------------------