mobile menu font not as selected in customizer?

[sparkle]

hello generatepress friends 🙂 i hope you are all well.

i have used Cinzel in a my website header for the site title – set in the customizer. i’ve monkied a bit with the css in my child theme, but not the font. when i look at the site on mobile though, it displays in a different font (one i had toyed with but chose not to use). it looks right on desktop and tablet views.

how can i make it match? i’ve even tried to hide it with css to no avail.

[Leo]

Hi there,

Any chance you can disable all plugins except GP Premium to eliminate conflicts from other plugins first?

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[sparkle]

boo. looks like it’s a conflict with elementor free.

[sparkle]

does that mean i’m dead in the water? elementor and generatepress are getting harder to combine and sometimes i wonder if i’m missing something or if they’re trying to hamstring your users. lol

[Elvin]

does that mean i’m dead in the water?

We can definitely do something about this.

Can you try adding this CSS?

nav#mobile-header > div.inside-navigation > button.menu-toggle > span.mobile-menu {
    font-family: "Cinzel", serif;
}

Here’s how to add CSS – https://docs.generatepress.com/article/adding-css/

Let us know if it works for you.

A wise man once said:
"Have you cleared your cache?"

[sparkle]

thanks, but unfortunately it doesn’t work? i agree it seems like it should!

[David]

Hi there,

try adding the CSS at the top of your child styles.css

You should be able to simplify the CSS to this:

#mobile-header button.menu-toggle {
    font-family: "Cinzel", serif;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[sparkle]

yes. that did it. thank you both for your efforts. be well. 🙂

[David]

You’re welcome.
You may want to check your CSS as this would generally mean there is a broken CSS rule / property. Maybe a missing bracket or something.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[sparkle]

actually…. one last thing… how do i get the ‘active’ coloring off the mobile menu so the site title isn’t boxed? i can’t find that greenish (#B4D2BD) in my customizer or css….

[Leo]

Sorry can you link us to the site again?

The private info field is erased as soon as the topic is marked as resolved.

I’ve just marked the topic unresolved again so you should be able to use the field again.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[sparkle]

it only happens on the mobile view…

[sparkle]

whoops link in private

[Leo]

Use this for your CSS instead:

#mobile-header button.menu-toggle {
    font-family: "Cinzel", serif;
    font-size: 11pt;
    line-height: 13pt;
    width: 100%;
    background-color: transparent !important;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[sparkle]

oh hooray. thank you! 🙂 looks perfect now.

[Author]

Posts