If I add a Drawer and toggle it, the background behind the opened drawer turns into gray with an opacity.
Is there a way to avoid this behavior and stay just on the original color?
Asked
Active
Viewed 1,042 times
1

Manny
- 79
- 1
- 10
-
You can remove all the class that has a `bg-` at start – xenooooo Dec 03 '22 at 09:49
-
@xenooooo I can? Awesome! How I can do that? – Manny Dec 03 '22 at 14:25
-
just remove the `bg-gray-900 bg-opacity-50` inside the `class` of your div – xenooooo Dec 03 '22 at 16:58
-
thx. But it is not my class and my div. It is display by TailwindCSS if I open the drawer. If I do in my CSS `div { @apply bg-transparent } nothing happens. The snippet in my Question is a screenshot from Chrome dev tools. – Manny Dec 03 '22 at 18:20
1 Answers
1
Solution
Go into your HTML, Blade or whatever you use for your Markup.
There, go into the element where you use the drawer.
Insert:
data-drawer-backdrop="false"
If you want to turn it on again, you can delete this line (because the drawer-backdrop is a default by TailwindCSS) or you can do:
data-drawer-backdrop="true"
In TailwindCSS docs it described here as well. Look for the topic Backdrop
.

Manny
- 79
- 1
- 10