Merge branch '34-mettre-a-jour-les-temoignages' into 'main'

Resolve "mettre à jour les témoignages"

Closes #34

See merge request !32

src/components/FormationButton.js

@@ -2,6 +2,6 @@ import React from 'react';
 
 export default function Button({href}) {
   return (
-    <a className='button button--primary' rel="noreferrer" target='_blank' href={href}> Je veux en savoir plus ! </a>
+    <a className='button large button--primary' rel="noreferrer" target='_blank' href={href}> Je veux en savoir plus ! </a>
   );
 }

src/components/JoinButton.js

@@ -3,7 +3,7 @@ import Link from "@docusaurus/Link";
 
 const Button = () => (
   <div className="button-frame">
-    <Link className="button button--primary" to="#join"> Je rejoins les Compagnons du DevOps </Link>
+    <Link className="button large button--primary" to="#join"> Je rejoins les Compagnons du DevOps </Link>
   </div>
 )
 

src/components/TestimonyCard/index.js

 import React from 'react';
+import { useState } from 'react';
 import styles from './styles.module.css'
 import useBaseUrl from "@docusaurus/useBaseUrl";
 
 export default function HomepageList(props) {
+  const [showMore, setShowMore] = useState(false);
+  const maxLength = 350
+
   return (
     <div className={styles.wholeCard +" avatar avatar--vertical"}>
       <a href={props.url} className={styles.avatarSegment + " text--center margin-bottom--md"} target="_blank" rel="noreferrer"> 
@@ -17,8 +21,14 @@ export default function HomepageList(props) {
       <div className="avatar__intro card padding--md padding-top--xl">
         <h3 className="avatar__name"> {props.title} </h3>
         <p className="avatar__subtitle" style={{ whiteSpace: 'pre-wrap' }}>
-          {props.text}
+          {props.text.length > maxLength ? 
+          showMore ? props.text : `${props.text.substring(0, maxLength)}...`
+          : 
+          props.text
+          }
         </p>
+        {props.text.length > maxLength && <button className="button button--sm button--primary" onClick={() => setShowMore(!showMore)}>{showMore ? "Voir moins" : "Voir plus" }</button>}
+
       </div>
     </div>
   ) 

src/css/custom.css

@@ -29,12 +29,15 @@ strong, b {
   font-family: var(--ifm-font-family-bold);
 }
 
-.button--primary {
+.large {
   font-size: large;
+  padding: 10px 30px;
+}
+
+.button--primary {
   background-color: var(--ifm-button-primary-color);
   color: var(--text-contrast);
   margin: auto;
-  padding: 10px 30px;
   cursor: pointer;
   border: 0;
   outline: 0;

static/testimoniesList.json

 [
+  {
+    "name" : "Maxime Pawlak",
+    "url" : "https://www.linkedin.com/in/maxime-pawlak-/",
+    "title" : "Expérimenté, pragmatique et surtout passionné.",
+    "text" : "Christophe nous a accompagné lors d’un changement majeur de nos outils. Durant plusieurs mois, son mentorat nous a permis d’aborder les bons sujets de manière plus sereine. \nSon expérience nous a aidés en continu à prendre du recul et nous diriger vers des outils adaptés à notre contexte. Cela nous a fait gagner un temps précieux car nous avons écarté les solutions trop complexes pour nous. \nExpérimenté, pragmatique et surtout passionné.",
+    "img" : "maximep.jpeg"
+  },
+  {
+    "name": "Thibault R.",
+    "url": "https://www.linkedin.com/in/thibault-rihet/",
+    "title": "Nous avons fait le pari de recruter un profil junior prometteur et de le combiner avec un mentorat de Christophe",
+    "text" : "Afin de supporter la croissance d'Enogrid, nous avons ouvert un recrutement sur un rôle DevOps. Face à la difficulté de trouver des personnes expérimentées et disponibles, nous avons fait le pari de recruter un profil junior prometteur et de le combiner avec un mentorat de Christophe (formule sprint). \nNos objectifs avec ce mentorat étaient d'apporter une perspective externe sur nos pratiques et des compétences que nous n'avions pas en interne. Ceci afin de nous permettre d'évoluer opérationnellement et de former notre ingénieure DevOps fraîchement recrutée. \nPari réussi car notre nouvelle collègue a tissé un lien de confiance avec Christophe. Ce qui lui permet de partager librement ses problématiques afin d'évoluer individuellement et d'ensuite faire bénéficier Enogrid de son évolution. \nPour bénéficier au maximum du mentorat, cela implique une implication de la structure. Notamment prendre du temps pour partager ses problématiques afin que le·la mentoré·e se les approprie, et donner le temps nécessaire pour appliquer les points discutés lors des sessions de mentorat. Si vous avez des problématiques DevOps et que vous êtes prêt·e·s à vous engager sur ce point, cela vaut probablement le coup d'essayer le mentorat pour vous ou vos collègues DevOps.",
+    "img" : "thibaultr.jpeg"
+  },
+
   {
     "name": "Nicolas B.",
     "url" : "https://www.linkedin.com/in/kaizendo/",