Compress leverans section header

Removed the section header and adjusted layout to make the Leverans area more compact. Kept three info cards with reduced padding and simplified header, aligning with updated design.

X-Lovable-Edit-ID: edt-b3a19668-d54a-4daa-bb0d-fd61c996c43b
This commit is contained in:
gpt-engineer-app[bot]
2026-01-28 13:51:25 +00:00
+14 -25
View File
@@ -2,27 +2,16 @@ import { Truck, Clock, MapPin } from "lucide-react";
const DeliverySection = () => { const DeliverySection = () => {
return ( return (
<section className="py-12 md:py-20 px-4 md:px-6 bg-card"> <section className="py-8 md:py-12 px-4 md:px-6 bg-card">
<div className="max-w-4xl mx-auto"> <div className="max-w-4xl mx-auto">
{/* Section header */}
<div className="text-center mb-10 md:mb-14">
<div className="w-16 md:w-24 h-px bg-primary/40 mx-auto mb-4 md:mb-6"></div>
<h2 className="font-display text-2xl md:text-4xl font-semibold mb-3">
Leverans
</h2>
<p className="text-muted-foreground text-sm md:text-lg">
Färska kakor direkt till ert kontor varje vecka
</p>
</div>
{/* Info cards */} {/* Info cards */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-6 md:gap-8"> <div className="grid grid-cols-1 md:grid-cols-3 gap-4 md:gap-6">
{/* Leveransområde */} {/* Leveransområde */}
<div className="text-center p-6"> <div className="text-center p-4">
<div className="w-12 h-12 mx-auto mb-4 rounded-full bg-primary/10 flex items-center justify-center"> <div className="w-10 h-10 mx-auto mb-3 rounded-full bg-primary/10 flex items-center justify-center">
<MapPin className="w-6 h-6 text-primary" /> <MapPin className="w-5 h-5 text-primary" />
</div> </div>
<h3 className="font-display text-lg md:text-xl font-semibold mb-2"> <h3 className="font-display text-base md:text-lg font-semibold mb-1">
Storstockholm Storstockholm
</h3> </h3>
<p className="text-muted-foreground text-sm"> <p className="text-muted-foreground text-sm">
@@ -31,11 +20,11 @@ const DeliverySection = () => {
</div> </div>
{/* Leveransdag */} {/* Leveransdag */}
<div className="text-center p-6"> <div className="text-center p-4">
<div className="w-12 h-12 mx-auto mb-4 rounded-full bg-primary/10 flex items-center justify-center"> <div className="w-10 h-10 mx-auto mb-3 rounded-full bg-primary/10 flex items-center justify-center">
<Clock className="w-6 h-6 text-primary" /> <Clock className="w-5 h-5 text-primary" />
</div> </div>
<h3 className="font-display text-lg md:text-xl font-semibold mb-2"> <h3 className="font-display text-base md:text-lg font-semibold mb-1">
Veckoleverans Veckoleverans
</h3> </h3>
<p className="text-muted-foreground text-sm"> <p className="text-muted-foreground text-sm">
@@ -44,11 +33,11 @@ const DeliverySection = () => {
</div> </div>
{/* Leveranstid */} {/* Leveranstid */}
<div className="text-center p-6"> <div className="text-center p-4">
<div className="w-12 h-12 mx-auto mb-4 rounded-full bg-primary/10 flex items-center justify-center"> <div className="w-10 h-10 mx-auto mb-3 rounded-full bg-primary/10 flex items-center justify-center">
<Truck className="w-6 h-6 text-primary" /> <Truck className="w-5 h-5 text-primary" />
</div> </div>
<h3 className="font-display text-lg md:text-xl font-semibold mb-2"> <h3 className="font-display text-base md:text-lg font-semibold mb-1">
Dagtid Dagtid
</h3> </h3>
<p className="text-muted-foreground text-sm"> <p className="text-muted-foreground text-sm">