2025-09-16 11:32:59 +08:00

100 lines
4.0 KiB
TypeScript

'use client';
interface FooterProps {
currentLang: string;
t: {
footer: {
company: string;
products: string;
support: string;
legal: string;
copyright: string;
};
};
}
export default function Footer({ currentLang, t }: FooterProps) {
return (
<footer className="relative z-10 border-t border-cyan-500/30 backdrop-blur-sm mt-20">
<div className="max-w-7xl mx-auto px-6 py-12">
<div className="grid md:grid-cols-4 gap-8">
<div>
<div className="text-2xl font-bold text-cyan-400 mb-4">
CYBER
<span className="text-pink-500">CLOUD</span>
</div>
<p className="text-gray-400 text-sm">{t.footer.company}</p>
</div>
<div>
<h3 className="text-cyan-400 font-semibold mb-4">{t.footer.products}</h3>
<ul className="space-y-2 text-gray-400 text-sm">
<li>
<a href="#" className="hover:text-cyan-400 transition-colors">
Cloud Servers
</a>
</li>
<li>
<a href="#" className="hover:text-cyan-400 transition-colors">
Storage
</a>
</li>
<li>
<a href="#" className="hover:text-cyan-400 transition-colors">
Networking
</a>
</li>
</ul>
</div>
<div>
<h3 className="text-cyan-400 font-semibold mb-4">{t.footer.support}</h3>
<ul className="space-y-2 text-gray-400 text-sm">
<li>
<a href="#" className="hover:text-cyan-400 transition-colors">
Documentation
</a>
</li>
<li>
<a href="#" className="hover:text-cyan-400 transition-colors">
API Reference
</a>
</li>
<li>
<a href="#" className="hover:text-cyan-400 transition-colors">
Contact
</a>
</li>
</ul>
</div>
<div>
<h3 className="text-cyan-400 font-semibold mb-4">{t.footer.legal}</h3>
<ul className="space-y-2 text-gray-400 text-sm">
<li>
<a href="#" className="hover:text-cyan-400 transition-colors">
Privacy Policy
</a>
</li>
<li>
<a href="#" className="hover:text-cyan-400 transition-colors">
Terms of Service
</a>
</li>
<li>
<a href="#" className="hover:text-cyan-400 transition-colors">
Security
</a>
</li>
</ul>
</div>
</div>
<div className="border-t border-cyan-500/30 mt-8 pt-8 text-center text-gray-400 text-sm">
<p>{t.footer.copyright}</p>
</div>
</div>
</footer>
);
}