Inverting color of mobile logo only on one page.

Hi,

I was wondering if there was a way to invert the mobile logo on just one specific mobile page?

It was fairly easy to find information on how to invert the logo on one specific web page, but not for mobile. 

Thank you in advance! 🙂

38 minutes ago, Adcho said:

Hi,

I was wondering if there was a way to invert the mobile logo on just one specific mobile page?

It was fairly easy to find information on how to invert the logo on one specific web page, but not for mobile. 

Thank you in advance! 🙂

Can you share your site with the site-wide password so we can take a look?

Here you go! I have several other projects that have the inverted logo for desktop, but I would like to make the mobile version inverted to white as well. Currently the mobile logo is black.

On 5/25/2022 at 6:10 AM, Adcho said:

Hi,

I was wondering if there was a way to invert the mobile logo on just one specific mobile page?

It was fairly easy to find information on how to invert the logo on one specific web page, but not for mobile. 

Thank you in advance! 🙂

If Squarespace 7.1, you can edit that page >> Add a Code Block on bottom of page > Paste this code

<style>
  @media screen and (max-width:767px) {
    header#header img {
    	filter: invert(1);
    }
  }
</style>

If it doesnt work, change 1 to 0

On 5/26/2022 at 3:44 AM, tuanphan said:

If Squarespace 7.1, you can edit that page >> Add a Code Block on bottom of page > Paste this code

<style>
  @media screen and (max-width:767px) {
    header#header img {
    	filter: invert(1);
    }
  }
</style>

If it doesnt work, change 1 to 0

Hi it works great, but I just noticed that it remains black for the tablet view logo as well. Is there a way to invert it for both tablet and mobile within the same code or would another one be needed?

On 5/26/2022 at 3:34 PM, Adcho said:

Hi it works great, but I just noticed that it remains black for the tablet view logo as well. Is there a way to invert it for both tablet and mobile within the same code or would another one be needed?

Change 767px to 991px

Perfect. Thank you!