Czech language font visualization problem

Hello,

I'm using the open source version of metabase, which is great and usable in every way.

However, I have a problem with the Czech localization and I haven't found a solution to it either on gitlab or on your knowledge-base.

It is not so much a translation problem, but a problem with the visualization of the font "Lato", which unfortunately no longer supports some Czech characters.

image
image
image
image

Here is an example, using the Lato font - Lato - Google Fonts

In the application, it looks like the font "Lato" is used within some e.g. headings and the missing character e.g. "ř" is replaced by a fallback font, which looks different (in some cases it has a different width).

I know that changing the font is only supported by metabase in the paid version, but could it not somehow be possible to set as default font e.g. "Roboto", which by default supports a larger set of special characters across all languages?

Here I attach an example using the Roboto font - Roboto - Google Fonts

Or is there some other solution that I don't see?

Thank you very much for any help.

1 Like

Hi, there is same problem also with Roboto, or is it working for you?

With the roboto font all Czech characters work fine, I tried to replace this font on the web browser level (google chrome) and everything worked fine.

For me not, here is example of code:
https://codesandbox.io/p/live/a290cf63-e14e-48ca-91f9-74e6004a3edb
I am using this package from NPM: @fontsource/roboto - npm

It is possible that @fontsource does not have complete coverage of the character set.
If I use directly the implementation from google font, everything works without problems:

without @fontsource/roboto - npm and with direct import:

@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap");

it is ok

1 Like

So is there any possibility to change the font to roboto within the opensource version? I mean for all users across the board, not just through browser-specific settings.