[Resolved] Hide logo on mobile/tablet sticky nav and change text style on mobile sticky

Home Forums Support Hide logo on mobile/tablet sticky nav and change text style on mobile sticky

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #957258
    Shawn

    Alrighty so I have a transparent primary nav using nav as header. I’ve managed to style the sticky nav separately with some custom CSS like so:

    .main-navigation.navigation-clone {
    	 background-image: linear-gradient(to right, #005d68, #007b7f, #009a8f, #2db99a, #5cd89f);
    }

    and

    .main-navigation.sticky-navigation-transition .main-nav > ul > li > a, .sticky-navigation-transition .menu-toggle, .main-navigation.sticky-navigation-transition .mobile-bar-items a, .sticky-navigation-transition .navigation-branding .main-title {
    	color: white;
    }
    
    .main-navigation.sticky-navigation-transition .main-nav > ul > li > a:hover , .sticky-navigation-transition .menu-toggle, .main-navigation.sticky-navigation-transition .mobile-bar-items a, .sticky-navigation-transition .navigation-branding .main-title{
    	color: #005D68 ;
    }

    The issue though is that the logo doesn’t show well over the gradient so it’s hidden on desktop. But I can’t hide it from tablet and mobile only on the sticky nav. In other words. On tablet/mobile I’d like the logo to show on normal but hide on sticky.

    I’d also like to change the text colour of the mobile toggle and label on the mobile/tablet sticky.

    Does anyone have a suggestion on how to pull that off.

    #957559
    Leo
    Staff
    Customer Support

    Hi there,

    This should hide the sticky logo on mobile:

    .mobile-header-navigation.navigation-stick .site-logo.mobile-header-logo img {
        display: none;
    }

    This should change the color:

    .mobile-header-navigation.navigation-stick .menu-toggle {
        color: #fff;
    }

    Let me know if this helps 🙂

    #958002
    Shawn

    Thanks so much. Now I see it I can’t think why I missed it.

    #958447
    Leo
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.