Icon links for navigating to social profiles.
<SiteLinks className="flex items-center gap-6" />
<ThemeSelect />
<SocialIcons />
</span>
<span className="flex items-center gap-4 md:hidden" data-testid="mobile-components">
The rendered SocialIcons component.
export default function SocialIcons() {
return (
<div className="flex flex-row items-center justify-center gap-8" data-testid="social-icons">
<Link href="mailto:jackwmaclennan@gmail.com" role="link" aria-label="email" tabIndex={0} data-testid="email-link">
<FontAwesomeIcon className="h-4 w-5 text-xl text-slate-300" icon={faEnvelope} />
</Link>
<Link
href="https://github.com/maclenjack/"
target="_blank"
rel="noreferrer"
role="link"
aria-label="github"
tabIndex={0}
data-testid="github-link"
>
<FontAwesomeIcon className="h-4 w-5 text-xl text-slate-300" icon={faGithub} />
</Link>
<Link
href="https://www.linkedin.com/in/jack-maclennan/"
target="_blank"
rel="noreferrer"
role="link"
aria-label="linkedin"
tabIndex={0}
data-testid="linkedin-link"
>
<FontAwesomeIcon className="h-4 w-5 text-xl text-slate-300" icon={faLinkedin} />
</Link>
</div>
);
}