correction banner et bouton eventagenda.vue

components/Home/EventAgenda.vue

@@ -10,11 +10,11 @@
     <v-row>
       <v-col cols="12" class="btn-container">
         <v-col col="6">
-          <v-btn class="btn-event">Découvrir les évènements </v-btn>
+          <v-btn class="btn-event">Découvrir les évènements <v-icon class="fa-solid fa-arrow-right icon-arrow"></v-icon> </v-btn>
         </v-col>
 
         <v-col col="6">
-          <v-btn class="btn-event">Découvrir l’ANNUAIRE </v-btn>
+          <v-btn class="btn-event">Découvrir l’ANNUAIRE <v-icon class="fa-solid fa-arrow-right icon-arrow"></v-icon> </v-btn>
         </v-col>
       </v-col>
     </v-row>
@@ -48,6 +48,11 @@
 </template>
 
 <style scoped>
+
+.icon-arrow {
+  font-size: 1rem;
+  margin-left: 1rem;
+}
 .btn-container {
   display: flex;
   align-items: center;
@@ -62,22 +67,24 @@
   margin-left: 7vw;
   gap: 9px;
   font-weight: 700;
-  font-size: 10px;
+  font-size: .9rem;
   line-height: 15px;
-  width: 15rem;
+  width: 18rem;
   height: 3rem;
-  margin-top: 2rem;
+  margin-top: 3rem;
+  padding-top: 2rem;
+  padding-bottom: 2rem;
 }
 
 .title {
   font-family: "Barlow";
   font-style: normal;
-  height: 114px;
+  height: 9rem;
   font-weight: 400;
-  font-size: 2rem;
-  line-height: 38px;
+  font-size: 3rem;
+  line-height: 3rem;
   text-align: center;
-  margin-bottom: 2rem;
+  margin-bottom: 3rem;
   margin-top: 4rem;
   color: #ffffff;
   width: 30rem;