33 lines
860 B
JavaScript
33 lines
860 B
JavaScript
// pages/demo.jsx
|
||
import React from "react";
|
||
import FontCard from "@/components/ui/FontCard"; // Default‑Import
|
||
import { fonts } from "@/lib/fonts";
|
||
|
||
export default function Demo() {
|
||
// Absicherung gegen undefined beim SSR
|
||
const robotoClass = fonts.roboto?.className || "";
|
||
|
||
return (
|
||
<section className="space-y-8 p-8">
|
||
{/* 1. next/font (voll integriert) */}
|
||
<h2 className={`${robotoClass} text-4xl`}>
|
||
Roboto aus next/font
|
||
</h2>
|
||
|
||
{/* 2. Tailwind‑Utility aus Map */}
|
||
<p className="font-montserrat text-xl">
|
||
Dieselbe Font via <code>font-montserrat</code>
|
||
</p>
|
||
|
||
{/* 3. Deine Preview‑Komponente */}
|
||
<FontCard
|
||
fontName="Pacifico"
|
||
transformedText="Hallo Instagram!"
|
||
category="handwriting"
|
||
isPopular
|
||
index={0}
|
||
/>
|
||
</section>
|
||
);
|
||
}
|