forms.css in purecss-0.0.10

- old
+ new

@@ -157,11 +157,12 @@
     overflow: auto; /* 1 */
     vertical-align: top; /* 2 */
 }
 
 .pure-form input,
-.pure-form select {
+.pure-form select,
+.pure-form textarea {
   padding: 0.5em 0.6em;
   display: inline-block;
   border: 1px solid #ccc;
   font-size: 0.8em;
   box-shadow: inset 0 1px 3px #ddd;
@@ -176,15 +177,22 @@
   box-sizing: border-box;
   -webkit-font-smoothing: antialiased;
 }
 
 .pure-form input:focus,
-.pure-form select:focus {
+.pure-form select:focus,
+.pure-form textarea:focus {
   outline: 0;
   outline: thin dotted \9; /* IE6-9 */
   border-color: #129FEA;
 }
+.pure-form input[type="file"]:focus,
+.pure-form input[type="radio"]:focus,
+.pure-form input[type="checkbox"]:focus {
+  outline: thin dotted #333;
+  outline: 1px auto #129FEA;    
+}
 .pure-form .pure-checkbox,
 .pure-form .pure-radio {
   margin: 0.5em 0;
   display: block;
 }
@@ -208,10 +216,15 @@
 .pure-form input:focus:invalid:focus,
 .pure-form textarea:focus:invalid:focus,
 .pure-form select:focus:invalid:focus {
   border-color: #e9322d;
 }
+.pure-form input[type="file"]:focus:invalid:focus,
+.pure-form input[type="radio"]:focus:invalid:focus,
+.pure-form input[type="checkbox"]:focus:invalid:focus {
+  outline-color: #e9322d;
+}
 .pure-form select {
   border: 1px solid #ccc;
   background-color: white;
 }
 .pure-form select[multiple] {
@@ -244,11 +257,12 @@
 }
 
 .pure-form-aligned input,
 .pure-form-aligned textarea,
 .pure-form-aligned select,
-.pure-form-aligned .pure-help-inline {
+.pure-form-aligned .pure-help-inline, /* note: pure-help-inline is deprecated. Use .pure-form-message-inline instead */
+.pure-form-message-inline {
   display: inline-block;
   *display: inline; /* IE7 inline-block hack */
   *zoom: 1;
   vertical-align: middle;
 }
@@ -316,18 +330,27 @@
 .pure-form .pure-input-1-4 {
   width: 25%;
 }
 
 /* Inline help for forms */
-.pure-form .pure-help-inline {
+/* Note: pure-help-inline is deprecated. Use .pure-form-message-inline instead */
+.pure-form .pure-help-inline,
+.pure-form-message-inline {
   display: inline-block;
   padding-left: 0.3em;
   color: #666;
   vertical-align: middle;
   font-size: 90%;
 }
 
+/* Block help for forms */
+.pure-form-message {
+  display: block;
+  color: #666;
+  font-size: 90%;
+}
+
 @media only screen and (max-width : 480px) {
 	.pure-form button[type='submit'] {
 		margin: 0.7em 0 0;
 	}
 
@@ -349,10 +372,13 @@
 
 	.pure-form-aligned .pure-controls {
 		margin: 1.5em 0 0 0;
 	}
 
-	.pure-form .pure-help-inline {
+	/* note: pure-help-inline is deprecated. Use .pure-form-message-inline instead */
+	.pure-form .pure-help-inline,
+	.pure-form-message-inline,
+	.pure-form-message {
 		display: block;
 		font-size: 80%;
 		padding: 0.2em 0 0.8em; /* increased bottom padding to make it group with its related input element */
 	}
 }