|
|
@@ -45,9 +45,29 @@
|
|
|
|
|
|
&.ck-error {
|
|
|
border-color: var(--ck-color-input-error-border);
|
|
|
+ animation: shakeInput .5s ease both;
|
|
|
+ transform: translateX(0);
|
|
|
|
|
|
&:focus {
|
|
|
@mixin ck-box-shadow var(--ck-focus-error-outer-shadow), var(--ck-inner-shadow);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+@keyframes shakeInput {
|
|
|
+ 20% {
|
|
|
+ transform: translateX(-2px);
|
|
|
+ }
|
|
|
+
|
|
|
+ 40% {
|
|
|
+ transform: translateX(2px);
|
|
|
+ }
|
|
|
+
|
|
|
+ 60% {
|
|
|
+ transform: translateX(-1px);
|
|
|
+ }
|
|
|
+
|
|
|
+ 80% {
|
|
|
+ transform: translateX(1px);
|
|
|
+ }
|
|
|
+}
|