---
import { tt } from "#/copy";
import SocialIcons from "@astrojs/starlight/components/SocialIcons.astro";
import Link from "#/components/Link.astro";
---

<div
  class="bottom flex flex-wrap justify-center sm:flex-nowrap sm:justify-between gap-y-3 gap-x-6 text-accent-500 items-center text-sm md:text-base"
>
  <div class="flex items-center gap-2">
    <span>Alumnium © {new Date().getFullYear()}</span>
    <text-del></text-del>
    <Link t={tt.links.mitLicense} />
  </div>

  <div class="flex gap-5 text-xl">
    <SocialIcons {...Astro.props} />
  </div>
</div>

<style>
  @reference "#/styles/global.css";

  .bottom :global(a) {
    @apply text-accent-500 hover:text-cyan-500;
  }
</style>
