Phanpy uses Safari-only 'ui-rounded' and 'ui-monospace' instead of 'system-ui' or 'monospace'
Site, Version, Instance
phanpy.social 2024.11.22.8f048af
eldritch.cafe
Browser
Firefox 133.0 (64-bit) / Linux 6.11.10-300.fc41.x86_64
Bug description
The current font declaraton in Phanpy's CSS is
font-family: ui-rounded, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;
Which means that unless your browser supports ui-rounded (which is Safari-only), you get a random font instead what appears to be intended, the system-ui font.
As it stands, because I have Segoe UI installed, that's the font I get, even though my system-ui and sans-serif fonts are Inter Variable.
The same issue occurs with the monospace font
--monospace-font: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
Where Consolas ends up used, instead of the system and browser monospaced font Commit Mono.
To reproduce
- Open Phanpy in Firefox or a Non-Safari browser
- Use developer tools to see which font has been used
Expected behavior
Phanpy should use either the system ui font (system-ui) or the system sans-serif font (sans-serif).
This could be accomplished by replacing the current font declaration with font-family: ui-rounded, system-ui, sans-serif; and font-family: ui-monospace, monospace;
Other
No response