Solved

Dawn template: Overlay colour when I click on cart or search button.

Angela86
Excursionist
25 1 3

Hello,

When I click on "search" or  on "cart", the page turn pink. I know that changing the text colour, I can change it. However, I want to keep my text colour and change the pink overlay one, instead I want the page turns darker. 

Captura de pantalla 2024-03-28 a la(s) 9.43.16 a.m..png

 

Captura de pantalla 2024-03-28 a la(s) 9.40.03 a.m..png

 

Url: https://74e196-e9.myshopify.com/
pass:ujiamu


I'm looking forward to your response.

Thank you,

 

Accepted Solutions (2)

LuffyOnePiece
Shopify Partner
288 50 50

This is an accepted solution.

Hi @Angela86 ,

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find base.css file
4) Add the following code at the end of base.css

details[open] .modal-overlay::after, .drawer {
    background: #333333;
    opacity: 0.8;
}

 

If you require further help to optimize or customize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

 

Best Regards,
LuffyOnePiece

 

Sandeep Pangeni
Need help with your store? sandeeppangeni17@gmail.com
For quick response, Contact In WhatsApp +9779867521184

View solution in original post

Raj-webdesigner
Shopify Partner
236 52 51

This is an accepted solution.

Add This Css in your Edite Code > Base.css File

details[open] .modal-overlay::after, .drawer {
    background-color: #00000078 !important;
}
If you require further help to optimize your store, please don’t hesitate to reach out.

This contribution will always benefit you and you will get my full help easily and you can contact me easily.
Your Willpower Contribution Link :-

Contribution



Contect On My Mail :-raj.s.webdevloper@gmail.com

View solution in original post

Replies 3 (3)

LuffyOnePiece
Shopify Partner
288 50 50

This is an accepted solution.

Hi @Angela86 ,

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find base.css file
4) Add the following code at the end of base.css

details[open] .modal-overlay::after, .drawer {
    background: #333333;
    opacity: 0.8;
}

 

If you require further help to optimize or customize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

 

Best Regards,
LuffyOnePiece

 

Sandeep Pangeni
Need help with your store? sandeeppangeni17@gmail.com
For quick response, Contact In WhatsApp +9779867521184

Raj-webdesigner
Shopify Partner
236 52 51

This is an accepted solution.

Add This Css in your Edite Code > Base.css File

details[open] .modal-overlay::after, .drawer {
    background-color: #00000078 !important;
}
If you require further help to optimize your store, please don’t hesitate to reach out.

This contribution will always benefit you and you will get my full help easily and you can contact me easily.
Your Willpower Contribution Link :-

Contribution



Contect On My Mail :-raj.s.webdevloper@gmail.com

PageFly-Henry
Astronaut
946 269 212

Hi @Angela86 

This is Henry from PageFly - Landing Page Builder App

 

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save


details[open] .modal-overlay::after {

background: hsl(0deg 0% 13% / 72%) !important;

}

 

Hope that my solution works for you.

Best regards,

Henry | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.