55 lines
1.8 KiB
TypeScript
55 lines
1.8 KiB
TypeScript
const socialLinks = [
|
|
{
|
|
href: 'https://www.instagram.com',
|
|
label: 'Instagram',
|
|
icon: (
|
|
<path d="M7.75 2h8.5A5.75 5.75 0 0 1 22 7.75v8.5A5.75 5.75 0 0 1 16.25 22h-8.5A5.75 5.75 0 0 1 2 16.25v-8.5A5.75 5.75 0 0 1 7.75 2Zm0 1.5A4.25 4.25 0 0 0 3.5 7.75v8.5A4.25 4.25 0 0 0 7.75 20.5h8.5a4.25 4.25 0 0 0 4.25-4.25v-8.5a4.25 4.25 0 0 0-4.25-4.25h-8.5Zm9.5 1.75a1.25 1.25 0 1 1 0 2.5 1.25 1.25 0 0 1 0-2.5ZM12 7a5 5 0 1 1 0 10 5 5 0 0 1 0-10Zm0 1.5a3.5 3.5 0 1 0 0 7 3.5 3.5 0 0 0 0-7Z" />
|
|
),
|
|
},
|
|
{
|
|
href: 'https://www.linkedin.com',
|
|
label: 'LinkedIn',
|
|
icon: (
|
|
<path d="M6.94 8.5A1.56 1.56 0 1 1 6.94 5.4a1.56 1.56 0 0 1 0 3.1ZM5.5 10h2.88v8.5H5.5V10Zm4.63 0H12.9v1.16h.04c.39-.74 1.35-1.52 2.79-1.52 2.99 0 3.54 1.97 3.54 4.53v4.33h-2.88V14.66c0-.91-.02-2.07-1.26-2.07-1.27 0-1.46.99-1.46 2.01v3.9h-2.88V10Z" />
|
|
),
|
|
},
|
|
{
|
|
href: 'https://x.com',
|
|
label: 'X',
|
|
icon: (
|
|
<path d="M18.9 2H22l-6.77 7.74L23 22h-6.1l-4.78-6.26L6.63 22H3.5l7.25-8.28L1 2h6.26l4.32 5.7L18.9 2Zm-1.07 18h1.69L6.34 3.9H4.53L17.83 20Z" />
|
|
),
|
|
},
|
|
] as const
|
|
|
|
interface SocialMediaLinksProps {
|
|
className?: string
|
|
iconClassName?: string
|
|
linkClassName?: string
|
|
}
|
|
|
|
export default function SocialMediaLinks({
|
|
className = '',
|
|
iconClassName = 'h-5 w-5',
|
|
linkClassName = 'transition-colors hover:text-[#4274ff]',
|
|
}: SocialMediaLinksProps) {
|
|
return (
|
|
<div className={`flex items-center gap-4 ${className}`.trim()}>
|
|
{socialLinks.map((link) => (
|
|
<a
|
|
key={link.label}
|
|
href={link.href}
|
|
className={linkClassName}
|
|
aria-label={link.label}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<svg className={iconClassName} viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
|
|
{link.icon}
|
|
</svg>
|
|
</a>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|