search

joshwcomeau / guppy

🐠A friendly application manager and task runner for React.js
ISC License
3.27k stars 154 forks source link

Added pointerEvents on BackfaceWrapper - fix hover issue #337

Closed AWolf81 closed 5 years ago

AWolf81 commented 5 years ago

As mentioned in PR #335 there is a small issue with the ExternalLink on the LeftPane of the TwoPaneModal.

Summary: Added pointerEvents to BackfaceWrapper. If folded disable pointerEvents. Styling of ExternalLink is unchanged - I've just used the recording from GatsbyStarter branch.

One point that could be improved is that the Earth animaion is running even if it's not visible (see recording below). I think the impact is not that big but I haven't tested. We can tackle this after this PR by adding a prop to Earth component so it's only animating if it's visible.

Screenshots/GIFs: With-out pointerEvents on BackfaceWrapper recording

With pointerEvents on BackfaceWrapper (different ExternalLink) screenrecording_externallink_hover_fixed

Removed class from div to show the Earth animation screenrecording_removed_style_leftpane

codecov[bot] commented 5 years ago

Codecov Report

Merging #337 into master will decrease coverage by <.01%. The diff coverage is 0%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master     #337      +/-   ##
==========================================
- Coverage   20.92%   20.91%   -0.01%     
==========================================
  Files         246      246              
  Lines        3895     3896       +1     
  Branches      389      389              
==========================================
  Hits          815      815              
- Misses       2801     2802       +1     
  Partials      279      279
Impacted Files Coverage Δ
src/components/TwoPaneModal/TwoPaneModal.js 0% <0%> (ø) :arrow_up: