80 lines
3.1 KiB
TypeScript
80 lines
3.1 KiB
TypeScript
import Link from "next/link.js";
|
|
|
|
import { AuthorConfig, NavLink } from "../types";
|
|
|
|
interface Props {
|
|
author: AuthorConfig;
|
|
links?: Array<NavLink>;
|
|
}
|
|
|
|
// TODO replace this with some nice tailwindui footer
|
|
export const Footer: React.FC<Props> = ({ links, author }) => {
|
|
return (
|
|
<footer className="bg-background dark:bg-background-dark text-primary dark:text-primary-dark pt-16 pb-20 px-14 flex flex-col items-center justify-center gap-3">
|
|
{links && (
|
|
<div className="flex w-full flex-wrap justify-center mb-2">
|
|
{links.map((item) => (
|
|
<Link
|
|
key={item.href}
|
|
href={item.href}
|
|
className="inline-flex items-center mx-4 px-1 py-1 text-black hover:text-primary dark:text-white hover:dark:text-primary-dark no-underline font-semibold"
|
|
>
|
|
{/* TODO aria-current={item.current ? "page" : undefined} */}
|
|
{item.name}
|
|
</Link>
|
|
))}
|
|
</div>
|
|
)}
|
|
<p className="flex items-center justify-center gap-2">
|
|
<span>Created by</span>
|
|
{author.url ? (
|
|
<a
|
|
href={author.url}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="flex items-center gap-1 no-underline font-semibold text-black dark:text-white"
|
|
>
|
|
{author.logo && (
|
|
<img
|
|
src={author.logo}
|
|
alt="Logo"
|
|
className="h-6 block"
|
|
/>
|
|
)}
|
|
<span>{author.name}</span>
|
|
</a>
|
|
) : (
|
|
<span
|
|
className="flex items-center gap-1 no-underline font-semibold text-black dark:text-white"
|
|
>
|
|
{author.logo && (
|
|
<img
|
|
src={author.logo}
|
|
alt={author.name}
|
|
className="h-6 block"
|
|
/>
|
|
)}
|
|
<span>{author.name}</span>
|
|
</span>
|
|
)}
|
|
</p>
|
|
<p className="flex items-center justify-center gap-1">
|
|
<span>Made with</span>
|
|
<a
|
|
href="https://flowershow.app/"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="flex items-center gap-1 no-underline font-semibold text-black dark:text-white"
|
|
>
|
|
<img
|
|
src="https://flowershow.app/images/logo.svg"
|
|
alt="Logo"
|
|
className="h-6 block"
|
|
/>
|
|
<span>Flowershow</span>
|
|
</a>
|
|
</p>
|
|
</footer>
|
|
);
|
|
};
|