Feat: Home récupère subtitle et CTA depuis les données Kirby

- Renommage des champs blueprint : cta_text → ctaText, cta_link → ctaLink
- Template home.json.php : expose ctaText et ctaPath (id de page Kirby)
- Home.svelte : suppression des traductions en dur, lecture de data.hero

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-02-18 12:08:08 +01:00
parent 51eee10c5a
commit 50f81269ac
3 changed files with 8 additions and 23 deletions

View file

@ -23,13 +23,13 @@ tabs:
type: writer type: writer
marks: false marks: false
nodes: false nodes: false
cta_text: ctaText:
width: 1/2 width: 1/2
label: Texte du bouton CTA label: Texte du bouton CTA
help: CTA pour call to action help: CTA pour call to action
type: text type: text
default: Explorer default: Explorer
cta_link: ctaLink:
width: 1/2 width: 1/2
label: Lien du bouton CTA label: Lien du bouton CTA
help: CTA pour call to action help: CTA pour call to action

View file

@ -5,8 +5,8 @@ $specificData = [
'title' => $page->hero_title()->value(), 'title' => $page->hero_title()->value(),
'title_highlight' => $page->hero_title_highlight()->value(), 'title_highlight' => $page->hero_title_highlight()->value(),
'subtitle' => $page->hero_subtitle()->value(), 'subtitle' => $page->hero_subtitle()->value(),
'cta_text' => $page->hero_cta_text()->value(), 'ctaText' => $page->ctaText()->value(),
'cta_link' => $page->hero_cta_link()->toPage()?->url() ?? '#', 'ctaPath' => $page->ctaLink()->toPage()?->id() ?? '#',
'image' => $page->hero_image()->toFile()?->url() 'image' => $page->hero_image()->toFile()?->url()
], ],
'background_video' => $page->background_video()->toFile()?->url(), 'background_video' => $page->background_video()->toFile()?->url(),

View file

@ -1,27 +1,12 @@
<script> <script>
import { onMount } from 'svelte' import { onMount } from 'svelte'
import { locale } from '@state/locale.svelte' import { locale } from '@state/locale.svelte'
import { navigateTo } from '@state/router' import { navigateTo } from '@router'
let { data } = $props() let { data } = $props()
const currentLang = $derived(locale.current) const currentLang = $derived(locale.current)
const translations = {
homeText: {
fr: "World Game crée des expériences gamifiées qui transforment l'engagement en résultats mesurables",
en: "World Game creates gamified experiences that transform engagement into measurable results"
},
explore: {
fr: "EXPLORER",
en: "EXPLORE"
}
}
function t(key) {
return translations[key]?.[currentLang] || translations[key]?.fr || ''
}
onMount(() => { onMount(() => {
const playVideo = async (videoId) => { const playVideo = async (videoId) => {
const video = document.getElementById(videoId) const video = document.getElementById(videoId)
@ -55,7 +40,7 @@
}) })
function handleExplore() { function handleExplore() {
navigateTo('/portfolio') navigateTo('/' + data.hero.ctaPath)
} }
</script> </script>
@ -125,7 +110,7 @@
style="z-index: 5; justify-self: center; margin-top: 6vmax;" style="z-index: 5; justify-self: center; margin-top: 6vmax;"
> >
<h2 class="font-face-danzza-light home-subtitle"> <h2 class="font-face-danzza-light home-subtitle">
{t('homeText')} {data.hero.subtitle}
</h2> </h2>
<div <div
class="clickable button" class="clickable button"
@ -137,7 +122,7 @@
> >
<div class="earth-icon clickable-filter-black"></div> <div class="earth-icon clickable-filter-black"></div>
<p class="clickable" style="font-family: Terminal; font-size: 1.2em;"> <p class="clickable" style="font-family: Terminal; font-size: 1.2em;">
{t('explore')} {data.hero.ctaText}
</p> </p>
</div> </div>
</div> </div>