<template>
  <footer class="flex-none">
    <div class="mx-auto max-w-7xl flex flex-col gap-1 my-2" aria-label="Footer">
      <UDivider>
        <UiLogo :avatar="true" />
      </UDivider>
      <div class="flex flex-col md:flex-row flex-wrap gap-2 items-center space-between p-6 md:px-8">
        <div class="md:flex-1">
          Propulsé par
          <ULink
            to="https://labs.phundrak.com/phundrak/gejdr-front"
            class="px-1 text-accent-600 hover:text-accent-400 transition font-semibold"
          >
            GéJDR
          </ULink>
        </div>
        <div class="flex text-base">
          <UContainer>front&nbsp;: {{ config.public.frontVersion }}</UContainer>
          <UDivider orientation="vertical" />
          <UContainer>back&nbsp;: temp</UContainer>
        </div>
        <div class="md:text-base md:flex-1 md:flex md:justify-end">
          Copyright &copy; Lucien Cartier-Tilet {{ year }}
        </div>
      </div>
    </div>
  </footer>
</template>

<script setup>
const config = useRuntimeConfig();
const date = new Date();
const year = date.getFullYear();
</script>
