templates/general/homepage.html.twig line 1

Open in your IDE?
  1. {#
  2. /*
  3. * Ce fichier est la propriété de l'association (c) Projets Métiers
  4. *
  5. * (c) crée par Jean-Marc CATALA <jeanmmarccatala@gmail.com>
  6. *
  7. */
  8. #}
  10. {% extends 'basepm.html.twig' %}
  12. {% block body %}
  17. <div class=" bandeHaut jaune full"></div>
  19. {% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
  21. <div class="row" style=" margin-top: -100px;">
  22. <div class="col centrer">
  24. <a href="{{ path('app_redirect') }}" class="boutonProf">Mon espace personnel <i
  25. class=" fa fa-arrow-right"></i></a>
  27. </div>
  28. </div>
  29. <br>
  30. <br>
  31. <br>
  32. {% else %}
  34. <div class="flex-container" style="margin-top: -200px;">
  35. <div>
  36. <a href="{{ path('accueilEleve') }}"><img src="{{ asset('images/accueil/ChoixEleve.png') }}"
  37. class="rond" alt="Je suis eleve"></a>
  38. <a href="{{ path('accueilEleve') }}"><h5>Je suis un élève</h5></a>
  39. </div>
  42. <div>
  43. <a href="{{ path('app_register',{type:'adulte'}) }}"><img src="{{ asset('images/accueil/JeunesAdultes.png') }}"
  44. class="rond" alt="Je suis un jeune adulte"></a>
  45. <a href="{{ path('app_register',{type:'adulte'}) }}"><h5 class="legend">Je suis un jeune adulte</h5></a>
  46. </div>
  47. <div>
  48. <a href="{{ path('accueilParent') }}"><img src="{{ asset('images/accueil/choixParent.png') }}"
  49. class="rond" alt="Je suis parent"></a>
  50. <a href="{{ path('accueilParent') }}"><h5>Je suis un parent</h5></a>
  51. </div>
  52. </div>
  53. <div class="flex-container">
  55. <div>
  56. <a href="{{ path('accueilProf') }}"><img src="{{ asset('images/accueil/Proffesseur.png') }}"
  57. class="rond" alt="Je suis professeur"></a>
  58. <a href="{{ path('accueilProf') }}"><h5 class="legend"> Je suis professeur conseiller ou
  59. accompagnateur</h5></a>
  60. </div>
  61. <div>
  62. <a href={{ path('app_register',{type:'mentor'}) }}><img src="{{ asset('images/accueil/Mentor.png') }}"
  63. class="rond" alt="Je suis un mentor"></a>
  64. <a href="{{ path('app_register',{type:'mentor'}) }}"><h5>Je suis un mentor</h5></a>
  65. </div>
  66. </div>
  67. <div class="flex-container">
  69. <div>
  70. <a href="{{ path('app_register_expert') }}"><img src="{{ asset('images/tmp/banner-2.jpg') }}"
  71. class="rond" alt="Je suis expert métier"></a>
  72. <a href="{{ path('app_register_expert') }}"><h5 class="legend"> Je suis expert métier</h5></a>
  73. </div>
  75. </div>
  80. <br>
  83. {% endif %}
  86. <div class="container-sm centrer" style="padding-bottom: 250px;">
  88. <p>
  89. Le parcours Projets Métiers est accessible aux utilisateurs des établissements ou institutions ayant
  90. signé une convention avec l’Association Projets Métiers.
  91. </p>
  92. <p>
  93. Si vous voulez réaliser un test ou avoir une présentation, merci de laisser un message avec vos
  94. coordonnées
  96. </p>
  97. <p>
  99. </p>
  100. <p>
  101. <a href="{{ path('contact') }}" class="boutonPerso centrerButton">Nous contacter</a>
  104. </p>
  106. </div>
  110. {#
  111. <div class="full">
  112. <div class="container-fluid zIndex3 padGD">
  114. <div class="row zIndex3">
  115. <div class="col-sm-2 zIndex3">
  116. <img src="{{ asset ('images/JBodin.jpg') }}"
  117. class="rounded-circle centrerImage zIndex3"
  118. alt="Joel BODIN">
  119. <h3 class=" centrer">Joël Bodin</h3>
  120. <h4 class="centrer">Président de Projets Métiers</h4>
  121. </div>
  122. <div class="col-sm-10 zIndex3 padGD" style="margin-top: -40px;">
  123. <br class="blockquote zIndex3">
  124. <p class="mb-0" style="text-align: justify;">« Bienvenue sur le site de l’association PROJETS
  125. METIERS.<br>
  126. Notre objectif est d’aider tous les jeunes à préparer leur insertion professionnelle, qu’elle
  127. soit lointaine ou proche.<br>
  128. Vous êtes collégien, lycéen ou jeune adulte en recherche d’emploi. Vous avez des enseignants,
  129. des conseillers, des parents. Ils ont leur place sur ce site.<br>
  130. Cette plateforme est un parcours pédagogique qui facilitera votre recherche entre les milliers
  131. de métiers possibles.<br>
  132. Dans un premier temps, vous ferez votre Autoportrait. Vous répondrez à des questions simples
  133. dont vous êtes le seul à avoir les réponses.<br>
  134. Ensuite vous serez guidé pour construire votre Projet professionnel. Vous direz ce qui vous
  135. intéresse et ce qui ne vous intéresse pas. Vous tracerez votre chemin de découvertes, jusqu’à
  136. votre projet. Jusqu’à votre métier.<br>
  137. N’oubliez pas de nous dire ce que vous avez trouvé, ce que vous avez appris ou les difficultés
  138. rencontrées.<br>
  139. Bon parcours. Que la réussite soit au bout de votre chemin! »<br>
  140. </p><br>
  143. <p><em>Joël Bodin</em><br>j.bodin@projetsmetiers.fr</p>
  144. </div>
  145. </div>
  146. </div>
  147. </div>
  148. #}
  156. <style>
  158. .rond {
  159. border-radius: 50%;
  160. width:250px;
  161. height :250px;
  162. opacity: 92%;
  163. }
  164. .rond:hover{
  165. box-shadow: 1px 1px 1px 1px #333333;
  166. opacity: 100%;
  167. }
  169. .legend {
  170. max-width: 400px
  171. }
  173. .blocFooterBas {
  174. padding-top: 20px;
  175. background-color: #e5c234;
  176. color: #034055;
  177. text-align: center;
  178. }
  180. .boutonPerso {
  181. padding-left: 20px;
  182. padding-right: 20px;
  183. background-color: #034055;
  184. color: #e5e9ec;
  185. text-align: center;
  186. text-decoration: none;
  187. display: inline-block;
  188. cursor: pointer;
  189. border-radius: 12px;
  190. border: 2px solid #034055;
  191. font-family: 'OdibeeSansRegular', sans-serif;
  192. font-size: 36px;
  194. }
  196. .boutonPerso:hover {
  197. background-color: #e5c234;
  198. color: #034055;
  199. border: 2px solid #e5c234;
  200. text-decoration: none;
  201. }
  203. .centrerButton {
  204. width: 90%;
  205. text-align: center;
  206. margin-left: auto;
  207. margin-right: auto;
  208. max-width: 300px;
  209. }
  210. .flex-container {
  211. display: flex;
  212. justify-content: center;
  213. }
  215. .flex-container > div {
  216. width: 20%;
  217. margin: 10px;
  218. text-align: center;
  219. line-height: 75px;
  220. font-size: 30px;
  221. }
  222. .centrer {
  223. text-align: center;}
  224. </style>
  225. {% endblock %}