Skip to content

Conversation

@csillag
Copy link
Contributor

@csillag csillag commented Sep 4, 2025

This is an alternate implementation of #2178 and #2182, which keeps the border around the hover highlight, but adds 1px of negative horizontal margin. This means that we will have proper vertical alignment, but use one pixel above and below every address. We might see some clipping at the left and right sides, if the address is squeezed somewhere really tightly. (I haven't seen this manifest anywhere yet.)

See screenshots at #2178.

Earlier we had some difficulty about padding/margin about addresses
that we might want to highlight on hover, because we wanted a bubble around
the highlighted part. Unfortunately this makes correct spacing
next to impossible, so now we are giving it up.

From now, hover highlight will simply change the background, and nothing else.

This makes all workaround unnecessary.

Also, fix some more vertical alignment issues around links,
so that everything lines up nicely.
@github-actions
Copy link

github-actions bot commented Sep 4, 2025

Deployed to Cloudflare Pages

Latest commit: c5eeaf525d4da40f4fbb6ee85ecfdc4185e2e6e6
Status:✅ Deploy successful!
Preview URL: https://669f0ebb.oasis-explorer.pages.dev
Alias: https://pr-2183.oasis-explorer.pages.dev

@csillag csillag changed the title Simplify hover highlight v2 (keep the border and -1px horizontal margin) Simplify hover highlight v3 (keep the border and -1px horizontal margin) Sep 4, 2025
@csillag
Copy link
Contributor Author

csillag commented Sep 4, 2025

Decision from @donouwens:

from what I can see and understand, I think option 2 is the most reliable, scalable, and solves the UX purpose best.

So, I'm closing this (v3)

@csillag csillag closed this Sep 4, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants