Arch Linux

sairuiu

Member

Registered: 2019-05-18

Posts: 27

[SOLVED] Firefox UI Elements Using Strange Font

After the recent update to Firefox 72, the fonts on my Firefox UI elements have changed to some strange font with massive spaces and emoji-looking numbers: https://0x0.st/zRy0.png

This is how it looks on my other Arch machine, with the same Firefox profile/system configurations: https://0x0.st/zRyU.png

I can't figure out what I need to set to make Firefox use the correct fonts. I've tried a clean Firefox profile, the exact profile from my other computer, the /etc/fonts/conf.d from my other computer. Everything is exactly the same, including all of the fontconfig settings.

$ fc-match sans
SourceHanCodeJP-Regular.otf: "源ノ角ゴシック Code JP" "R"
$ fc-match serif
SourceHanCodeJP-Regular.otf: "源ノ角ゴシック Code JP" "R"
$ fc-match mono
SourceHanCodeJP-Regular.otf: "源ノ角ゴシック Code JP" "R"

I'm not really sure why it shows Source Han Code for all three (instead of Sans) but the output is the same on my other machine. I do have a temporary workaround at the moment, by adding the following to userChrome.css and userContent.css.

* {
  font-family: Source Han Sans JP !important;
}

However this applies the font to everything, which I don't really want either. I'd make it more specific but I can't figure out the names of the relevant UI elements, and this is more of a hack than a solution anyway.

What can I configure to define the font that Firefox uses for its UI? This might be relevant to a similar issue I described a while ago, but that issue mysteriously disappeared after an update so I don't really have a solution.

Firefox 72.0.1 64-bit on 5.4.10-arch1-1, xorg and i3-gaps on both machines.

Last edited by sairuiu (2020-01-11 22:57:12)

seth

Member

From: Won't reply 2 private help req

Registered: 2012-09-03

Posts: 75,838

Re: [SOLVED] Firefox UI Elements Using Strange Font

What is "SourceHanCodeJP-Regular.otf"?

fc-list | grep SourceHan

The repos seem to hold SourceHan and there's SourceHanMono in the AUR and they're also not from adobe-source-code-pro-fonts

The screenshot looks like the text is justified inter-word, though. It's clearly not a monospace font. But if forcing the font family "fixes", it's going to be some mishandling of the default font.
You can also use the webinspector (ctrl+shift+i) to inspect the element at hand, it's css calculation and the resulting font.

---

How to upload text · How to boot w/o GUI · Disable Windows Fast-Start! · Fix your xinitrc

sairuiu

Member

Registered: 2019-05-18

Posts: 27

Re: [SOLVED] Firefox UI Elements Using Strange Font

