Shopify themes, liquid, logos, and UX
Hello, I need help adding a backdrop-filter to my menu-drawer, i been testing so many time that i lost count how many fail attempts is been.
This is an example that i did with my cart drawer:
A nice backdrop-filter with a background color of rgba(1, 9, 10, 0.5)
but this is what i got with my menu-drawer
it doesn't look good 😞
i been trying to add a backdrop-filter to my menu-drawer but everytime i do so it just tells me NAH you can't do that.
exemple:
.menu-drawer {
background: rgba(4, 4, 4, 0.8);
backdrop-filter: blur(20px);
}
Can someone help? The things i have changed are this:
base.css
some icons for the header type .svg
component-menu-drawer.css and thats all
I'll leave the password and the website:
Password: St0r3P4ssw0rd
I think i found the problem.
See if i add a backdrop to my header, my drawer then removes the backdrop-filter effect:
Yall can see it too just add this code to my .header
or just remove my backdrop-filter
.header {
backdrop-filter: blur(20px);
}
And yall would see that now the menu-drawer is working with his Blueness and Transparency.
Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025