edit: ajout images & correction bug typo et responsive

v0-appel-projet/src/App.vue

@@ -8,6 +8,7 @@
     <GrainOverlay name="grain" class="overlay"/>
     <workshopPannel v-show="workshopActive" @close="workshopToggle" :class="{alonePannel: workshopIsAlone}"></workshopPannel>
     <aboutPannel v-show="aboutActive" @close="aboutToggle"></aboutPannel>
+    <imagePannel></imagePannel>
     <div id="titleContainer">
       <div id="windowContainer">
         <div id="imgContainer">
@@ -103,7 +104,7 @@
     border-radius: 16.1px;
     border-color: var(--dark-color);
     border-width: thin;
-    margin-bottom: 3.33%;
+    margin-bottom: 5%;
   }
 
   #imgContainer{
@@ -192,6 +193,7 @@
     margin-left: 16.1px;
     margin-right: 16.1px;
     align-self: flex-start;
+    z-index: 34;
   }
 
   #descTextTop{
@@ -213,6 +215,7 @@
     flex-direction: row;
     align-items: center;
     justify-content: center;
+    z-index: 33;
   }
 
   .btnStyle{
@@ -242,6 +245,10 @@
     animation: float 1s infinite;
   }
 
+  #joinUs:hover{
+    animation: none;
+  }
+
   /*============Format tel*/
   @media(max-width:999px){
     #windowContainer{
@@ -281,7 +288,7 @@
     }
 
     #windowContainer{
-      margin-top: 5vh;
+      margin-top: 16.1vh;
       margin-left: 10%;
       width: 80%;
       height: 80%;