Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit 6be09ee

Browse files
authored
Remove STIXGeneral from the font stack (#10980)
* Remove STIXGeneral from the font stack STIXGeneral was originally added to our font stack to work around a bug in Chrome (https://bugs.chromium.org/p/chromium/issues/detail?id=591346) which caused some obscure combining marks to render as tofu. However, because STIXGeneral unexpectedly has glyphs for a handful of common Japanese characters, it's ended up making Japanese text in Element look patchy. I previously attempted to fix this by prioritizing sans-serif over STIXGeneral, but as is evident from our screenshot tests and user reports, this is still not enough on some systems to get Chrome to pick a consistent font for Japanese. On the basis that i18n is more important than supporting a few mathematical diacritics, I propose we remove the font. STIXGeneral is deprecated anyways, so if we want to get these diacritics back there's always the option of looking at its successor, STIXTwo. * Remove STIXGeneral installation from Cypress workflow
1 parent 143ffcc commit 6be09ee

File tree

3 files changed

+6
-24
lines changed

3 files changed

+6
-24
lines changed

.github/workflows/cypress.yaml

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -120,12 +120,6 @@ jobs:
120120
- uses: browser-actions/setup-chrome@c485fa3bab6be59dce18dbc18ef6ab7cbc8ff5f1
121121
- run: echo "BROWSER_PATH=$(which chrome)" >> $GITHUB_ENV
122122

123-
- uses: tecolicom/actions-use-apt-tools@ceaf289fdbc6169fd2406a0f0365a584ffba003b # v1
124-
with:
125-
# Our test suite includes some screenshot tests with unusual diacritics, which are
126-
# supposed to be covered by STIXGeneral.
127-
tools: fonts-stix
128-
129123
# There's a 'download artifact' action, but it hasn't been updated for the workflow_run action
130124
# (https://github.com/actions/download-artifact/issues/60) so instead we get this mess:
131125
- name: 📥 Download artifact

res/themes/legacy-light/css/_legacy-light.pcss

Lines changed: 3 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,17 @@
11
/* Nunito lacks combining diacritics, so these will fall through
22
to the next font. Helevetica's diacritics sometimes do not combine
33
nicely (on OSX, at least) and result in a huge horizontal mess.
4-
Arial empirically gets it right, hence prioritising Arial here.
5-
We also include STIXGeneral explicitly to support a wider range
6-
of combining diacritics (Chrome fails without it, as per
7-
https://bugs.chromium.org/p/chromium/issues/detail?id=1328898).
8-
We should never actively *prefer* STIXGeneral over the default font though,
9-
since it looks pretty rough and implements some non-LGC scripts only
10-
partially, making, for example, Japanese text look patchy and sad. */
4+
Arial empirically gets it right, hence prioritising Arial here. */
115
/* We fall through to Twemoji for emoji rather than falling through
126
to native Emoji fonts (if any) to ensure cross-browser consistency */
137
/* Noto Color Emoji contains digits, in fixed-width, therefore causing
148
digits in flowed text to stand out.
159
TODO: Consider putting all emoji fonts to the end rather than the front. */
1610
$font-family: "Nunito", "Twemoji", "Apple Color Emoji", "Segoe UI Emoji", "Arial", "Helvetica", sans-serif,
17-
"STIXGeneral", "Noto Color Emoji";
11+
"Noto Color Emoji";
1812

1913
$monospace-font-family: "Inconsolata", "Twemoji", "Apple Color Emoji", "Segoe UI Emoji", "Courier", monospace,
20-
"STIXGeneral", "Noto Color Emoji";
14+
"Noto Color Emoji";
2115

2216
/* unified palette */
2317
/* try to use these colors when possible */

res/themes/light/css/_light.pcss

Lines changed: 3 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,17 @@
11
/* Nunito and Inter lacks combining diacritics, so these will fall through
22
to the next font. Helevetica's diacritics sometimes do not combine
33
nicely (on OSX, at least) and result in a huge horizontal mess.
4-
Arial empirically gets it right, hence prioritising Arial here.
5-
We also include STIXGeneral explicitly to support a wider range
6-
of combining diacritics (Chrome fails without it, as per
7-
https://bugs.chromium.org/p/chromium/issues/detail?id=1328898).
8-
We should never actively *prefer* STIXGeneral over the default font though,
9-
since it looks pretty rough and implements some non-LGC scripts only
10-
partially, making, for example, Japanese text look patchy and sad. */
4+
Arial empirically gets it right, hence prioritising Arial here. */
115
/* We fall through to Twemoji for emoji rather than falling through
126
to native Emoji fonts (if any) to ensure cross-browser consistency */
137
/* Noto Color Emoji contains digits, in fixed-width, therefore causing
148
digits in flowed text to stand out.
159
TODO: Consider putting all emoji fonts to the end rather than the front. */
16-
$font-family: "Inter", "Twemoji", "Apple Color Emoji", "Segoe UI Emoji", "Arial", "Helvetica", sans-serif, "STIXGeneral",
10+
$font-family: "Inter", "Twemoji", "Apple Color Emoji", "Segoe UI Emoji", "Arial", "Helvetica", sans-serif,
1711
"Noto Color Emoji";
1812

1913
$monospace-font-family: "Inconsolata", "Twemoji", "Apple Color Emoji", "Segoe UI Emoji", "Courier", monospace,
20-
"STIXGeneral", "Noto Color Emoji";
14+
"Noto Color Emoji";
2115

2216
/* Colors from Figma Compound https://www.figma.com/file/X4XTH9iS2KGJ2wFKDqkyed/Compound?node-id=559%3A120 */
2317
/* ******************** */

0 commit comments

Comments
 (0)