diff --git a/src/app/globals.css b/src/app/globals.css index 3faea673..7c5d6703 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -25,8 +25,12 @@ --color-accent-dim: var(--accent-dim); --color-border: var(--border); --color-error: var(--error); + /* Two-font system: serif for content, sans-serif for UI */ + /* REVERT POINT: To revert typography, restore all --font-* and --default-font-family + to use --font-lora instead of --font-inter for UI lines below */ --font-heading: var(--font-lora), "Lora", Georgia, "Times New Roman", serif; --font-body: var(--font-lora), "Lora", Georgia, "Times New Roman", serif; + --font-ui: var(--font-inter), "Inter", system-ui, -apple-system, sans-serif; --default-font-family: var(--font-lora), "Lora", Georgia, "Times New Roman", serif; --default-font-feature-settings: normal; --default-font-variation-settings: normal; @@ -42,6 +46,12 @@ h1, h2, h3, h4, h5, h6 { font-family: var(--font-lora), "Lora", Georgia, "Times New Roman", serif; } +/* UI elements: sans-serif (Inter) for navigation, controls, labels */ +nav, footer, button, input, select, textarea, label, +.font-ui { + font-family: var(--font-ui); +} + /* Monospace elements: addresses, code blocks, contract data */ code, pre, .font-mono { font-family: var(--font-geist-mono), "Geist Mono", ui-monospace, monospace; diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 45fccd40..6fc1eaf1 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,5 +1,5 @@ import type { Metadata } from "next"; -import { Lora, Geist_Mono } from "next/font/google"; +import { Lora, Inter, Geist_Mono } from "next/font/google"; import { Providers } from "./providers"; import { NavBar } from "../components/NavBar"; import { Footer } from "../components/Footer"; @@ -11,6 +11,11 @@ const lora = Lora({ subsets: ["latin"], }); +const inter = Inter({ + variable: "--font-inter", + subsets: ["latin"], +}); + const geistMono = Geist_Mono({ variable: "--font-geist-mono", subsets: ["latin"], @@ -39,7 +44,7 @@ export default function RootLayout({ }>) { return ( - +