Création tutoriel de base (UI générale + ajout des images)

src/routes/simulation.svelte

@@ -437,12 +437,45 @@
     </div>
     <!-- Panneau de gauche pour ce que l'utilisateur modifie-->
     <div class=" lg:w-1/3 lg:order-1 bg-white shadow-md p-5">
-      <section class="bg-gray-100 overflow-auto relative">
+      <section class="bg-white overflow-auto relative">
         {#if editionMode === null}
-          <h1 class="text-3xl font-bold text-gray-600 pb-5 md:mt-16">
-            Tutoriel
+          <div
+            class="bg-white border-le-jaune border-4 shadow-md md:mt-16 rounded-md"
+          >
+            <h1 class="bg-le-jaune text-2xl font-bold text-white py-2 px-4 ">
+              Démarrer avec LexImpact
             </h1>
-          <p class="italic">Lorem ipsum.</p>
+            <h2 class="py-2 px-4 text-lg font-bold">Amender la loi</h2>
+            <p class="py-2 px-4">
+              Pour amender la loi, rendez-vous sur un des cas types à droite et
+              cliquez sur le nom d'un dispositif législatif.
+            </p>
+            <div class="m-4">
+              <img
+                src="/tutoriel-amender-la-loi.png"
+                alt="montre où cliquer pour amender un dispositif"
+              />
+            </div>
+            <p class="py-2 px-4 italic">
+              Une fenêtre s'ouvrira ici-même et vous permettra d'intervenir sur
+              les paramètres de la loi.
+            </p>
+            <h2 class="pb-2 pt-5 px-4 text-lg font-bold">Éditer un cas type</h2>
+            <p class="py-2 px-4">
+              Pour modifier un cas type, Cliquez sur le pictogramme "stylo", en
+              haut à droite du cas type choisi.
+            </p>
+            <div class="m-4">
+              <img
+                src="/tutoriel-editer-cas-type.png"
+                alt="montre où cliquer pour amender un dispositif"
+              />
+            </div>
+            <p class="py-2 px-4 italic">
+              Une fenêtre s'ouvrira ici-même et vous permettra d'intervenir sur
+              les caractéristiques du cas type.
+            </p>
+          </div>
         {:else if editionMode.mode === "test_case"}
           <div class="flex justify-end space-x-2">
             <!-- Bouton de fermeture de l'édition du cas type -->