refactor(font): utilize Next.js built-in web font optimization (#1681)

https://nextjs.org/docs/basic-features/font-optimization
4 years ago · e88042ba28
parent a18ccee20e
commit e88042ba28
2 changed files with 6 additions and 2 deletions
--- a/src/pages/_document.tsx
+++ b/src/pages/_document.tsx
@ -21,7 +21,11 @@ class MyDocument extends Document {
    return (
      <Html>
        <Head>
-          <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
+          <link rel="preconnect" href="https://fonts.gstatic.com" />
+          <link
+            rel="stylesheet"
+            href="https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap"
+          />
        </Head>
        <body>
          <Main />
--- a/tailwind.config.js
+++ b/tailwind.config.js
@ -11,7 +11,7 @@ module.exports = {
        width: 'width',
      },
      fontFamily: {
-        sans: ['Inter var', ...defaultTheme.fontFamily.sans],
+        sans: ['Inter', ...defaultTheme.fontFamily.sans],
      },
      typography: (theme) => ({
        DEFAULT: {