It's driving me a bit crazy as I'm not sure where I've gone wrong.
I'm currently working with NextJS and have loaded this font into my <Link />.
While it displays perfectly on Chrome and Safari in the iOS simulator, it fails to load when I access the site on my personal device.
The font in question can be found here:
_document.tsx
import Document, { Html, Head, Main, NextScript } from 'next/document';
class MyDocument extends Document {
render() {
return (
<Html>
<Head>
<link href='http://fonts.cdnfonts.com/css/gagalin' rel='stylesheet' />
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;
global.css
html,
body {
font-family: 'Gagalin', -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
margin: 0;
padding: 0;
background-color: black;
}