Font unification: - Add @fontsource packages for Geist Sans, Geist Mono, Playfair Display - Create fonts.ts for centralized font imports - Import fonts in both web (layout.tsx) and desktop (main.tsx) - Register --font-brand in Tailwind @theme inline block - Fix font-brand class usage (replace arbitrary value syntax) Design system documentation: - Add comprehensive design philosophy comments to globals.css - Document typography choices (why Geist, why Playfair for brand) - Document color system approach (neutral grays, semantic colors only) - Explain component library customizations Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
19 lines
552 B
TypeScript
19 lines
552 B
TypeScript
"use client";
|
|
|
|
import { ThemeToggle } from "./theme-toggle";
|
|
|
|
export function Header() {
|
|
return (
|
|
<header className="container flex justify-between items-center p-2">
|
|
<div className="flex items-center gap-2.5">
|
|
<img src="/logo.svg" alt="Multica" className="size-6 rounded-md" />
|
|
<span className="text-sm tracking-wide font-brand">
|
|
Multica
|
|
</span>
|
|
</div>
|
|
<div className="flex items-center gap-1">
|
|
<ThemeToggle />
|
|
</div>
|
|
</header>
|
|
);
|
|
}
|