improve text color and borders for legibility

mdo · mdo · commit 0c1c23641460 · 2011-10-09T22:38:48.000-07:00
diff --git 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: Sun Oct  9 22:31:28 PDT 2011
+ * Date: Sun Oct  9 22:37:55 PDT 2011
  */
 /* Reset.less
  * Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here	that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
@@ -723,10 +723,10 @@ input[type=file]:focus, input[type=checkbox]:focus, select:focus {
   outline: 1px dotted #666;
 }
 form .clearfix.error > label, form .clearfix.error .help-block, form .clearfix.error .help-inline {
-  color: #ee5f5b;
+  color: #b94a48;
 }
 form .clearfix.error input, form .clearfix.error textarea {
-  color: #ee5f5b;
+  color: #b94a48;
   border-color: #ee5f5b;
 }
 form .clearfix.error input:focus, form .clearfix.error textarea:focus {
@@ -736,15 +736,15 @@ form .clearfix.error input:focus, form .clearfix.error textarea:focus {
   box-shadow: 0 0 6px #f8b9b7;
 }
 form .clearfix.error .input-prepend .add-on, form .clearfix.error .input-append .add-on {
-  color: #ee5f5b;
+  color: #b94a48;
   background-color: #fce6e6;
-  border-color: #ee5f5b;
+  border-color: #b94a48;
 }
 form .clearfix.warning > label, form .clearfix.warning .help-block, form .clearfix.warning .help-inline {
-  color: #ccae64;
+  color: #c09853;
 }
 form .clearfix.warning input, form .clearfix.warning textarea {
-  color: #ccae64;
+  color: #c09853;
   border-color: #ccae64;
 }
 form .clearfix.warning input:focus, form .clearfix.warning textarea:focus {
@@ -754,15 +754,15 @@ form .clearfix.warning input:focus, form .clearfix.warning textarea:focus {
   box-shadow: 0 0 6px #e5d6b1;
 }
 form .clearfix.warning .input-prepend .add-on, form .clearfix.warning .input-append .add-on {
-  color: #ccae64;
+  color: #c09853;
   background-color: #d2b877;
-  border-color: #ccae64;
+  border-color: #c09853;
 }
 form .clearfix.success > label, form .clearfix.success .help-block, form .clearfix.success .help-inline {
-  color: #57a957;
+  color: #468847;
 }
 form .clearfix.success input, form .clearfix.success textarea {
-  color: #57a957;
+  color: #468847;
   border-color: #57a957;
 }
 form .clearfix.success input:focus, form .clearfix.success textarea:focus {
@@ -772,9 +772,9 @@ form .clearfix.success input:focus, form .clearfix.success textarea:focus {
   box-shadow: 0 0 6px #9acc9a;
 }
 form .clearfix.success .input-prepend .add-on, form .clearfix.success .input-append .add-on {
-  color: #57a957;
+  color: #468847;
   background-color: #bcddbc;
-  border-color: #57a957;
+  border-color: #468847;
 }
 .input-mini,
 input.mini,
diff --git a/bootstrap.min.css b/bootstrap.min.css
diff --git a/lib/forms.less b/lib/forms.less
@@ -169,7 +169,7 @@ select:focus {
 // --------------------------
 
 // Mixin for form field states
-.formFieldState(@textColor: #555, @backgroundColor: #f5f5f5) {
+.formFieldState(@textColor: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) {
   // Set the text color
   > label,
   .help-block,
@@ -180,10 +180,10 @@ select:focus {
   input,
   textarea {
     color: @textColor;
-    border-color: @textColor;
+    border-color: @borderColor;
     &:focus {
-      border-color: darken(@textColor, 10%);
-      .box-shadow(0 0 6px lighten(@textColor, 20%);
+      border-color: darken(@borderColor, 10%);
+      .box-shadow(0 0 6px lighten(@borderColor, 20%);
     }
   }
   // Give a small background color for input-prepend/-append
@@ -196,15 +196,15 @@ select:focus {
 }
 // Error
 form .clearfix.error {
-  .formFieldState(#ee5f5b, lighten(#ee5f5b, 30%));
+  .formFieldState(#b94a48, #ee5f5b, lighten(#ee5f5b, 30%));
 }
 // Warning
 form .clearfix.warning {
-  .formFieldState(#CCAE64, lighten(#CCAE64, 5%));
+  .formFieldState(#c09853, #ccae64, lighten(#CCAE64, 5%));
 }
 // Success
 form .clearfix.success {
-  .formFieldState(#57a957, lighten(#57a957, 30%));
+  .formFieldState(#468847, #57a957, lighten(#57a957, 30%));
 }
 
 

Original file line number	Diff line number	Diff line change
`@@ -6,7 +6,7 @@`
`6`	`6`	`* http://www.apache.org/licenses/LICENSE-2.0`
`7`	`7`	`*`
`8`	`8`	`* Designed and built with all the love in the world @twitter by @mdo and @fat.`
`9`		`- * Date: Sun Oct 9 22:31:28 PDT 2011`
	`9`	`+ * Date: Sun Oct 9 22:37:55 PDT 2011`
`10`	`10`	`*/`
`11`	`11`	`/* Reset.less`
`12`	`12`	`* Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).`
`@@ -723,10 +723,10 @@ input[type=file]:focus, input[type=checkbox]:focus, select:focus {`
`723`	`723`	`outline: 1px dotted #666;`
`724`	`724`	`}`
`725`	`725`	`form .clearfix.error > label, form .clearfix.error .help-block, form .clearfix.error .help-inline {`
`726`		`- color: #ee5f5b;`
	`726`	`+ color: #b94a48;`
`727`	`727`	`}`
`728`	`728`	`form .clearfix.error input, form .clearfix.error textarea {`
`729`		`- color: #ee5f5b;`
	`729`	`+ color: #b94a48;`
`730`	`730`	`border-color: #ee5f5b;`
`731`	`731`	`}`
`732`	`732`	`form .clearfix.error input:focus, form .clearfix.error textarea:focus {`
`@@ -736,15 +736,15 @@ form .clearfix.error input:focus, form .clearfix.error textarea:focus {`
`736`	`736`	`box-shadow: 0 0 6px #f8b9b7;`
`737`	`737`	`}`
`738`	`738`	`form .clearfix.error .input-prepend .add-on, form .clearfix.error .input-append .add-on {`
`739`		`- color: #ee5f5b;`
	`739`	`+ color: #b94a48;`
`740`	`740`	`background-color: #fce6e6;`
`741`		`- border-color: #ee5f5b;`
	`741`	`+ border-color: #b94a48;`
`742`	`742`	`}`
`743`	`743`	`form .clearfix.warning > label, form .clearfix.warning .help-block, form .clearfix.warning .help-inline {`
`744`		`- color: #ccae64;`
	`744`	`+ color: #c09853;`
`745`	`745`	`}`
`746`	`746`	`form .clearfix.warning input, form .clearfix.warning textarea {`
`747`		`- color: #ccae64;`
	`747`	`+ color: #c09853;`
`748`	`748`	`border-color: #ccae64;`
`749`	`749`	`}`
`750`	`750`	`form .clearfix.warning input:focus, form .clearfix.warning textarea:focus {`
`@@ -754,15 +754,15 @@ form .clearfix.warning input:focus, form .clearfix.warning textarea:focus {`
`754`	`754`	`box-shadow: 0 0 6px #e5d6b1;`
`755`	`755`	`}`
`756`	`756`	`form .clearfix.warning .input-prepend .add-on, form .clearfix.warning .input-append .add-on {`
`757`		`- color: #ccae64;`
	`757`	`+ color: #c09853;`
`758`	`758`	`background-color: #d2b877;`
`759`		`- border-color: #ccae64;`
	`759`	`+ border-color: #c09853;`
`760`	`760`	`}`
`761`	`761`	`form .clearfix.success > label, form .clearfix.success .help-block, form .clearfix.success .help-inline {`
`762`		`- color: #57a957;`
	`762`	`+ color: #468847;`
`763`	`763`	`}`
`764`	`764`	`form .clearfix.success input, form .clearfix.success textarea {`
`765`		`- color: #57a957;`
	`765`	`+ color: #468847;`
`766`	`766`	`border-color: #57a957;`
`767`	`767`	`}`
`768`	`768`	`form .clearfix.success input:focus, form .clearfix.success textarea:focus {`
`@@ -772,9 +772,9 @@ form .clearfix.success input:focus, form .clearfix.success textarea:focus {`
`772`	`772`	`box-shadow: 0 0 6px #9acc9a;`
`773`	`773`	`}`
`774`	`774`	`form .clearfix.success .input-prepend .add-on, form .clearfix.success .input-append .add-on {`
`775`		`- color: #57a957;`
	`775`	`+ color: #468847;`
`776`	`776`	`background-color: #bcddbc;`
`777`		`- border-color: #57a957;`
	`777`	`+ border-color: #468847;`
`778`	`778`	`}`
`779`	`779`	`.input-mini,`
`780`	`780`	`input.mini,`