Font weights not rendering properly for Starter stack

[designerken]

I have a fonts palette set up with BODY and HEADLINE.

Both use “Inter” as the font, but body is using 400/600 for its normal/bold weights. While headline is using 700/800 for its weights.

Inside of Cornerstone, it appears to render the text with it’s proper weight.

However, on the front end it is only using 400, no matter if I use normal or bold states. You can see it in the screenshot below.

If I change the weight in cornerstone for the element to 700 it will appear correctly on the front end. But that defeats the purpose of setting up the palette in the first place. Is this a bug with the Starter stack?

All cache cleared, all current versions.

[ruenel]

Hey @designerken,

Thanks for writing in!

These screenshots, which are in the secure note below, are what I am seeing.

• See the screenshot below

Have you saved your changes? Do we have permission to change the settings?

Thanks.

[designerken]

Hey @ruenel,

That’s odd. I went back in and saw what you were seeing, and changed settings to be the correct weights and it’s all seems correct now.

One thing I was experimenting with was setting the header to 18ch. Sadly it applies that to the outer div and not the actual h1 property so it does no good. Any workaround for that other than having to add custom css to the element?

[ruenel]

Hey @designerken,

You can use inline element CSS instead:

$el h1 {
      max-width: 18ch;
}

At the same time, set the maximum width of the Headline element to “none”.

Best Regards.

[designerken]

@ruenel

That’s kinda my point. You can’t use the builder to set
the max-width you have to add the custom CSS and find the correct target. Thanks for confirming that’s what I figured was the solution.

[ruenel]

You are most welcome, @designerken.