templates/front/_partials/pricing.html.twig line 1

  1. <section class="section bg-light" id="pricing">
  2.   <div class="container">
  3.     <div class="row justify-content-center">
  4.       <div class="col-12">
  5.         <div class="section-title text-center mb-4 pb-2">
  6.           {% if app.request.locale == 'fr' %}
  7.           <h4 class="title mb-4">Des tarifs transparents, sans engagement</h4>
  8.           <p class="text-muted para-desc mx-auto mb-0">
  9.             Choisissez votre plan avantageux qui correspond à la taille et aux
  10.             besoins de votre entreprise, aucun engagement à long terme requis.
  11.           </p>
  12.           {% endif %} {% if app.request.locale == 'ar_DZ' %}
  13.           <h4 class="title mb-4">أسعار شفافة، دون التزام</h4>
  14.           <p class="text-muted para-desc mx-auto mb-0">
  15.             اختر خطتك المفيدة التي تتوافق مع حجم واحتياجات عملك، دون التزام طويل
  16.             الأمد المصطلح المطلوب
  17.           </p>
  18.           {% endif %}
  19.         </div>
  20.       </div>
  21.     </div>
  23.     <div class="row align-items-center">
  24.       <div class="col-lg-3 col-md-6 col-12 mt-4 pt-2">
  25.         <div class="pricing text-center rounded overflow-hidden shadow">
  26.           <div class="price-header bg-dark pt-5 pb-5">
  27.             <h5 class="price-title text-white">
  28.               {{ products[0].name }}
  29.             </h5>
  30.             <p class="mb-0 text-white-50">
  31.               {{ products[0].description }}
  32.             </p>
  33.           </div>
  34.           <div
  35.             class="d-flex justify-content-center bg-light border-bottom py-4"
  36.           >
  37.             <span class="price h4 mb-0 ms-1"> Gratuit </span>
  38.           </div>
  39.           <div class="pricing-features text-start">
  40.             <ul class="feature list-unstyled py-4 p-3 mb-0">
  41.               {% for item in products[0].details[app.request.locale]|default('')
  42.               %}
  43.               <p class="mb-3 font-size-15">
  44.                 {% if item.checked %}
  45.                 <i
  46.                   class="mdi mdi-check-circle text-success font-size-18 me-2"
  47.                 ></i>
  48.                 {% else %}
  49.                 <i
  50.                   class="mdi mdi-check-circle text-warning font-size-18 me-2"
  51.                 ></i>
  52.                 {% endif %}
  53.                 {{ item.text }}
  54.               </p>
  55.               {% endfor %}
  56.             </ul>
  57.             <div class="border-top text-center py-4">
  58.               <a href="{{ path('app_register') }}" class="btn btn-dark">
  59.                 {% trans %} S'inscrire maintenant{% endtrans %}
  60.               </a>
  61.             </div>
  62.           </div>
  63.         </div>
  64.       </div>
  66.       <div class="col-lg-3 col-md-6 col-12 mt-4 pt-2">
  67.         <div class="pricing text-center rounded overflow-hidden shadow">
  68.           <div class="price-header bg-dark pt-5 pb-5">
  69.             <h5 class="price-title text-white">
  70.               {{ products[1].name }}
  71.             </h5>
  72.             <p class="mb-0 text-white-50">
  73.               {{ products[1].description }}
  74.             </p>
  75.           </div>
  76.           <div
  77.             class="d-flex justify-content-center bg-light border-bottom py-4"
  78.           >
  79.             <span
  80.               class="h6 mb-0"
  81.               >{{ company is defined ? company.currencie : 'DZD' }}</span
  82.             >
  83.             <span class="price h4 mb-0 ms-1">
  84.               {{ products[1].price|number_format(0, '.', ' ') }}
  85.             </span>
  86.             <span class="h6 align-self-end mb-1">
  87.               / {% trans %} month {% endtrans %}
  88.             </span>
  89.           </div>
  90.           <div class="pricing-features text-start">
  91.             <ul class="feature list-unstyled py-4 p-3 mb-0">
  92.               {% for item in products[1].details[app.request.locale]|default('')
  93.               %}
  94.               <p class="mb-3 font-size-15">
  95.                 {% if item.checked %}
  96.                 <i
  97.                   class="mdi mdi-check-circle text-success font-size-18 me-2"
  98.                 ></i>
  99.                 {% else %}
  100.                 <i
  101.                   class="mdi mdi-check-circle text-warning font-size-18 me-2"
  102.                 ></i>
  103.                 {% endif %}
  104.                 {{ item.text }}
  105.               </p>
  106.               {% endfor %}
  107.             </ul>
  108.             <div class="border-top text-center py-4">
  109.               <a
  110.                 class="btn btn-dark"
  111.                 href="{{ path('app_buy_index', { product: products[1].id }) }}"
  112.                 >{% trans %}Acheter maintenant{% endtrans %}</a
  113.               >
  114.             </div>
  115.           </div>
  116.         </div>
  117.       </div>
  119.       <div class="col-lg-3 col-md-6 col-12 mt-4 pt-2">
  120.         <div
  121.           class="pricing text-center rounded overflow-hidden shadow-lg bg-light"
  122.         >
  123.           <div class="price-header bg-primary pt-5 pb-5">
  124.             <h5 class="price-title text-white">
  125.               {{ products[2].name }}
  126.             </h5>
  127.             <p class="mb-0 text-white-50">
  128.               {{ products[2].description }}
  129.             </p>
  130.           </div>
  131.           <div
  132.             class="d-flex justify-content-center bg-light border-bottom py-5"
  133.           >
  134.             <span
  135.               class="h6 mb-0"
  136.               >{{ company is defined ? company.currencie : 'DZD' }}</span
  137.             >
  138.             <span class="price h4 mb-0 ms-1">
  139.               {{ products[2].price|number_format(0, '.', ' ') }}
  140.             </span>
  141.             <span class="h6 align-self-end mb-1">
  142.               / {% trans %} month {% endtrans %}</span
  143.             >
  144.           </div>
  145.           <div class="pricing-features text-start">
  146.             <ul class="feature list-unstyled py-2 p-3 mb-0">
  147.               {% for item in products[2].details[app.request.locale]|default('')
  148.               %}
  149.               <p class="mb-3 font-size-15">
  150.                 {% if item.checked %}
  151.                 <i
  152.                   class="mdi mdi-check-circle text-success font-size-18 me-2"
  153.                 ></i>
  154.                 {% else %}
  155.                 <i
  156.                   class="mdi mdi-check-circle text-warning font-size-18 me-2"
  157.                 ></i>
  158.                 {% endif %}
  160.                 {{ item.text }}
  161.               </p>
  162.               {% endfor %}
  163.             </ul>
  164.             <div class="border-top text-center py-5">
  165.               <a
  166.                 class="btn btn-primary"
  167.                 href="{{ path('app_buy_index', { product: products[2].id }) }}"
  168.                 >{% trans %}Acheter maintenant{% endtrans %}</a
  169.               >
  170.             </div>
  171.           </div>
  172.         </div>
  173.       </div>
  175.       <div class="col-lg-3 col-md-6 col-12 mt-4 pt-2">
  176.         <div class="pricing text-center rounded overflow-hidden shadow">
  177.           <div class="price-header bg-dark pt-5 pb-5">
  178.             <h5 class="price-title text-white">
  179.               {{ products[3].name }}
  180.             </h5>
  181.             <p class="mb-0 text-white-50">
  182.               {{ products[3].description }}
  183.             </p>
  184.           </div>
  185.           <div
  186.             class="d-flex justify-content-center bg-light border-bottom py-5"
  187.           >
  188.             <span
  189.               class="h6 mb-0"
  190.               >{{ company is defined ? company.currencie : 'DZD' }}</span
  191.             >
  192.             <span class="price h4 mb-0 ms-1">
  193.               {{ products[3].price|number_format(0, '.', ' ') }}
  194.             </span>
  195.             <span class="h6 align-self-end mb-1">
  196.               / {% trans %} month {% endtrans %}</span
  197.             >
  198.           </div>
  200.           <div class="pricing-features text-start">
  201.             <ul class="feature list-unstyled py-4 p-3 mb-0">
  202.               {% for item in products[3].details[app.request.locale]|default('')
  203.               %}
  204.               <p class="mb-3 font-size-15">
  205.                 {% if item.checked %}
  206.                 <i
  207.                   class="mdi mdi-check-circle text-success font-size-18 me-2"
  208.                 ></i>
  209.                 {% else %}
  210.                 <i
  211.                   class="mdi mdi-check-circle text-warning font-size-18 me-2"
  212.                 ></i>
  213.                 {% endif %}
  215.                 {{ item.text }}
  216.               </p>
  217.               {% endfor %}
  218.             </ul>
  219.             <div class="border-top text-center py-4">
  220.               <a
  221.                 class="btn btn-dark"
  222.                 href="{{ path('app_buy_index', { product: products[3].id }) }}"
  223.                 >{% trans %}Acheter maintenant{% endtrans %}</a
  224.               >
  225.             </div>
  226.           </div>
  227.         </div>
  228.       </div>
  229.     </div>
  230.   </div>
  231. </section>