oxidecomputer / console

Oxide Web Console
https://console-preview.oxide.computer
Mozilla Public License 2.0
139 stars 11 forks source link

Fix inconsistent focus states on buttons, links, tables #2054

Open charliepark opened 8 months ago

charliepark commented 8 months ago

@paryhin noticed a few focus issues, and in looking into it I spotted one or two more. This might get spun out into multiple tickets, but I wanted to create a place to log them.

Table receives blue outline when tabbing, in Chrome and Arc: https://github.com/oxidecomputer/console/assets/22547/3146016f-fa21-4725-a185-30f330d470e9

Actions Cell has odd outline widths: image (This looks like it could be from the next row down (and next cell over) having a negative margin, but I haven't investigated too deeply)

Links in Firefox aren't tabbable No screenshot of this, but in Firefox it seems that <a> links, even with an href and without any sort of tabindex value, aren't tabbable. This ends up affecting both navigation links and table action links (the "button" above the table). They seem fine in Chrome. This is odd enough it could be some setting on my browser; will ask others to repro before investing time in it.

charliepark commented 8 months ago

Check the tabindex on that table (or wrapper) and see what the original intent of that was. Removing it might be good.

paryhin commented 7 months ago

Hey @charliepark here is another one:
CleanShot 2024-04-08 at 11 13 19@2x