Fix validator animation style

This commit is contained in:
afc163 2015-11-18 15:41:30 +08:00
parent 0e13be7500
commit 3bc76922d7
2 changed files with 33 additions and 7 deletions

View File

@ -268,14 +268,22 @@ form {
.animation(zoomIn .3s @ease-out-back);
}
}
.has-error{
.has-success {
&.has-feedback:after {
animation-name: zoomIn2 !important;
animation-name: diffZoomIn1 !important;
}
}
.has-warning{
.has-error {
&.has-feedback:after {
animation-name: zoomIn3 !important;
animation-name: diffZoomIn2 !important;
}
}
.has-warning {
&.has-feedback:after {
animation-name: diffZoomIn3 !important;
}
}
@ -320,6 +328,9 @@ form {
.@{input-number-prefix-cls} {
border-color: @warning-color;
box-shadow: 0 0 0 2px tint(@warning-color, 80%);
&:not([disabled]):hover {
border-color: @warning-color;
}
}
}
@ -352,6 +363,9 @@ form {
.@{input-number-prefix-cls} {
border-color: @error-color;
box-shadow: 0 0 0 2px tint(@error-color, 80%);
&:not([disabled]):hover {
border-color: @error-color;
}
}
}
@ -363,7 +377,9 @@ form {
}
}
@keyframes zoomIn2 {
// need there different zoom animation
// otherwise won't trigger anim
@keyframes diffZoomIn1 {
0%{
transform: scale(0);
}
@ -371,7 +387,17 @@ form {
transform: scale(1);
}
}
@keyframes zoomIn3 {
@keyframes diffZoomIn2 {
0%{
transform: scale(0);
}
100%{
transform: scale(1);
}
}
@keyframes diffZoomIn3 {
0%{
transform: scale(0);
}

View File

@ -6,7 +6,7 @@
.@{css-prefix}input {
border-color: @border-color;
box-shadow: 0 0 0 2px tint(@border-color, 80%);
&:not([disabled]):hover {
border-color: @border-color;
}