Participation.vue 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  1. <template>
  2. <AnchoredSection id="inscription">
  3. <LayoutContainer class="alt-theme">
  4. <v-row>
  5. <v-col cols="12">
  6. <LayoutUISubTitle>
  7. Accessibilité
  8. </LayoutUISubTitle>
  9. </v-col>
  10. </v-row>
  11. <h3 class="title-participation text-center mb-8">
  12. Vous souhaitez participer à une formation ?
  13. </h3>
  14. <v-row class="mb-12">
  15. <v-col cols="12">
  16. <v-img
  17. src="/images/formation/participation.jpg"
  18. class="participation-img"
  19. />
  20. </v-col>
  21. </v-row>
  22. <v-row class="mb-12">
  23. <v-col cols="12">
  24. <div class="details-participations">
  25. <p class="mb-6">
  26. Nous vous répondons sous 48h (hors week-ends). Délais d'accès:
  27. Après accord, nous mettons tout en oeuvre pour vous mettre à
  28. disposition un formateur sous 1 mois."
  29. </p>
  30. <p>
  31. Nos formations peuvent être accessibles aux personnes en situation
  32. de handicap. Chaque situation étant unique, nous vous demandons de
  33. préciser à l’inscription votre handicap. Nous pourrons ainsi
  34. confirmer l’ensemble des possibilités afin de vous permettre de
  35. suivre la formation dans les meilleures conditions en accord avec
  36. votre employeur. Pour toutes informations complémentaires, nous
  37. vous conseillons les structures suivantes : ONISEP, AGEFIPH et
  38. FIPHFP. Pour le bon déroulement de la formation, il est nécessaire
  39. de disposer d’un espace de travail calme et équipé d’au moins un
  40. ordinateur, connecté à internet, et dont le navigateur (Mozilla
  41. Firefox, Google Chrome, ou Apple Safari) est à jour. Nous
  42. recommandons d’utiliser un ordinateur par personne. Les
  43. participants devront également avoir des ordinateurs équipés de
  44. micros et de haut-parleurs, préférablement des micro-casques pour
  45. un meilleur confort d’écoute.
  46. </p>
  47. </div>
  48. </v-col>
  49. </v-row>
  50. </LayoutContainer>
  51. </AnchoredSection>
  52. </template>
  53. <style scoped lang="scss">
  54. .v-row {
  55. width: 90%;
  56. margin-left: auto;
  57. margin-right: auto;
  58. }
  59. @media (min-width: 1200px) {
  60. .v-row {
  61. min-width: 100%;
  62. }
  63. }
  64. h3 {
  65. font-family: "Barlow", serif;
  66. font-style: normal;
  67. font-weight: 600;
  68. font-size: 42px;
  69. line-height: 42px;
  70. text-align: center;
  71. color: #ffffff;
  72. }
  73. .details-participations {
  74. display: flex;
  75. flex-direction: column;
  76. text-align: justify;
  77. font-weight: 300;
  78. font-size: 16px;
  79. line-height: 20px;
  80. margin-top: 1rem;
  81. display: flex;
  82. width: 800px;
  83. margin: auto;
  84. color: #ffffff;
  85. }
  86. .participation-img {
  87. position: relative;
  88. background-image: url("/images/formation/participation.jpg");
  89. width: 700px;
  90. height: 550px;
  91. background-position: center;
  92. background-size: cover;
  93. border-radius: 10%;
  94. display: flex;
  95. justify-content: center;
  96. align-items: center;
  97. margin-left: auto;
  98. margin-right: auto;
  99. }
  100. .icon-title {
  101. font-size: 1rem;
  102. margin-right: 1rem;
  103. }
  104. .container-title {
  105. display: flex;
  106. justify-content: center;
  107. align-items: center;
  108. margin-bottom: 2rem;
  109. }
  110. .container {
  111. background-color: #0e2d32;
  112. color: #ffffff;
  113. }
  114. </style>
  115. <script setup lang="ts">
  116. import AnchoredSection from "~/components/Layout/AnchoredSection.vue";
  117. </script>