marsultor/public-blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

typography: load IBM Plex Mono for body text via next/font/google

Browse Source
This commit is contained in:
Krishna Ayyalasomayajula
2026-06-02 12:16:52 -05:00
parent 5ff65968a3
commit f70c9b5abb
1 changed files with 10 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
app/layout.tsx
View File

@@ -1,5 +1,5 @@
import type { Metadata } from 'next' import type { Metadata } from 'next'
import { Fraunces, JetBrains_Mono } from 'next/font/google' import { Fraunces, IBM_Plex_Mono, JetBrains_Mono } from 'next/font/google'
import { ThemeProvider } from '@wrksz/themes/next' import { ThemeProvider } from '@wrksz/themes/next'
import './globals.css' import './globals.css'
import 'katex/dist/katex.min.css' import 'katex/dist/katex.min.css'
@@ -23,6 +23,14 @@ const jetbrainsMono = JetBrains_Mono({
variable: '--font-jetbrains-mono', variable: '--font-jetbrains-mono',
}) })
const plexMono = IBM_Plex_Mono({
weight: ['300', '400'],
subsets: ['latin'],
display: 'swap',
adjustFontFallback: false,
variable: '--font-plex-mono',
})
export const metadata: Metadata = { export const metadata: Metadata = {
title: { template: '%s | blog', default: 'blog' }, title: { template: '%s | blog', default: 'blog' },
description: 'A sleek static blog with code and math.', description: 'A sleek static blog with code and math.',
@@ -30,7 +38,7 @@ export const metadata: Metadata = {
export default function RootLayout({ children }: { children: React.ReactNode }) { export default function RootLayout({ children }: { children: React.ReactNode }) {
return ( return (
<html lang="en" className={`${fraunces.variable} ${jetbrainsMono.variable}`} suppressHydrationWarning> <html lang="en" className={`${fraunces.variable} ${jetbrainsMono.variable} ${plexMono.variable}`} suppressHydrationWarning>
<body className={`antialiased bg-canvas text-ink ${fraunces.className}`}> <body className={`antialiased bg-canvas text-ink ${fraunces.className}`}>
<ThemeProvider <ThemeProvider
attribute="class" attribute="class"