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
    NOT RESOLVED Posts

  • greenbulb
    Participant

    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.

    Shufflehound Support
    Moderator

    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

     

     

    greenbulb
    Participant

    Here is the address of my site

    Shufflehound Support
    Moderator

    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;
}
}

    greenbulb
    Participant

    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;
}

    Shufflehound Support
    Moderator

    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/

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)