diff --git a/src/wp-admin/css/login.css b/src/wp-admin/css/login.css index d5c60f117a..f0261a6819 100644 --- a/src/wp-admin/css/login.css +++ b/src/wp-admin/css/login.css @@ -139,6 +139,24 @@ p { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04); } +.login form.shake { + animation: shake 0.2s cubic-bezier(.19,.49,.38,.79) both; + animation-iteration-count: 3; + transform: translateX(0); +} + +@keyframes shake { + 25% { + transform: translateX(-20px); + } + 75% { + transform: translateX(20px); + } + 100% { + transform: translateX(0); + } +} + .login-action-confirm_admin_email #login { width: 60vw; margin-top: -2vh; diff --git a/src/wp-login.php b/src/wp-login.php index 55e310a216..096a2d4b4c 100644 --- a/src/wp-login.php +++ b/src/wp-login.php @@ -62,7 +62,7 @@ function login_header( $title = 'Log In', $message = '', $wp_error = null ) { $shake_error_codes = apply_filters( 'shake_error_codes', $shake_error_codes ); if ( $shake_error_codes && $wp_error->has_errors() && in_array( $wp_error->get_error_code(), $shake_error_codes, true ) ) { - add_action( 'login_head', 'wp_shake_js', 12 ); + add_action( 'login_footer', 'wp_shake_js', 12 ); } $login_title = get_bloginfo( 'name', 'display' ); @@ -335,11 +335,7 @@ function login_footer( $input_id = '' ) { function wp_shake_js() { ?>