Login: Password reset - add hide icon & confirm weak password checkbox.

Extends the password features added in 4.3 to the password reset flow.

Props johnbillion, manolis09, umesh.nevase, Nikschavan.



git-svn-id: https://develop.svn.wordpress.org/trunk@41556 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Adam Silverstein 2017-09-21 21:28:07 +00:00
parent 9b7c97af26
commit 52bdeee37d
3 changed files with 33 additions and 5 deletions

View File

@ -73,6 +73,25 @@ p {
padding: 0; padding: 0;
} }
.login .password-input-wrapper {
display: table;
}
.login .input.password-input {
display: table-cell;
margin: 0;
}
.login .pw-weak {
margin-bottom: 15px;
}
.login .button.button-secondary {
display: table-cell;
border-radius: 0;
vertical-align: middle;
}
.login form { .login form {
margin-top: 20px; margin-top: 20px;
margin-left: 0; margin-left: 0;

View File

@ -161,7 +161,7 @@
// hide this // hide this
$('.user-pass2-wrap').hide(); $('.user-pass2-wrap').hide();
$submitButton = $( '#submit' ).on( 'click', function () { $submitButton = $( '#submit, #wp-submit' ).on( 'click', function () {
updateLock = false; updateLock = false;
}); });
@ -314,7 +314,7 @@
if ( passStrength.className ) { if ( passStrength.className ) {
$pass1.add( $pass1Text ).addClass( passStrength.className ); $pass1.add( $pass1Text ).addClass( passStrength.className );
if ( 'short' === passStrength.className || 'bad' === passStrength.className ) { if ( $( passStrength ).is( '.short, .bad' ) ) {
if ( ! $weakCheckbox.prop( 'checked' ) ) { if ( ! $weakCheckbox.prop( 'checked' ) ) {
$submitButtons.prop( 'disabled', true ); $submitButtons.prop( 'disabled', true );
} }

View File

@ -644,11 +644,20 @@ case 'rp' :
</p> </p>
<div class="wp-pwd"> <div class="wp-pwd">
<span class="password-input-wrapper"> <div class="password-input-wrapper">
<input type="password" data-reveal="1" data-pw="<?php echo esc_attr( wp_generate_password( 16 ) ); ?>" name="pass1" id="pass1" class="input" size="20" value="" autocomplete="off" aria-describedby="pass-strength-result" /> <input type="password" data-reveal="1" data-pw="<?php echo esc_attr( wp_generate_password( 16 ) ); ?>" name="pass1" id="pass1" class="input password-input" size="24" value="" autocomplete="off" aria-describedby="pass-strength-result" />
</span> <span class="button button-secondary wp-hide-pw hide-if-no-js">
<span class="dashicons dashicons-hidden"></span>
</span>
</div>
<div id="pass-strength-result" class="hide-if-no-js" aria-live="polite"><?php _e( 'Strength indicator' ); ?></div> <div id="pass-strength-result" class="hide-if-no-js" aria-live="polite"><?php _e( 'Strength indicator' ); ?></div>
</div> </div>
<div class="pw-weak">
<label>
<input type="checkbox" name="pw_weak" class="pw-checkbox" />
<?php _e( 'Confirm use of weak password' ); ?>
</label>
</div>
</div> </div>
<p class="user-pass2-wrap"> <p class="user-pass2-wrap">