79 lines
2.1 KiB
Vue
79 lines
2.1 KiB
Vue
<script setup lang="ts">
|
|
import { footerLinks } from '../composables/MainFooter'
|
|
|
|
const { t } = useLocale()
|
|
</script>
|
|
|
|
<template>
|
|
<UFooter>
|
|
<template #top>
|
|
<UFooterColumns
|
|
:links="footerLinks"
|
|
class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-12"
|
|
>
|
|
<template #left>
|
|
<div class="flex flex-col gap-4">
|
|
<div class="flex items-center gap-3">
|
|
<AppLogo class="h-10 w-auto" />
|
|
<span class="archivo-black text-2xl text-white tracking-tighter uppercase">
|
|
Spacebar
|
|
</span>
|
|
</div>
|
|
<div class="text-sm text-gray-400 space-y-1">
|
|
<p>Copyright {{ new Date().getFullYear() }}</p>
|
|
<p>{{ t.footer?.siteMaintained }}</p>
|
|
<p>{{ t.footer?.developedBy }}</p>
|
|
|
|
<p class="mt-4 max-w-[320px] leading-snug text-gray-500">
|
|
{{ t.footer?.description }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</UFooterColumns>
|
|
</template>
|
|
|
|
<template #left>
|
|
<span class="text-sm text-gray-500">
|
|
© {{ new Date().getFullYear() }} {{ t.footer?.copyright }}
|
|
</span>
|
|
</template>
|
|
|
|
<template #right>
|
|
<div class="flex gap-2">
|
|
<UButton
|
|
icon="i-simple-icons-patreon"
|
|
color="neutral"
|
|
variant="ghost"
|
|
to="https://www.patreon.com/splatfestival"
|
|
target="_blank"
|
|
aria-label="Patreon"
|
|
/>
|
|
<UButton
|
|
icon="i-simple-icons-discord"
|
|
color="neutral"
|
|
variant="ghost"
|
|
to="https://discord.gg/grMSxZf"
|
|
target="_blank"
|
|
aria-label="Discord"
|
|
/>
|
|
<UButton
|
|
icon="i-simple-icons-gitea"
|
|
color="neutral"
|
|
variant="ghost"
|
|
to="https://git.spbr.net/spacebar"
|
|
target="_blank"
|
|
aria-label="Forgejo"
|
|
/>
|
|
</div>
|
|
</template>
|
|
</UFooter>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.archivo-black {
|
|
font-family: "Archivo Black", sans-serif;
|
|
font-weight: 400;
|
|
font-style: normal;
|
|
}
|
|
</style>
|