Update components/info.tsx

This commit is contained in:
kleap-admin 2026-01-16 16:41:57 +00:00
parent aca451752f
commit 47f6eece5e
1 changed files with 58 additions and 0 deletions

58
components/info.tsx Normal file
View File

@ -0,0 +1,58 @@
"use client";
import { Container } from "@/components/container";
import { Heading } from "@/components/heading";
import { MapPin, Clock, Phone, Mail } from "lucide-react";
export function Info() {
return (
<section className="py-20 bg-stone-900 text-stone-100">
<Container>
<div className="grid md:grid-cols-3 gap-12">
{/* Location */}
<div className="text-center md:text-left">
<div className="flex justify-center md:justify-start mb-4">
<div className="p-3 bg-amber-600/20 rounded-full text-amber-500">
<MapPin className="w-6 h-6" />
</div>
</div>
<h3 className="text-xl font-serif mb-4 text-amber-50">Location</h3>
<p className="text-stone-400 mb-2">123 Avenue des Champs-Élysées</p>
<p className="text-stone-400">75008 Paris, France</p>
</div>
{/* Hours */}
<div className="text-center md:text-left">
<div className="flex justify-center md:justify-start mb-4">
<div className="p-3 bg-amber-600/20 rounded-full text-amber-500">
<Clock className="w-6 h-6" />
</div>
</div>
<h3 className="text-xl font-serif mb-4 text-amber-50">Opening Hours</h3>
<div className="text-stone-400 space-y-1">
<p><span className="text-stone-300 w-24 inline-block">Mon - Thu:</span> 18:00 - 23:00</p>
<p><span className="text-stone-300 w-24 inline-block">Fri - Sat:</span> 17:00 - 00:00</p>
<p><span className="text-stone-300 w-24 inline-block">Sunday:</span> Closed</p>
</div>
</div>
{/* Contact */}
<div className="text-center md:text-left">
<div className="flex justify-center md:justify-start mb-4">
<div className="p-3 bg-amber-600/20 rounded-full text-amber-500">
<Phone className="w-6 h-6" />
</div>
</div>
<h3 className="text-xl font-serif mb-4 text-amber-50">Contact</h3>
<p className="text-stone-400 mb-2 flex items-center justify-center md:justify-start gap-2">
<Phone className="w-4 h-4" /> +33 1 23 45 67 89
</p>
<p className="text-stone-400 flex items-center justify-center md:justify-start gap-2">
<Mail className="w-4 h-4" /> reservations@lumiere.com
</p>
</div>
</div>
</Container>
</section>
);
}