From 52fc9286e08a93c1335a50ac7305c83378c2381f Mon Sep 17 00:00:00 2001 From: John Kole Date: Wed, 11 Feb 2015 23:18:36 -0500 Subject: [PATCH] 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. --- scss/foundation/components/_forms.scss | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/scss/foundation/components/_forms.scss b/scss/foundation/components/_forms.scss index cb8c1854a..a256b867c 100644 --- 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); -- 2.47.2