Disabled mobile sticky menu but still show

Home Forums Jevelin Theme Disabled mobile sticky menu but still show

Home Forums Jevelin Theme Disabled mobile sticky menu but still show

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • I am using header style 1, and very happy with the desktop menu. And I decide to disable mobile sticky menu to save more screen space for the content of the page. However, when I scroll up, the mobile sticky menu still show (although it won’t stick to the top). How do I completely disable the sticky menu being show? Thanks.

     

    I screen captured the undesired effect for your convenience.

     

    Elton

    Attachments:
    You must be logged in to view attached files.

    Hi Elton,

     

    I hope you are well today and thank you for your question.

     

    Could you please share me your site URL where it’s happening so that i can troubleshoot it?

     

    Best regards,
    Shufflehound team

     

     

    Here is the address of my site

    You can disable it completely by adding the following CSS code in the Custom CSS code option of your theme on the below path.

     

    Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code

     

    @media (max-width: 1025px){
    body header.primary-mobile .sh-sticky-mobile-header-active {
        background-color: transparent !important;
    }
    
    
    body .primary-mobile-light .sh-header-mobile .header-logo img {
        display: none;
    }
    
    body .primary-mobile-light .sh-header-mobile .header-logo .sh-light-logo {
        display: block;
    }
    
    #page-container header.primary-mobile-light .sh-header-mobile.sh-sticky-mobile-header-active {
        border-bottom: 0!important;
    }
    
    .primary-mobile-light .sh-header-mobile .c-hamburger:not(.is-active) span,
    .primary-mobile-light .sh-header-mobile .c-hamburger span:before,
    .primary-mobile-light .sh-header-mobile .c-hamburger span:after {
        background-color: #fff!important;
    }
    }

    This part of your code doesn’t work.

    #page-container header.primary-mobile-light .sh-header-mobile.sh-sticky-mobile-header-active {
        border-bottom: 0!important;
    }

    It is disabled by the !important on the line 1104 of the theme CSS, why do you put a !important there?

    #page-container header.primary-mobile-light .sh-header-mobile.sh-sticky-mobile-header-active {
    	border-bottom: 1px solid rgba( 0,0,0,0.08 )!important;
    }

    I can see the shared code is working fine on your site, even the bottom border removal code.

     

    You will find more information about !important on the following page.

     

    https://css-tricks.com/when-using-important-is-the-right-choice/

Viewing 6 posts - 1 through 6 (of 6 total)