Projet.vue 2.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. <template>
  2. <LayoutContainer>
  3. <v-row>
  4. <v-col cols="4">
  5. <h5>Contactez-nous</h5>
  6. <v-img
  7. src="/images/logiciels/school/femme-casque.jpg"
  8. class="femme-casque"
  9. >
  10. </v-img>
  11. </v-col>
  12. <v-col cols="8">
  13. <h5>Vous avez un projet ?</h5>
  14. <h6>N'attendez plus, appelez-nous</h6>
  15. <p>
  16. Vous avez une identité, des besoins, des projets... On est là pour
  17. vous écouter et vous offrir une offre personnalisée ! Que vous soyez
  18. une petite ou une structure plus conséquente, notre offre s'adapte à
  19. toutes les tailles : le prix de l’abonnement au logiciel varie en
  20. fonction du nombre d'élèves, tout en conservant l'intégralité des
  21. fonctionnalités.
  22. </p>
  23. <v-btn> Nous contacter</v-btn>
  24. </v-col>
  25. </v-row>
  26. <v-row>
  27. <v-col cols="2">
  28. <v-img src="/images/logiciels/school/cmf_logo_orange.png"></v-img>
  29. </v-col>
  30. <v-col cols="10">
  31. <h5>Adhérents CMF : bénéficiez de conditions privilégiées</h5>
  32. <p>
  33. Si votre établissement d’enseignement artistique est adhérent à la
  34. Confédération Musicale de France (CMF), vous bénéficiez gratuitement,
  35. dans le cadre de votre adhésion, de la version Opentalent Artist
  36. standard et de conditions priviliégiés pour la version Opentalent
  37. School. Contactez nous direcetement ou contactez votre fédération pour
  38. obtenir vos codes d’accès.
  39. </p>
  40. </v-col>
  41. </v-row>
  42. <v-row >
  43. <v-col cols="4" class="border" >
  44. <div class="d-flex justify-center align-center ">
  45. <v-icon class="fa-brands fa-react icon"></v-icon>
  46. </div>
  47. <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
  48. </v-col>
  49. <v-col cols="4" class="border">
  50. <div class="d-flex justify-center align-center">
  51. <v-icon class="fa-brands fa-react icon"></v-icon>
  52. </div>
  53. <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
  54. </v-col>
  55. <v-col cols="4" class="border">
  56. <div class="d-flex justify-center align-center">
  57. <v-icon class="fa-brands fa-react icon"></v-icon>
  58. </div>
  59. <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
  60. </v-col>
  61. </v-row>
  62. </LayoutContainer>
  63. </template>
  64. <script setup></script>
  65. <style scoped>
  66. .border{
  67. border-top: 1px solid #000; /* Remplacez #000 par la couleur de votre choix */
  68. border-right: 1px solid #000; /* Remplacez #000 par la couleur de votre choix */
  69. }
  70. .icon{
  71. font-size: 3rem;
  72. color: #0E2D32;
  73. }
  74. .femme-casque {
  75. width: 20rem;
  76. }
  77. </style>