Ticket #30685: 30685.5.patch

src/wp-admin/css/login.css

@@ -14 +14 @@
         color: #444;
         font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
         font-size: 13px;
-        line-height: 1.4em;
+        line-height: 1.4;
 }
 
 a {
@@ -54 +54 @@
         line-height: 1.5;
 }
 
-.login .message,
-.login #login_error {
-        border-left: 4px solid #00a0d2;
+.login .login-error-list {
+        list-style: none;
+        margin: 20px 0 0 0;
+        padding: 0;
+}
+
+.login .notice {
+        margin: 0;
         padding: 12px;
-        margin-left: 0;
         background-color: #fff;
         -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
         box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
 }
 
-.login #login_error {
-        border-left-color: #dc3232;
+.login-error-list .notice + .notice {
+        margin-top: -24px;
 }
 
+.login .notice-info {
+        border-left: 4px solid #00a0d2;
+}
+
+.login .notice-error {
+        border-left: 4px solid #dc3232;
+}
+
 #loginform p.submit,
 .login-action-lostpassword p.submit {
         border: none;

src/wp-login.php

@@ -190 +190 @@
                         $severity = $wp_error->get_error_data( $code );
                         foreach ( $wp_error->get_error_messages( $code ) as $error_message ) {
                                 if ( 'message' == $severity )
-                                        $messages .= '  ' . $error_message . "<br />\n";
+                                        $messages .= $error_message . "<br />\n";
                                 else
-                                        $errors .= '    ' . $error_message . "<br />\n";
+                                        $errors .= '<li class="notice notice-error">' . $error_message . '</li>';
                         }
                 }
                 if ( ! empty( $errors ) ) {
@@ -203 +203 @@
                          *
                          * @param string $errors Login error message.
                          */
-                        echo '<div id="login_error">' . apply_filters( 'login_errors', $errors ) . "</div>\n";
+                        echo '<div id="login_error"><ul class="login-error-list">' . apply_filters( 'login_errors', $errors ) . "</ul></div>\n";
                 }
                 if ( ! empty( $messages ) ) {
                         /**
@@ -213 +213 @@
                          *
                          * @param string $messages Login messages.
                          */
-                        echo '<p class="message">' . apply_filters( 'login_messages', $messages ) . "</p>\n";
+                        echo '<div class="notice notice-info"><p>' . apply_filters( 'login_messages', $messages ) . "</p></div>\n";
                 }
         }
 } // End of login_header()
@@ -250 +250 @@
          * @since 3.1.0
          */
         do_action( 'login_footer' ); ?>
-        <div class="clear"></div>
         </body>
         </html>
         <?php
@@ -533 +532 @@
          */
         do_action( 'lost_password' );
 
-        login_header(__('Lost Password'), '<p class="message">' . __('Please enter your username or email address. You will receive a link to create a new password via email.') . '</p>', $errors);
+        login_header( __( 'Lost Password' ), '<div class="notice notice-info"><p>' . __( 'Please enter your username or email address. You will receive a link to create a new password via email.' ) . '</p></div>', $errors );
 
         $user_login = isset($_POST['user_login']) ? wp_unslash($_POST['user_login']) : '';
 
@@ -619 +618 @@
         if ( ( ! $errors->get_error_code() ) && isset( $_POST['pass1'] ) && !empty( $_POST['pass1'] ) ) {
                 reset_password($user, $_POST['pass1']);
                 setcookie( $rp_cookie, ' ', time() - YEAR_IN_SECONDS, $rp_path, COOKIE_DOMAIN, is_ssl(), true );
-                login_header( __( 'Password Reset' ), '<p class="message reset-pass">' . __( 'Your password has been reset.' ) . ' <a href="' . esc_url( wp_login_url() ) . '">' . __( 'Log in' ) . '</a></p>' );
+                login_header( __( 'Password Reset' ), '<div class="notice notice-info"><p>' . __( 'Your password has been reset.' ) . ' <a href="' . esc_url( wp_login_url() ) . '">' . __( 'Log in' ) . '</a></p></div>' );
                 login_footer();
                 exit;
         }
