---

import { MENU_LINKS } from "@/data/constants";

const year = new Date().getFullYear();

---

<footer

	class="mt-auto flex w-full flex-col items-center justify-center gap-y-2 pt-20 pb-4 text-center align-top text-gray-500 sm:flex-row sm:justify-between sm:text-xs"

>

	<div class="mr-0 sm:mr-4">

		Copyright © {year}

		<span aria-label="rocket emoji">🚀</span>

		Astro Cactus

	</div>

	<nav

		aria-label="More on this site"

		class="flex gap-x-2 sm:gap-x-0 sm:divide-x sm:divide-gray-500"

	>

		{

			MENU_LINKS.map((link) => (

				<a

					href={link.path}

					class="sm:hover:text-textColor px-4 py-2 sm:py-0 sm:px-2 sm:hover:underline"

				>

					{link.title}

				</a>

			))

		}

	</nav>

</footer>