Custom Font related question.
It’s the first time that I try to use a custom font inside the App but I have a lot of problems…
Example: I want to use this google font https://fonts.google.com/specimen/Special+Elite
I’ve downloaded this font and put it into /assets/fonts
In variables.scss I added the code:
@font-face {
font-family: 'SpecialElite-Regular';
src: url('../assets/fonts/SpecialElite-Regular.ttf') format('ttf');
font-weight: 800;
font-style: regular;
}
and I tried to apply this font to all the code:
app.scss
*{
font-family: "SpecialElite" !important;
}
But the font isn’t shown (not in browser, not in app).
How can I use a custom font?
I did not find any working guide.
Thank you in advance.
SOLVED:
I’ve included different types of font’s…
variables.scss
@font-face {
font-family: 'SpecialElite-Regular';
src: url( $font-path + '/SpecialElite-Regular/SpecialElite-Regular.ttf') format('ttf'),
url( $font-path + '/SpecialElite-Regular/SpecialElite-Regular.eot') format('eot'),
url( $font-path + '/SpecialElite-Regular/SpecialElite-Regular.svg') format('svg'),
url( $font-path + '/SpecialElite-Regular/SpecialElite-Regular.woff') format('woff'),
url( $font-path + '/SpecialElite-Regular/SpecialElite-Regular.woff2') format('woff2');
}
where I want to use my font
font-family: 'SpecialElite-Regular' !important;