load twemoji dynamically as colr or sbix; fix monospace
This commit is contained in:
parent
8b9017891b
commit
4ae652e5c3
7 changed files with 117 additions and 14 deletions
|
@ -34,6 +34,7 @@ body {
|
|||
|
||||
pre, code {
|
||||
font-family: $monospace-font-family;
|
||||
font-size: 100% ! important;
|
||||
}
|
||||
|
||||
.error, .warning {
|
||||
|
|
BIN
res/fonts/Twemoji_Mozilla/TwemojiMozilla-sbix.woff2
Normal file
BIN
res/fonts/Twemoji_Mozilla/TwemojiMozilla-sbix.woff2
Normal file
Binary file not shown.
|
@ -33,23 +33,40 @@
|
|||
src: url('$(res)/fonts/Nunito/Nunito-Bold.ttf') format('truetype');
|
||||
}
|
||||
|
||||
/*
|
||||
* Fira Mono
|
||||
* Used for monospace copy, i.e. code
|
||||
*/
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Fira Mono';
|
||||
src: url('$(res)/fonts/Fira_Mono/FiraMono-Regular.ttf') format('truetype');
|
||||
font-family: 'Inconsolata';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
src: local('Inconsolata Regular'), local('Inconsolata-Regular'), url('$(res)/fonts/Inconsolata/QldKNThLqRwH-OJ1UHjlKGlX5qhExfHwNJU.woff2') format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Fira Mono';
|
||||
src: url('$(res)/fonts/Fira_Mono/FiraMono-Bold.ttf') format('truetype');
|
||||
font-weight: 700;
|
||||
font-family: 'Inconsolata';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: local('Inconsolata Regular'), local('Inconsolata-Regular'), url('$(res)/fonts/Inconsolata/QldKNThLqRwH-OJ1UHjlKGlZ5qhExfHw.woff2') format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Inconsolata';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: local('Inconsolata Bold'), local('Inconsolata-Bold'), url('$(res)/fonts/Inconsolata/QldXNThLqRwH-OJ1UHjlKGHiw71n5_zaDpwm80E.woff2') format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Inconsolata';
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-display: swap;
|
||||
src: local('Inconsolata Bold'), local('Inconsolata-Bold'), url('$(res)/fonts/Inconsolata/QldXNThLqRwH-OJ1UHjlKGHiw71p5_zaDpwm.woff2') format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* a COLR/CPAL version of Twemoji used for consistent cross-browser emoji
|
||||
|
@ -57,7 +74,11 @@
|
|||
* using the fix from https://github.com/mozilla/twemoji-colr/issues/50 to
|
||||
* work on macOS
|
||||
*/
|
||||
/*
|
||||
// except we now load it dynamically via FontManager to handle browsers
|
||||
// which can't render COLR/CPAL still
|
||||
@font-face {
|
||||
font-family: "Twemoji Mozilla";
|
||||
src: url('$(res)/fonts/Twemoji_Mozilla/TwemojiMozilla.woff2') format('woff2');
|
||||
}
|
||||
*/
|
|
@ -5,11 +5,11 @@
|
|||
Arial empirically gets it right, hence prioritising Arial here. */
|
||||
/* We fall through to Twemoji for emoji rather than falling through
|
||||
to native Emoji fonts (if any) to ensure cross-browser consistency */
|
||||
$font-family: Nunito, 'Twemoji Mozilla', Arial, Helvetica, Sans-Serif;
|
||||
$font-family: Nunito, Twemoji, 'Apple Color Emoji', 'Noto Color Emoji', Arial, Helvetica, Sans-Serif;
|
||||
|
||||
// XXX: In theory this should be Fira, but it's a bit ugly.
|
||||
// TODO: make it consistent cross-browser
|
||||
$monospace-font-family: Consolas, 'Liberation Mono', Courier, 'Twemoji Mozilla', monospace;
|
||||
$monospace-font-family: Inconsolata, Twemoji, 'Apple Color Emoji', 'Noto Color Emoji', Courier, monospace;
|
||||
|
||||
// unified palette
|
||||
// try to use these colors when possible
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue