GNOME Bugzilla – Bug 783489
Error, about, plugins, applications, and overview pages should use the selected system font
Last modified: 2017-06-30 15:11:15 UTC
Steps to reproduce: 1. Open GNOME's “Tweak Tool”. 2. At the “Fonts” section, change the “Interface” font to any font other than Cantarell. 3. Open a new tab in Epiphany Expected outcome: The font selected in “Tweak Tool” is used for the thumbnail labels in the new tab overview page. Actual outcome: Cantarell is always used. Additional information: Cantarell is also hardcoded as the font to be used for the about page that can be reached using the “about:” URL, the plugins information page (“about:plugins”), the saved web applications page (“about:applications”), and the error pages (for example the error shown when loading http://epiphanywebbrowserrules.net/ which is a domain that does not exist).
Created attachment 353274 [details] [review] [PATCH] Use "font: menu" to obtain the system interface font in CSS
Review of attachment 353274 [details] [review]: OK it's clever, but too much of a hack IMO. This property should be used for... menus. WebKit has a special CSS property just for this, "-apple-system", see https://webkit.org/blog/3709/using-the-system-font-in-web-content/. Does WebKitGTK+ support either "-apple-system" or "system"? If not, let's add support for the prefixed version. This is a good use case to justify it, IMO.
Looks like our CSS parser already supports it (as both -apple-system and -webkit--system) but it needs implementation in FontCacheFreeType.cpp similar to the implementation in FontCacheMac.cpp. We'll have to add some GTK-specific code there to get the font from GTK+, and for other ports (including WPE) we should get it from Fontconfig instead.
(In reply to Michael Catanzaro from comment #3) > Looks like our CSS parser already supports it (as both -apple-system and > -webkit--system) but it needs implementation in FontCacheFreeType.cpp > similar to the implementation in FontCacheMac.cpp. We'll have to add some > GTK-specific code there to get the font from GTK+, and for other ports > (including WPE) we should get it from Fontconfig instead. The nice thing about using “font: menu” is that it is part of the CSS spec (has been for years) and it works already today. On the other hand, “-apple-system” is engine-specific and from what I got from Myles Maxfield and from the W3C mailing list thread where “font: system” was proposed, it seems that it's not likely that it will be specced. JFTR, the W3C thread is this one: https://lists.w3.org/Archives/Public/www-style/2015Jul/0169.html My conclusion after reading it is that the existing “font: menu” (and friends), even when not in widespread use, are better because they choose not only the family but also the rest of font attributes (variant, weight, and so on). This means that they chosen font is expected to also be affected by a11y and i18n settings (e.g. if the system has a different font for a Japanese locale, it would be picked inside a “<p lang="ja-jp">...</p>”) — and this is a good thing. -
Fun trivia: using “font: menu; font-size: XYZ;” works all the way back to Netscape 4.x (that would be a browser from 18 years ago!)
(In reply to Adrian Perez from comment #5) > Fun trivia: using “font: menu; font-size: XYZ;” works all the way > back to Netscape 4.x (that would be a browser from 18 years ago!) ...which means it's not a “clever hack” but simply “using what was there already in the spec” ;-)
OK, you've convinced me on IRC that we should do this instead of exposing -webkit-system. But it is still pretty confusing, so I'm going to request adding a short comment above each use to explain.
Created attachment 354735 [details] [review] [PATCH v2] Use "font: menu" to obtain the system interface font in CSS
(In reply to Michael Catanzaro from comment #7) > OK, you've convinced me on IRC that we should do this instead of exposing > -webkit-system. But it is still pretty confusing, so I'm going to request > adding a short comment above each use to explain. Done!