The various dropdown elements no longer animate smoothly when appearing on the screen. They just appear.
However, they do fade out smoothly.
Here’s the inspected CSS. Prior release version on the left, Beta 1 on the right.
For the Beta 1 settings on the right, I used the new Dropdown Transition setting to make the Duration “5s”. But it seems to have applied it to the delay as well.
Howdy, @devinelston!
This is all patched up now! The duration value is utilized in the transition-delay property because we need to utilize visibility: hidden when the dropdown / modal / off canvas area is “off” for best practices and accessibility, but we don’t want it to hide right away, otherwise it’d just pop in and out. The duration value is used in the 3rd spot in that particular property for dropdowns as their transition-property order is opacity, transform, visibility in the base level CSS. We need to set the duration amount as the delay amount on that particular property so it doesn’t pop out of view immediately when closing it out. We can do this because visiblity is “animatable,” but you can’t actually transition it…basically, we can at least apply a delay, but once it’s up it just swaps to its new binary state. Some properties aren’t animatable, but luckily visibility is for our purposes with how we structure these interactive elements.
There’s a but of property juggling to get it all working right. I just had to shuffle a few things around to get this working in Safari, and it should all be working as expected now for dropdowns, modals, and off canvas areas.
Let me know if you run into anything else!
