2026-01-09 18:53:47 +05:30

132 lines
5.8 KiB
TypeScript

import Link from 'next/link';
import { Facebook, Instagram, Linkedin, Twitter, Youtube } from 'lucide-react';
import styles from './Footer.module.css';
export default function Footer() {
const currentYear = new Date().getFullYear();
const footerLinks = {
product: [
{ label: 'Features', href: '#' },
{ label: 'Pricing', href: '/pricing' },
{ label: 'Documentation', href: '#' },
{ label: 'API', href: '#' },
],
company: [
{ label: 'About Us', href: '/about' },
{ label: 'Blog', href: '/resources' },
{ label: 'Careers', href: '/careers' },
{ label: 'Contact', href: '/contact' },
],
resources: [
{ label: 'Help Center', href: '/help' },
{ label: 'Community', href: '/community' },
{ label: 'Tutorials', href: '/tutorials' },
{ label: 'Status', href: '/status' },
],
legal: [
{ label: 'Privacy Policy', href: '/privacy' },
{ label: 'Terms of Service', href: '/terms' },
{ label: 'Cookie Policy', href: '/cookies' },
{ label: 'GDPR', href: '/gdpr' },
],
};
const socialLinks = [
{ icon: <Twitter size={20} />, href: 'https://twitter.com', label: 'Twitter' },
{ icon: <Facebook size={20} />, href: 'https://facebook.com', label: 'Facebook' },
{ icon: <Instagram size={20} />, href: 'https://instagram.com', label: 'Instagram' },
{ icon: <Linkedin size={20} />, href: 'https://linkedin.com', label: 'LinkedIn' },
{ icon: <Youtube size={20} />, href: 'https://youtube.com', label: 'YouTube' },
];
return (
<footer className={styles.footer}>
<div className="container">
<div className={styles.footerContent}>
{/* Brand Section */}
<div className={styles.brandSection}>
<Link href="/" className={styles.logo}>
<img src="/logo.png" alt="SocialBuddy Logo" style={{ height: '45px', width: 'auto' }} />
<span className={styles.logoText}></span>
</Link>
<p className={styles.brandDescription}>
Empowering brands to streamline social media management, drive engagement, and grow with powerful tools and analytics.
</p>
<div className={styles.socialLinks}>
{socialLinks.map((social) => (
<a
key={social.label}
href={social.href}
target="_blank"
rel="noopener noreferrer"
className={styles.socialLink}
aria-label={social.label}
>
{social.icon}
</a>
))}
</div>
</div>
{/* Links Sections */}
<div className={styles.linksGrid}>
<div className={styles.linkColumn}>
<h4 className={styles.columnTitle}>Product</h4>
{footerLinks.product.map((link) => (
<Link key={link.label} href={link.href} className={styles.footerLink}>
{link.label}
</Link>
))}
</div>
<div className={styles.linkColumn}>
<h4 className={styles.columnTitle}>Company</h4>
{footerLinks.company.map((link) => (
<Link key={link.label} href={link.href} className={styles.footerLink}>
{link.label}
</Link>
))}
</div>
<div className={styles.linkColumn}>
<h4 className={styles.columnTitle}>Resources</h4>
{footerLinks.resources.map((link) => (
<Link key={link.label} href={link.href} className={styles.footerLink}>
{link.label}
</Link>
))}
</div>
<div className={styles.linkColumn}>
<h4 className={styles.columnTitle}>Legal</h4>
{footerLinks.legal.map((link) => (
<Link key={link.label} href={link.href} className={styles.footerLink}>
{link.label}
</Link>
))}
</div>
</div>
</div>
{/* Bottom Bar */}
{/* Bottom Bar */}
<div className={styles.bottomBar}>
<p className={styles.copyright}>
© Copyright {currentYear} SocialBuddy | Powered by{' '}
<a
href="https://metatroncubesolutions.com/"
target="_blank"
rel="noopener noreferrer"
className={styles.poweredLink}
>
MetatronCube
</a>{' '}
All Rights Reserved
</p>
</div>
</div>
</footer>
);
}