site_logiciels/components/Home/Help.vue

<template>
  <v-container>
    <div class="container">
      <v-row>

        <v-col cols="8">
          <v-img class="help-img" src="/images/help/Help.png"></v-img>
        </v-col>

        <v-col cols="4">
          <h4 class="subtitle-team">Notre équipe est à vos côtés pour vous guider</h4>

          <p class="need-help">
            Besoin d’aide ? Vous souhaitez en savoir plus sur nos solutions ou
            vous avez besoin d'assistance sur l'utilisation de l'un de nos
            logiciels ?
          </p>

          <v-row>
            <ul class="details">
              <li class="detail-item">Ouvert du lundi au vendredi de 8h15 à 17h45</li>
              <li class="detail-item">Support joignable par mail</li>
              <li class="detail-item">De nombreux articles tutoriels accessibles 24h/24</li>
            </ul>
          </v-row>

          <v-row class="row-faq">
            <v-btn class="button-faq">
            consulter la FAQ
          </v-btn>
          </v-row>


        </v-col>
        
      </v-row>
    </div>
  </v-container>
</template>

<style scoped>

.button-faq{
  width: 195px;
height: 53px;

/* Vert 60 */
background: #64AFB7;
border-radius: 6px;
color: white;
padding: 19px 28px;
gap: 9px;
font-family: 'Barlow';

}


.row-faq {
  margin-top: 170px;
}

.details {

  margin-top: 50px;
  width: 399px;
  height: 58px;
left: 973px;
font-family: 'Barlow';
font-style: normal;
font-weight: 300;
font-size: 16px;
line-height: 20px;
color: #0E2D32;
}

.detail-item {
  margin-left: 28px;
  margin-bottom: 15px;
  width: 286px;
left: 933px;
font-family: 'Barlow';
font-style: normal;
font-weight: 300;
font-size: 16px;
line-height: 20px;
color: #0E2D32;
}



.need-help {
  width: 399px;
  height: 58px;
left: 933px;
top: 7323px;
font-family: 'Barlow';
font-style: normal;
font-weight: 300;
font-size: 16px;
line-height: 20px;
color: #0E2D32;
}
  

.help-img {
  width: 722px;
height: 506px;
left: 121px;
border-radius: 20px;
}

.subtitle-team{
  height: 138px;
left: 933px;
top: 7221px;

/* H4 Headline */
font-family: 'Barlow';
font-style: normal;
font-weight: 400;
font-size: 30px;
line-height: 34px;
width: 300px;
}

.container {
  margin-bottom: 100px;
  width: 100%;
}

</style>