Add diashow and styling

app/pages/hunt/[huntSlug]/showcase.vue

@@ -4,15 +4,13 @@ import NumberCard from '~/components/showcase/NumberCard.vue';
 import { fullDate } from '~~/server/utils/date';
 
 definePageMeta({
-  // TODO: re-enable perms
-  // middleware: ['admin'],
   layout: 'full'
 });
 const { t, d } = useI18n();
 
 const app = useNuxtApp();
 const { name, id } = app.$slugData.huntSlug!;
-const { data } = await useFetch(`/api/admin/hunt/${id}/showcase`);
+const { data, error } = await useFetch(`/api/hunt/${id}/showcase`);
 
 const { toggle, isFullscreen, isSupported } = useFullscreen();
 
@@ -243,7 +241,23 @@ const columns = leaderboardColumns.map((c) =>
       </div>
     </section>
   </article>
-  <article v-else>pending...</article>
+
+  <article
+    v-else-if="error"
+    class="flex h-dvh w-full flex-col items-center justify-center text-center text-2xl"
+  >
+    <VaAlert color="danger" class="w-[90%]"
+      >Answers are not revealed yet, please wait until the end!</VaAlert
+    >
+    <VaAlert color="danger" class="w-[90%]" v-if="error.statusCode !== 403">{{
+      error
+    }}</VaAlert
+    ><VaButton
+      icon="arrow_back"
+      :to="$localePath(`/hunt/${sluggy($nuxt.$slugData.huntSlug!)}`)"
+      >Back to Hunt</VaButton
+    >
+  </article>
 </template>
 
 <style scoped>