Login and Registration: Use CSS animation instead of old JavaScript code for "shake" animation on login failure.

Props markjaquith, valentinbora.
Fixes #48490.
Built from https://develop.svn.wordpress.org/trunk@47226


git-svn-id: http://core.svn.wordpress.org/trunk@47026 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Sergey Biryukov 2020-02-10 01:52:04 +00:00
parent 9bd75db1fc
commit 95edb66e53
6 changed files with 41 additions and 9 deletions

View File

@ -140,6 +140,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;

File diff suppressed because one or more lines are too long

View File

@ -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;

File diff suppressed because one or more lines are too long

View File

@ -13,7 +13,7 @@
*
* @global string $wp_version
*/
$wp_version = '5.4-alpha-47225';
$wp_version = '5.4-alpha-47226';
/**
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.

View File

@ -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() {
?>
<script type="text/javascript">
addLoadEvent = function(func){if(typeof jQuery!="undefined")jQuery(document).ready(func);else if(typeof wpOnload!='function'){wpOnload=func;}else{var oldonload=wpOnload;wpOnload=function(){oldonload();func();}}};
function s(id,pos){g(id).left=pos+'px';}
function g(id){return document.getElementById(id).style;}
function shake(id,a,d){c=a.shift();s(id,c);if(a.length>0){setTimeout(function(){shake(id,a,d);},d);}else{try{g(id).position='static';wp_attempt_focus();}catch(e){}}}
addLoadEvent(function(){ var p=new Array(15,30,15,0,-15,-30,-15,0);p=p.concat(p.concat(p));var i=document.forms[0].id;g(i).position='relative';shake(i,p,20);});
document.querySelector('form').classList.add('shake');
</script>
<?php
}