$ fc-list | grep -i sourcehan
/usr/share/fonts/OTF/SourceHanCodeJP-HeavyIt.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP H,源ノ角ゴシック Code JP H:style=H It,Italic
/usr/share/fonts/OTF/SourceHanCodeJP-Light.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP L,源ノ角ゴシック Code JP L:style=L,Regular
/usr/share/fonts/OTF/SourceHanCodeJP-Normal.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP N,源ノ角ゴシック Code JP N:style=N,Regular
/usr/share/fonts/OTF/SourceHanCodeJP-MediumIt.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP M,源ノ角ゴシック Code JP M:style=M It,Italic
/usr/share/fonts/OTF/SourceHanCodeJP-Bold.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP R,源ノ角ゴシック Code JP R:style=B,Bold
/usr/share/fonts/adobe-source-han-sans/SourceHanSansJP-Normal.otf: 源ノ角ゴシック JP,Source Han Sans JP,Source Han Sans JP Normal,源ノ角ゴシック JP Normal:style=Normal,Regular
/usr/share/fonts/OTF/SourceHanCodeJP-ExtraLightIt.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP EL,源ノ角ゴシック Code JP EL:style=EL It,Italic
/usr/share/fonts/OTF/SourceHanCodeJP-BoldIt.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP R,源ノ角ゴシック Code JP R:style=B It,Bold Italic
/usr/share/fonts/adobe-source-han-sans/SourceHanSansJP-Regular.otf: 源ノ角ゴシック JP,Source Han Sans JP:style=Regular
/usr/share/fonts/adobe-source-han-sans/SourceHanSansJP-ExtraLight.otf: 源ノ角ゴシック JP,Source Han Sans JP,Source Han Sans JP ExtraLight,源ノ角ゴシック JP ExtraLight:style=ExtraLight,Regular
/usr/share/fonts/adobe-source-han-sans/SourceHanSansJP-Medium.otf: 源ノ角ゴシック JP,Source Han Sans JP,Source Han Sans JP Medium,源ノ角ゴシック JP Medium:style=Medium,Regular
/usr/share/fonts/OTF/SourceHanCodeJP-Regular.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP R,源ノ角ゴシック Code JP R:style=R,Regular
/usr/share/fonts/OTF/SourceHanCodeJP-RegularIt.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP R,源ノ角ゴシック Code JP R:style=R It,Italic
/usr/share/fonts/OTF/SourceHanCodeJP-Heavy.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP H,源ノ角ゴシック Code JP H:style=H,Regular
/usr/share/fonts/adobe-source-han-sans/SourceHanSansJP-Bold.otf: 源ノ角ゴシック JP,Source Han Sans JP:style=Bold
/usr/share/fonts/OTF/SourceHanCodeJP-NormalIt.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP N,源ノ角ゴシック Code JP N:style=N It,Italic
/usr/share/fonts/OTF/SourceHanCodeJP-Medium.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP M,源ノ角ゴシック Code JP M:style=M,Regular
/usr/share/fonts/OTF/SourceHanCodeJP-ExtraLight.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP EL,源ノ角ゴシック Code JP EL:style=EL,Regular
/usr/share/fonts/adobe-source-han-sans/SourceHanSansJP-Heavy.otf: 源ノ角ゴシック JP,Source Han Sans JP,Source Han Sans JP Heavy,源ノ角ゴシック JP Heavy:style=Heavy,Regular
/usr/share/fonts/OTF/SourceHanCodeJP-LightIt.otf: 源ノ角ゴシック Code JP,Source Han Code JP,Source Han Code JP L,源ノ角ゴシック Code JP L:style=L It,Italic
/usr/share/fonts/adobe-source-han-sans/SourceHanSansJP-Light.otf: 源ノ角ゴシック JP,Source Han Sans JP,Source Han Sans JP Light,源ノ角ゴシック JP Light:style=Light,Regular

It should be this: https://aur.archlinux.org/packages/otf- … n-code-jp/

I've been using the web inspector to find the element names, but there doesn't seem to be any fonts set on browser pages like about:preferences and about:addons. I tried using their `:root` element but that doesn't work either; I was only able to see a difference using the * wildcard.

But like I said, this is just a stopgap measure until I can figure out what's actually wrong. Do you have any ideas on how I can diagnose my default font?

seth

Member

From: Won't reply 2 private help req

Registered: 2012-09-03

Posts: 75,838

Re: [SOLVED] Firefox UI Elements Using Strange Font

The font doesn't seem to be fixed width (according to its cidfontinfos)

What if you configure otherfonts™ (dejavu?) as defaults for sans/serif/mono with their respective variants?
https://wiki.archlinux.org/index.php/Fo … ault_fonts

Since the whitespaces seem to be pretty much equally wide, this might be a locale issue, causing FF to use some weirdo UTF-8 whitespace rather than ASCII/32…

---

How to upload text · How to boot w/o GUI · Disable Windows Fast-Start! · Fix your xinitrc

sairuiu

Member

Registered: 2019-05-18

Posts: 27

Re: [SOLVED] Firefox UI Elements Using Strange Font

Great call! Turns out it was a locale issue. Running Firefox with LANG=en solved the issue, so now I just need to either figure out how to configure locale per-application or diagnose why the fonts are strange on Firefox specifically under a different locale. Thanks for the help!