[KnowledgeWorkerParticipant]

I’m designing a site based on the Icon stack.

I’m using Work Sans for the site. The font has nine weights (see https://fonts.google.com/specimen/Work+Sans) – however, I can’t get access to all of them.
See attached screen shot.

The text “Remoulade i Brasilien” is set to H2, with a 600 font weight. Clearly, the weight displayed is 700.
I’ve tried setting “font-weight: 600; !important”, but that doesn’t work.

Same problem goes for Source Serif Pro. It’s as if only 3 weights or so are available. How can I solve this?

[JoaoModerator]

Hi There,

I have tested on Appereance Customizer Typoography and the weights are working fine I could notice a clear difference between every font-weight and I paid speciall attention to 600 and 700.

Please check what you have set at Appereance Customizer Typography.

Also you have to be sure that is an H2 looking as H2 not an H1 looking like H2 or H3 looking like H2 on which case the CSS PATH with be h1 .h2 or h3 .h2

Another way of changing font weights per element, I believe it is not what you are looking for, but just for your knowledge is at the Classes Box of your Cornerstone Elements you can add the helper classes : w100 w200 w300 ..w700

I have tested on my end

.h4 {
font-weight: 600;
}

That is applying to a <p> with a h4 class and there is a clear difference between 600 and 700. – Using Work Typeface

If you cannot solve this, please provide us your URL and we will have a look at your issue.

Thanks,

Joao

[KnowledgeWorkerParticipant]

This reply has been marked as private.

[FriechModerator]

Hi There,

I did take a closer look on this and see what you’re referring to, though the difference between 600 and 700 is hardly noticeable specially if the text is dark color.

I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup please add the line below on your child theme’s style.css file.

@import 'https://fonts.googleapis.com/css?family=Work+Sans:100,200,300,400,500,600,700,800,900';

Hope it helps, Cheers!

[KnowledgeWorkerParticipant]

Thanks, that worked! Had to import Source Serif Pro to get that fully working as well. Hopefully this won’t slow down the site?

[FriechModerator]

Cool, It will affect the site performance a little bit. I’d advice that you only import the weight that you need.

Cheers!

[Author]

Posts