Im using Tailwind, along with their HeadlessUI for Transitions on a modal
https://www.npmjs.com/package/@headlessui/react#transition
<Transition
show={show}
enter="transition ease-out duration-300"
enterFrom="opacity-0 "
enterTo="opacity-100"
leave="transition ease-in duration-200"
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
<div className="fixed inset-0 bg-gray-900 bg-opacity-75 backdrop-filter backdrop-blur-sm" aria-hidden="true" />
</Transition>
The above works, however the backdrop filter only applies once the Transition component has completed.
Does anyone know how I can get this to work so that the transition also applies to the backdrop filter?