SouthernSunEvents

@tuanphanwanted to add to this that this made the homepage transparent only and I'm aiming for site wide. Thanks!

How could I go about hiding the logo on the home page on mobile/tablet views? http://www.southernsunevents.com PW:sse2020

@tuanphan Looking to reduce the font size on my mobile/tablet footer. Not having any luck finding any code to work with as a template. Also, you help me so much on a daily basis, I need to figure out a way to send you many cases of beer. I am unbelievably grateful for all of your help. http://www.southernsunevents.com PW: sse2020

Trying to do this too without any luck. http://www.southernsunevents.com PW: sse2020

Thanks so much. Might you be able to point me in the direction of a code template for this?

tablet/mobile

Still trying to change "MENU" color to white on index page and can't seem to get sticky nav. It's still scrolling down for me on mobile and tablet. Thanks!

Site URL: http://www.southernsunevents.com http://www.southernsunevents.com PW: sse2020 My home page has the logo featured on the banner image and the traditional logo spot hidden via css. I've got my nav links spaced apart as I want them like this: I want the typical top center logo for the rest of my pages but it's knocking down my nav links because they are too big based on how I've set them for the home page layout. Is there a way to customize the nav links just for the index page and have everything standard for the rest of my pages? Thanks!

Gah, sorry! Also curious how to get my nav bar to stick at the top for mobile/tablet. I'm tried so many different variations of code but nothing seems to be working. http://www.southernsunevents.com PW: sse2020

@tuanphanThis works great. I'm curious if this could be manipulated to have the index page "MENU" font color as white and then black for all other pages?

@tuanphanFigured out how to do this with the help of your video block by block but curious if there's a sitewide coding fix before I spend a week straight fixing every block. Thanks! http://www.southernsunevents.com PW: sse2020

Still trying to tackle this one. I can't seem to keep the logo/nav sticky at the top. Anyone have any ideas? http://www.southernsunevents.com PW: sse2020

gah, so sorry! http://www.southernsunevents.com PW: sse2020

trying to make nav text bolder on just the home page

@tuanphan I think I just solved this but I had to add this code on top of what's listed above. It feels like a huge amount of code for this. Do you think it looks alright? Everything seems to work with this except for the intro banner image on tablet view. Not sure how I can fix that one. Thanks so much for your help on everything. You must be so sick of looking at my page!! /* RESIZING BANNERS - IMAGE 1*/ @media screen and (max-width:640px) { section#about-intro figure img { width: 100% !important; left: 0 !important; height: auto !important; } section#about-intro { min-height: unset !important; height: 80vh !important; } } /* RESIZING BANNERS - IMAGE 2*/ @media screen and (max-width:640px) { section#explore-our-work figure img { width: 100% !important; left: 0 !important; height: auto !important; } section#explore-our-work { min-height: unset !important; height: 80vh !important; } } /* RESIZING BANNERS - IMAGE 3*/ @media screen and (max-width:640px) { section#quote figure img { width: 100% !important; left: 0 !important; height: auto !important; } section#quote { min-height: unset !important; height: 80vh !important; } }

@tuanphan Also trying to reside my banner images in mobile view. I've been using the following that worked great prior to me changing the images. Might you be able to help me identify why it's not working now that the images are different? /*RESIZING BANNERS ON MOBILE IN SQUARESPACE - BRINE W/ PARALLAX*/ /*image 1*/ @media screen and (max-width: 640px) { .Parallax-item:nth-child(1) .Index-page-image { background-image: url('https://static1.squarespace.com/static/5e1752ffdaded31e3f9c43e4/t/60ef3bcde5597268282ecb75/1626291160358/shutterstock_1903979449.jpg'); background-position: 45% bottom; background-repeat: no-repeat; background-size: 125%; } .Parallax-item:nth-child(1) .Index-page-image img { display: none; } } /*image 2*/ @media screen and (max-width: 640px) { .Parallax-item:nth-child(2) .Index-page-image { background-image: url('https://static1.squarespace.com/static/5e1752ffdaded31e3f9c43e4/t/60ef3bf3498183082da0f405/1626291201103/shutterstock_1623765805.jpg'); background-position: 50% bottom; background-repeat: no-repeat; background-size: 125%; } .Parallax-item:nth-child(2) .Index-page-image img { display: none; } } /*image 3*/ @media screen and (max-width: 640px) { .Parallax-item:nth-child(3) .Index-page-image { background-image: url('https://static1.squarespace.com/static/5e1752ffdaded31e3f9c43e4/t/60ef3c0e0f253f0745d394b3/1626291218552/341.jpg'); background-position: 48% bottom; background-repeat: no-repeat; background-size: 125%; } .Parallax-item:nth-child(3) .Index-page-image img { display: none; } }

The logo and nav menu move down and overlaps everything while scrolling on mobile and tablet. Looking to keep them stuck at the top. Thanks!

Thanks for sending this over. I just realized my earlier post was worded a little wonky. I'm looking for a heavy text weight. Keeping this code though because I like the nav text higher up so thanks for this one too!

@tuanphan Trying to figure this out as well for mobile and tablet. http://www.southernsunevents.com PW: sse2020

Trying to find this in the forums but this page topic is the closest thing I can find. I'm trying to have the nav text weight higher on my index page. Is there a way to adjust the nav text on the index page only? http://www.southernsunevents.com PW: sse2020 Thanks!

Still there for all pages on tablet on my end. Thanks!

Works great but now the logo is scrolling and overlapping my banner image text. Punch the code to do tablet too and having the same problem. Thanks!

Sorry! It's http://www.southernsunevents.com PW: sse2020

Hi @tuanphan, Not sure I'm able to follow this video because it's a bit fast for my non-coding savvy self. Is there a code that can adjust all header/body spacing site wide? Thanks!

popping on this thread because I'm having a similar problem. Looking to bump the focus of this image up a little bit to have more sky included. I've messed with the position coding for a while now and can't seem to get things to shift up a bit. Any ideas? Also looking to make the nav bar transparent for mobile if possible. Thanks!