style: Bagel Fat One 디스플레이 폰트 도입
- next/font/google로 Bagel_Fat_One (weight 400) 로드 - --font-kx-hero 변수로 주입, .kx-display가 우선 적용 - 한글은 Bagel Fat One(latin-only) → Space Grotesk/CookieRun 자연 폴백
This commit is contained in:
@@ -108,8 +108,8 @@ body {
|
||||
color: var(--kx-on-variant);
|
||||
}
|
||||
.kx-display {
|
||||
font-family: 'Space Grotesk', 'CookieRun', system-ui, sans-serif;
|
||||
letter-spacing: -0.02em;
|
||||
font-family: var(--font-kx-hero), 'Bagel Fat One', 'Space Grotesk', 'CookieRun', system-ui, sans-serif;
|
||||
letter-spacing: -0.01em;
|
||||
color: var(--kx-on-surface);
|
||||
}
|
||||
.kx-label {
|
||||
|
||||
@@ -1,12 +1,13 @@
|
||||
import type { Metadata } from "next";
|
||||
import Script from "next/script";
|
||||
import { Space_Grotesk, Inter, Manrope } from "next/font/google";
|
||||
import { Space_Grotesk, Inter, Manrope, Bagel_Fat_One } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import DashboardShell from "./components/DashboardShell";
|
||||
|
||||
const spaceGrotesk = Space_Grotesk({ subsets: ["latin"], variable: "--font-kx-display", display: "swap" });
|
||||
const inter = Inter({ subsets: ["latin"], variable: "--font-kx-body", display: "swap" });
|
||||
const manrope = Manrope({ subsets: ["latin"], variable: "--font-kx-label", display: "swap" });
|
||||
const bagel = Bagel_Fat_One({ weight: "400", subsets: ["latin"], variable: "--font-kx-hero", display: "swap" });
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: {
|
||||
@@ -103,7 +104,7 @@ export default function RootLayout({
|
||||
children: React.ReactNode;
|
||||
}) {
|
||||
return (
|
||||
<html lang="ko" data-scroll-behavior="smooth" className={`${spaceGrotesk.variable} ${inter.variable} ${manrope.variable}`}>
|
||||
<html lang="ko" data-scroll-behavior="smooth" className={`${spaceGrotesk.variable} ${inter.variable} ${manrope.variable} ${bagel.variable}`}>
|
||||
<head>
|
||||
<script
|
||||
type="application/ld+json"
|
||||
|
||||
Reference in New Issue
Block a user