{# community/password-forget-form.html.twig #}
{% extends 'base.html.twig' %}
{% block title %}<title>Mot de passe oublié</title>{% endblock %}
{% block style %}
{{ parent() }}
{% include "pages/headers/encore-entry-css-files.html.twig" with {file: 'previews_css'} %}
{% include "pages/headers/encore-entry-css-files.html.twig" with {file: 'login_css'} %}
{% endblock %}
{% block content %}
<nav class="breadcrumb dflex aic fwwrap ptb-1p25em">
<div class="diblock home-icon">{{ source('svg/home-icon.html.twig') }}</div>
<a href="{{ sulu_content_root_path() }}" class="fw400 fs14 lh20 cblue p8">Accueil</a>
<div class="diblock chevron">{{ source('svg/crevron-right.html.twig') }}</div>
<div class="fw400 fs14 lh20 diblock cblue p8">Mot de passe oublié</div>
</nav>
<div class="container dflex mb-40px password-forgot">
{% if app.request.get('send') == 'true' %}
<div class="left-container">
<div class="form-container mlr-1em cblue">
Veuillez cliquer sur le lien dans le mail qui vous a été envoyé.
</div>
</div>
{% else %}
{{ form_start(form, {'attr': {'class' : 'ptb-2p5em',novalidate: 'novalidate' }}) }}
<div class="header-cont">
<h1 class="mb-0p5em">Mot de passe oublié</h1>
<span class="lh24 mb-2em diblock">Je demande un nouveau mot de passe. Merci de renseigner votre identifiant ou votre adresse e-mail. Vous recevrez un e-mail contenant les instructions vous permettant de réinitialiser votre mot de passe.</span>
</div>
<div class="form-container mlr-1em cblue">
<ul class="header-cont">
<li class="dflex w100 jcsb fwwrap mb-20px">
<div>
{% include "blocks/error.html.twig" %}
{{ form_label(form.email_username) }}
{{ form_widget(form.email_username) }}
</div>
</li>
<li class="dflex w100 jcc">
{{ form_row(form.submit, {'attr': {'class': 'CTA center' }}) }}
</li>
<div class="frame-title dflex mb-20px">
<a href="{{ path('sulu_community.login') }}" class="corange fs16 lh24 center">
Me connecter
</a>
</div>
<span class="dblock">* informations obligatoires</span>
</ul>
</div>
{{ form_end(form) }}
{% endif %}
<div class="img-container prelative">
<img src="/resources/img/profile-registration-img/image-formulaire-2.webp" srcset="/resources/img/profile-registration-img/image-formulaire-2-300x.webp 300w, /resources/img/profile-registration-img/image-formulaire-2-600x.webp 600w, /resources/img/profile-registration-img/image-formulaire-2-1000x.webp 1000w" alt="image décorative" width="1440" height="500">
<div class="background-color-orange"></div>
</div>
</div>
{% endblock %}