How to remove whitespace above the gallery section? & How to change header logo on scroll?

[LR_]

Hi, 

I am struggeling with two questions containing the design of my shopify store. If you can only answer one question i would still love to hear te answer!

store: https://newindumentis.com/

theme: Symmetry

(1) I have a gallery section right above my footer. I am struggeling to remove the whitespace at the top of the section, so that my featured collection section has the same amount of whitespace at the top and bottom. How do I do this?

(2) I have a transparent header that turns white on scroll. My logo is white, I want it to turn black on scroll because of the white header. I already have both versions of the logo (img). How do I do this?

All help is greatly appreciated!

[rajimulislamjoy]

@LR_ 

Hi,

For your gallery section whitespace issue, you can adjust the padding in the CSS file. Look for the gallery section's CSS and reduce the padding-top value to match the padding-bottom.

For the logo color change on scroll, you'll need to use JavaScript or jQuery to detect the scroll event and switch the logo image. In your theme's JavaScript file, add an event listener for scroll and use a condition to change the logo source based on the scroll position.

Both adjustments will require editing the theme's code, so ensure you backup your theme before making changes.

[LR_]

Hi Rajimulislamjoy, thank you for replying.

I've tried to find the option to remove the top padding from my gallery section but I can't seem to find it. I'm a complete beginner when it comes to any type of code. Could you show me where I need to edit my code to remove the whitespace?

Thanks in advance!

[websensepro]

Hello @LR_ ,

Please share your store password so I can observe the issues and solve them.

Thanks!

[LR_]

Hi Websensepro,

Thank you for responding. I have removed the password from the store so you should be able to see the actual store itself now.