NO BUG: Custom font issue

Browser: Brave Version 1.73.104 (desktop) & Chrome 131.0.6778.200 on my mobile
OS: Windows
URL: staging site

I have added the custom font crimson-text to my Bricks, which I then set (via ACSS) to apply on all headers.

On desktop all headings indeed look like crimson-text. When I inspect in Chrome and set the resolution to something like responsive: 400px to check the mobile view, then I am seeing again what looks like crimson-text:

However, when I then check my actual phone, I see something different:

The page title looks like the serif crimson-text, but that heading (‘Waarom eindredactie’) has been replaced probably by some browser font. In Bricks itself I see no problem with the make-up for this title:

There is another class there than the one currently selected, but it doesn’t have any font family applied to it.

I really don’t know what’s going on here. I also don’t know if this is a bug or not -apologies if I posted this in the wrong place.

Hi @GeertB,

just to make sure, can you try to set the name "Crimson Text" inside your variable? Just to test if this will work correctly, maybe it’s just a different name?

Let me know, please.
Matej

Apologies, but which variable would that be? I’m not using any as far as I know

Hey,

it’s --heading-font-family variable, from ACSS.

Matej

Ah, ok, that’s what you meant -sorry for not getting that immediately.

Well, I did that, and guess what? You were spot on! Titles on mobile are Crimson too now! Thank you so much for helping me out. This wasn’t a Bricks issue, but a human stupidity issue, and you still took the time to help me out. I really appreciate that, so thanks, again!

I marked your suggestion as solution. Do I need to do anything else to change the status of this ticket?

Hi @GeertB,

no, no need to do anything else - I’ll change the title prefix to “no bug” (as it’s not a Bricks bug), and that’s it :slight_smile:

I’m happy that the issue is solved now :partying_face:

Best regards,
Matej

1 Like