Arial heading font showing up as Times in 2.7.0.beta5

Bug
1

I just updated to 2.7.0.beta5 8fcad73b36 and the font in my site started showing as Times (I assume this is the default when there’s a problem with the config).

If I change “heading font” to something else (like Roboto), the site goes back to showing Arial (except for the headings). I initially thought the problem was in the “base font” setting, but that seems to be working fine. However, setting the “heading font” to the default setting (Arial) breaks something and the base font starts showing as Times.

I don’t have any weird themes and I’m not setting the --font-family variable in any custom stylesheet. Here the theme components I have installed (all up to date):

  • Custom Header Links
  • DiscoTOC
  • Mobile Category List Adjustments
  • Topic Thumbnails
2 Likes
2

I also have everything in Times, except I use Montserrat as a font.

Inspecting pretty much any text in the page, I see font-family: var(--font-family); straight in the Elements page. I’m not CSS expert at all, but could it be that it’s somehow not compiled?

1 Like
3

We noticed this yesterday on our community forum too after updating. A rebuild of the site seemed to fix it for us.

3 Likes
4

@Nacho_Caballero did you do an update via the UI or CLI? Does a second update fix the issue? Please post the URL of the site as well, if you can.

2 Likes
5

Via the UI. @pmusaraj I just rebuilt via the CLI and I can confirm that the issue went away.

I’ll add to my SOP to always try rebuilding via the CLI if something appears broken after updating via the API. :sweat_smile:

1 Like
6

I recently upgraded to 2.7.0.beta5 ( 36ec09a07b ) and themes that are not Dark and Light no longer seem to be setting the root CSS vars for font-family and heading-font-family.

My font and heading font in the settings are set to “Arial”.

On my custom theme, I can workaround by adding the following CSS:

:root {
    --heading-font-family: Arial, sans-serif;
    --font-family: Arial, sans-serif;
}

to the theme’s CSS. It also seems to be a problem for the Graceful theme, but I cannot override that one.

The Dark and Light theme seem unaffected (they set the root CSS vars).

Should this be considered a bug with Discourse, or are custom themes required to set these variables now?

7

https://github.com/discourse/discourse/commit/4071af1d099a1c6a0c7bf664ceafa8de264b9744 might be related cc @pmusaraj

8

Hi @ryantm, I moved this here because it’s essentially the same issue.

I can’t reproduce this with the Graceful theme here on meta. I also can’t seem to reproduce it on your site. Can you provide repro steps?

Also, the font definitions should be in core’s CSS files, i.e. not in a theme’s CSS. Like in this example:

image
image2596×1254 426 KB

My commit you linked above is likely the culprit, but maybe this is an issue with cached stylesheets. Did you try a force refresh?

2 Likes
9

Thanks for merging it.

Yes, the Graceful theme fixed itself by hard refreshing.

My other imported custom theme (just a custom color palette) wasn’t working even after hard refreshing. I tried to reproduce it on another of my Discourse instances by exporting the theme and importing it, and it worked fine there, so I tried exporting and importing it on the server that was having trouble, and now that is fine too!

1 Like