readthedocs
Improve CSS UX of links
I'd love to have a more visible UX indicator that a link on the page is hoverxref-enabled. I'd love a very obvious custom underline CSS style, as a start. Perhaps also an optional icon at the end of the link? Many sites do this for badging external links, so could be something similar.
This should also be documented for theme authors so they can make similar UX updates.
We talked about this some time ago and I suggested to use a small 💡 icon. See https://github.com/readthedocs/sphinx-hoverxref/issues/11#issuecomment-609042369
It should not be hard to make this change, but I'd like to receive some feedback and opinions about the style/look&feel to make it good under different circumstances.
I found this nice idea in https://myst.tools/sandbox
- you have to click, so it's not hover
- that makes it to work on mobile
- it changes the cursor to a magnifier with a plus sign inside it
- the popup shows a link at the top right to go directly to that section
- you have to click outside to make it disappear