[wp-trac] [WordPress Trac] #34904: The design of the focus outline on buttons/elements could be improved

[WordPress Trac]

#34904: The design of the focus outline on buttons/elements could be improved
-------------------------------------------------+-------------------------
 Reporter:  michaelarestad                       |       Owner:  audrasjb
     Type:  task (blessed)                       |      Status:  reopened
 Priority:  normal                               |   Milestone:  5.3
Component:  Administration                       |     Version:
 Severity:  normal                               |  Resolution:
 Keywords:  color-contrast blessed wpcampus-     |     Focuses:  ui,
  report has-patch has-screenshots needs-dev-    |  accessibility
  note commit 5-3-admin-css-changes              |
-------------------------------------------------+-------------------------

Comment (by kjellr):

 > Reminder: for the admin menu there's #28599. Old, long to read, ticket:
 recommend to directly jump to the latest comments.
 >
 > On that ticket, a solid outline for the admin menu received a non
 positive design feedback. At some point the identified solution was a left
 "border" implemented with box-shadow and currentColor. Worth noting
 currentColor has the advantage of automatically using the color from the
 active color scheme. I'd be inclined to not rush changes for the admin
 menu and consider what the best option is. Not opposed to postpone and
 work on #28599 during the WP 5.4 cycle.

 Thanks for the link — I'd forgotten about that ticket. As long as we have
 a visible focus state in here in general, I'd be happy to postpone major
 changes and work on them in the context of that ticket instead.

 > For normal links: personally, I'd keep using a box-shadow. It is true
 that 34904.13.diff​ appears to solve the "odd shape" issue but we're not
 sure it addresses all the occurrences. After all, using outline instead of
 box-shadow gives us only the advantage of a slight simplification of the
 CSS. Instead, box-shadow is more reliable as it is used since years: we
 know it works across all the UI. For Windows High Contrast Mode the
 additional transparent outline just works.

 Using box-shadow (along with the transparent outline fallback for high-
 contrast mode) sounds fine to me too. I'm not sure I have time to rewrite
 that patch at the moment, but if someone else is up for taking it on, that
 would be excellent.

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