Force styles causes problems

Hi @bensontel2,

I would recommend resetting all the settings to default, and then using the more specific “Advanced” settings as opposed to the ‘Basic’ ones.

That means not using ‘Base Typography’ control but instead using the ‘Navigation Typography’ and ‘Content Typography’ controls independently. That will remove the need to use the force setting.

Let me know if I can help with anything else.

Thanks

Thank you, Danny. I set the basic to default as you recommended. I can style text at the block level now, big thanks.

There are still some issues I’m hoping to resolve.

1) I could not use Tulpen One as a menu item as the font kept reverting to tiny type in the pull-down menu — no matter what setting I used in navigation.

I was forced to use Open Sans light which performed better. Even Open Sans light shows as bold in the top-level pull-down menu but fine on the bottom menu.

2) What selectors only affect the Menu and Search buttons at the top right? Is there a separate selector for the top level of the pull-down menu (not the menu at the bottom of the page)?

• This reply was modified 3 years, 11 months ago by bensontel2.
• This reply was modified 3 years, 11 months ago by bensontel2.
• This reply was modified 3 years, 11 months ago by bensontel2.
• This reply was modified 3 years, 11 months ago by bensontel2.
• This reply was modified 3 years, 11 months ago by bensontel2.

Hi @bensontel2,

All menus (standard, mobile and footer) should be controlled by the single Advanced Settings → Navigation Control.

The icon buttons ‘Menu’ and ‘Search’ might need an independent control. I will look into that.

Would having that independent setting solve your problem?

• This reply was modified 3 years, 11 months ago by DannyCooper.

Yes, I think it might. Thank you.

I’ve set the font back to Tulpen One because that’s what I want, but –as you can see– the font is way too small on the top-level pull-down menu, but the sub menus seem correct.

It could be that because the theme is reducing the letter-spacing on the top level menu it’s making it look too small even though it’s not.

The theme default is:

.modal-menu > li > a, .modal-menu > li > .ancestor-wrapper > a {
    font-size: 2rem;
    font-weight: 700;
    <strong>letter-spacing: -0.0375em;</strong>
}

Add this to your Custom CSS instead:

.modal-menu > li > a, .modal-menu > li > .ancestor-wrapper > a {
    letter-spacing: 0.1em;
}

• This reply was modified 3 years, 11 months ago by DannyCooper.
• This reply was modified 3 years, 11 months ago by DannyCooper.

I added this to custom css but no luck yet. I noticed the default made the font bold which I don’t want, too.

.modal-menu > li > a, .modal-menu > li > .ancestor-wrapper > a {
letter-spacing: 0.1em;
}

I noticed that everything before { is showing in red in the additional css.

• This reply was modified 3 years, 11 months ago by bensontel2.

It’s because when you pasted the code it changes the symbols to special characters:

https://jmp.sh/HljkmEC

You need to make sure they are the actual symbols ( > )

Okay. I have to go out now, but will be back and figure out how to put the symbols in. Thanks.

I got the code in right now, but it doesn’t alter the default.
https://drive.google.com/file/d/1cE_PY0gX0UlPrVZHomh209q_m1JbZMoo/view?usp=sharing

That’s still the same problem as before, where it says & gt; that is the HTML special character representation of >

You will need to replace each & gt; with >;

• This reply was modified 3 years, 11 months ago by DannyCooper.
• This reply was modified 3 years, 11 months ago by DannyCooper.
• This reply was modified 3 years, 11 months ago by DannyCooper.
• This reply was modified 3 years, 11 months ago by DannyCooper.

Thank you so much!