skycel
7e87a341a2
Epic 4: Chemins Narratifs, Challenge & Contact Stories implementees: - 4.1: Composant ChoiceCards pour choix narratifs binaires - 4.2: Sequence d'intro narrative avec Le Bug - 4.3: Chemins narratifs differencies avec useNarrativePath - 4.4: Table easter_eggs et systeme de detection (API + composable) - 4.5: Easter eggs UI (popup, notification, collection) - 4.6: Page challenge avec puzzle de code - 4.7: Page revelation "Monde de Code" - 4.8: Page contact avec formulaire et stats Fichiers crees: - Frontend: ChoiceCards, IntroSequence, ZoneEndChoice, EasterEggPopup, CodePuzzle, ChallengeSuccess, CodeWorld, et pages intro/challenge/revelation - API: EasterEggController, Model, Migration, Seeder Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
38 lines
1.4 KiB
Vue
38 lines
1.4 KiB
Vue
<template>
|
|
<div class="zone-end-choice py-16 px-4 border-t border-sky-dark-100 mt-16">
|
|
<div class="max-w-2xl mx-auto">
|
|
<!-- Choix binaire -->
|
|
<FeatureChoiceCards
|
|
v-if="choicePoint && choicePoint.choices[0].id !== choicePoint.choices[1].id"
|
|
:choice-point="choicePoint"
|
|
/>
|
|
|
|
<!-- Si une seule destination (contact) -->
|
|
<div
|
|
v-else-if="choicePoint"
|
|
class="text-center"
|
|
>
|
|
<p class="font-narrative text-xl text-sky-text mb-8 italic">
|
|
{{ locale === 'fr' ? choicePoint.questionFr : choicePoint.questionEn }}
|
|
</p>
|
|
|
|
<NuxtLink
|
|
:to="localePath(choicePoint.choices[0].destination)"
|
|
class="inline-flex items-center gap-3 px-8 py-4 bg-sky-accent text-sky-dark font-ui font-semibold rounded-xl hover:opacity-90 transition-opacity focus-visible:outline-2 focus-visible:outline-sky-accent focus-visible:outline-offset-2"
|
|
>
|
|
<span class="text-2xl">{{ choicePoint.choices[0].icon }}</span>
|
|
<span>{{ locale === 'fr' ? choicePoint.choices[0].textFr : choicePoint.choices[0].textEn }}</span>
|
|
</NuxtLink>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const { getNextChoicePoint } = useNarrativePath()
|
|
const { locale } = useI18n()
|
|
const localePath = useLocalePath()
|
|
|
|
const choicePoint = computed(() => getNextChoicePoint())
|
|
</script>
|