search

soflyy / oxygen-bugs-and-features

Bug Reports & Feature Requests for Oxygen
https://oxygenbuilder.com/
314 stars 29 forks source link

Hide menu items on mobile #257

Open FlexonReclame opened 5 years ago

FlexonReclame commented 5 years ago

Describe the feature you'd like to see included in Oxygen. A clear, detailed description of the feature you're requesting.

What are the use cases for this feature? e.g. Accessibility, e-commerce store that sells bicycles, etc.

Examples of this feature or functionality. If another product has done it well, provide examples here.

FlexonReclame commented 5 years ago

Some of my menu items are not clickable ( link #) , but just a indication of sub pages On a mobile menu it is confusing because there is noting hapening if clicked. It would be nice if the none clickable links could be hidden.

wplit commented 5 years ago

Give those individual menu items a class, you can do this from inside WordPress dashboard in the menu settings. Something like 'hide-on-mobile'. Then add a stylesheet inside Oxygen and add this..

.oxy-nav-menu-open .menu-item.hide-on-mobile > a { display: none; }

wplit commented 5 years ago

ps having links that aren't really links is known as bad UX. Think of the people will large ipads that can't hover over the menu items, but can only click.

FlexonReclame commented 5 years ago

Give those individual menu items a class, you can do this from inside WordPress dashboard in the menu settings. Something like 'hide-on-mobile'. Then add a stylesheet inside Oxygen and add this..

.oxy-nav-menu-open .menu-item.hide-on-mobile > a { display: none; }

It looks simple even though I'll have to make a search for a "how to" two weeks ago all I got on my wordpress site was "hello world" ;-) I'll give it a try when my site is finished Thanks

quadcom commented 5 years ago

I was just in the middle of writing this up. This is a bug, not a feature request.

quadcom commented 5 years ago

the only workaround I could actually get to work was to put two menus in place each with a different WP menu. One with dropdown, the other without. Then, using media queries, hid one while showing the other when in mobile scale.