92 lines
3.4 KiB
TypeScript
92 lines
3.4 KiB
TypeScript
import React from 'react';
|
|
import { Link } from 'react-router-dom';
|
|
import { Shield, Github, Linkedin, Instagram, Mail } from 'lucide-react';
|
|
|
|
const Footer: React.FC = () => {
|
|
return (
|
|
<footer className="border-t border-border/30 bg-card/20 backdrop-blur-xl mt-auto">
|
|
<div className="container mx-auto px-4 py-8">
|
|
<div className="grid grid-cols-1 md:grid-cols-4 gap-8">
|
|
{/* Brand */}
|
|
<div className="space-y-4">
|
|
<Link to="/" className="flex items-center gap-2 group">
|
|
<Shield className="w-6 h-6 text-primary" />
|
|
<span className="font-display font-bold text-lg text-gradient-primary">
|
|
CipherX Labs
|
|
</span>
|
|
</Link>
|
|
<p className="text-muted-foreground text-sm">
|
|
Securing the digital frontier with cutting-edge cybersecurity education and tools.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Quick Links */}
|
|
<div>
|
|
<h4 className="font-display font-semibold text-foreground mb-4">Quick Links</h4>
|
|
<ul className="space-y-2">
|
|
{['Dashboard', 'Tools', 'Academy', 'Cipher-AI'].map((link) => (
|
|
<li key={link}>
|
|
<Link
|
|
to={`/${link.toLowerCase().replace('-', '')}`}
|
|
className="text-muted-foreground hover:text-primary transition-colors text-sm"
|
|
>
|
|
{link}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Resources */}
|
|
<div>
|
|
<h4 className="font-display font-semibold text-foreground mb-4">Resources</h4>
|
|
<ul className="space-y-2">
|
|
{['About', 'Contact', 'Privacy Policy', 'Terms of Service'].map((link) => (
|
|
<li key={link}>
|
|
<Link
|
|
to={`/${link.toLowerCase().replace(' ', '-')}`}
|
|
className="text-muted-foreground hover:text-primary transition-colors text-sm"
|
|
>
|
|
{link}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Social */}
|
|
<div>
|
|
<h4 className="font-display font-semibold text-foreground mb-4">Connect</h4>
|
|
<div className="flex gap-4">
|
|
{[
|
|
{ icon: Github, href: 'https://github.com' },
|
|
{ icon: Linkedin, href: 'https://linkedin.com' },
|
|
{ icon: Instagram, href: 'https://instagram.com' },
|
|
{ icon: Mail, href: 'mailto:contact@cipherxlabs.com' },
|
|
].map(({ icon: Icon, href }) => (
|
|
<a
|
|
key={href}
|
|
href={href}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="p-2 rounded-lg border border-border/50 text-muted-foreground hover:text-primary hover:border-primary/50 hover:shadow-[0_0_15px_hsl(var(--cyber-purple)/0.3)] transition-all duration-300"
|
|
>
|
|
<Icon className="w-5 h-5" />
|
|
</a>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="mt-8 pt-8 border-t border-border/30 text-center">
|
|
<p className="text-muted-foreground text-sm font-display">
|
|
© 2025 CipherX Labs. Securing the digital frontier.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
};
|
|
|
|
export default Footer;
|