[openstreetmap/openstreetmap-website] Keyboard navigation: focus not shown on certain elements (Issue #3633)

[Guillaume Rischard]

### URL

https://openstretemap.org

### How to reproduce the issue?

1. Use the tab key to cycle through the elements on the main openstreetmap.org page.
2. See how the focus gets shown for most items
3. The focus does not get shown for the map buttons (zoom etc.). It could get shown the way it gets shown when you hover the mouse over it.
4. The focus does not get shown on the user profile/avatar/unread count button at the top right. There is no mouse hover effect there.

This is an important accessibility feature for users with a motor disability.

### Screenshot(s) or anything else?

With mouse:

<img width="362" alt="image" src="https://user-images.githubusercontent.com/1556567/181589548-143ff9b4-c03a-40f7-9977-f8a3b393ce49.png">

With keyboard:

<img width="362" alt="image" src="https://user-images.githubusercontent.com/1556567/181589618-c70a8715-7ca9-40db-835b-220257bb3388.png">


-- 
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/issues/3633
You are receiving this because you are subscribed to this thread.

Message ID: <openstreetmap/openstreetmap-website/issues/3633 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20220728/b7e86872/attachment-0001.htm>