- This topic has 3 replies, 2 voices, and was last updated 9 years, 5 months ago by
.
-
Posts
-
Hi all
Two items I need help with – both out of the box issues with Adapt:
1. Out of the box Adapt behaves a certain way for mobile iphone and android size screens.
The nav menu becomes a vertical stack of rectangular bars with link text. This looks strange as the nav stack takes up almost all of the initial screen on the mobile. Can we alter this so that we can have a single nav item called ‘Navigation’ or ‘Menu’ etc that when clicked opens up the nav items which can then be clicked to open?
2. The CSS changes we have made to alter the nav text colours and background etc aren’t reflected in the mobile nav items. What is the css required to alter this?many thanks
You would have to redesign the css of the nav to be horizontal (if thats what you want). Although, you’ll need to have css skills to do this, as it could take some time and effort to implement. You’ll also need to be familiar with responsive css as well. That’s if you want to manually do it.
There is a plugin called dropdown menus (I think) that creates a single menu that you tap and it opens up. Here is an example – http://demo.appfinite.com/classik/ – view this theme demo from a phone. You could also use a menu plugin like Uber Menu.
Wes is currently working on the new version which will have horizontal menus and a ton of other updates for Genesis 2.0. – http://appfinite.com/topic/optimal-update/#post-5055 ……So if you can wait, then it will automatically be done when the new update is available. But if you want a signle nav item instead of horizontal menus, then try out one of those plugins above.
Thanks kronos
Also re my point 2 – how do I get the mobile menu to be the same as the standard menu I have created by adjusting colours etc with genesis extender (http://www.bacchusmarshcp.com.au/temp/ ), and I suppose the second question is why are they different since it is the same menu? thanks againIts showing up different because of the code in the responsive section. The responsive section of the css adjusts the menu to be vertical….but again, Wes is redesigning this to be horizontal instead. Here is an example – http://demo.appfinite.com/epik/ view in a mobile browser, or resize your browser to see the difference.
The only thing I can recommend is to copy the menu/nav code from the 2nd responsive section –
@media only screen and (min-width: 600px) and (max-width: 960px)and add those same adjustments to the top/first responsive section under this –
@media only screen and (max-width: 600px)It will take some effort, but it can be done….and it will probably be easy if you’re good with css. Other than that, there will be an entirely new version of this theme when Genesis 2.0 comes out (which will be soon).
- You must be logged in to reply to this topic.