[wp-trac] [WordPress Trac] #30685: Better Login Error&Message Displaying

[WordPress Trac]

#30685: Better Login Error&Message Displaying
------------------------------------+--------------------------------
 Reporter:  extendwings             |       Owner:
     Type:  enhancement             |      Status:  new
 Priority:  normal                  |   Milestone:  Awaiting Review
Component:  Login and Registration  |     Version:
 Severity:  normal                  |  Resolution:
 Keywords:  has-patch               |     Focuses:  ui, accessibility
------------------------------------+--------------------------------

Comment (by afercia):

 @extendwings thanks very much for the clarification.

 With the new proposed patch, error messages will use a list. Together with
 the [https://core.trac.wordpress.org/ticket/29955#comment:4 proposed use
 of aria-describedby] to make errors be announced automatically by screen
 readers, this could be a very nice improvement for accessibility.
 In the attached patch:

 - errors are listed with a `<ul>`, messages will still use a `<p>`
 - both use now the "notice" CSS classes
 - messages are all blue, see ticket:27418#comment:9
 - added focus style for links
 - changed link color `#999` in `#6e6e6e` in order to have a sufficient
 color contrast for WCAG level AA
 - simplified CSS (e.g. removed transitions on links, avoided things like
 `.login *`)
 - removed a few title attributes see #24766
 - removed two `<br class="clear" />` because screen readers will read out
 "blank"
 - removed `<div class="clear"></div>` before `</body>` didn't see any
 reason for that
 - added CSS class `modal-open` for the body in wp-auth-check.js for
 consistency with modals

 I may have missed something, please let me know. Tried to test all the
 possible actions, a few example screenshots:
 https://cloudup.com/cNxU3BhyLL1

 Aside:
 many CSS rules here are duplicated, for example the "notice" style are
 already in `common.css`.
 Was thinking to include `common.css` in the login screen and clean out
 `login.css` but maybe better to wait for
 [https://make.wordpress.org/core/2014/12/19/core-css-roadmap/ the CSS
 roadmap to sanity]

--
Ticket URL: <https://core.trac.wordpress.org/ticket/30685#comment:9>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform