From f66e39ab09ca6acfc658e8898ea824b12ed2ddd7 Mon Sep 17 00:00:00 2001 From: MohamedLoum1001 Date: Fri, 25 Sep 2026 20:04:07 +0200 Subject: [PATCH] =?UTF-8?q?feat(trajectoire):=20int=C3=A9gration=20compl?= =?UTF-8?q?=C3=A8te=20de=20la=20page=20et=20des=20sous-composants=20Figma?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- assets/app.js | 16 +- assets/components/AlumniCommunaute.jsx | 55 +++++ assets/components/ConstruireTrajectoire.jsx | 21 +- assets/components/ExemplesProjets.jsx | 38 ++-- assets/components/Footer.jsx | 2 +- assets/components/Header.jsx | 10 +- assets/components/Home.jsx | 29 +-- assets/components/HuitTrajectoires.jsx | 212 ++++++++++++------ assets/components/HumanEmploymentModel.jsx | 79 ++++--- assets/components/TrajectoireJamaisFigee.jsx | 54 +++++ assets/img/{bureau.png => alumni-meeting.png} | Bin .../img/{route.png => trajectoire-route.png} | Bin assets/styles/alumniCommunaute.css | 83 +++++++ assets/styles/exemples-projets.css | 152 +++++++++---- assets/styles/footer.css | 6 +- assets/styles/huitTrajectoires.css | 148 ++++++++++++ assets/styles/human-employment.css | 163 ++++++++------ assets/styles/trajectoireJamaisFigee.css | 110 +++++++++ templates/base.html.twig | 4 +- webpack.config.cjs | 4 +- 20 files changed, 894 insertions(+), 292 deletions(-) create mode 100644 assets/components/AlumniCommunaute.jsx create mode 100644 assets/components/TrajectoireJamaisFigee.jsx rename assets/img/{bureau.png => alumni-meeting.png} (100%) rename assets/img/{route.png => trajectoire-route.png} (100%) create mode 100644 assets/styles/alumniCommunaute.css create mode 100644 assets/styles/huitTrajectoires.css create mode 100644 assets/styles/trajectoireJamaisFigee.css diff --git a/assets/app.js b/assets/app.js index 2cabd8c..216cf39 100644 --- a/assets/app.js +++ b/assets/app.js @@ -1,20 +1,26 @@ import React from 'react'; import ReactDOM from 'react-dom/client'; import { BrowserRouter, Routes, Route } from 'react-router-dom'; -// Au lieu de './components/Home' + +import Header from './components/Header.jsx'; import Home from './components/Home.jsx'; import ConstruireTrajectoire from './components/ConstruireTrajectoire.jsx'; import './styles/app.css'; -const rootElement = document.getElementById('root'); // ou l'ID de ton conteneur Twig -if (rootElement) { - const root = ReactDOM.createRoot(rootElement); - root.render( +function App() { + return ( +
} /> } /> ); +} + +const rootElement = document.getElementById('root'); +if (rootElement) { + const root = ReactDOM.createRoot(rootElement); + root.render(); } \ No newline at end of file diff --git a/assets/components/AlumniCommunaute.jsx b/assets/components/AlumniCommunaute.jsx new file mode 100644 index 0000000..8f9a8b5 --- /dev/null +++ b/assets/components/AlumniCommunaute.jsx @@ -0,0 +1,55 @@ +import React from 'react'; +import alumniImg from '../img/alumni-meeting.png'; // Place l'image exportée de Figma dans assets/img/ +import '../styles/alumniCommunaute.css'; + +const COLONNE_GAUCHE = [ + 'Développez votre réseau.', + 'Partagez votre expérience.', + 'Contribuez à des projets.' +]; + +const COLONNE_DROITE = [ + 'Participez à des communautés de pratique.', + 'Découvrez de nouvelles opportunités.', + 'Créez de nouvelles opportunités.' +]; + +export default function AlumniCommunaute() { + return ( +
+
+ + {/* 1. Grande photo arrondie */} +
+ Membres de la communauté gaea21 en réunion de travail +
+ + {/* 2. Bloc textuel sous l'image */} +
+

+ La fin d’une trajectoire ne marque pas la fin de l’aventure. +

+ +
+
    + {COLONNE_GAUCHE.map((item, index) => ( +
  • {item}
    • + ))} +
+ +
    + {COLONNE_DROITE.map((item, index) => ( +
  • {item}
    • + ))} +
+
+
+ +
+
+ ); +} \ No newline at end of file diff --git a/assets/components/ConstruireTrajectoire.jsx b/assets/components/ConstruireTrajectoire.jsx index b3a7113..12b5bd3 100644 --- a/assets/components/ConstruireTrajectoire.jsx +++ b/assets/components/ConstruireTrajectoire.jsx @@ -1,11 +1,15 @@ import React from 'react'; -import heroTrajectoireImg from '../img/img-traject-banner.jpg'; +import heroTrajectoireImg from '../img/img-traject-banner.png'; import HuitTrajectoires from './HuitTrajectoires'; import HumanEmploymentModel from './HumanEmploymentModel'; import MethodologieEtapes from './MethodologieEtapes'; import LearningByDoing from './LearningByDoing'; -import ExemplesProjets from './ExemplesProjets'; import '../styles/trajectoire.css'; +import ExemplesProjets from './ExemplesProjets'; +import CompetencesEvoluer from './CompetencesEvoluer'; +import TrajectoireJamaisFigee from './TrajectoireJamaisFigee'; +import AlumniCommunaute from './AlumniCommunaute'; +import Footer from './Footer'; export default function ConstruireTrajectoire() { return ( @@ -59,18 +63,23 @@ export default function ConstruireTrajectoire() { {/* 3. Les 8 Trajectoires */} - {/* 4. Approche Human Employment Model */} - {/* 5. Méthodologie en 6 Étapes */} - {/* 6. Learning by Doing */} - {/* 7. Exemples de projets */} + {/* 8. Des compétences pour évoluer */} + + {/* 9. Une trajectoire n'est jamais figée */} + + {/* 10. Communauté & fin de parcours */} + + + {/* 11. Footer global du site */} +