[sean]

Hello I have just switched my company’s webpage over to your catch responsive theme to make it more mobile friendly. But when I access our site via a mobile device the menu button in the top left corner is very hard to see as it is three gray lines on a darker background. I know the easy solution is to choose a lighter background to contract with it, but is there any way to change the coloring of those three bars that denote the menu? qes.com is the website

[Sakin]

@s.reinold: You can change the color code in the following css and then add it in “Appearance => Theme Options => Custom CSS” box:

.mobile-menu-anchor a.genericon-menu, 
.mobile-menu-anchor a.genericon-menu:hover {
    color: #404040;
}

[sean]

I entered this exact message in the customization css box and it did not change the coloring of the 3-bar drop down menu icon on the mobile site. I also tried changing the color code to see if that would effect the color, but that did not change the color of those 3-bars either.

[Sakin]

@s.reinold: Post in your site URL so that I can check in.

[sean]

http://www.qes.com

[Sakin]

@s.reinold: I see that you have added the following css where you have missed dot in front
mobile-menu-anchor a.genericon-menu,.mobile-menu-anchor a.genericon-menu:hover {color: #FFFFFF;}

It should be as:
.mobile-menu-anchor a.genericon-menu, .mobile-menu-anchor a.genericon-menu:hover { color: #fff; }

[sean]

Great thank you very much that did the trick. One more quick question is there a simple way to put the word “Menu” above or below the 3-bars?

[Sakin]

@s.reinold: Yes, you can add the following css in “Appearance => Theme Options => Custom CSS” box:

@media screen and (max-width: 990px) {
.mobile-menu-anchor { display: block; }
}

[sean]

I copied that text into the CSS box and it did not produce a font with the 3-Bar icon.

http://www.qes.com

[Sakin]

@s.reinold: Sorry replace the previous css I gave you with the following css:

@media screen and (max-width: 990px) {
.mobile-menu-text { display: block; }
}

[sean]

Great thank you very much!

[Sakin]

@s.reinold: Thanks for your appreciation. If you like Catch Responsive theme than you can help us by providing your review and rating here at https://wordpress.org/support/view/theme-reviews/catch-responsive?rate=5#postform .

[fletchsc]

I am having this issue as well, that CSS fixed it, BUT I already had a bit of custom CSS in there to get rid of the search bar and icon, if I keep the CSS to get rid of the icon it gets rid of my hamburger menu on mobile as well =( the url is http://www.bocazoo.com This is the CSS I have
.sidebar-header-right { display: none; }

.mobile-menu-anchor a.genericon-menu, .mobile-menu-anchor a.genericon-menu:hover { color: #fff; }

When I add – .genericon {display: none; } to get rid of the magnifying glass icon it gets rid of my hamburger menu as well – is there a fix for that? Thanks! Love your theme and your support – I’m going to have my client buy the pro version ASAP!

[Sakin]

@fletchsc: Sorry but I don’t get it what you want. Let me details of what you want then I can check you current css and give you the new one.

[bethsobi]

I have a different issue with the menu. On my iPhone, I see two menu icons, one on the left and one on the right. The one on the left is working, the one on the right just brings up a big black box. How do I get rid of that?

[Sakin]

@bethsobi: Can you post in your site URL then I can check in your site issue.

[MrManzarra]

Greetings Sakin, I am having the same issue as @bethsobi is having on the mobile version.

The URL is the following: w3agency.pt

Thank you for your time.

[Sakin]

@mrmanzarra: First, can you update your theme to latest version. Then can you go to “Appearance => Menus => Manage Locations” and let me know what you have added in there.

[Author]

Posts