Hi, as you can see, my logo looks perfectly fine on my slideshow. However, when I scroll down, the 2nd picture occurs. I have implemented a code that allows a sticky header. Is there any way to make the logo change to black once I scroll past the slideshow? My url is https://a-lineage-story.myshopif…

@adthai add following css class .template-collection .header-sticky a { color: #000!important; }

@adthai you have added any css class in your css file ?

yes, this is what i used to make a sticky header .header-wrapper, .header-container { position: fixed; z-index: 1; background-color: rgba({{ settings.color_body_bg }}, 0.0); width: 100%; } .header-sticky .header-wrapper { background-color: rgba({{ settings.color_body_bg }}, 1); @includ…

@adthai ok no problem add following css class Please add the following code at the bottom of your assets/theme.scss.liquid file. .header-sticky.header-wrapper { background-color: #000 !important; } .header-sticky a { color: #fff!important; }

hi, that works well, but when I go into my collections and scroll down, the white text turns invisible.

@adthai Please share screenshot what do you want. Thanks!

This is before I scroll down. [adthai_0-1634542997258.png] This is after I scroll down. [adthai_1-1634543010966.png]

@adthai add following css class for product and cart page .template-cart .header-sticky a { color: #000!important; } .template-product .header-sticky a { color: #000!important; } .template-page .header-sticky a { color: #000!important; }

is it possible to make this sticky header on the pages black and the font white? [adthai_0-1634543399737.png]

I also noticed that on my F.A.Q. page and terms of service, the same issue happens where the navigation menu disappears because it is white on white.

Brooklyn theme: change transparent logo color once scrolling down

Store Design

adthai October 18, 2021, 7:43am 7

This is before I scroll down.

This is after I scroll down.

Topic		Replies	Views
Brooklyn: sticky header: Homepage transparent header to scroll to normal page header Store Design	9	90	August 23, 2021
How to make logo black when scrolling down? Technical Q&A	5	66	October 20, 2022
Sticky header (transparent on home page, white background with black on other) Technical Q&A	23	268	March 27, 2023
I want my logo to change from white to black on scroll header - brooklyn theme Store Design	9	125	April 16, 2022
Brooklyn theme: Burger Icon on Mobile Disappears from Sticky Header when scrolling down Store Design	10	115	October 21, 2021

Brooklyn theme: change transparent logo color once scrolling down

Related topics