Deploy
This commit is contained in:
Vula Builder
@@ -0,0 +1,138 @@
|
|||||||
|
import { Camera, Clock, Globe, Mail, MapPin, MessageCircle, Phone, X } from 'lucide-react';
|
||||||
|
;
|
||||||
|
|
||||||
|
const footerLinks = [
|
||||||
|
{ label: 'Home', href: '/' },
|
||||||
|
{ label: 'Book a Room', href: '/booking' },
|
||||||
|
{ label: 'Our Story', href: '/#our-story' },
|
||||||
|
{ label: 'Specials', href: '/#specials' },
|
||||||
|
{ label: 'Gallery', href: '/#gallery' },
|
||||||
|
{ label: 'Cultural Insights', href: '/#cultural-insights' },
|
||||||
|
{ label: 'Contact', href: '/#contact' },
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function Footer() {
|
||||||
|
const currentYear = new Date().getFullYear();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<footer className="bg-accent text-accent-foreground pt-16 pb-8 px-6">
|
||||||
|
<div className="max-w-7xl mx-auto grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-10 border-b border-white/20 pb-12">
|
||||||
|
{/* Contact */}
|
||||||
|
<div>
|
||||||
|
<h3 className="font-heading text-2xl font-bold mb-6 text-primary">vaVenda Lodge</h3>
|
||||||
|
<ul className="space-y-4 text-sm">
|
||||||
|
<li className="flex gap-3 items-start">
|
||||||
|
<MapPin size={18} className="mt-0.5 text-secondary shrink-0" />
|
||||||
|
<span>Plot 12, Tshikota Road<br />Makhado (Louis Trichardt)<br />Limpopo, South Africa</span>
|
||||||
|
</li>
|
||||||
|
<li className="flex gap-3 items-center">
|
||||||
|
<Phone size={18} className="text-secondary shrink-0" />
|
||||||
|
<a href="tel:+27151234567" className="hover:text-primary transition-all duration-200 ease-out">+27 15 123 4567</a>
|
||||||
|
</li>
|
||||||
|
<li className="flex gap-3 items-center">
|
||||||
|
<Mail size={18} className="text-secondary shrink-0" />
|
||||||
|
<a href="mailto:stay@vavendalodge.co.za" className="hover:text-primary transition-all duration-200 ease-out">stay@vavendalodge.co.za</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Quick Links */}
|
||||||
|
<div>
|
||||||
|
<h4 className="font-heading text-xl font-bold mb-6 text-primary">Quick Links</h4>
|
||||||
|
<ul className="space-y-3 text-sm">
|
||||||
|
{footerLinks.map((link) => (
|
||||||
|
<li key={link.label}>
|
||||||
|
<a
|
||||||
|
href={link.href}
|
||||||
|
className="hover:text-primary transition-all duration-200 ease-out inline-block py-1"
|
||||||
|
>
|
||||||
|
{link.label}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Hours */}
|
||||||
|
<div>
|
||||||
|
<h4 className="font-heading text-xl font-bold mb-6 text-primary">Reception Hours</h4>
|
||||||
|
<ul className="space-y-3 text-sm">
|
||||||
|
<li className="flex gap-3 items-start">
|
||||||
|
<Clock size={18} className="mt-0.5 text-secondary shrink-0" />
|
||||||
|
<span>Monday – Friday: 6:30 AM – 9:00 PM<br />Saturday: 7:00 AM – 10:00 PM<br />Sunday: 7:00 AM – 8:00 PM</span>
|
||||||
|
</li>
|
||||||
|
<li className="text-xs opacity-80">
|
||||||
|
Check-in: 2:00 PM | Check-out: 10:00 AM
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Social & Newsletter */}
|
||||||
|
<div>
|
||||||
|
<h4 className="font-heading text-xl font-bold mb-6 text-primary">Follow Our Story</h4>
|
||||||
|
<div className="flex gap-4 mb-6">
|
||||||
|
<a
|
||||||
|
href="https://facebook.com/vavendalodge"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="p-2 rounded-full bg-white/10 hover:bg-primary hover:text-accent transition-all duration-200 ease-out"
|
||||||
|
aria-label="Facebook"
|
||||||
|
>
|
||||||
|
<Globe size={20} />
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="https://instagram.com/vavendalodge"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="p-2 rounded-full bg-white/10 hover:bg-primary hover:text-accent transition-all duration-200 ease-out"
|
||||||
|
aria-label="Instagram"
|
||||||
|
>
|
||||||
|
<Camera size={20} />
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="https://x.com/vavendalodge"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="p-2 rounded-full bg-white/10 hover:bg-primary hover:text-accent transition-all duration-200 ease-out"
|
||||||
|
aria-label="X (formerly Twitter)"
|
||||||
|
>
|
||||||
|
<X size={20} />
|
||||||
|
</a>
|
||||||
|
<a
|
||||||
|
href="https://wa.me/27151234567"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="p-2 rounded-full bg-white/10 hover:bg-primary hover:text-accent transition-all duration-200 ease-out"
|
||||||
|
aria-label="WhatsApp"
|
||||||
|
>
|
||||||
|
<MessageCircle size={20} />
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<p className="text-xs opacity-80 mt-4">
|
||||||
|
Subscribe to receive seasonal offers and insights from the Soutpansberg — one mail a month.
|
||||||
|
</p>
|
||||||
|
<form className="mt-4 flex flex-col sm:flex-row gap-3">
|
||||||
|
<input
|
||||||
|
type="email"
|
||||||
|
placeholder="Your email address"
|
||||||
|
className="px-4 py-2 rounded-md bg-white/15 border border-white/20 text-sm placeholder:text-white/50 focus:outline-none focus:ring-2 focus:ring-primary flex-1"
|
||||||
|
/>
|
||||||
|
<button
|
||||||
|
type="submit"
|
||||||
|
className="btn-primary text-sm py-2 px-5 shrink-0"
|
||||||
|
>
|
||||||
|
Subscribe
|
||||||
|
</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="max-w-7xl mx-auto mt-8 flex flex-col sm:flex-row justify-between items-center text-xs opacity-70">
|
||||||
|
<p>© {currentYear} vaVenda Lodge. All rights reserved.</p>
|
||||||
|
<p className="mt-2 sm:mt-0">
|
||||||
|
Handcrafted stays in the heart of Limpopo.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
);
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user