Issue #1138844 by lewisnyman: Add touch support to contextual links.

8.0.x
Dries 2012-12-19 17:16:22 -05:00
parent 0485f2928f
commit 63fa77ec17
3 changed files with 14 additions and 10 deletions

View File

@ -12,8 +12,10 @@
.contextual .trigger {
display: none;
}
.contextual-region:hover .contextual,
.contextual-region:hover .contextual-links-trigger-active,
.touch .contextual,
.touch .contextual .trigger,
.no-touch .contextual-region:hover .contextual,
.no-touch .contextual-region:hover .contextual-links-trigger-active,
.contextual-active .contextual-links {
display: block;
}

View File

@ -26,11 +26,13 @@ Drupal.behaviors.contextualLinks = {
$wrapper.toggleClass('contextual-active');
}
);
// Attach hover behavior to trigger and ul.contextual-links.
$trigger.add($links).hover(
function () { $region.addClass('contextual-region-active'); },
function () { $region.removeClass('contextual-region-active'); }
);
// Attach hover behavior to trigger and ul.contextual-links, for non touch devices only.
if(!Modernizr.touch) {
$trigger.add($links).hover(
function () { $region.addClass('contextual-region-active'); },
function () { $region.removeClass('contextual-region-active'); }
);
}
// Hide the contextual links when user clicks a link or rolls out of the .contextual-region.
$region.bind('mouseleave click', Drupal.contextualLinks.mouseleave);
$region.hover(

View File

@ -29,7 +29,7 @@
text-indent: 34px;
width: 28px;
}
.contextual .trigger:hover,
.no-touch .contextual .trigger:hover,
.contextual-active .trigger {
background-position: 2px -18px;
}
@ -75,13 +75,13 @@
padding: 0.4em 0.8em 0.4em 0.6em; /* LTR */
}
.contextual-region .contextual .contextual-links a,
.contextual-region .contextual .contextual-links a:hover,
.no-touch .contextual-region .contextual .contextual-links a:hover,
.contextual-region .contextual .contextual-links a:active,
.contextual-region .contextual .contextual-links a:focus {
background-color: #fff;
color: #333;
text-decoration: none;
}
.contextual-region .contextual .contextual-links li a:hover {
.no-touch .contextual-region .contextual .contextual-links li a:hover {
background-color: #bfdcee;
}