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)

Popular choice

Professional Developers At Your Fingertips!

If you need services beyond standard support, we've got your back!

Services we offer:

Demo setup
Advanced customization
Layout adjustment
Graphic work / visualizations
Custom coding
Full WordPress development and design

Services

What we can offer

  • Demo setup +

    If you'd prefer not to handle the installation yourself or need help getting started, we'll set everything up for you.

  • Layout adjustment +

    We'll help you rearrange sections, adjust spacing, and modify the page structure to fit your needs.

  • Advanced customization +

    More complex styling changes, theme option modifications, and third-party integrations.

  • Custom coding +

    If you need something that's not included in the theme, we can code it for you.

  • Graphic work / visualizations +

    Web design services to create custom sections, pages, and blocks for your theme, plus graphics and visualizations.

  • Full WordPress development and design +

    Full website builds, custom theme development, or plugin creation from scratch.

  • About pricing +

    We'll provide a clear quote based on what you need. No hidden fees.

Professional Developers At Your Fingertips!

Custom Work Form