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
This commit is contained in:
54
assets/components/trajectoire/TrajectoireJamaisFigee.jsx
Normal file
54
assets/components/trajectoire/TrajectoireJamaisFigee.jsx
Normal file
@ -0,0 +1,54 @@
|
||||
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>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user