Different logo wjhen adaptive header changes from transparent to solid

5 hours ago, Oddish said:

Hi, is it possible to have two logo variations on the same page?

The site logo is dark, however I needed the homepage logo to be light to sit over the hero image.

I have inserted the code below to change the homepage logo to be light, however I need it to switch back to dark on scroll when the adaptive header is solid. Any help is appreciated 🙂

/* Homepage new logo */
body[class*="homepage"] header#header img {
    content: url(https://images.squarespace-cdn.com/content/65d8155900dd3949584c908d/525c807e-b928-4947-9e4d-920d3d307bf2/EucalyptRoses_PrimaryLogo_Website_Light.png?content-type=image%2Fpng);
}

Replace your code with the code below

body[class*="homepage"] header#header:not(.shrink) img {
    content: url(https://images.squarespace-cdn.com/content/65d8155900dd3949584c908d/525c807e-b928-4947-9e4d-920d3d307bf2/EucalyptRoses_PrimaryLogo_Website_Light.png?content-type=image%2Fpng);
}