templates/front/layout/registration.html.twig line 1

Open in your IDE?
  1. {% extends 'front/base.html.twig' %}
  2. {% block seo %}
  3.     {% include 'front/partials/seo.html.twig' %}
  4.     {% include 'front/partials/social.html.twig' %}
  5. {% endblock seo %}
  6. {% block stylesheet %}{{ parent() }}{% endblock stylesheet %}
  7. {% block layout %}
  8.     <div class="fluid-grid lg:pt-13">
  9.         {% include 'front/partials/breadcrumb.html.twig' with {theme: 'dark' } %}
  11.         <div class="row mt-8 pb-10 md:pb-20">
  12.             <div class="col-12 lg-col-8 lg-col-offset-2 relative">
  13.                 <a href="{{ page_url('login','front') }}" class="button-back icon-center">
  14.                     <svg width="18" height="18">
  15.                         <use href="#icon-arrow-left" xlink:href="#icon-arrow-left"/>
  16.                     </svg>
  17.                     <span class="sr-only">Retour</span>
  18.                 </a>
  20.                 <h1 class="title--M font-semibold mb-6 md:mb-8 text-violet-dark">Demande de création de compte</h1>
  22.                 <form id="contact-form" action="" class="form" js-form-validation="{isCustomSubmit: true}" js-form="{type: 'register', url: '/registration', success: 'Votre demande de création de compte a bien été transmise.'}">
  23.                     <div class="form__row has-placeholder with-placeholder" js-form-validation-field-wrapper>
  24.                         <label class="form__label" for="division">Ma fédération <sup>*</sup></label>
  25.                         <select js-form-validation-field required js-custom-select="{hasPlaceholder: true}" name="front_user[division]" id="division">
  26.                             <option value="">Fédération de rattachement</option>
  27.                             <option>Association Française des Distributeurs de Papiers et d’Emballages (AFDPE)</option>
  28.                             <option>Association nationale des Expéditeurs et Exportateurs en Fruits et Légumes (ANEEFEL)</option>
  29.                             <option>Chambre Syndicale de la Répartition Pharmaceutique (CSRP)</option>
  30.                             <option>Chambre Syndicale du Commerce de Gros et du Commerce International d’Alsace Lorraine</option>
  31.                             <option>Chambre Syndicale Nationale des Fabricants et Distributeurs d’Armes, Munitions, Équipements et Accessoires pour la Chasse et le Tir Sportif (SNAFAM)</option>
  32.                             <option>COMIDENT (produits et matériaux dentaires)</option>
  33.                             <option>Confédération des Grossistes de France (CGF)</option>
  34.                             <option>DISTRIPRO (Boissons)</option>
  35.                             <option>Fédération de la Distribution Automobile (FEDA)</option>
  36.                             <option>Fédération des Distributeurs d’Équipements et Solutions électriques, Génie Climatique et Sanitaires (COEDIS)</option>
  37.                             <option>Fédération des Entreprises Industrielles et Commerciales Internationales de la Mécanique et de l’Électronique (FICIME)</option>
  38.                             <option>Fédération des Grossistes en Fleurs Coupées et Plantes en Pots (FGFP)</option>
  39.                             <option>Fédération des Marchés de Gros de France (FMGF)</option>
  40.                             <option>Fédération Française de la Quincaillerie, des Fournitures pour l’Industrie, le Bâtiment et l’Habitat (FFQ)</option>
  41.                             <option>Fédération Française des Professionnels de la Communication par l’Objet (2FPCO)</option>
  42.                             <option>Fédération Française des Syndicats de Courtiers en Marchandises (FFSCM)</option>
  43.                             <option>Fédération nationale de la Décoration (FND)</option>
  44.                             <option>Fédération nationale de Vente et Services Automatiques (NAVSA)</option>
  45.                             <option>Fédération nationale des négociants en pomme de terre, ail, oignon, échalote et légumes en gros (FEDEPOM)</option>
  46.                             <option>Fédération nationale des Syndicats de Commerce en Gros en Produits Avicoles (FENSCOPA)</option>
  47.                             <option>Fédération nationale du Tissu (FENNTISS)</option>
  48.                             <option>Les Grossistes Alimentaires de France</option>
  49.                             <option>Syndicat des entreprises françaises des viandes (CULTURE VIANDE)</option>
  50.                             <option>Syndicat national des Dépositaires de Presse (SNDP)</option>
  51.                             <option>Syndicat national des Grossistes en Fournitures Générales pour Bureaux de Tabac (SNGFGBT)</option>
  52.                             <option>Syndicat de l’Importation et du Commerce de la Réunion (SICR)</option>
  53.                             <option>Union des Distributeurs Non alimentaires Professionnels (UDINAP)</option>
  54.                             <option>Union Générale des Syndicats de Grossistes du MIN de Rungis (UNIGROS)</option>
  55.                             <option>Union nationale de Commerce de Gros de Fruits et Légumes (UNCGFL)</option>
  56.                             <option>Union Professionnelle de la Carte Postale (UPCP)</option>
  57.                             <option>Union Professionnelle des Grossistes en Confiserie et Alimentation Fine (UPGCAF)</option>
  58.                         </select>
  59.                     </div>
  60.                     <div class="form__row" js-form-validation-field-wrapper>
  61.                         <label class="form__label" for="firstName">Prénom <sup>*</sup></label>
  62.                         <input class="text-input" id="firstName" name="front_user[firstName]" placeholder="Votre prénom" type="text" required js-form-validation-field />
  63.                     </div>
  64.                     <div class="form__row" js-form-validation-field-wrapper>
  65.                         <label class="form__label" for="lastName">Nom <sup>*</sup></label>
  66.                         <input class="text-input" id="lastName" name="front_user[lastName]" placeholder="Votre nom" type="text" required js-form-validation-field />
  67.                     </div>
  68.                     <div class="form__row" js-form-validation-field-wrapper>
  69.                         <label class="form__label" for="job">Fonction <sup>*</sup></label>
  70.                         <input class="text-input" id="job" name="front_user[job]" placeholder="Votre fonction" type="text" required js-form-validation-field />
  71.                     </div>
  72.                     <div class="form__row" js-form-validation-field-wrapper>
  73.                         <label class="form__label" for="email">Adresse mail <sup>*</sup></label>
  74.                         <input class="text-input" id="email" name="front_user[email]" placeholder="L’adresse mail de votre entreprise" type="email" js-form-validation-email data-validation-type="email" required js-form-validation-field />
  75.                     </div>
  76.                     <div class="form__row" js-form-validation-field-wrapper>
  77.                         <label class="form__label" for="emailConfirm">Confirmer votre adresse mail <sup>*</sup></label>
  78.                         <input class="text-input" id="emailConfirm" name="emailConfirm" placeholder="L’adresse mail de votre entreprise" type="email" data-validation-type="emailConfirm" required js-form-validation-field />
  79.                     </div>
  81.                     <fieldset class="mt-10">
  82.                         <legend class="form__subtitle">Création de votre mot de passe</legend>
  84.                         <div class="md:flex justify-between">
  85.                             <div js-toggle-password js-form-validation-field-wrapper class="form__row form__row--half relative">
  86.                                 <label class="form__label" for="password">Mot de passe<sup>*</sup></label>
  87.                                 <input js-toggle-password-input class="text-input text-input--icon" required data-validation-type="password" js-form-validation-password js-form-validation-field placeholder="Votre mot de passe" type="password" id="password" name="front_user[plainPassword]"/>
  89.                                 {% include 'front/partials/form/toggle-password.html.twig' %}
  90.                             </div>
  92.                             <div js-toggle-password js-form-validation-field-wrapper class="form__row form__row--half relative mb-5">
  93.                                 <label class="form__label" for="passwordConfirm">Confirmer votre mot de passe<sup>*</sup></label>
  94.                                 <input js-toggle-password-input class="text-input text-input--icon" required data-validation-type="passwordConfirm" js-form-validation-field placeholder="Confirmer votre mot de passe" type="password" id="passwordConfirm" name="passwordConfirm"/>
  96.                                 {% include 'front/partials/form/toggle-password.html.twig' %}
  97.                             </div>
  98.                         </div>
  99.                         <p class="form__help mb-4">Doit contenir au moins 8 caractères dont 1 majuscule et 1 chiffre</p>
  100.                     </fieldset>
  102.                     <input js-form-validation-field type="hidden" name="front_user[token]"
  103.                            value="{{ csrf_token('front_user_form') }}"/>
  105.                     <p class="form__mandatory md:text-right mb-8 md:mb-0"><sup>*</sup>champs obligatoires</p>
  106.                     
  107.                     <button class="button button--rounded button--orange">
  108.                         <span class="font-weight-bold">S'inscrire</span>
  109.                     </button>
  110.                     
  111.                     <button class="button button--arrow button--rounded form__submit-secondary" js-form-reset type="button">
  112.                         <span class="font-weight-bold">Réinitialiser les informations</span>
  113.                         <svg width="12" height="12" class="picto icon ml-2 flex-shrink-0">
  114.                             <use href="#icon-arrow" xlink:href="#icon-arrow"></use>
  115.                         </svg>
  116.                     </button>
  117.                 </form>
  118.             </div>
  119.         </div>
  120.     </div>
  121. {% endblock layout %}
  123. {% block javascript %}{{ parent() }}{% endblock javascript %}