feat: set default font

MovieReviewComment · Jan 24, 2024 · c7334b1 · c7334b1
1 parent 6cfe921
commit c7334b1
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 1 deletion.
diff --git a/ui/packages/mr-c.app/src/app/layout.tsx b/ui/packages/mr-c.app/src/app/layout.tsx
@@ -1,5 +1,6 @@
 import { Metadata } from 'next';
 import '@/styles/globals.css';
+import { notoSansKr } from '@/fonts';
 
 export const metadata: Metadata = {
   title: 'Home',
@@ -15,7 +16,7 @@ export default function RootLayout({
 }) {
   return (
     <html lang="en">
-      <body>{children}</body>
+      <body className={`${notoSansKr.className} antialiased`}>{children}</body>
     </html>
   );
 }
diff --git a/ui/packages/mr-c.app/src/fonts/index.ts b/ui/packages/mr-c.app/src/fonts/index.ts
@@ -0,0 +1,16 @@
+import { Noto_Sans_KR as NotoSansKr } from 'next/font/google';
+
+// next/font fetches the font files on build time
+// i.e. '.next/static/media/**.woff2'
+// but supports preloading only for the subsets.
+// Not preloaded font files are loaded on browser later
+// than html.
+export const notoSansKr = NotoSansKr({
+  // 'korean' subset is not supported
+  subsets: ['latin'],
+  // While loading, we don't show the text with
+  // fallback font til 3s at most (FOIT)
+  // instead of showing ugly font changing (FOUT).
+  display: 'block',
+  adjustFontFallback: true,
+});