Many elements do have focus visible, it's worth going through with a fine tooth comb because there are areas where it is missing.

To test this simply Tab through the site - each element should have a box around it if it is a link. To go backwards hit Shift + Tab

Reference: Focus Visible: Understanding SC 2.4.7 2.4.7 Any keyboard operable user interface has a mode of operation where the keyboard focus indicator is visible. (Level AA)

A couple of screenshots attached to demonstrate

CommentFileSizeAuthor
#12 8-x.8.9.3-menu-link-border1.jpg13.69 KBbas123
#12 8-x.8.9.3-link-border.jpg36.37 KBbas123
#12 8-x.8.9.3-menu-link-border.jpg12.95 KBbas123
focus_visible_missing.png12.22 KBok_lyndsey
focus_visible_exists.png15.12 KBok_lyndsey
focus_visible.png309.09 KBok_lyndsey

Comments

ok_lyndsey created an issue. See original summary.

Serhiy Chornobay’s picture

Serhiy Chornobay commented
Status: Active » Closed (duplicate)

Duplicated: https://www.drupal.org/project/social/issues/2946460

kingdutch’s picture

kingdutch
he/him
Primary language English
commented
Version: 8.x-1.11 » 8.x-9.x-dev
Status: Closed (duplicate) » Active

Re-opening this since there are quite a few links that are not buttons that don't have a focus style. This makes using the keyboard to navigate a page more difficult.

We have a rule for this but it doesn't work in Firefox and possibly also in other browsers.

https://github.com/goalgorilla/open_social/blob/10.0.x/themes/socialbase...

agamich’s picture

agamich commented
Assigned: Unassigned » agamich
agamich’s picture

agamich commented

I've added updates on this PR: https://github.com/goalgorilla/open_social/pull/1991

agamich’s picture

agamich commented
Assigned: agamich » Unassigned
Status: Active » Needs review
kingdutch’s picture

kingdutch
he/him
Primary language English
commented
Version: 8.x-9.x-dev » 8.x-8.x-dev
Status: Needs review » Reviewed & tested by the community
kingdutch’s picture

kingdutch
he/him
Primary language English
commented
Status: Reviewed & tested by the community » Fixed

  • Kingdutch committed 7200a89 on 8.x-8.x 
    Issue #2947668 by agami4: Check and add updates to focus links (#1991)

  • Kingdutch committed 3420210 on 8.x-9.x 
    Issue #2947668 by agami4: Check and add updates to focus links (#1991)
bas123’s picture

bas123 commented

This feature MUST be made optional or at least adjustable by the admin user!

It created a white border around every focused link, and every focused button which is way to strong in my theme which has medium to dark green buttons and links!

I do not see the purpose in validating to a user what they already know they have done! The page changes and that should be their validation!

Nothing wrong with a subtle color change or box shadow on hover, but this is over the top!

Please make this code reversible or at least changeable in the Theme Settings Page!

Or provide the file and location where we can at least modify the border color in a more consistent theme style!

Thank you!

bas123’s picture

bas123 commented
StatusFileSize
new 8-x.8.9.3-menu-link-border.jpg12.95 KB
new 8-x.8.9.3-link-border.jpg36.37 KB
new 8-x.8.9.3-menu-link-border1.jpg13.69 KB
kingdutch’s picture

kingdutch
he/him
Primary language English
commented

Please open a new ticket for issues that have been marked as fixed, I've opened #3177634: The color for focused elements added in #2947668 sometimes clashes with the theme colors. for you.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.