30 lines
1.2 KiB
TypeScript
30 lines
1.2 KiB
TypeScript
import Git from "../assets/git.svg?react";
|
|
import LinkedIn from "../assets/linkedin.svg?react";
|
|
import Mastodon from "../assets/mastodon.svg?react";
|
|
import DarkModeToggleIcon from "../assets/darkmodetoggle.svg?react";
|
|
|
|
type ImageLinkProps = {
|
|
href: string;
|
|
title: string;
|
|
Image: typeof Git; // Not ideal, but I can't figure out how to import the type directly from the declared wildcard module
|
|
};
|
|
|
|
const ImageLink = ({ href, title, Image }: ImageLinkProps) => (
|
|
<a rel="me" href={href} title={title} className="footerAction">
|
|
<Image width="100%" />
|
|
</a>
|
|
);
|
|
|
|
const Links = () => (
|
|
<div className="links">
|
|
<ImageLink href="https://git.mmbradley.ca/MichaelBradley/" title="Forgejo instance" Image={Git} />
|
|
<ImageLink href="https://www.linkedin.com/in/michaelmbradley/" title="LinkedIn account" Image={LinkedIn} />
|
|
<ImageLink href="https://mstdn.ca/@michaelbradley/" title="Mastodon account" Image={Mastodon} />
|
|
<input id="dark-mode-toggle" type="checkbox" aria-label="Toggle dark mode" />
|
|
<label htmlFor="dark-mode-toggle" id="dark-mode-toggle-label" title="Toggle dark mode" className="footerAction">
|
|
<DarkModeToggleIcon width="100%" />
|
|
</label>
|
|
</div>
|
|
);
|
|
|
|
export default Links;
|