Transparent navbar on desktop, solid color on tablet/phone

Support
#1

The transparent navbar looks great on desktop (http://midwestinfrared.com) but how do I change solid navbar color on tablet and phone to the hex color blue #203f79 so it matches the rest of my website pallette?

#2

Hello There,

Thanks for writing in! Since you have other pages as well that needs the navbar, it is best that you set the navbar background color to #203f79 in X > Launch > Options > Renew > Navbar Background Color.. To make the navbar color transparent in your home and just on desktop screens, please edit your homepage back in Cornerstone and insert the following custom css in the settings tab, Settings > Custom CSS

@media(min-width: 767px){
  body .x-navbar {
    background-color: transparent !important;
  }
}

You will have to do this way because with your current set up, your navbar is not visible in other pages in your site.

Please let us know how it goes.

1 Like
#3

That was easy, thanks!!

#4

Glad we were able to help :slight_smile:

#5

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.