eclipse-archived/ceylon

ceylondoc: Hard to click "Show more links" arrow

Opened this issue · 0 comments

xkr47 commented

In documentation page

https://modules.ceylon-lang.org/repo/1/ceylon/language/1.3.3/module-doc/api/Sequence.type.html

you can hover either Element[] or {Element+} to get a small arrow you can click to get a list of links with interesting related documentation.

However, it is rather hard to escort the mouse cursor to the arrow without the latter disappearing. I have illustrated this challenge below (4x upscaled). I have added a yellow background for the area that should be hovered for the dropdown arrow to appear and an orange background for the area of the dropdown arrow itself where you have to click for the dropdown to activate. The cursor must stay within the yellow or orange areas for the dropdown not to disappear. The green line shows a typical path that the cursor has to travel to successfully reach the dropdown arrow.

image

While the arrow is aesthetically pleasing, the "corridor" between the yellow and orange areas is too small and should arguably be increased. This does not necessarily have to imply changing the visual appearance of the arrow itself, but at least increasing the orange "action area", perhaps most importantly upwards, but perhaps also a bit to the right and down?

CSS to visualize the yellow and orange areas:

.link-dropdown { background: yellow; }
.dropdown-toggle, .dropdown-toggle > * { background: orange; }

The arrow is implemented here:

https://github.com/eclipse/ceylon/blob/52fd049b8d1288d497352e142ab3626f81dcc8d3/compiler-java/src/org/eclipse/ceylon/ceylondoc/LinkRenderer.java#L905