145 lines
8.1 KiB
TypeScript
145 lines
8.1 KiB
TypeScript
import Link from 'next/link'
|
|
import { Linkedin, Facebook, Instagram, Mail, Phone, MapPin, Award, Truck, Shield } from 'lucide-react'
|
|
|
|
export function Footer() {
|
|
return (
|
|
<footer className="bg-gray-900 text-white">
|
|
{/* Main Footer Content */}
|
|
<div className="max-w-7xl mx-auto px-3 sm:px-6 lg:px-8 py-8 sm:py-12 lg:py-16">
|
|
<div className="grid grid-cols-1 lg:grid-cols-5 gap-6 sm:gap-8">
|
|
|
|
{/* Company Info - Full width on mobile */}
|
|
<div className="lg:col-span-2 mb-6 lg:mb-0">
|
|
<div className="mb-4 sm:mb-6">
|
|
<h3 className="text-xl sm:text-2xl font-bold text-orange-400 mb-2">Padmaaja</h3>
|
|
<p className="text-gray-400 text-sm sm:text-base leading-relaxed">
|
|
India's leading manufacturer and exporter of premium Basmati rice and multigrain flour.
|
|
Committed to delivering authentic quality and taste that has been trusted for generations.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Contact Info */}
|
|
<div className="space-y-2 sm:space-y-3">
|
|
<div className="flex items-start space-x-3">
|
|
<MapPin className="h-4 w-4 sm:h-5 sm:w-5 text-orange-400 mt-1 flex-shrink-0" />
|
|
<div className="text-xs sm:text-sm">
|
|
<p className="font-medium">Corporate Office</p>
|
|
<p className="text-gray-400">11B/79, Vrindavan Colony, Lucknow - 226029</p>
|
|
</div>
|
|
</div>
|
|
<div className="flex items-center space-x-3">
|
|
<Phone className="h-4 w-4 sm:h-5 sm:w-5 text-orange-400" />
|
|
<div className="text-xs sm:text-sm">
|
|
<a href="tel:+91-9475758817" className="hover:text-orange-400 transition-colors">
|
|
+91-9475758817
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div className="flex items-center space-x-3">
|
|
<Mail className="h-4 w-4 sm:h-5 sm:w-5 text-orange-400" />
|
|
<div className="text-xs sm:text-sm">
|
|
<a href="mailto:info@padmajarice.com" className="hover:text-orange-400 transition-colors">
|
|
info@padmajarice.com
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Menu sections - Responsive layout */}
|
|
<div className="lg:col-span-3">
|
|
<div className="grid grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6 lg:gap-8">
|
|
|
|
{/* Quick Links */}
|
|
<div>
|
|
<h4 className="font-semibold text-base sm:text-lg mb-3 sm:mb-4 text-white">Quick Links</h4>
|
|
<ul className="space-y-1.5 sm:space-y-2 text-xs sm:text-sm">
|
|
<li><Link href="/about" className="text-gray-400 hover:text-orange-400 transition-colors">About Us</Link></li>
|
|
<li><Link href="/products" className="text-gray-400 hover:text-orange-400 transition-colors">Our Products</Link></li>
|
|
<li><Link href="/partnership" className="text-gray-400 hover:text-orange-400 transition-colors">Partnership</Link></li>
|
|
<li><Link href="/wholesaler" className="text-gray-400 hover:text-orange-400 transition-colors">Become Wholesaler</Link></li>
|
|
<li><Link href="/contact" className="text-gray-400 hover:text-orange-400 transition-colors">Contact Us</Link></li>
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Business Solutions */}
|
|
<div>
|
|
<h4 className="font-semibold text-base sm:text-lg mb-3 sm:mb-4 text-white">Business</h4>
|
|
<ul className="space-y-1.5 sm:space-y-2 text-xs sm:text-sm">
|
|
<li><Link href="/wholesaler" className="text-gray-400 hover:text-orange-400 transition-colors">Distributor Program</Link></li>
|
|
<li><Link href="/partnership" className="text-gray-400 hover:text-orange-400 transition-colors">Business Partnership</Link></li>
|
|
<li><Link href="/contact" className="text-gray-400 hover:text-orange-400 transition-colors">Private Label</Link></li>
|
|
<li><Link href="/contact" className="text-gray-400 hover:text-orange-400 transition-colors">Export Inquiry</Link></li>
|
|
<li><Link href="/contact" className="text-gray-400 hover:text-orange-400 transition-colors">Franchise</Link></li>
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Legal & Support - Responsive column spanning */}
|
|
<div className="col-span-2 lg:col-span-1">
|
|
<h4 className="font-semibold text-base sm:text-lg mb-3 sm:mb-4 text-white">Support</h4>
|
|
<ul className="space-y-1.5 sm:space-y-2 text-xs sm:text-sm grid grid-cols-2 lg:grid-cols-1 gap-x-4 lg:gap-x-0">
|
|
<li><Link href="/orders" className="text-gray-400 hover:text-orange-400 transition-colors">Track Order</Link></li>
|
|
<li><Link href="/profile" className="text-gray-400 hover:text-orange-400 transition-colors">My Account</Link></li>
|
|
<li><Link href="/terms-of-service" className="text-gray-400 hover:text-orange-400 transition-colors">Terms of Service</Link></li>
|
|
<li><Link href="/privacy-policy" className="text-gray-400 hover:text-orange-400 transition-colors">Privacy Policy</Link></li>
|
|
<li><Link href="/refund-policy" className="text-gray-400 hover:text-orange-400 transition-colors">Refund Policy</Link></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Social Media & Newsletter */}
|
|
{/* <div className="mt-6 sm:mt-8 pt-6 sm:pt-8 border-t border-gray-800">
|
|
<div className="flex flex-col space-y-4 sm:space-y-6 lg:space-y-0 lg:flex-row lg:justify-between lg:items-center"> */}
|
|
|
|
{/* Social Media */}
|
|
{/* <div className="flex flex-col sm:flex-row sm:items-center space-y-2 sm:space-y-0 sm:space-x-4 lg:space-x-6">
|
|
<span className="text-sm font-medium text-gray-400">Follow Us:</span>
|
|
<div className="flex space-x-4">
|
|
<Link href="#" className="text-gray-400 hover:text-orange-400 transition-colors">
|
|
<Linkedin className="h-5 w-5 sm:h-6 sm:w-6" />
|
|
</Link>
|
|
<Link href="#" className="text-gray-400 hover:text-orange-400 transition-colors">
|
|
<Facebook className="h-5 w-5 sm:h-6 sm:w-6" />
|
|
</Link>
|
|
<Link href="#" className="text-gray-400 hover:text-orange-400 transition-colors">
|
|
<Instagram className="h-5 w-5 sm:h-6 sm:w-6" />
|
|
</Link>
|
|
</div>
|
|
</div> */}
|
|
|
|
{/* Newsletter Signup */}
|
|
{/* <div className="flex flex-col sm:flex-row sm:items-center space-y-2 sm:space-y-0 sm:space-x-3">
|
|
<span className="text-sm font-medium text-gray-400">Stay Updated:</span>
|
|
<div className="flex w-full sm:w-auto">
|
|
<input
|
|
type="email"
|
|
placeholder="Enter your email"
|
|
className="flex-1 sm:flex-none px-3 py-2 bg-gray-800 border border-gray-700 rounded-l-md text-sm focus:outline-none focus:border-orange-400 text-white placeholder-gray-500 w-full sm:w-48"
|
|
/>
|
|
<button className="px-3 sm:px-4 py-2 bg-orange-600 hover:bg-orange-700 text-white text-sm rounded-r-md transition-colors">
|
|
Subscribe
|
|
</button>
|
|
</div>
|
|
</div> */}
|
|
{/* </div>
|
|
</div> */}
|
|
</div>
|
|
|
|
{/* Bottom Bar */}
|
|
<div className="bg-gray-950">
|
|
<div className="max-w-7xl mx-auto px-3 sm:px-6 lg:px-8 py-3 sm:py-4">
|
|
<div className="flex flex-col sm:flex-row justify-between items-center text-xs sm:text-sm text-gray-400 space-y-2 sm:space-y-0">
|
|
<div>
|
|
<p>© 2024 Padmaaja. All rights reserved.</p>
|
|
</div>
|
|
<div>
|
|
<p>Crafted with ❤️ by <Link href='https://web.jabin.org' target='_blank'>Jabin Web</Link></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
)
|
|
} |