64 lines
2.4 KiB
JavaScript
64 lines
2.4 KiB
JavaScript
import { SectionWrapper } from '../components/SectionWrapper';
|
|
|
|
const socialLinks = [
|
|
{ name: 'Email', url: 'mailto:space@reversed.dev', icon: '📧', desc: 'space@reversed.dev' },
|
|
];
|
|
|
|
export function Contact() {
|
|
return (
|
|
<section id="contact" className="py-24 px-4 bg-darker">
|
|
<div className="max-w-4xl mx-auto">
|
|
<SectionWrapper>
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-4xl font-bold mb-4">
|
|
<span className="bg-gradient-to-r from-primary to-secondary bg-clip-text text-transparent">
|
|
Get in Touch
|
|
</span>
|
|
</h2>
|
|
<p className="text-slate-400 max-w-2xl mx-auto">
|
|
Want to reach me? Here's how.
|
|
</p>
|
|
</div>
|
|
</SectionWrapper>
|
|
|
|
<SectionWrapper delay={100}>
|
|
<div className="max-w-lg mx-auto space-y-4">
|
|
{/* Allowlist notice */}
|
|
<div className="p-4 bg-dark rounded-lg border border-amber-500/30 mb-6">
|
|
<div className="flex items-start gap-3">
|
|
<span className="text-2xl">⚠️</span>
|
|
<div>
|
|
<div className="font-medium text-amber-400 mb-1">Email Allowlist</div>
|
|
<p className="text-sm text-slate-400">
|
|
I only receive emails from approved senders. To contact me, email{' '}
|
|
<span className="text-slate-300">space@reversed.dev</span> and ask
|
|
him to add you to Luna's allowlist (clawy@reversed.dev).
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{socialLinks.map((link) => (
|
|
<a
|
|
key={link.name}
|
|
href={link.url}
|
|
target={link.url.startsWith('mailto') ? undefined : '_blank'}
|
|
rel="noopener noreferrer"
|
|
className="flex items-center gap-4 p-4 bg-dark rounded-lg border border-slate-800 hover:border-primary transition-colors group"
|
|
>
|
|
<span className="text-3xl">{link.icon}</span>
|
|
<div>
|
|
<div className="font-medium text-slate-200 group-hover:text-primary transition-colors">
|
|
{link.name}
|
|
</div>
|
|
<div className="text-sm text-slate-500">{link.desc}</div>
|
|
</div>
|
|
</a>
|
|
))}
|
|
</div>
|
|
</SectionWrapper>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|