Files
gaea21-v2-web/assets/components/trajectoire/TrajectoireJamaisFigee.jsx
MohamedLoum1001 bb1393e9ef feat(parcours): intégration des sections de la page Parcours conforme à Figma
- Prise en charge du thème sombre du Header sur la route /parcours
- Ajout de la section Hero et présentation des chiffres clés
- Grille des profils 'Qui peut rejoindre' avec méthode map() et icônes
- Intégration de la timeline verticale des étapes d'intégration
- Ajout du bandeau 'Learning by Doing'
- Restructuration des composants par dossier
2026-09-30 15:38:26 +02:00

54 lines
2.3 KiB
JavaScript

import React from 'react';
import routeImg from '../../img/trajectoire-route.png'; // Place ton image exportée de Figma dans assets/img/
import '../../styles/trajectoireJamaisFigee.css';
const TEXTES_TRANSITIONS = [
'Un étudiant peut devenir coordinateur.',
'Un coordinateur peut devenir référent.',
'Un référent peut devenir entrepreneur.',
'Un entrepreneur peut devenir mentor.',
'Une personne en reconversion peut découvrir une vocation inattendue.',
'Une première expérience peut ouvrir une carrière entière.'
];
export default function TrajectoireJamaisFigee() {
return (
<section className="trajectoire-figee-section" id="trajectoire-evolutive">
<div className="trajectoire-figee-container">
{/* Colonne gauche : Contenu textuel */}
<div className="trajectoire-figee-content">
<header className="trajectoire-figee-header">
<span className="trajectoire-figee-line" aria-hidden="true" />
<span className="trajectoire-figee-uptitle">Les trajectoires</span>
<h2 className="trajectoire-figee-title">Une trajectoire n'est jamais figée.</h2>
</header>
<div className="trajectoire-figee-list">
{TEXTES_TRANSITIONS.map((texte, idx) => (
<p key={idx} className="trajectoire-figee-step">{texte}</p>
))}
</div>
<div className="trajectoire-figee-conclusion">
<p>
C'est pourquoi les trajectoires gaea21<br />
ne sont pas conçues comme des programmes isolés. Elles sont conçues comme des étapes<br />
d'un parcours d'évolution.
</p>
</div>
</div>
{/* Colonne droite : Image route */}
<div className="trajectoire-figee-media">
<img
src={routeImg}
alt="Route sinueuse traversant la nature"
className="trajectoire-figee-image"
/>
</div>
</div>
</section>
);
}