Drawer: consider using background with alpha channel instead of opacity.

[flip111]

<label for="my-drawer" class="drawer-overlay"> put a nice darkening overlay on the background. Though i like to have a visual indication inside of this darkened area. Just a cross to indicate the user can click there to close the drawer. However because opacity is used it also affects child elements. I tried make the effect with background color alpha channel instead of opacity like so !bg-neutral/50 !opacity-100 but i couldn't get the effect to look nicely. Because the background alpha channel does not transition gradually but just pops in and out. I don't understand why because transition-property: all is set so it should work.

A problem with !opacity-100 is that the click effect on the background no longer works. Also don't understand why this is happening.

By the way, i have a question. Because i want to use the drawer over my full website i used h-screen on the outer div .. does that now mean that all of my website content should go inside this div now?

[flip111]

Thanks for quick commit !