footer
This commit is contained in:
parent
e773f6b7e1
commit
b1d9d46e4e
123
src/components/common/Footer.jsx
Normal file
123
src/components/common/Footer.jsx
Normal file
@ -0,0 +1,123 @@
|
|||||||
|
import { Facebook, Instagram, Linkedin, Twitter, Youtube } from 'lucide-react';
|
||||||
|
|
||||||
|
export default function Footer() {
|
||||||
|
return (
|
||||||
|
<footer className="bg-gradient-to-b from-green-50 to-white">
|
||||||
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-8 mb-8">
|
||||||
|
{/* Need Help Section */}
|
||||||
|
<div>
|
||||||
|
<h3 className="text-red-600 font-bold text-lg mb-4">Need Help?</h3>
|
||||||
|
<ul className="space-y-2">
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Member Login</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Sign Up</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Partner Search</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">How to Use Shaadi.com</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Premium Memberships</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Customer Support</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Site Map</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Company Section */}
|
||||||
|
<div>
|
||||||
|
<h3 className="text-red-600 font-bold text-lg mb-4">Company</h3>
|
||||||
|
<ul className="space-y-2">
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">About Us</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Shaadi Blog</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Careers</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Awards & Recognition</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Cov-Aid</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Contact Us</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Privacy & You Section */}
|
||||||
|
<div>
|
||||||
|
<h3 className="text-red-600 font-bold text-lg mb-4">Privacy & You</h3>
|
||||||
|
<ul className="space-y-2">
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Terms of Use</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Privacy Policy</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Be Safe Online</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Report Misuse</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* More Section */}
|
||||||
|
<div>
|
||||||
|
<h3 className="text-red-600 font-bold text-lg mb-4">More</h3>
|
||||||
|
<ul className="space-y-2">
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">VIP Shaadi</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Select Shaadi</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Sangam</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Shaadi Centres</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Success Stories</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Shaadi Live</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Elite Matrimony by Shaadi.com</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Astrochat.com</a></li>
|
||||||
|
<li><a href="#" className="text-gray-600 hover:text-green-600 transition-colors">Chat with Astrologers</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Social Media & Apps Section */}
|
||||||
|
<div>
|
||||||
|
<h3 className="text-red-600 font-bold text-lg mb-4">Find us on:</h3>
|
||||||
|
<div className="flex gap-3 mb-6">
|
||||||
|
<a href="#" className="bg-white border border-gray-300 p-2 rounded hover:bg-green-50 hover:border-green-500 transition-all">
|
||||||
|
<Facebook className="w-5 h-5 text-gray-700" />
|
||||||
|
</a>
|
||||||
|
<a href="#" className="bg-white border border-gray-300 p-2 rounded hover:bg-green-50 hover:border-green-500 transition-all">
|
||||||
|
<Instagram className="w-5 h-5 text-gray-700" />
|
||||||
|
</a>
|
||||||
|
<a href="#" className="bg-white border border-gray-300 p-2 rounded hover:bg-green-50 hover:border-green-500 transition-all">
|
||||||
|
<Linkedin className="w-5 h-5 text-gray-700" />
|
||||||
|
</a>
|
||||||
|
<a href="#" className="bg-white border border-gray-300 p-2 rounded hover:bg-green-50 hover:border-green-500 transition-all">
|
||||||
|
<Twitter className="w-5 h-5 text-gray-700" />
|
||||||
|
</a>
|
||||||
|
<a href="#" className="bg-white border border-gray-300 p-2 rounded hover:bg-green-50 hover:border-green-500 transition-all">
|
||||||
|
<Youtube className="w-5 h-5 text-gray-700" />
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3 className="text-red-600 font-bold text-lg mb-4">Get the Shaadi App</h3>
|
||||||
|
<div className="space-y-3">
|
||||||
|
<a href="#" className="block">
|
||||||
|
<img
|
||||||
|
src="https://upload.wikimedia.org/wikipedia/commons/3/3c/Download_on_the_App_Store_Badge.svg"
|
||||||
|
alt="Download on App Store"
|
||||||
|
className="h-10 hover:opacity-80 transition-opacity"
|
||||||
|
/>
|
||||||
|
</a>
|
||||||
|
<a href="#" className="block">
|
||||||
|
<img
|
||||||
|
src="https://upload.wikimedia.org/wikipedia/commons/7/78/Google_Play_Store_badge_EN.svg"
|
||||||
|
alt="Get it on Google Play"
|
||||||
|
className="h-10 hover:opacity-80 transition-opacity"
|
||||||
|
/>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<p className="text-xs text-gray-500 mt-3">
|
||||||
|
Apple and the Apple Logo are trademarks of Apple Inc.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-gray-500 mt-1">
|
||||||
|
Google Play and the Google Play logo are trademarks of Google LLC.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Bottom Copyright Section */}
|
||||||
|
<div className="border-t border-gray-200 pt-6">
|
||||||
|
<div className="flex flex-col md:flex-row justify-between items-center">
|
||||||
|
<p className="text-sm text-gray-600 mb-4 md:mb-0">
|
||||||
|
© 1996-2025 Shaadi.com, The World's Leading Matchmaking Service™
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-gray-600">
|
||||||
|
Passionately created by <span className="text-green-600 font-semibold">People Group</span> ▶
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -95,14 +95,14 @@ export default function ThreeScrollTrigger() {
|
|||||||
</div>
|
</div>
|
||||||
</ThreeDScrollTriggerRow>
|
</ThreeDScrollTriggerRow>
|
||||||
|
|
||||||
<ThreeDScrollTriggerRow baseVelocity={2} direction={1}>
|
{/* <ThreeDScrollTriggerRow baseVelocity={2} direction={1}>
|
||||||
<div className="flex flex-row gap-6 px-3 py-1">
|
<div className="flex flex-row gap-6 px-3 py-1">
|
||||||
{row3.map((rev, idx) => (
|
{row3.map((rev, idx) => (
|
||||||
<ReviewCard key={idx} {...rev} onMouseEnter={() => setPaused(true)}
|
<ReviewCard key={idx} {...rev} onMouseEnter={() => setPaused(true)}
|
||||||
onMouseLeave={() => setPaused(false)} />
|
onMouseLeave={() => setPaused(false)} />
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</ThreeDScrollTriggerRow>
|
</ThreeDScrollTriggerRow> */}
|
||||||
</ThreeDScrollTriggerContainer>
|
</ThreeDScrollTriggerContainer>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -77,7 +77,7 @@ const AppPromoteSection = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<section className="md:-mt-[100px] mx-auto w-[100%] max-w-[1100px] relative z-9 md:my-8 p-2 md:p-12">
|
<section className="md:-mt-[100px] mx-auto w-[100%] max-w-[1200px] relative z-9 md:my-8 p-2 md:p-4">
|
||||||
<div
|
<div
|
||||||
className="-mt-[20px] md:mt-[0px]
|
className="-mt-[20px] md:mt-[0px]
|
||||||
rounded-[20px] overflow-hidden bg-white " style={{boxShadow:"0 2px 6px 0 rgba(142, 142, 142, .2)"}}
|
rounded-[20px] overflow-hidden bg-white " style={{boxShadow:"0 2px 6px 0 rgba(142, 142, 142, .2)"}}
|
||||||
|
|||||||
@ -1,5 +1,6 @@
|
|||||||
import { Outlet } from "react-router-dom";
|
import { Outlet } from "react-router-dom";
|
||||||
import ProfileHeader from "../components/common/ProfileHeader";
|
import ProfileHeader from "../components/common/ProfileHeader";
|
||||||
|
import Footer from "../components/common/Footer";
|
||||||
const ProfileLayout = () => {
|
const ProfileLayout = () => {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@ -7,6 +8,8 @@ const ProfileLayout = () => {
|
|||||||
<div className=" w-[100%] max-w-[1400px] mx-auto p-2" style={{ marginBottom:'90px', overflowX:"hidden" }}>
|
<div className=" w-[100%] max-w-[1400px] mx-auto p-2" style={{ marginBottom:'90px', overflowX:"hidden" }}>
|
||||||
<Outlet />
|
<Outlet />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<Footer/>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user