diff --git a/src/components/placeholder-image.tsx b/src/components/placeholder-image.tsx index 6f9a883..c520790 100644 --- a/src/components/placeholder-image.tsx +++ b/src/components/placeholder-image.tsx @@ -1,7 +1,20 @@ +import { HoneycombPattern } from "@/components/honeycomb"; +import { Logomark } from "@/components/logomark"; + +const SURFACES = { + forest: "bg-forest text-cream", + cream: "bg-cream text-forest", + honey: "bg-honey-pale/60 text-forest", +} as const; + /** - * Abstrakter, hochwertiger Bild-Platzhalter (Farbverlauf + feine Linientextur) - * fuer Bereiche, in denen echte Produkt-/Naturfotografie noch fehlt. Bewusst - * ohne Comic-Motive oder Wabenmuster-Kitsch, passend zur Markenpalette. + * Platzhalter, solange fuer ein Produkt oder einen Abschnitt kein Foto + * gepflegt ist. Gestaltet wie das Glas-Etikett: ruhige Flaeche, das + * gezeichnete Waben-Zeichen und darunter der Name in gesperrten + * Serif-Versalien — statt eines generischen Farbverlaufs mit Linientextur. + * + * In kleinen Groessen (Warenkorb, Galerie-Vorschau) bleibt nur das Zeichen; + * der Name erscheint erst ab 9rem Breite (Container Query). */ export function PlaceholderImage({ className = "", @@ -9,39 +22,23 @@ export function PlaceholderImage({ label, }: { className?: string; - tone?: "forest" | "cream" | "honey"; + tone?: keyof typeof SURFACES; label?: string; }) { - const gradients: Record = { - forest: "from-[#1a271f] via-[#24352b] to-[#3a4d3f]", - cream: "from-[#efe8d8] via-[#f4efe5] to-[#e2d9c4]", - honey: "from-[#8a6832] via-[#b88a44] to-[#c9a468]", - }; - return ( -
- - - - - - - - - {label ? ( - - {label} - - ) : null} +
+ +
+ + {label ? ( + + {label} + + ) : null} +
); }