Background colour on policy page changed for desktop but not mobile

Solved

Background colour on policy page changed for desktop but not mobile

aurumlux
Tourist
15 0 0

I used the following code and added it to my base.css file. The colour changed for my desktop website but not for my mobile. How do I get it to work for my mobile page too.

 

 

 

 

 

main#MainContent {
    background: #faf9f6 !important;
}

 

 

 

 

 

Accepted Solution (1)
ThePrimeWeb
Shopify Partner
2138 615 493

This is an accepted solution.

Maybe add it in the theme.liquid file right below the <head> tag

 

<style>
main#MainContent {
    background-color: #faf9f6 !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1710256210196.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!

View solution in original post

Replies 15 (15)

ThePrimeWeb
Shopify Partner
2138 615 493

Hey @aurumlux,

 

Can you share the link to your store please? Thank you

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
aurumlux
Tourist
15 0 0

aurumlux.co.uk - password is "globetrotter". Still under construction :@

ThePrimeWeb
Shopify Partner
2138 615 493

Maybe try this?

 

#MainContent > section .gradient {
    background-color: #faf9f6 !important;
}

#MainContent > section:has(> .banner) .gradient {
    background-color: transparent !important;
}
Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
aurumlux
Tourist
15 0 0

Didnt work unfortunately

ThePrimeWeb
Shopify Partner
2138 615 493

The site I'm seeing is already in that colour. Are you working on a draft theme? If so can you send me the preview link to that theme instead?

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
aurumlux
Tourist
15 0 0

I think you may have misunderstood. The background colour on desktop is fine. However, on mobile the background colour is still white on the policy pages but everywhere else the colour matches.

aurumlux
Tourist
15 0 0

on the policy page^ but everywhere else the colour matches

ThePrimeWeb
Shopify Partner
2138 615 493

Hey! I was talking about mobile.

I'm seeing it in the pale colour on mobile as well. 

 

I checked all the policies, return, privacy, and shipping. Which one are you talking about?

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
aurumlux
Tourist
15 0 0

IMG_0449.png

 when I go on my mobile it still shows this white colour across all policy pages so It may just be my phone then and yes I sent u the updated theme

ThePrimeWeb
Shopify Partner
2138 615 493

Try incognito, I used iPhone too. I had the colour you wanted. Same page.

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
aurumlux
Tourist
15 0 0

Still no luck, tried it on 2 phones as well. very strange

aurumlux
Tourist
15 0 0

im going to try a different browser on my phone

ThePrimeWeb
Shopify Partner
2138 615 493

This is an accepted solution.

Maybe add it in the theme.liquid file right below the <head> tag

 

<style>
main#MainContent {
    background-color: #faf9f6 !important;
}
</style>

 

Screenshot is for reference only, the correct code to paste is the one shown above.

ThePrimeWeb_0-1710256210196.jpeg

 

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
aurumlux
Tourist
15 0 0

thank you very much

OmenSkincare
Visitor
1 0 1

Hello,

 

I had the same problem just right now and it too me hours to solve the problem, and it was a tiny problem. First of all if you have any edit codes to solve this go ahead and remove them because it has nothing to do with this. 

 

Solution: I am pretty sure you used the template that shopify suggested for the policies and made few changes, if you did, go ahead and select that and then change color to white click "save" and then change it back to black (or the color you desire). Go under settings page on your home screen of shopify, and then look for "Policies" and then follow the steps that I just told you for EACH policy. 

 

Let me know if this works because it did for me.