Justerad bakverksektion bilder
Bytte namn på kakor till mandelkubben, kolasnitten och chokladsnitten med -en suffix, tillägnade beskrivningar under varje bild, och removeade tidigare kortlayout så bilderna renderas fritt med textbeskrivningar. X-Lovable-Edit-ID: edt-e5038124-1675-4696-afbf-26e44897b024
This commit is contained in:
@@ -6,16 +6,19 @@ import chokladsnittImage from "@/assets/chokladsnitt.jpg";
|
|||||||
|
|
||||||
const cookies = [
|
const cookies = [
|
||||||
{
|
{
|
||||||
name: "Mandelkubb",
|
name: "Mandelkubben",
|
||||||
image: mandelkubbImage,
|
image: mandelkubbImage,
|
||||||
|
description: "Mjuk och smörig med en härlig mandelsmak som smälter på tungan. Toppas med rostade mandelflagor.",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "Kolasnitt",
|
name: "Kolasnitten",
|
||||||
image: kolasnittImage,
|
image: kolasnittImage,
|
||||||
|
description: "Krämig kolakaka med en perfekt balans av sötma och smörighet. En riktig favorit på fikarasten.",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "Chokladsnitt",
|
name: "Chokladsnitten",
|
||||||
image: chokladsnittImage,
|
image: chokladsnittImage,
|
||||||
|
description: "Rik och fyllig chokladsmak med en len glasyr. För dig som älskar äkta, mörk choklad.",
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
@@ -118,19 +121,20 @@ const HeritageSection = () => {
|
|||||||
transitionDelay: cookiesVisible ? `${index * 200}ms` : "0ms",
|
transitionDelay: cookiesVisible ? `${index * 200}ms` : "0ms",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div className="bg-card rounded-sm overflow-hidden card-classic">
|
<div className="text-center">
|
||||||
<div className="aspect-square overflow-hidden">
|
<div className="aspect-square overflow-hidden rounded-sm mb-6">
|
||||||
<img
|
<img
|
||||||
src={cookie.image}
|
src={cookie.image}
|
||||||
alt={cookie.name}
|
alt={cookie.name}
|
||||||
className="w-full h-full object-cover hover:scale-105 transition-transform duration-500"
|
className="w-full h-full object-cover hover:scale-105 transition-transform duration-500"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div className="p-6 text-center">
|
<h3 className="font-display text-2xl font-semibold text-foreground mb-3">
|
||||||
<h3 className="font-display text-2xl font-semibold text-foreground">
|
|
||||||
{cookie.name}
|
{cookie.name}
|
||||||
</h3>
|
</h3>
|
||||||
</div>
|
<p className="text-foreground/70 leading-relaxed">
|
||||||
|
{cookie.description}
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
|
|||||||
Reference in New Issue
Block a user