Ticket #38569: 38569.diff

src/wp-admin/css/forms.css

@@ -443 +443 @@
         top: 3px;
 }
 
+.login-action-resetpass .wp-pwd {
+        position: relative;
+}
+
+.login-action-resetpass.login form .input {
+        padding-right: 40px;
+}
+
+.login-action-resetpass button.wp-hide-pw {
+        position: absolute;
+        top: 0;
+        right: 0;
+        background: transparent;
+        border: 0;
+        box-shadow: none;
+}
+
+.login-action-resetpass button.wp-hide-pw:hover,
+.login-action-resetpass button.wp-hide-pw:focus {
+        background: transparent;
+        border: 0;
+}
+
+.login-action-resetpass button.wp-hide-pw > .dashicons {
+        top: 0;
+        height: 36px;
+        line-height: 36px;
+}
+
 label,
 #your-profile label + a {
         vertical-align: middle;

src/wp-login.php

@@ -632 +632 @@
                         <span 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" />
                         </span>
+                        <button type="button" class="button wp-hide-pw hide-if-no-js" data-start-masked="<?php echo (int) isset( $_POST['pass1'] ); ?>" data-toggle="0" aria-label="<?php esc_attr_e( 'Hide password' ); ?>">
+                                <span class="dashicons dashicons-hidden"></span>
+                        </button>
                         <div id="pass-strength-result" class="hide-if-no-js" aria-live="polite"><?php _e( 'Strength indicator' ); ?></div>
                 </div>
         </div>