litruv/cinny
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: stop emoji fonts claiming spaces and Latin text

Browse Source 
Use Fontsource's real family name ('Inter Variable') so text no longer
falls through to Noto Color Emoji / Twemoji. Scope emoji @font-face to
emoji unicode-range so space metrics stay normal on Linux and elsewhere.
This commit is contained in:
Litruv
2026-07-15 03:19:54 +10:00
parent c7067021ba
commit 154f4dfdb0
1 changed files with 9 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/index.css
View File

@@ -1,9 +1,10 @@
/* Twemoji font (Twitter emoji) */
/* Twemoji font (Twitter emoji) — unicode-range keeps spaces/Latin out of emoji metrics */
@font-face {
font-family: Twemoji;
src: url('../public/font/Twemoji.Mozilla.v15.1.0.woff2'),
url('../public/font/Twemoji.Mozilla.v15.1.0.ttf');
font-display: swap;
unicode-range: U+1F300-1F9FF, U+2600-26FF, U+2700-27BF, U+FE0F, U+200D, U+1F1E6-1F1FF;
}
/* Apple Color Emoji - uses local Apple Color Emoji if available (macOS/iOS),
@@ -14,6 +15,7 @@
local('Segoe UI Emoji'),
local('Noto Color Emoji');
font-display: swap;
unicode-range: U+1F300-1F9FF, U+2600-26FF, U+2700-27BF, U+FE0F, U+200D, U+1F1E6-1F1FF;
}
/* System emoji - uses native OS emoji */
@@ -26,6 +28,7 @@
local('Android Emoji'),
local('EmojiOne Color');
font-display: swap;
unicode-range: U+1F300-1F9FF, U+2600-26FF, U+2700-27BF, U+FE0F, U+200D, U+1F1E6-1F1FF;
}
:root {
@@ -42,7 +45,10 @@
--mx-uc-8: hsl(94, 100%, 35%);
--font-emoji: 'AppleColorEmoji';
--font-secondary: 'InterVariable', var(--font-emoji), sans-serif;
/* Must match @fontsource-variable/inter's family name ('Inter Variable').
A wrong name falls through to emoji fonts — huge spaces on Linux (Noto Color Emoji)
and Twemoji COLR keycaps for digits. Emoji stays last for glyphs only (unicode-range). */
--font-secondary: 'Inter Variable', var(--font-emoji), sans-serif;
}
.dark-theme,
@@ -62,7 +68,7 @@
--mx-uc-7: hsl(243, 100%, 80%);
--mx-uc-8: hsl(94, 100%, 80%);
--font-secondary: 'InterVariable', var(--font-emoji), sans-serif;
--font-secondary: 'Inter Variable', var(--font-emoji), sans-serif;
}
html {