edit: ajout des panneaux donations et tickets

v1-com-officielle/src/infoComponents/InfoMenu.vue

@@ -42,6 +42,8 @@
           si tu as envie de participer !
           </p>
         <button type="button" class="textBtnStyle" @click="openPannel('follow')">NOUS SUIVRE HORS DES RÉSEAUX!</button>
+        <button type="button" class="textBtnStyle" @click="openPannel('donation')">NOUS FAIRE UNE DONATION</button>
+        <button type="button" class="textBtnStyle" id="ticketButton" @click="openPannel('ticket')">RÉSERVER MA PLACE!</button>
       </div>
       <div id="btnColumn">
         <button type="button" class="iconBtnStyle" id="btnArtist" @click="openPannel('artist')" data-tooltip="à propos de nous">
@@ -110,6 +112,18 @@
       @focus="focusPannel('link')"
       :class="{zBase: isFocused!=='link', zFocus: isFocused==='link'}">
     </LinkPan>
+    <DonationPan
+      v-show="isActive.includes('donation')"
+      @close="closePannel('donation')"
+      @focus="focusPannel('donation')"
+      :class="{zBase: isFocused!=='donation', zFocus: isFocused==='donation'}">
+    </DonationPan>
+    <TicketPan
+      v-show="isActive.includes('ticket')"
+      @close="closePannel('ticket')"
+      @focus="focusPannel('ticket')"
+      :class="{zBase: isFocused!=='ticket', zFocus: isFocused==='ticket'}">
+    </TicketPan>
 </template>
 
 <style scoped>
@@ -194,6 +208,23 @@
   #welcomeTextContainer .textBtnStyle{
     height:44.4px;
     width: 70%;
+    margin-bottom: 7.77px;
+  }
+
+  #ticketButton.textBtnStyle{
+    position: absolute;
+    top: -80px;
+    left: 64%;
+    animation: float 1.61s infinite;
+    color: var(--main-color);
+    background-color: var(--accent-color);
+    width: 50%;
+  }
+  #ticketButton.textBtnStyle:hover{
+    background-color: var(--main-color);
+    animation: none;
+    border-color: var(--accent-color);
+    color: var(--accent-color);
   }
 
   /*================ MID FORMAT*/
@@ -225,6 +256,12 @@
       font-size: 22.2px;
     }
 
+    #ticketButton.textBtnStyle{
+      top: unset;
+      bottom: -85%;
+      left: -300px;
+    }
+
   }
 </style>