Don't prefer STIXGeneral over the default font (#9711)

* Don't prefer STIXGeneral over the default font

STIXGeneral contains some glyphs for non-LGC scripts, but often doesn't implement these scripts fully. We should always try the browser's default fonts, which are likely to look nicer and have broader script support, before falling back to STIXGeneral.

* Explain why STIXGeneral shouldn't have precedence

* Add a regression test
This commit is contained in:
Robin 2023-01-05 23:11:41 -05:00 committed by GitHub
parent bfe219bdaa
commit 8628aae410
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 25 additions and 10 deletions

View file

@ -4,17 +4,20 @@
Arial empirically gets it right, hence prioritising Arial here.
We also include STIXGeneral explicitly to support a wider range
of combining diacritics (Chrome fails without it, as per
https://bugs.chromium.org/p/chromium/issues/detail?id=1328898) */
https://bugs.chromium.org/p/chromium/issues/detail?id=1328898).
We should never actively *prefer* STIXGeneral over the default font though,
since it looks pretty rough and implements some non-LGC scripts only
partially, making, for example, Japanese text look patchy and sad. */
/* We fall through to Twemoji for emoji rather than falling through
to native Emoji fonts (if any) to ensure cross-browser consistency */
/* Noto Color Emoji contains digits, in fixed-width, therefore causing
digits in flowed text to stand out.
TODO: Consider putting all emoji fonts to the end rather than the front. */
$font-family: "Inter", "Twemoji", "Apple Color Emoji", "Segoe UI Emoji", "STIXGeneral", "Arial", "Helvetica", sans-serif,
$font-family: "Inter", "Twemoji", "Apple Color Emoji", "Segoe UI Emoji", "Arial", "Helvetica", sans-serif, "STIXGeneral",
"Noto Color Emoji";
$monospace-font-family: "Inconsolata", "Twemoji", "Apple Color Emoji", "Segoe UI Emoji", "STIXGeneral", "Courier",
monospace, "Noto Color Emoji";
$monospace-font-family: "Inconsolata", "Twemoji", "Apple Color Emoji", "Segoe UI Emoji", "Courier", monospace,
"STIXGeneral", "Noto Color Emoji";
/* Colors from Figma Compound https://www.figma.com/file/X4XTH9iS2KGJ2wFKDqkyed/Compound?node-id=559%3A120 */
/* ******************** */