Resolve "refactor: HomepageFeatures"

Closes #92 (closed)

src/components/HomepageFeaturesTab.js

@@ -11,37 +11,43 @@ const FeatureList = [
       id: 1,
       title: "Le\u00A0Lab\u00A0🧪",   
       svg: "chemistry.svg",
+      alt: "Kermitt manipule du matériel de laboratoire",
       description:"Gérer vos projets, héberger votre code et collaborer autour de Git", 
     },
     {
       id: 2,
       title: "La\u00A0CI\u00A0🔁",
-      svg: "selfie.svg", 
+      svg: "selfie.svg",
+      alt: "Kermitt prend un selfie",
       description: "Des applications qui passent tous les tests grâce aux fonctionnalités de Gitlab-CI"
     },
     {
       id: 3,
       title: "Le\u00A0Chat\u00A0💬",
-      svg: "read-smile.svg", 
+      svg: "read-smile.svg",
+      alt: "Kermitt porte des lunettes rondes et lit un livre",
       description: "Un chat intégré pour communiquer autour du code… juste à côté du code"
     },
     {
       id: 4,
       title: "Les\u00A0Pages\u00A0🔖",
-      svg: "rainbow.svg", 
+      svg: "rainbow.svg",
+      alt: "Kermitt pose devant un arc-en-ciel",
       description: "Publier vos sites, blog ou documetation, ou n'importe quel site statique sur nos GitLab pages"
     },
     {
       id: 5,
-      title: "La\u00A0communauté\u00A0🍺",
-      svg: "beer.png", 
-      description: "Une communauté Git pour solutionner vos pépins rapidement."
+      title: "Le\u00A0SSO\u00A0🔑",
+      svg: "hello.png",
+      alt: "Kermitt, sortant de sa cachette",
+      description: "Tout ça avec une authentification unique !"
     },
     {
       id: 6,
-      title: "Le\u00A0SSO\u00A0🔑",
-      svg: "hello.png", 
-      description: "Tout ça avec une authentification unique !"
+      title: "La\u00A0communauté\u00A0🍺",
+      svg: "beer.png",
+      alt: "Kermitt faisant un clin d'oeil, une chope à la main",
+      description: "Une communauté Git pour solutionner vos pépins rapidement."
     }
   ];
 
@@ -60,7 +66,7 @@ export default function HomepageFeaturesTab() {
     <Tabs className={styles.tabsTitle}>
         {FeatureList.map((em) => (
           <TabItem className={clsx("text--center")} value={em.title} label={em.title}>
-            <TextRight img={useBaseUrl("img/" + em.svg)}>
+            <TextRight img={useBaseUrl("img/" + em.svg)} alt={em.alt}>
               <div className={styles.textDisplay}>
                 <p> {em.description} </p>
               </div>