41 lines
2.1 KiB
TypeScript
41 lines
2.1 KiB
TypeScript
"use client";
|
|
import { Container } from "@/components/container";
|
|
import { Heading } from "@/components/heading";
|
|
import { Subheading } from "@/components/subheading";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Phone } from "lucide-react";
|
|
|
|
export function Hero() {
|
|
return (
|
|
<section className="relative py-20 md:py-32 overflow-hidden bg-slate-50">
|
|
<div className="absolute inset-0 bg-grid-slate-200 [mask-image:linear-gradient(0deg,white,rgba(255,255,255,0.6))]" />
|
|
<Container className="relative">
|
|
<div className="max-w-3xl mx-auto text-center">
|
|
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-blue-100 text-blue-700 text-sm font-medium mb-6">
|
|
<span className="relative flex h-2 w-2">
|
|
<span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-blue-400 opacity-75"></span>
|
|
<span className="relative inline-flex rounded-full h-2 w-2 bg-blue-500"></span>
|
|
</span>
|
|
Disponible pour les Urgences
|
|
</div>
|
|
<Heading as="h1" className="text-4xl md:text-6xl font-bold tracking-tight text-slate-900">
|
|
Dépannage Chauffage & Plomberie d'Urgence
|
|
</Heading>
|
|
<Subheading className="mt-6 text-lg text-slate-600 max-w-2xl mx-auto">
|
|
Intervention rapide et assistance professionnelle pour toutes vos urgences de chauffage et plomberie. Nos 6 techniciens qualifiés sont prêts à intervenir quand vous en avez le plus besoin.
|
|
</Subheading>
|
|
<div className="mt-10 flex flex-col sm:flex-row gap-4 justify-center">
|
|
<Button size="lg" className="bg-blue-600 hover:bg-blue-700 text-white px-8" onClick={() => document.getElementById('emergency-form')?.scrollIntoView({ behavior: 'smooth' })}>
|
|
Demander une Intervention
|
|
</Button>
|
|
<Button size="lg" variant="outline" className="gap-2 border-slate-300 text-slate-700">
|
|
<Phone className="w-4 h-4" />
|
|
01 23 45 67 89
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</Container>
|
|
</section>
|
|
);
|
|
}
|