Jump to content

Mobile menu suggestion, remove top selection or change color

Featured Replies

Posted

ips_mobile_nav.thumb.png.28ec22d83f798b1

 

When you click Browse you get:

ips_mobile_nav2.thumb.png.dfdedba2a86327

Browse appears again and looks like a sub selection not a header. Looks redundant, causes confusion.

  • Can the top selection be removed? or...
  • Can it be a new color?

This is what it looks like as a new color to signify it is the header for the section you are in:

ips_mobile_nav3.thumb.png.7cb623da7a64a9

 

Thanks!

 

  • Author

Or maybe just black like the back button. That would do it. Does not look like a selection, or selected. Looks like top selection header.

ips_mobile_nav4.thumb.png.40e2ca61a28333

Probably a better css way of doing it but hey, at least I put my mind to it and kludged it together......

How to hide the top item:

div#elMobileDrawer div.ipsDrawer_menu div.ipsDrawer_content ul.ipsDrawer_list li.ipsDrawer_itemParent ul.ipsDrawer_list li:nth-child(2){
    display:none;
}

hidey_widey.thumb.png.62e2b801395adbe80a

How to change its colour:

div#elMobileDrawer div.ipsDrawer_menu div.ipsDrawer_content ul.ipsDrawer_list li.ipsDrawer_itemParent ul.ipsDrawer_list li:nth-child(2){
    background-color:pink;
}

sminky_pinky.png.be14cd58b4695fbdfc4d39c

How to indent (just a little bit) the items below the top item, so it looks a little neater if you don't want to hide the top item:

div#elMobileDrawer div.ipsDrawer_menu div.ipsDrawer_content ul.ipsDrawer_list li.ipsDrawer_itemParent ul.ipsDrawer_list li:nth-child(n+3){
    margin-left:10px;
}

indenty_wenty.png.04704308ea355425d266e9

  • Author

All good options (great idea on indent) thanks for taking the time to do that, I'll figure out what works best or a combo! :thumbsup:

custom.css I imagine?

Cheers!

Archived

This topic is now archived and is closed to further replies.

Recently Browsing 0

  • No registered users viewing this page.