9caf11c8ab
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
- Structure par section : /numerique, /economique, /citoyenne (plus de /gestation) - Chaque section a index + sous-pages avec contenu YAML administrable - API content supporte les chemins imbriqués ([...path]) - Admin : liste des pages + éditeur par section - Page /economique : monnaie libre (picto Ğ1), modèle éco, productions collectives, commande livre - Page /citoyenne : decision (CTA Glibredecision), tarifs-eau (CTA SejeteralO) - BookActions : composant partagé (player, PDF, chapitres, commande) sur home, eco et modele-eco - GrateWizard remonté dans la section économique de la home - Palette été par défaut, choix persisté en localStorage - Fix lisibilité été (text-white/65 + variables CSS) - Shadoks thématiques sur toutes les pages (8-10 par page, métiers variés) - Redirections 301 : /gestation/*, /modele-eco/*, /decision, /lire/* - README, CONTRIBUTING, CLAUDE.md mis à jour Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
99 lines
2.4 KiB
Vue
99 lines
2.4 KiB
Vue
<template>
|
|
<section class="section-padding">
|
|
<div class="container-content">
|
|
<div class="grid items-center gap-12 md:grid-cols-2">
|
|
<!-- Book cover -->
|
|
<UiScrollReveal>
|
|
<div class="book-cover-wrapper relative">
|
|
<div class="book-cover-3d">
|
|
<img
|
|
:src="content?.book.coverImage"
|
|
:alt="content?.book.coverAlt"
|
|
class="book-cover-img"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</UiScrollReveal>
|
|
|
|
<!-- Content + CTAs -->
|
|
<div>
|
|
<UiScrollReveal>
|
|
<p class="mb-2 font-mono text-sm tracking-widest text-accent uppercase">{{ content?.book.kicker }}</p>
|
|
<h2 class="heading-section font-display font-bold tracking-tight text-white">
|
|
{{ content?.book.title }}
|
|
</h2>
|
|
</UiScrollReveal>
|
|
|
|
<UiScrollReveal :delay="100">
|
|
<p class="mt-4 text-lg leading-relaxed text-white/60">
|
|
{{ content?.book.description }}
|
|
</p>
|
|
</UiScrollReveal>
|
|
|
|
<UiScrollReveal :delay="200">
|
|
<BookActions
|
|
:show-chapters="showChapters"
|
|
@open-player="$emit('open-player')"
|
|
@open-pdf="$emit('open-pdf')"
|
|
/>
|
|
</UiScrollReveal>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
withDefaults(defineProps<{
|
|
showChapters?: boolean
|
|
}>(), {
|
|
showChapters: true,
|
|
})
|
|
|
|
defineEmits<{
|
|
'open-player': []
|
|
'open-pdf': []
|
|
}>()
|
|
|
|
const { data: content } = await usePageContent('home')
|
|
</script>
|
|
|
|
<style scoped>
|
|
.book-cover-wrapper {
|
|
perspective: 800px;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.book-cover-3d {
|
|
aspect-ratio: 3 / 4;
|
|
border-radius: 0.75rem;
|
|
overflow: hidden;
|
|
border: 1px solid hsl(var(--color-text) / 0.1);
|
|
box-shadow:
|
|
0 12px 40px hsl(var(--color-text) / 0.15),
|
|
0 0 0 1px hsl(var(--color-text) / 0.08);
|
|
transition: transform 0.5s cubic-bezier(0.645, 0.045, 0.355, 1),
|
|
box-shadow 0.5s ease;
|
|
max-width: 360px;
|
|
}
|
|
|
|
.book-cover-3d:hover {
|
|
transform: rotateY(-8deg) rotateX(3deg) scale(1.02);
|
|
box-shadow:
|
|
12px 16px 48px hsl(var(--color-text) / 0.2),
|
|
0 0 0 1px hsl(var(--color-primary) / 0.2);
|
|
}
|
|
|
|
.book-cover-img {
|
|
width: 200%;
|
|
height: 100%;
|
|
object-fit: cover;
|
|
transform: translateX(-50%);
|
|
}
|
|
|
|
.heading-section {
|
|
font-size: clamp(1.625rem, 4vw, 2.125rem);
|
|
}
|
|
</style>
|