How can I prevent the header from dimming when opening the cart drawer?

Shopify Discussion
1

Do any of you know a way to not have the header dimmed when I open the cart drawer? The same as the hamburger menu. When I open the hamburger menu, everything is dimmed except for the header and the menu itself. I am thinking it is coding to add padding to the top of the overlay when the cart is opened. Thank you for any and all help.

ddai_0-1677030293552.png
ddai_0-1677030293552.png399×227 8.93 KB

ddai_1-1677030293516.png
ddai_1-1677030293516.png400×226 11.1 KB

2

Hello @ddai

To provide you with the most precise solution in this case, could you please share your page URL ( with pass if your store password is enabled )?

Thank you and hope to hear from you.
Best regards,
GemPages Support Team

3

My store link is ysamani.com

4

Hello @ddai

Thanks for your reply

Do you want it to looks like this

GemPages_0-1677031723319.png
GemPages_0-1677031723319.png1885×902 92.6 KB

I hope the above is useful to you.
Best regards,
GemPages Support Team

1 Like
5

Yes! This is exactly what I am looking for.

6

Thanks for your reply.

Kindly follow the steps below:

  1. Go to your Online store > Themes > Edit code
  2. Open your theme.liquid file
  3. Paste the below code before

I hope the above is useful to you.
Best regards,
GemPages Support Team

1 Like
7

Now I am running into the issue where once the cart is open, I cannot close it using the same button. I am very thankful for your help and I promise that is all I need!

8

You try adding the code before :

.drawer.active{
z-index:99999 !important;
}

However, because there is a bit of a conflict with the theme, after you add the code, you will turn off the cart drawer by clicking outside the drawer like the video: https://www.loom.com/share/a57cf52c4b0b422da1d80506d549591a

1 Like
9

Is there a way to add a separate identical button on top that will close the drawer by chance?