fix loading of inter font

2023-07-29 11:06:46 +08:00 · 2023-07-29 11:06:46 +08:00 · f8a5233460
commit f8a5233460
parent ceb913f767
2 changed files with 4 additions and 2 deletions
--- a/app/layout.tsx
+++ b/app/layout.tsx
@ -15,6 +15,8 @@ import { Metadata } from 'next'

 const inter = Inter({
  subsets: ['latin'],
+  display: 'swap',
+  variable: '--font-inter',
 })

 export const metadata: Metadata = {
@ -61,7 +63,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
  return (
    <html
      lang={siteMetadata.language}
-      className={`${inter.className} scroll-smooth`}
+      className={`${inter.variable} scroll-smooth`}
      suppressHydrationWarning
    >
      <link rel="apple-touch-icon" sizes="76x76" href="/static/favicons/apple-touch-icon.png" />
--- a/tailwind.config.js
+++ b/tailwind.config.js
@ -22,7 +22,7 @@ module.exports = {
        14: '3.5rem',
      },
      fontFamily: {
-        sans: ['Inter', ...fontFamily.sans],
+        sans: ['var(--font-inter)', ...fontFamily.sans],
      },
      colors: {
        primary: colors.pink,