Sub-menu border??

Hi Melissa…everything in the menu.css file that starts with

.menu-toggle

That complete group of styling does the toggle button on the mobile view. It uses a gradient colour (hence all that code), but you can change it to just be a background colour only.

Basically you can do this in your child theme to start with the button itself:

.menu-toggle {
   color: #fff;
   background-color: #e6e6e6;
}
.menu-toggle:hover {
   color: #fff;
   background-color: #618b9b;
}
.menu-toggle:active,
.menu-toggle.toggled-on {
   color: #fff;
   background-color: #618b9b;
}

Then for the other colours, text part, etc. In the menu.css near the bottom, these colours are done from this point on:

@media (min-width: 320px) and (max-width: 599px) {

….just look for the parts that have the colours.

Being as you are using a child theme, you would open your style.css (of the child theme) and look for this:

/* Add your menu.css changes here
————————————————————– */
Put styles here

Any thing you want to modify from the menu.css of the parent theme, you copy the code over and put it below that (where I typed “put styles here”). So for example, if I take the code I pasted in the previous reply, your style.css would look like this:

/* Add your menu.css changes here
--------------------------------------------------------- */
.menu-toggle {
   color: #fff;
   background-color: #d6194f;
}
.menu-toggle:hover {
   color: #fff;
   background-color: #d6194f;
}
.menu-toggle:active,
.menu-toggle.toggled-on {
   color: #fff;
   background-color: #d6194f;
}

The important part is to make sure the correct placement. If you put your code where it says “Add your menu.css changes here” then it won’t work because that is part of a comment because anything between /* and */ means it’s just a comment (long story).

I didn’t make the style.css very clear, so I take the blame for that and will fix that for the next update to the theme.

Anyway, the above css I gave an example for is to show where it would go. Any other styles you want to modify for the menu, you would just add below that group of code.

It’s a bit of a learning curve, but once you get used to it, you will be able to do this without any effort 🙂

Quick follow up… I seriously need a vacation. The reason why things are not changing is because I added colour styles but did not add them to the theme customizer. I’m also discovering a few things I can make adjustments too as well.

what I will have to do here is get on a new update for PReference Lite today and fix this for you so you (and others) can change the colours on their menu and mobile menu too. I will probably import what I did on the Pro version of Preference and use it for the Lite version.

So not to fear, not your fault…it’s mine. So I will go get a big coffee and jump back on the computer here and have this done by the end of the day (night).

lol… thanks for the review and stars, despite the menu colour issue. Anyway, time for coffee (this one is going to require a Venti size Mocha) and then to the theme update!