Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

GeneratePress GenerateBlocks

Mobile Menu – Transition Issue

  • Digiarth
    February 28, 2024 at 11:40 pm

    Hello,

    If you visit my website (link shared as private information) on mobile, you will see the menu not closing correctly.

    When you open it, the transition is smooth and without any issues.

    But when you try to close it, there is a slight pause before it closes completely.

    Kindly let me know how to fix it, as I can’t find the code where I need to make the changes.

    Thank you.

  • David
    February 29, 2024 at 4:18 am

    Hi there,

    in your Child Theme CSS you have this rule:

    
.slideout-navigation.main-navigation {
    width: 100% !important;
    max-width: 90%;
    color: #fff;
    bottom: 0;
    position: fixed !important;
    box-shadow: 0 0 2rem 0 rgba(0,0,0,.1);
    display: flex;
    flex-direction: column;
	transition: transform .3s cubic-bezier(.77, .2, .05, 1), opacity .25s cubic-bezier(.77, .2, .05, 1), -webkit-transform .3s cubic-bezier(.77, .2, .05, 1) !important;
}

    Remove the:

    
width: 100% !important;
max-width: 90%;

    And then add this CSS:

    
body {
    --gp-slideout-width: 90%;
}

    This sets the width of the navigation slideout , and handles all the sliding in and out for you.

  • Digiarth
    February 29, 2024 at 5:00 am

    Thanks. It worked.

  • David
    February 29, 2024 at 10:45 am

    Glad to hear that

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.