Fix hover to display links in tables for users with screen readers.#4025
Merged
ozh merged 4 commits intoYOURLS:masterfrom Dec 12, 2025
Merged
Fix hover to display links in tables for users with screen readers.#4025ozh merged 4 commits intoYOURLS:masterfrom
ozh merged 4 commits intoYOURLS:masterfrom
Conversation
Member
|
EDIT : oops nope, after I refreshed cache :-P It doesn't work : the icons are now either hidden or piled, but it's unusable as of now |
ozh
requested changes
Dec 7, 2025
Member
ozh
left a comment
There was a problem hiding this comment.
Doesn't work as intented : icons hidden or piled up together
Contributor
Author
|
@ozh Does this happen when hovering or when not hovering the icons? Knowing
this will allow me to hopefully figure out which css statement needs
changing, though I suspect its the one for when icons are hovered.
…-Michael.
--
Sorry about the test, it's just a me thing.
Michael Taboada, Creator of Games. Does that make me a god, well, sorta.
My pgp key: 79BC390E8864CD71305D4DD606CD2197A6EE5ED7
My website: https://michaels.world
2MB website: https://2mb.games
Don't believe everything you read on the internet. I might not be real, you might not be real, and this email certainly isn't real.
Sent from my musically gifted...
stationary bicycle
|
Member
|
They appear all stacked up since only 1 weird icon shows. Hovering doesn't not change anything |
The details, delete, etc links in tables were hidden with display: none until hovered, which hid them from screen readers. Screen readers do not hover the columns with the links, however, so we need to hide them in a way that keeps them available for screen readers.
Contributor
Author
|
@ozh Try the update I just made... I think not including !important on
the hover section was breaking things. I also added a push left of
-9999px, which should make sure they are out of the visible area.
…-Michael.
--
Sorry about the test, it's just a me thing.
Michael Taboada, Creator of Games. Does that make me a god, well, sorta.
My pgp key: 79BC390E8864CD71305D4DD606CD2197A6EE5ED7
My website: https://michaels.world
2MB website: https://2mb.games
Don't believe everything you read on the internet. I might not be real, you might not be real, and this email certainly isn't real.
Sent from my supernatural...
stationary bicycle
|
Member
|
Still doesn't work. Icons are invisible and shown on hover as intended, but the showing makes the table resize on the fly. I'll come up with a solution. |
Member
|
@lilmike can you test this |
Contributor
Author
|
@ozh It does work just fine for my screen reader. Consider it good. -Michael. |
ozh
approved these changes
Dec 12, 2025
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The details, delete, etc links in tables were hidden with display: none until hovered, which hid them from screen readers. Screen readers do not hover the columns with the links, however, so we need to hide them in a way that keeps them available for screen readers.
Please do tell me if any of the css is wrong, or if the web interface looks wrong visually -- I am also blind, so I don't know much about css and cannot tell if things look wrong.