fix: stop emoji fonts claiming spaces and Latin text
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:
@@ -1,9 +1,10 @@
|
|||||||
/* Twemoji font (Twitter emoji) */
|
/* Twemoji font (Twitter emoji) — unicode-range keeps spaces/Latin out of emoji metrics */
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: Twemoji;
|
font-family: Twemoji;
|
||||||
src: url('../public/font/Twemoji.Mozilla.v15.1.0.woff2'),
|
src: url('../public/font/Twemoji.Mozilla.v15.1.0.woff2'),
|
||||||
url('../public/font/Twemoji.Mozilla.v15.1.0.ttf');
|
url('../public/font/Twemoji.Mozilla.v15.1.0.ttf');
|
||||||
font-display: swap;
|
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),
|
/* Apple Color Emoji - uses local Apple Color Emoji if available (macOS/iOS),
|
||||||
@@ -14,6 +15,7 @@
|
|||||||
local('Segoe UI Emoji'),
|
local('Segoe UI Emoji'),
|
||||||
local('Noto Color Emoji');
|
local('Noto Color Emoji');
|
||||||
font-display: swap;
|
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 */
|
/* System emoji - uses native OS emoji */
|
||||||
@@ -26,6 +28,7 @@
|
|||||||
local('Android Emoji'),
|
local('Android Emoji'),
|
||||||
local('EmojiOne Color');
|
local('EmojiOne Color');
|
||||||
font-display: swap;
|
font-display: swap;
|
||||||
|
unicode-range: U+1F300-1F9FF, U+2600-26FF, U+2700-27BF, U+FE0F, U+200D, U+1F1E6-1F1FF;
|
||||||
}
|
}
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
@@ -42,7 +45,10 @@
|
|||||||
--mx-uc-8: hsl(94, 100%, 35%);
|
--mx-uc-8: hsl(94, 100%, 35%);
|
||||||
|
|
||||||
--font-emoji: 'AppleColorEmoji';
|
--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,
|
.dark-theme,
|
||||||
@@ -62,7 +68,7 @@
|
|||||||
--mx-uc-7: hsl(243, 100%, 80%);
|
--mx-uc-7: hsl(243, 100%, 80%);
|
||||||
--mx-uc-8: hsl(94, 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 {
|
html {
|
||||||
|
|||||||
Reference in New Issue
Block a user