Files
valentin_le_moign 1c1604ea2f Pages équipe + conclusion, colonnes de page libre, réglages couverture
- Page « équipe » : roster statique du collectif (composables/useTeam),
  portraits servis depuis public/portraits, grille ≤ 3 colonnes équilibrée
  (portrait/nom/rôle/présentation), sélection + surcharges par membre
  (repliables, réordonnables, réinitialisables) dans le composeur
- Page « conclusion » : « Merci ! » centré + rappel des contacts
- Page libre : 1 à 3 colonnes texte (markdown) ou images avec sous-titres,
  réordonnables ; migration des champs body/media legacy vers columns
- Couverture : texte libre sous l'intro, adresse en bas à gauche (3 lignes),
  case « afficher les années » au niveau du document
- Sommaire : items centrés (self-center), filet en points dégradés stable
- Retrait de la dépendance morte pagedjs
- Docs à jour (CLAUDE.md, README) ; spec marquée comme archive réalisée
2026-07-13 16:00:59 +02:00

75 lines
2.8 KiB
Vue
Raw Permalink Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<script setup lang="ts">
// Page de conclusion — bookend de la couverture : « Merci ! » en grand au
// centre + rappel des contacts (site, mail, adresse tirés de la couverture).
import type { Background } from '~~/types'
const props = withDefaults(
defineProps<{
title?: string // texte central — défaut « Merci ! »
background: Background
bandColor?: string // filet couleur en bas
siteUrl?: string
contactEmail?: string
address?: string
renderMode?: 'preview' | 'print'
}>(),
{ renderMode: 'preview' },
)
const strip = computed(() => props.bandColor || FL_INK)
// Même logique de fond que la couverture (blanc = gris charte, plein = filet).
const pageStyle = computed(() => {
const base
= props.background.mode === 'full'
? strip.value
: props.background.mode === 'tint'
? TINT_COLOR
: FL_BASE
return { backgroundColor: base, color: inkOn(base) }
})
const heading = computed(() => props.title?.trim() || 'Merci !')
const siteHref = computed(() => props.siteUrl?.trim() || DEFAULT_SITE_URL)
const siteLabel = computed(() => siteHref.value.replace(/^https?:\/\//, '').replace(/\/$/, ''))
const email = computed(() => props.contactEmail?.trim() || DEFAULT_CONTACT_EMAIL)
// Adresse coupée aux virgules : une ligne par segment.
const addressLines = computed(() =>
(props.address?.trim() || DEFAULT_ADDRESS).split(',').map(s => s.trim()).filter(Boolean),
)
</script>
<template>
<div class="fl-page" :style="pageStyle">
<div
class="absolute inset-0 flex flex-col items-center justify-center"
:style="{ padding: 'var(--fl-margin)', gap: '64px' }"
>
<p :style="{ fontFamily: 'Syne, sans-serif', fontSize: '150px', lineHeight: '1' }">{{ heading }}</p>
<!-- Rappel des contacts (liens actifs PDF/viewer) -->
<div
class="flex flex-col items-center"
:style="{ fontFamily: 'Syne, sans-serif', fontSize: '22px', lineHeight: '1.6' }"
>
<a :href="siteHref" target="_blank" rel="noopener" class="text-current no-underline">{{ siteLabel }}</a>
<a :href="`mailto:${email}`" class="text-current no-underline">{{ email }}</a>
</div>
</div>
<!-- Adresse postale dans l'angle bas-gauche (comme la couverture) -->
<p
v-if="addressLines.length"
class="absolute left-0"
:style="{
bottom: background.mode === 'full' ? '0' : 'var(--fl-strip)',
padding: 'var(--fl-margin)',
fontFamily: 'Syne, sans-serif', fontSize: '19px', lineHeight: '1.5',
}"
><span v-for="(line, i) in addressLines" :key="i" class="block">{{ line }}</span></p>
<!-- Filet couleur pleine largeur en bas (masqué en fond plein) -->
<div v-if="background.mode !== 'full'" class="absolute inset-x-0 bottom-0" :style="{ height: 'var(--fl-strip)', backgroundColor: strip }" />
</div>
</template>