Skip to content

Commit

Permalink
rustdoc: do not animate when user prefers reduced motion
Browse files Browse the repository at this point in the history
This accessibility improvement gates the target flashing and tooltip fade-out
behind an inverted prefers-reduced-motion media query.
  • Loading branch information
zopsicle authored and zopsicle committed Sep 26, 2024
1 parent 0399709 commit cdd3371
Showing 1 changed file with 14 additions and 7 deletions.
21 changes: 14 additions & 7 deletions src/librustdoc/html/static/css/rustdoc.css
Original file line number Diff line number Diff line change
Expand Up @@ -1687,7 +1687,12 @@ instead, we check that it's not a "finger" cursor.
padding-right: 3px;
background-color: var(--target-background-color);
border-right: 3px solid var(--target-border-color);
animation: 0.65s cubic-bezier(0, 0, 0.1, 1.0) 0.1s targetfadein;
}

@media not (prefers-reduced-motion) {
:target {
animation: 0.65s cubic-bezier(0, 0, 0.1, 1.0) 0.1s targetfadein;
}
}

.code-header a.tooltip {
Expand All @@ -1712,12 +1717,14 @@ a.tooltip:hover::after {
content: "\00a0";
}

/* This animation is layered onto the mistake-proofing delay for dismissing
a hovered tooltip, to ensure it feels responsive even with the delay.
*/
.fade-out {
opacity: 0;
transition: opacity 0.45s cubic-bezier(0, 0, 0.1, 1.0);
@media not (prefers-reduced-motion) {
/* This animation is layered onto the mistake-proofing delay for dismissing
a hovered tooltip, to ensure it feels responsive even with the delay.
*/
.fade-out {
opacity: 0;
transition: opacity 0.45s cubic-bezier(0, 0, 0.1, 1.0);
}
}

.popover.tooltip .content {
Expand Down

0 comments on commit cdd3371

Please sign in to comment.