<template>
    <div class="flex flex-col justify-center items-center px-2 overflow-hidden">
        <div class="container w-full max-w-md">
            <NuxtLink to="/wedstrijd/owntimes" class="rounded-t item-hover py-2 flex items-center">
                <span>Eigen Tijden</span>
                <Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
            </NuxtLink>
            <div class="divider" />
            <NuxtLink to="/calendar" class="item-hover py-2 flex items-center">
                <span>Brigade Tijden</span>
                <Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
            </NuxtLink>
            <div v-if="userData.wedstrijdAdmin" class="divider" />
            <NuxtLink v-if="userData.wedstrijdAdmin" to="/wedstrijd/addcontest" class="rounded-b item-hover py-2 flex items-center">
                <span>Wedstrijd Toevoegen</span>
                <Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
            </NuxtLink>
        </div>
    </div>
</template>

<script setup>
definePageMeta({
  title: 'Wedstrijd'
})

const { userData } = inject('firebase')
</script>
