templates/themesWebsite/cvs/application/cv/anonyme.html.twig line 1

Open in your IDE?
  1. {% extends 'themesWebsite/cvs/application/cv/base.html.twig' %}
  3. {% block title %}CV anonyme {{ slug }}{% endblock title %}
  5. {% block header %}{% include "/themesWebsite/cvs/application/cv/components/header_anonyme.html.twig" with {'slug':slug} %}{% endblock header %}
  7. {% block body %}
  9.     <section class="section-frame mx-xxl-11 overflow-hidden">
  10.         <div class="wrapper image-wrapper bg-image bg-cover bg-overlay bg-overlay-light-500" data-image-src="https://sylvain-dieterle.com/ups/653fe559574d1638850597.png">
  11.             <div class="container py-16 py-md-18 text-center position-relative">
  12.                 <div class="position-absolute shape yellow d-none d-lg-block w-5" style="top: 18%; left: 5%;"><img src="https://sylvain-dieterle.com/ups/653fe592ce7ec779385852.svg" class="icon-svg w-100 h-100" alt="" /></div>
  13.                 <div class="position-absolute shape leaf d-none d-lg-block w-10" style="bottom: 30%; left: 2%;"><img src="https://sylvain-dieterle.com/ups/653fe612ee0bf246496598.svg" class="icon-svg w-100 h-100" alt="" /></div>
  14.                 <div class="position-absolute shape fuchsia d-none d-lg-block w-6" style="top: 20%; right: 2%; transform: rotate(70deg);"><img src="https://sylvain-dieterle.com/ups/653fe5fd0a314582889925.svg" class="icon-svg w-100 h-100" alt="" /></div>
  15.                 <div class="position-absolute shape grape d-none d-lg-block w-6" style="bottom: 28%; right: 5%;"><img src="https://sylvain-dieterle.com/ups/653fe5d755af3087577495.svg" class="icon-svg w-100 h-100" alt="" /></div>
  17.                 <div class="row">
  18.                     <div class="col-lg-9 col-xxl-8 mx-auto">
  19.                         <h1 class="display-1 fs-70 px-md-10 px-lg-0 px-xl-8 mb-5">đź‘‹ Salut, je suis {{ candidate.titleJob|lower }}</h1>
  20.                         <p class="lead fs-24 px-md-10 px-lg-0 mx-lg-n10 mx-xl-0 mb-8">{{ candidate.descriptionCoverAnonyme }}</p>
  21.                     </div>
  22.                 </div>
  24.             </div>
  25.         </div>
  26.     </section>
  28.     <section class="wrapper bg-light" id="services">
  29.         <div class="container py-16 py-md-18">
  30.             <div class="row d-flex align-items-start gy-10 mb-18 mb-md-20">
  31.                 <div class="col-lg-5 position-lg-sticky" style="top: 8rem;">
  32.                     <h3 class="display-2 mb-5">Les services que j'ai Ă©laborĂ©s correspondent Ă  vos exigences.</h3>
  33.                     <p class="mb-7">{{ candidate.descriptionServicesAnonyme }}</p>
  34.                 </div>
  35.                 <div class="col-lg-6 ms-auto">
  36.                     {% set couleurs = ['bg-soft-fuchsia', 'bg-soft-yellow', 'bg-soft-leaf', 'bg-soft-orange', 'bg-soft-grape', 'bg-soft-aqua'] %}
  37.                     {% for s in services %}
  38.                         {% set indexCouleur = loop.index0 % couleurs|length %}
  39.                         <div class="card {{ couleurs[indexCouleur] }} mb-6">
  40.                             <div class="card-body d-flex flex-row">
  41.                                 <div>
  42.                                     <img src="https://sylvain-dieterle.com/ups/6540dfdd83e0d175633467.svg" class="icon-svg icon-svg-md text-fuchsia me-5" alt="IcĂ´ne" />
  43.                                 </div>
  44.                                 <div>
  45.                                     <h3 class="fs-21 mb-2">{{ s.title }}</h3>
  46.                                     <p class="mb-0">{{ s.description }}</p>
  47.                                 </div>
  48.                             </div>
  49.                         </div>
  50.                     {% endfor %}
  51.                 </div>
  52.             </div>
  53.         </div>
  54.     </section>
  56.     <section class="wrapper bg-light" id="projects">
  57.         <div class="container py-16 py-md-18">
  58.             <div class="row align-items-center mb-10">
  59.                 <div class="col-md-8 col-lg-9 col-xl-8 col-xxl-7">
  60.                     <h2 class="display-2 mb-0">DĂ©couvrez une sĂ©lection de mes projets les plus rĂ©cents, mettant en avant des concepts innovants.</h2>
  61.                 </div>
  62.             </div>
  63.             {% set couleurs = ['bg-soft-fuchsia', 'bg-soft-yellow', 'bg-soft-leaf', 'bg-soft-orange', 'bg-soft-grape', 'bg-soft-aqua'] %}
  64.             {% for project in projects %}
  65.                 {% set indexCouleur = loop.index0 % couleurs|length %}
  66.                 <div class="card {{ couleurs[indexCouleur] }} mb-10">
  67.                     <div class="card-body p-12 pb-0">
  68.                         <div class="row">
  69.                             <div class="col-lg-12 pb-12 align-self-center">
  70.                                 <h3 class="h1 post-title mb-3">{{ project.title }}</h3>
  71.                                 <p>{{ project.descriptionAnonyme }}</p>
  72.                             </div>
  73.                             {# <div class="col-lg-7 offset-lg-1 align-self-end">
  74.                                 <figure><img class="img-fluid mb-10" src="https://sylvain-dieterle.com/ups/65a1309f1e2ea379952735.png" alt="{{ project.title }}" /></figure>
  75.                             </div> #}
  76.                         </div>
  77.                     </div>
  78.                 </div>
  79.             {% endfor %}
  80.         </div>
  81.     </section>
  83.     <section class="wrapper bg-light">
  84.         <div class="container py-16 py-md-18">
  85.             <a id="about"></a>
  86.             <div class="row gx-md-8 gx-xl-12 gy-10 align-items-center mt-lg-18 mb-16 mb-md-18">
  87.                 <div class="col-lg-12">
  88.                     <h2 class="display-2 mb-3">Plus d'informations sur moi </h2>
  89.                     <p class="lead">{{ candidate.descriptionAnonyme|nl2br }}</p>
  90.                 </div>
  91.             </div>
  93.             <div class="row gx-md-8 gx-xl-12 gy-10">
  94.                 <div class="col-lg-5 mx-auto">
  95.                     <h2 class="display-2 mb-3">Mon parcours</h2>
  96.                     <p>{{ candidate.descriptionExperienceAnonyme|nl2br }}</p>
  97.                 </div>
  98.                 <div class="col-lg-7">
  99.                     <ul class="timeline">
  100.                         {% for q in experiences %}
  101.                             <li class="timeline-item">
  102.                                 <div class="timeline-info meta fs-14">{% if q.start is not empty %}{{ q.start|date('M Y') }}{% endif %} - {% if q.today == 1 %}aujourd'hui{% else %}{{ q.end|date('M Y') }}{% endif %}</div>
  103.                                 <div class="timeline-marker"></div>
  104.                                 <div class="timeline-content">
  105.                                     {% if q.schoolName is not empty %}
  106.                                         <h3 class="timeline-title">{% if q.title is not empty %}{{ q.title }}{% endif %} Ă  {{ q.schoolName }}</h3>
  107.                                     {% else %}
  108.                                         <h3 class="timeline-title">{% if q.enterpriseName is not empty %}{{ q.enterpriseName }}{% endif %} - {% if q.title is not empty %}{{ q.title }}{% endif %}</h3>
  109.                                     {% endif %}
  110.                                     {% if q.diploma == 1 %}<p><span style="color:red;">CertifiĂ©</span></p>{% endif %}
  111.                                     <p>{{ q.descriptionAnonyme }}</p>
  112.                                 </div>
  113.                             </li>
  114.                         {% endfor %}
  115.                     </ul>
  116.                 </div>
  118.             </div>
  119.         </div>
  120.     </section>
  122.     <section class="wrapper" id="skills">
  123.         <div class="container py-14 py-md-16">
  124.             <div class="row text-center">
  125.                 <div class="col-lg-10 col-xl-9 col-xxl-8 mx-auto position-relative">
  126.                     <h3 class="display-3 mb-11 px-lg-5 px-xl-0 px-xxl-3">Mes compĂ©tences</h3>
  127.                 </div>
  128.             </div>
  129.             <div class="row">
  130.                 <div class="col-xxl-11 mx-auto">
  131.                     <div class="row gx-md-8 gy-10 text-center">
  132.                         {% set couleurs = ['bg-soft-fuchsia', 'bg-soft-yellow', 'bg-soft-leaf', 'bg-soft-orange', 'bg-soft-grape', 'bg-soft-aqua'] %}
  133.                         {% for skill in skills %}
  134.                             {% set indexCouleur = loop.index0 % couleurs|length %}
  135.                             <div class="col-md-6 col-lg-3">
  136.                                 <div class="svg-bg svg-bg-lg {{ couleurs[indexCouleur] }} rounded-xl mb-4"> <img src="https://sylvain-dieterle.com/ups/6540dfdd83e0d175633467.svg" class="svg-inject icon-svg solid text-navy" alt="" /> </div>
  137.                                 <h4 class="fs-20">{{ skill.title|upper }}</h4>
  138.                             </div>
  139.                         {% endfor %}
  140.                     </div>
  141.                 </div>
  142.             </div>
  143.         </div>
  144.     </section>
  146.     <section class="section-frame mx-xxl-11 overflow-hidden">
  147.         <div class="wrapper image-wrapper bg-image bg-cover bg-overlay bg-overlay-light-500" data-image-src="https://sylvain-dieterle.com/ups/653fe559574d1638850597.png">
  148.             <div class="container py-16 py-md-18 text-center">
  150.                 <div class="position-absolute shape yellow d-none d-lg-block w-5" style="top: 18%; left: 5%;"><img src="https://sylvain-dieterle.com/ups/653fe592ce7ec779385852.svg" class="icon-svg w-100 h-100" alt="" /></div>
  151.                 <div class="position-absolute shape leaf d-none d-lg-block w-10" style="bottom: 30%; left: 2%;"><img src="https://sylvain-dieterle.com/ups/653fe612ee0bf246496598.svg" class="icon-svg w-100 h-100" alt="" /></div>
  152.                 <div class="position-absolute shape fuchsia d-none d-lg-block w-6" style="top: 20%; right: 2%; transform: rotate(70deg);"><img src="https://sylvain-dieterle.com/ups/653fe5fd0a314582889925.svg" class="icon-svg w-100 h-100" alt="" /></div>
  153.                 <div class="position-absolute shape grape d-none d-lg-block w-6" style="bottom: 28%; right: 5%;"><img src="https://sylvain-dieterle.com/ups/653fe5d755af3087577495.svg" class="icon-svg w-100 h-100" alt="" /></div>
  155.                 <div class="row">
  156.                     <div class="col-lg-9 col-xxl-8 mx-auto">
  157.                         <h1 class="display-1 fs-70 mx-lg-n10 mx-xl-0 mb-5">Vous pensez Ă  un projet ? Collaborons ensemble !</h1>
  158.                         <p class="lead fs-24 px-md-12 px-lg-0 mx-lg-n10 mx-xl-0 mb-8">J'apporte des solutions rapides pour faciliter la vie de mes clients. Des questions ? Contactez-moi et je vous rĂ©pondrai rapidement.</p>
  159.                         <a href="mailto:contact@mirtillo.fr" class="btn btn-lg btn-primary btn-icon btn-icon-end">Envoyer moi un message</a>
  160.                     </div>
  161.                 </div>
  162.             </div>
  163.         </div>
  164.     </section>
  166. {% endblock body %}