search

observablehq / feedback

Customer submitted bugs and feature requests
42 stars 3 forks source link

Tooltips are displayed underneath the cursor pointer. #456

Closed mlynchdev closed 2 years ago

mlynchdev commented 2 years ago

To repro: Simply visit any project, hover any item in the right vertical menu and notice that it is very difficult to read.

Fix: change positioning of the tooltip so that it is above the cursor pointer.

mootari commented 2 years ago

Are you talking about these tooltips?

image
hellonearthis commented 2 years ago

I have a double sized pointer and the tooltips @mootari mentioned are hard to read, even with a normal size pointer blocking occurs.

Tooltips on the right side of the screen should flow from the right of the hovered tool button + 2em to avoid big pointers. Tooltips on the left flow ok but with big pointers they need that 2em space as well.

hellonearthis commented 2 years ago

https://user-images.githubusercontent.com/121805/176037604-43b8c357-bbde-41da-be78-4c7743f4be8b.mp4

mootari commented 2 years ago

Those are native tooltips which can be neither positioned nor styled.

@hellonearthis I assume that you have the exact same issue with every other native tooltip on every other site?

mythmon commented 2 years ago

Notably, how do the tooltips of the browser's UI work? I'd expect the refresh button or back button on the toolbar to act the same.

Are you using a third party tool for that cursor? I don't have a lot of experience with Windows cursor customization.

mlynchdev commented 2 years ago

There's no way to customize the positions? I'm seeing CSS options for this on w3 schools. https://www.w3schools.com/css/css_tooltip.asp

mootari commented 2 years ago

@mlynchdev Those are examples for custom tooltips, i.e. elements styled to appear like tooltips.

mlynchdev commented 2 years ago

Closed as it would be a larger scope than a simple css fix as I had expected. Thanks for all your work!