search

atomiks / tippyjs

Tooltip, popover, dropdown, and menu library
https://atomiks.github.io/tippyjs/
MIT License
11.86k stars 520 forks source link

Error in shift-away.scss #1054

Closed NateRobinsonAA closed 2 years ago

NateRobinsonAA commented 2 years ago

Bug description

The SCSS for this animation seems to compile to CSS that doesn't show the correct animation. The compiled CSS can be found here: https://unpkg.com/tippy.js@6.3.7/animations/shift-away.css The first selector to make opacity: 0 is correct, but the rest of the selectors should instead include [data-state=visible].

Reproduction

Here you'll see that the animation is completely absent: CodePen link: https://codepen.io/progidy/pen/MWQpmVL

Here you'll see that the animation is reintroduced when the CSS is fixed: https://codepen.io/progidy/pen/poaePKQ

atomiks commented 2 years ago

It doesn't need data-state=visible because transform: translate(0) is the default and implicit once the hidden state gets removed. Your CodePen is just missing the CSS file, it works fine: https://codepen.io/atomiks/pen/rNJymEB