toasted-notes
toasted-notes copied to clipboard
bottom exit animation doesn't match top exit animation
This is because we animate the height
attribute.
Possible solutions include using marginTop, marginBottom as animation attributes, or absolutely positioning the element inside.
I'm not hugely concerned with this but my ocd might get the better of me.
@bmcmahen Have you considered animating transform: translateY()
?
I think ideally we'd animation everything with transforms. Animating with translateY
is easy when you're dealing with just one toast element, but you need to account for a situation in which you have a stack of 3 items and you want to remove the middle one. This should immediately animate the other toasts into place, and animating height is the easiest way to achieve this.
I'm definitely open to other ideas here - and would like to revisit this at some point if I ever have time to hack on this.