1323288 - hg annotate popups disappear too quickly

Status: NEW

(Developer Services :: Mercurial: hg.mozilla.org, defect)

Description

[:Gijs (he/him)]

bug 1308152 helped but it's still hard to mouse over this popup. This is especially so on my mac. I am right-handed. To move the mouse, I have to move one of my right-hand fingers right across the touchpad. This almost inevitably means my movement to the right also moves *up* (because of where my palm is), and the tooltip is actually shifted *down*, meaning I almost always miss it the first time.

The tooltip should disappear off a timeout and/or not be shifted down and/or be centered vertically so its vertical middle aligns with the rev's vertical middle -- or all of the above.

Comment 1

[Tooru Fujisawa [:arai]]

I'm trying to use CSS Transition to delay hiding the popup, but it's trouble some because we have popup for each line, and there can be multiple popups shown when we hover multiple revision numbers quickly.


Here's the diff that delays the hiding transition (for mercurial itself)

diff --git a/mercurial/templates/static/style-paper.css b/mercurial/templates/static/style-paper.css
--- a/mercurial/templates/static/style-paper.css
+++ b/mercurial/templates/static/style-paper.css
@@ -209,26 +209,33 @@ h3 {
 .bigtable td.annotate { font-size: smaller; }
 .bigtable td.source { font-size: inherit; }
 tr.thisrev a { color:#999999; text-decoration: none; }
 tr.thisrev td.source { color:#009900; }
 td.annotate {
   white-space: nowrap;
 }
 div.annotate-info {
-  display: none;
+  display: inline;
   position: absolute;
   background-color: #FFFFFF;
   border: 1px solid #999;
   text-align: left;
   color: #000000;
   padding: 5px;
+  opacity: 0;
+  visibility: hidden;
+  transition: opacity 0.5s step-end, visibility 0.5s step-end;
 }
 div.annotate-info a { color: #0000FF; }
-td.annotate:hover div.annotate-info { display: inline; }
+td.annotate:hover div.annotate-info {
+  opacity: 1;
+  visibility: visible;
+  transition: opacity 0s, visibility 0s;
+}
 
 .source, .sourcefirst {
   font-family: monospace;
   white-space: pre;
   padding: 1px 4px;
   font-size: 90%;
 }
 .sourcefirst { border-bottom: 1px solid #999; font-weight: bold; }

Comment 2

[Tooru Fujisawa [:arai]]

Attachment: multiple popup shown when hide with delay

here's screenshot with the diff above

Comment 3

[Gregory Szorc [:gps]]

I agree the UI interaction can be improved. But as I'm pretty busy ATM and I'm not a terrific web developer, this is low priority for me, so don't look for a fix from me :(

Instructions for hacking the theme/style we use on hg.mozilla.org are available at https://mozilla-version-control-tools.readthedocs.io/en/latest/hgmo/contributing.html#hacking-the-theming

I would encourage fixes to be made against upstream Mercurial and then "backported" to Mozilla's copy of the templates. But if a fix is coded against our repo, I can submit the patch upstream on your behalf.