@@ -627 +626 @@
         wp_enqueue_script('utils');
         wp_enqueue_script('user-profile');
 
-        login_header(__('Reset Password'), '<p class="message reset-pass">' . __('Enter your new password below.') . '</p>', $errors );
+        login_header( __( 'Reset Password' ), '<div class="notice notice-info"><p>' . __( 'Enter your new password below.' ) . '</p></div>', $errors );
 
 ?>
 <form name="resetpassform" id="resetpassform" action="<?php echo esc_url( network_site_url( 'wp-login.php?action=resetpass', 'login_post' ) ); ?>" method="post" autocomplete="off">
@@ -724 +723 @@
          * @param string $registration_redirect The redirect destination URL.
          */
         $redirect_to = apply_filters( 'registration_redirect', $registration_redirect );
-        login_header(__('Registration Form'), '<p class="message register">' . __('Register For This Site') . '</p>', $errors);
+        login_header( __( 'Registration Form' ), '<div class="notice notice-info"><p>' . __( 'Register for this site.' ) . '</p></div>', $errors );
 ?>
 <form name="registerform" id="registerform" action="<?php echo esc_url( site_url( 'wp-login.php?action=register', 'login_post' ) ); ?>" method="post" novalidate="novalidate">
         <p>
@@ -820 +819 @@
 
         if ( !is_wp_error($user) && !$reauth ) {
                 if ( $interim_login ) {
-                        $message = '<p class="message">' . __('You have logged in successfully.') . '</p>';
+                        $message = '<div class="notice notice-info"><p>' . __( 'You have logged in successfully.' ) . '</p></div>';
                         $interim_login = 'success';
                         login_header( '', $message ); ?>
                         </div>
@@ -894 +893 @@
                 $user_login = ( 'incorrect_password' == $errors->get_error_code() || 'empty_password' == $errors->get_error_code() ) ? esc_attr(wp_unslash($_POST['log'])) : '';
         $rememberme = ! empty( $_POST['rememberme'] );
 
-        if ( ! empty( $errors->errors ) ) {
-                $aria_describedby_error = ' aria-describedby="login_error"';
+        // Ensure `aria-describedby` is used only for errors and not for messages.
+        if ( ! empty( $errors->errors ) && 'message' !== $errors->get_error_data() ) {
+                $aria_describedby = ' aria-describedby="login_error"';
         } else {
-                $aria_describedby_error = '';
+                $aria_describedby = '';
         }
 ?>
 
@@ -904 +904 @@
 <form name="loginform" id="loginform" action="<?php echo esc_url( site_url( 'wp-login.php', 'login_post' ) ); ?>" method="post">
         <p>
                 <label for="user_login"><?php _e('Username or Email') ?><br />
-                <input type="text" name="log" id="user_login"<?php echo $aria_describedby_error; ?> class="input" value="<?php echo esc_attr( $user_login ); ?>" size="20" /></label>
+                <input type="text" name="log" id="user_login"<?php echo $aria_describedby; ?> class="input" value="<?php echo esc_attr( $user_login ); ?>" size="20" /></label>
         </p>
         <p>
                 <label for="user_pass"><?php _e('Password') ?><br />
-                <input type="password" name="pwd" id="user_pass"<?php echo $aria_describedby_error; ?> class="input" value="" size="20" /></label>
+                <input type="password" name="pwd" id="user_pass"<?php echo $aria_describedby; ?> class="input" value="" size="20" /></label>
         </p>
         <?php
         /**
@@ -947 +947 @@
 <?php endif; ?>
 </p>
 <?php } ?>
-
 <script type="text/javascript">
 function wp_attempt_focus(){
 setTimeout( function(){ try{