{% extends 'base.html.twig' %}
{% block title %}Restons en contact | Formation & Partenariats - Qwantic{% endblock %}
{% block meta %}
<meta name="description"
content="Besoin d’infos sur nos formations diplômantes, courtes ou un partenariat ? Contactez Qwantic à Marseille via formulaire, mail ou téléphone."/>
{% endblock %}
{% block schemaOrg %}
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "Accueil",
"item": "{{ url('home') }}"
},
{
"@type": "ListItem",
"position": 2,
"name": "Contact",
"item": "{{ url('contact') }}"
}
]
}
</script>
{% endblock schemaOrg %}
{% block custom_javascripts %}
{{ encore_entry_script_tags('contact') }}
{% endblock %}
{% block body %}
<section class="questions relative">
<img class="absolute h-3/4 right-0 bottom-0 z-20" src="{{ asset('build/images/svg/w_white.svg') }}"
alt="w white">
<div class="flex md:px-28 lg:px-40 2xl:px-60 3xl:px-80 flex-col gap-8 p-vertical w-full bg-[#F5F5F5] relative">
<h1 data-aos="fade-right" data-aos-delay="0"
class="font-allerBold uppercase text-center lg:text-left text-2xl md:px-0 px-10"><span class="text-pink-500">Envie d'échanger</span>
avec nous ?</h1>
<div data-aos="fade-up" data-aos-delay="0" class="flex flex-col lg:flex-row w-full relative z-30">
<div class="lg:hidden w-full h-40 md:h-60 bg-cover bg-center bg-no-repeat rounded-t-lg lg:rounded-l-lg"
style="background-image: url({{ asset('build/images/contact-img.jpg') }})"></div>
<div class="hidden lg:block w-1/3 bg-cover bg-center bg-no-repeat rounded-t-lg lg:rounded-l-lg"
style="background-image: url({{ asset('build/images/contact-img.jpg') }})"></div>
<div class="w-full lg:w-2/3 bg-blue-500 rounded-b-lg lg:rounded-r-lg px-10 py-10 lg:py-16 flex flex-col gap-6 lg:gap-8">
<h3 class="font-allerBold text-2xl text-white text-left">Et si on discutait ensemble !</h3>
<p class="font-allerRegular text-white text-base">Vous souhaitez en savoir plus sur nos formations ou vous avez une question ?
<br> Remplissez le formulaire ci-dessous, notre équipe est à votre écoute.</p>
{{ form_start(form, { 'attr' : {
'class' : 'lg:p-8 lg:bg-[#D8D8D8] lg:bg-opacity-40 rounded-lg flex flex-col gap-6 relative',
'id' : 'contact_form'
}}) }}
<div class="flex flex-col">
<div class="flex flex-col lg:flex-row lg:gap-2">
<div class="w-full">
{{ form_label(form.lastname , null , {'label_attr' : {
'class' : 'hidden'
}}) }}
{{ form_widget(form.lastname , {'attr' : {
'class' : 'font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic mb-2'
}}) }}
</div>
<div class="w-full">
{{ form_label(form.firstname , null , {'label_attr' : {
'class' : 'hidden'
}}) }}
{{ form_widget(form.firstname , {'attr' : {
'class' : 'font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic mb-2'
}}) }}
</div>
</div>
<div class="error">
{{ form_errors(form.lastname) }}
{{ form_errors(form.firstname) }}
</div>
<div class="flex flex-col lg:flex-row lg:gap-2">
<div class="w-full lg:w-1/2">
{{ form_label(form.email , null , {'label_attr' : {
'class' : 'hidden'
}}) }}
{{ form_widget(form.email , {'attr' : {
'class' : 'font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic mb-2'
}}) }}
{{ form_label(form.email_pro , null , {'label_attr' : {
'class' : 'hidden'
}}) }}
{{ form_widget(form.email_pro , {'attr' : {
'class' : ' hidden font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic mb-2'
}}) }}
</div>
<div class="w-full lg:w-1/2">
{{ form_label(form.phone , null , {'label_attr' : {
'class' : 'hidden'
}}) }}
{{ form_widget(form.phone , {'attr' : {
'class' : 'font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic mb-2'
}}) }}
</div>
</div>
<div class="error">
{{ form_errors(form.email) }}
{{ form_errors(form.phone) }}
</div>
{{ form_label(form.subject , null , {'label_attr' : {
'class' : 'hidden'
}}) }}
{{ form_widget(form.subject , {'attr' : {
'class' : 'font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic mb-2'
}}) }}
{{ form_label(form.message , null , {'label_attr' : {
'class' : 'hidden'
}}) }}
{{ form_widget(form.message , {'attr' : {
'class' : 'font-allerRegular w-full px-5 py-3 rounded-lg text-sm text-grey-300 italic mb-2'
}}) }}
</div>
<div>
{{ form_widget(form.isOptin) }}
{{ form_label(form.isOptin , null , {'label_attr' : {
'class' : 'font-allerLight italic text-white text-right text-sm'
}}) }}
<div class="text-pink-500 font-allerLight">
{{ form_errors(form.isOptin) }}
</div>
</div>
{% for message in app.flashes('success') %}
<div class="alert alert-success text-pink-400 font-allerLight bg-white p-2 rounded">
{{ message }}
</div>
{% endfor %}
<!-- SMALL BLUE CTA -->
<div class="flex justify-center items-center w-full relative z-30">
{{ form_widget(form.save , {
'attr' : {
'class' : 'cta big-cta cta-white-blue !text-base w-full lg:w-fit'
}
}) }}
</div>
<p class="font-allerLight italic text-right text-white text-sm">(*) Informations obligatoires</p>
{{ form_end(form) }}
</div>
</div>
<a class="relative z-30 text-pink-400 font-allerLight underline italic pl-10 md:pl-0" href="tel:0491798536"> Tel : 04 91 79 85 36</a>
</div>
</section>
{{ component('address') }}
{{ component('sections:cross_section' , {
route1 : 'qui_sommes_nous',
title1 : 'Qui sommes-nous ?',
route2 : 'nos_formations_diplomantes',
title2 : 'Nos formations diplomantes',
route3 : 'dispositifs',
title3 : 'Nos solutions sur-mesure',
}) }}
{% endblock %}