Fixes input element animation

When $input-include-glowing-effect == false, adding the .error class to
an input element resulted in unwanted animation of the input bottom
margin down to zero.  Fix is to replace the single-transition mixin
with specific animation of the border-color and background properties.

diff --git a/scss/foundation/components/_forms.scss b/scss/foundation/components/_forms.scss
index cb8c1854ae2c1cd8da1287374e4e296d1e0169be..a256b867cd1bc0a0cc91b4e40b6e2e632ddf5539 100644 (file)
--- a/scss/foundation/components/_forms.scss
+++ b/scss/foundation/components/_forms.scss
@@ -415,7 +415,11 @@ $select-hover-bg-color: scale-color($select-bg-color, $lightness: -3%) !default;
       border-radius: 0;
       @include form-element;
       @if $input-include-glowing-effect == false {
-          @include single-transition(all, .15s, linear);
+        -webkit-transition: border-color 0.15s linear, background 0.15s linear;
+        -moz-transition: border-color 0.15s linear, background 0.15s linear;
+        -ms-transition: border-color 0.15s linear, background 0.15s linear;
+        -o-transition: border-color 0.15s linear, background 0.15s linear;
+        transition: border-color 0.15s linear, background 0.15s linear;
       }
       &.radius {
         @include radius($input-border-radius);