tooltip: Hide tooltip for touch events on touch-enabled devices.

Fixes #16674.
The commit hides the tooltip for touch events on touch enabled device.

Touch events trigger both click and hover action,
leaving the hover action sustained until next click.

Hence it is better to hide the tooltip to avoid the clutter in UI.
This commit is contained in:
Gaurav Pandey 2020-12-17 17:50:39 +05:30 committed by Tim Abbott
parent e271936aae
commit 3dcf97bf27
1 changed files with 17 additions and 0 deletions

View File

@ -536,6 +536,23 @@ strong {
background-color: hsla(0, 0%, 7%, 0.8); background-color: hsla(0, 0%, 7%, 0.8);
padding: 3px 5px; padding: 3px 5px;
} }
/*
Since hover and click are activated together on touchscreen
devices, the hover state persists until the next click, creating
awkward UI where the tooltip sticks around forever :(.
To resolve this, we just hide the tooltip for touch-events on
touch-enabled devices resolving the above problem. This means
that tooltips will never appear on touchscreen devices, but that's
probably a reasoanble tradeoff here.
Source: https://drafts.csswg.org/mediaqueries-4/#mf-interaction
*/
@media (hover: none) {
visibility: hidden !important;
}
} }
.buddy_list_tooltip_content { .buddy_list_tooltip_content {