mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 09:55:06 +03:00
Danny White
3a1b1e391d
## What kind of change does this PR introduce? Chore ## What is the current behavior? Design system still uses the old CustomFont family, so documented components no longer match Studio, www, and docs after the Inter / Manrope rollout. ## What is the new behavior? Design system uses the same font stack as the other apps: - Inter for body (`--font-sans`) - Manrope for headings (`--font-heading`) - Source Code Pro for mono Also adopts the Inter-optimised type scale and base weight (`450`) used in Studio. ## Additional context Based on Francesco's unshipped `chore/update-fonts` draft (design-system slice only). Related shipped work: #47306, #47227. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Updated the design system with refreshed typography using Inter and Manrope, with Source Code Pro for code. * Refined theme typography and spacing tokens, including a more complete text scale, updated font weights, and container sizing. * Improved heading styling and ensured `code`/`pre`/`kbd`/`samp` use consistent monospace treatment. * Adjusted default border styling and improved font loading/fallback behavior for more consistent rendering. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
24 lines
683 B
TypeScript
24 lines
683 B
TypeScript
import { Inter, Manrope, Source_Code_Pro } from 'next/font/google'
|
|
|
|
export const manrope = Manrope({
|
|
variable: '--font-manrope',
|
|
display: 'swap',
|
|
fallback: ['system-ui', 'Helvetica Neue', 'Helvetica', 'Arial', 'sans-serif'],
|
|
subsets: ['latin'],
|
|
})
|
|
|
|
export const inter = Inter({
|
|
variable: '--font-inter',
|
|
display: 'swap',
|
|
fallback: ['system-ui', 'Helvetica Neue', 'Helvetica', 'Arial', 'sans-serif'],
|
|
subsets: ['latin'],
|
|
})
|
|
|
|
export const sourceCodePro = Source_Code_Pro({
|
|
subsets: ['latin'],
|
|
fallback: ['Source Code Pro', 'Office Code Pro', 'Menlo', 'monospace'],
|
|
variable: '--font-source-code-pro',
|
|
display: 'swap',
|
|
weight: ['400', '500', '600', '700'],
|
|
})
|