Add Error, Small to 100% width media query.

Currently (in 3.1.1) you can add a column class to `small` tags in order to size them to match the corresponding `input` (this is for situations where one is not doing `row` classes, but just using the number classes to size/arrange form fields, eg, `<input class="six">`). However, the `small` tag (with corresponding `error` class) then does not get full width on the Small screen size. I believe this Pull Request should fix that.

However, I would encourage the Zurb folks to double check that I've not missed anything as this particular bit of Foundation scss is less familiar to me, and I was admittedly focused on fixing my particular use case. So there may be additional changes that you all would wish to make and/or there may be implications to the changes I'm proposing that I'm not aware of.

:)

diff --git a/scss/foundation/common/_forms.scss b/scss/foundation/common/_forms.scss
index af5e0981c7715b364a9b435a0ad3393802a6c613..8334188ec3624620e2c05d9d2c2eb6776349e56c 100644 (file)
--- a/scss/foundation/common/_forms.scss
+++ b/scss/foundation/common/_forms.scss
@@ -56,7 +56,7 @@
 
   @media only screen and (max-width: $screenSmall - 1) {
     @for $i from 1 through $totalColumns {
-      input[type="text"].#{convert-number-to-word($i)}, input[type="password"].#{convert-number-to-word($i)}, input[type="date"].#{convert-number-to-word($i)}, input[type="datetime"].#{convert-number-to-word($i)}, input[type="email"].#{convert-number-to-word($i)}, input[type="number"].#{convert-number-to-word($i)}, input[type="search"].#{convert-number-to-word($i)}, input[type="tel"].#{convert-number-to-word($i)}, input[type="time"].#{convert-number-to-word($i)}, input[type="url"].#{convert-number-to-word($i)}, textarea.#{convert-number-to-word($i)} { width: 100% !important; }
+      input[type="text"].#{convert-number-to-word($i)}, input[type="password"].#{convert-number-to-word($i)}, input[type="date"].#{convert-number-to-word($i)}, input[type="datetime"].#{convert-number-to-word($i)}, input[type="email"].#{convert-number-to-word($i)}, input[type="number"].#{convert-number-to-word($i)}, input[type="search"].#{convert-number-to-word($i)}, input[type="tel"].#{convert-number-to-word($i)}, input[type="time"].#{convert-number-to-word($i)}, input[type="url"].#{convert-number-to-word($i)}, textarea.#{convert-number-to-word($i)}, .error small.#{convert-number-to-word($i)}, small.error.#{convert-number-to-word($i)} { width: 100% !important; }
     }
   }