templates/configurateur/designs.html.twig line 1

  1. <div class="design-block form-group design-container">
  2.     <a class="form-title row" role="button" data-bs-toggle="collapse" href="#design-block" aria-expanded="false" aria-controls="collapseDesign">
  3.         <div class="col-12 configurator-section-heading" data-target=".design-block">
  4.             {{ 'design'|trans({}, 'configurateur')|raw }}
  5.             <span class="fa-container"></span>
  6.         </div>
  7.     </a>
  8.     <div class="form-content row collapse" id="design-block">
  9.         <div class="col-12 ">
  10.             <div class="row">
  11.                 <div class="col-0 col-sm-3 p-0 d-flex justify-content-end">
  12.                     <div class="btn-group-horizontal design-selection" role="group" id="design-selection" style="width:80%">
  13.                         <button type="button" value="connecteur" class="btn btn-default btn-image-select mb-1 w-100 fw-bold actif">{{ 'connecteur'|trans({}, 'configurateur')|raw }}</button>
  14.                         <button type="button" value="presse" class="btn btn-default btn-image-select mb-1 w-100 fw-bold">{{ 'presse'|trans({}, 'configurateur')|raw }}</button>
  15.                         <button type="button" value="jonction" class="btn btn-default btn-image-select mb-1 w-100 fw-bold">{{ 'jonction'|trans({}, 'configurateur')|raw }}</button>
  16.                     </div>
  17.                 </div>
  18.                 <div class="col-6 col-sm-4 p-0" style="min-height:130px;">
  19.                     <p class="design-title mb-0">{{ 'cable'|trans({}, 'configurateur')|raw }}:</p>
  20.                     <div class="image-select left connecteur">
  21.                         <select is="ms-dropdown" data-enable-auto-filter="false" data-child-height="300">
  22.                             <option value="CB" data-image="/ps/img/sensyconfigurators/CB.gif" selected>CB</option>
  23.                             <option value="CG" data-image="/ps/img/sensyconfigurators/CG.gif">CG</option>
  24.                             <option value="CD" data-image="/ps/img/sensyconfigurators/CD.gif">CD</option>
  25.                             <option value="CH" data-image="/ps/img/sensyconfigurators/CH.gif">CH</option>
  26.                             <option value="CA" data-image="/ps/img/sensyconfigurators/CA.gif">CA</option>
  27.                         </select>
  28.                     </div>
  30.                     <div class="image-select left presse d-none">
  31.                         <select is="ms-dropdown" data-enable-auto-filter="false">
  32.                             <option value="PG" data-image="/ps/img/sensyconfigurators/PG.gif" selected="">PG</option>
  33.                             <option value="PB" data-image="/ps/img/sensyconfigurators/PB.gif">PB</option>
  34.                             <option value="PD" data-image="/ps/img/sensyconfigurators/PD.gif">PD</option>
  35.                             <option value="PH" data-image="/ps/img/sensyconfigurators/PH.gif">PH</option>
  36.                             <option value="PA" data-image="/ps/img/sensyconfigurators/PA.gif">PA</option>
  37.                         </select>
  38.                     </div>
  40.                     <div class="image-select left jonction d-none">
  41.                         <select is="ms-dropdown" data-enable-auto-filter="false">
  42.                             <option value="BG" data-image="/ps/img/sensyconfigurators/BG.gif" selected="">BG</option>
  43.                             <option value="BB" data-image="/ps/img/sensyconfigurators/BB.gif">BB</option>
  44.                             <option value="BD" data-image="/ps/img/sensyconfigurators/BD.gif">BD</option>
  45.                             <option value="BH" data-image="/ps/img/sensyconfigurators/BH.gif">BH</option>
  46.                             <option value="BA" data-image="/ps/img/sensyconfigurators/BA.gif">BA</option>
  47.                         </select>
  48.                     </div>
  49.                 </div>
  50.                 <div class="col-6 col-sm-4 p-0" style="min-height:130px;">
  51.                     <p class="design-title mb-0 ms-0" style="margin-left:20px;">{{ 'plaquette'|trans({}, 'configurateur')|raw }}:</p>
  52.                     <div class="image-select right connecteur">
  53.                         <select is="ms-dropdown" data-enable-auto-filter="false">
  54.                             <option value="HN" data-image="/ps/img/sensyconfigurators/HN.gif" selected>HN</option>
  55.                             <option value="HC" data-image="/ps/img/sensyconfigurators/HC.gif">HC</option>
  56.                             <option value="DN" data-image="/ps/img/sensyconfigurators/DN.gif">DN</option>
  57.                             <option value="BN" data-image="/ps/img/sensyconfigurators/BN.gif">BN</option>
  58.                             <option value="H2" data-image="/ps/img/sensyconfigurators/H2.gif">H2</option>
  59.                             <option value="V2" data-image="/ps/img/sensyconfigurators/V2.gif">V2</option>
  60.                             <option value="P2" data-image="/ps/img/sensyconfigurators/P2.gif">P2</option>
  61.                         </select>
  62.                     </div>
  64.                     <div class="image-select right presse d-none">
  65.                         <select is="ms-dropdown" data-enable-auto-filter="false">
  66.                             <option value="HN" data-image="/ps/img/sensyconfigurators/HN.gif" selected>HN</option>
  67.                             <option value="HC" data-image="/ps/img/sensyconfigurators/HC.gif">HC</option>
  68.                             <option value="DN" data-image="/ps/img/sensyconfigurators/DN.gif">DN</option>
  69.                             <option value="BN" data-image="/ps/img/sensyconfigurators/BN.gif">BN</option>
  70.                         </select>
  71.                     </diV>
  73.                     <div class="image-select right jonction d-none">
  74.                         <select is="ms-dropdown" data-enable-auto-filter="false">
  75.                             <option value="HN" data-image="/ps/img/sensyconfigurators/HN.gif" selected>HN</option>
  76.                             <option value="HC" data-image="/ps/img/sensyconfigurators/HC.gif">HC</option>
  77.                             <option value="DN" data-image="/ps/img/sensyconfigurators/DN.gif">DN</option>
  78.                             <option value="BN" data-image="/ps/img/sensyconfigurators/BN.gif">BN</option>
  79.                             <option value="H2" data-image="/ps/img/sensyconfigurators/H2.gif">H2</option>
  80.                             <option value="V2" data-image="/ps/img/sensyconfigurators/V2.gif">V2</option>
  81.                             <option value="P2" data-image="/ps/img/sensyconfigurators/P2.gif">P2</option>
  82.                         </select>
  83.                     </div>
  84.                 </div>
  85.             </div>
  86.             <div class="form-group available-designs-image d-flex justify-content-center">
  87.                 <div class="available-designs-image-left">
  88.                     <img src="/ps/img/sensyconfigurators/GCB.gif" alt="{{ 'cable'|trans({}, 'configurateur')|raw }}">
  89.                 </div>
  90.                 <div class="available-designs-image-right">
  91.                     <img src="/ps/img/sensyconfigurators/GHN.gif" alt="{{ 'plaquette'|trans({}, 'configurateur')|raw }}">
  92.                 </div>
  93.             </div>
  94.         </div>
  95.         <div class="col-12">
  96.             <div class="next-button-container">
  97.                 <div class="bouton">
  98.                     <span class="flat-bouton flat-bouton-configurator float-end" data-target=".personnal-block">{{ 'suivant'|trans({}, 'configurateur')|raw }}</span>
  99.                 </div>
  100.                 <div class="clearfix"></div>
  101.             </div>
  102.         </div>
  103.         
  104.     </div>
  105. </div>