Remove drop down toggle in off-canvas slide menu

Hi there,

Any chance you can link us to the page in question?

You can use the private information field:
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

Let me know :)

Hi Leo,

Thank you for the quick reply. I now compromised the menu on my production site for demonstration purposes: https://arvedgintenreiter.com/

I am trying to get rid of the arrow dropdown toggle next to Exhibitions - without breaking the whole menu in the process. Would be glad if you have an idea :)

Thanks,
Arved

I am trying to get rid of the arrow dropdown toggle next to Exhibitions

Does that mean you don't want the submenu to show? Or do you just want to remove the arrow?

Hi Ying,

I'd hope to get rid of just the arrow. The submenu would then still expand when clicking on "exhibitions". Just the arrow indicator is not needed.

Thanks.

Try this:

.slideout-navigation .dropdown-menu-toggle:before {
    opacity: 0;
    margin-left: -0.8em;
    visibility: hidden;
}
.menu-item-has-children .dropdown-menu-toggle {
    padding-left: 0;
}

Hi Ying,

Thank you for the code, works perfectly on the production server.

On staging the code triggers an odd behavior of the menu sliding to the right beyond the screen immediately after opening the submenu (click on "exhibitions").

Since it works on production I am happy so far. In case you have an idea what might trigger the strange behavior on staging, I'd be glad for a hint. Otherwise this topic can be considered closed.

Thanks for having solved the main issue!!

Best,
Arved

In case you have an idea what might trigger the strange behavior on staging, I’d be glad for a hint.

I would need to see the staging site with that behaviour to do some investigating :)

Will try to figure it out first. Thank you!

No problem :)

Sorry for reopening this topic. I continue to have this strange behavior with the disappearing menu, and it's driving me crazy. So far, I just figured out that is is linked to the Firefox browser and not the staging server. In chrome the code suggested above seems to work well.

The issue with Firefox browser:
1. With click on the hamburger icon the menu expands properly (main menu-items show, sub-menu hidden)
2. Expanding the sub-menu with click on menu-item "Exhibitions" opens the submenu, but immediately the whole menu slides to the right off-screen and is barely visible anymore. I think the main menu-items even completely disappear.

Website: https://arvedgintenreiter.com/

Does anyone have an idea how I could fix this?

Thank you!

Hi Arved,

I did some testing on firefox, and would recommend changing the Exhibitions link to #.

And can you try this CSS to smoothen the slide animation? If you don't like the look of it, you can just ignore it :)

.offside--right.is-open{
    transform: translatex(-90vw);
}
.main-navigation.offside.offside--right {
    right: -90vw;
}

Hi Ying,

Your code works like a charm. Will have an eye on it for a day or two and mark it solved if no issue returns. Thank you so much for a great solution and even an animation improvement on top!

Best,
Arved

You are welcome   :)