templates/comptabilities/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2. {% block title %}
  3.     Logiciel de gestion comptable pour les structures sportives avec {{ website_name }}
  4. {% endblock %}
  5. {% block stylesheets %}
  6.     <script src="/js/auxiliary/dotlottie-player.js" async></script>  
  7.     <link rel="stylesheet" href="{{ asset('/css/pages/comptabilities.css') }}" />
  8. {% endblock %}
  9. {% block body %}
  10.     <div class="slider">
  11.         <div class="usefull-width item-slider">
  12.             <div>
  13.                 <H1 class="item-header-h">
  14.                     Améliorez<br/>
  15.                     <span class="color">votre comptabilité</span>
  16.                 </H1>
  17.                 <div class="item-inscription hidden-xs">
  18.                     <div class="title">
  19.                         Commencez votre essai gratuitement
  20.                     </div>
  21.                     <form class="header-form" action="{{ path('signup') }}" method="POST">
  22.                         <input name="email" class="form-control" placeholder="Tapez votre e-mail..." required="required"/>
  23.                         <input name="typeLd" type="hidden" value="{{ website_name ~ ' :: comptabilities-form' }}" />
  24.                         <button class="button_theme">
  25.                             Commencer
  26.                         </button>
  27.                     </form>
  28.                     <div class="item-sentence">
  29.                         <b>Pas besoin</b> de <b>carte bancaire</b> lors de l’inscription, aucuns frais cachés.
  30.                     </div>
  31.                 </div>
  32.             </div>
  33.             <div class="item-wrapped hidden-xs">
  34.                 <div class="launch-vids">
  35.                     <img src="{{ asset('/images/pages/comptabilities/sport-adhesion-header-preview.svg') }}" />
  36.                 </div>
  37.             </div>
  38.         </div>
  39.     </div>
  40.     
  41.     <div class="item-call-mob">
  42.         Commencez votre essai gratuitement
  43.     </div>
  44.     <div class="item-vid curve">
  45.         <a href="{{ path('signup') }}" class="button_theme">
  46.             Créer mon compte
  47.         </a>
  48.         <img src="{{ asset('/images/pages/comptabilities/sport-adhesion-header-preview.svg') }}" height="200" width="auto"/>
  49.     </div>
  50.     <div class="usefull-width">
  51.         <div class="row-fluid">
  52.             <H2 class="marginT-mob-40">
  53.                 Les bons outils pour vous faire gagner du temps
  54.             </H2>
  55.         </div>
  56.         <section>
  57.             <div class="item-content unl-padding-mob item-bg-brown">
  58.                 <div class="item-column unl-padding-f-mob align-right">
  59.                     <div class="cell-widget paddingT-mob-40 bg-FFF0C8 svg-flex-end">
  60.                         <dotlottie-player
  61.                             autoplay
  62.                             loop
  63.                             mode="normal"
  64.                             background="transparent"
  65.                             src="/lottieFiles/comptabilities/sa-bills.lottie"
  66.                             style="width: clamp(300px,100%, 444px);">
  67.                         </dotlottie-player>
  68.                     </div>
  69.                 </div>
  70.                 <div class="item-column init-mob">
  71.                     <H3 class="item-cast item-brown">
  72.                         2 minutes pour facturer
  73.                     </H3>
  74.                     <div class="text-widget hidden-xs">
  75.                         <i class="fas fa-check fa-md"></i> &nbsp;Modifiez le design de vos factures aux couleurs de votre structure.
  76.                         <br/>
  77.                         <i class="fas fa-check fa-md"></i> &nbsp;Editez les factures de vos clients en quelques cliques.
  78.                         <br/>
  79.                         <i class="fas fa-check fa-md"></i> &nbsp;Ajoutez les lignes de facturation et remises.
  80.                         <br/>
  81.                         <i class="fas fa-check fa-md"></i> &nbsp;Envoyez votre facture manuellement ou automatiquement à vos clients.
  82.                     </div>
  83.                 </div>
  84.             </div>
  85.             <div class="text-widget visible-xs">
  86.                 <i class="fas fa-check fa-md"></i> &nbsp;Modifiez le design de vos factures aux couleurs de votre structure.
  87.                 <br/>
  88.                 <i class="fas fa-check fa-md"></i> &nbsp;Editez les factures de vos clients en quelques cliques.
  89.                 <br/>
  90.                 <i class="fas fa-check fa-md"></i> &nbsp;Ajoutez les lignes de facturation et remises.
  91.                 <br/>
  92.                 <i class="fas fa-check fa-md"></i> &nbsp;Envoyez votre facture manuellement ou automatiquement à vos clients.
  93.             </div>
  94.             <a href="{{ path('signup') }}" class="button_theme btnlg with-auto-margin visible-xs">
  95.                 Essayez gratuitement
  96.             </a>
  97.             <div class="item-content item-bg-brown">
  98.                 <div class="item-column">
  99.                     <H3 class="item-cast item-brown">
  100.                         Gestion des notes de frais
  101.                     </H3>
  102.                     <div class="text-widget hidden-xs">
  103.                         Créez les notes de frais de vos collaborateurs en quelques cliques, sélectionnez la T.V.A à appliquer et liez vos reçus à votre note de frais.
  104.                         <br/><br/>
  105.                         Suivez vos postes de dépenses globales et par collaborateurs.
  106.                         <br/><br/>
  107.                         Grâce au temps gagné, votre expert comptable peut enfin se consacrer à vous conseiller au mieux.
  108.                     </div>
  109.                 </div>
  110.                 <div class="item-column">
  111.                     <div class="cell-widget d-flex bg-FFF0C8 paddingT-mob-40" style="justify-content: center;">
  112.                         <dotlottie-player
  113.                             autoplay
  114.                             loop
  115.                             mode="normal"
  116.                             background="transparent"
  117.                             src="/lottieFiles/comptabilities/sa-expense-report.lottie"
  118.                             style="width: clamp(300px,100%, 444px);">
  119.                         </dotlottie-player>
  120.                     </div>
  121.                 </div>
  122.             </div>
  123.             <div class="text-widget visible-xs">
  124.                 Créez les notes de frais de vos collaborateurs en quelques cliques, sélectionnez la T.V.A à appliquer et liez vos reçus à votre note de frais.
  125.                 <br/><br/>
  126.                 Suivez vos postes de dépenses globales et par collaborateurs.
  127.                 <br/><br/>
  128.                 Grâce au temps gagné, votre expert comptable peut enfin se consacrer à vous conseiller au mieux.
  129.             </div>
  130.             <div class="item-content item-bg-brown">
  131.                 <div class="item-column unl-padding-f-mob align-right">
  132.                     <div class="cell-widget bg-FFF0C8 paddingT-mob-30">
  133.                         <img src="{{ asset('/images/pages/comptabilities/sport-adhesion-screen-follow-unpayment-customer.svg') }}" class="item-img-screen" />
  134.                     </div>
  135.                 </div>
  136.                 <div class="item-column init-mob">
  137.                     <H3 class="item-cast item-brown">
  138.                         Suivez le paiement de vos clients
  139.                     </H3>
  140.                     <div class="text-widget hidden-xs">
  141.                         Restez à jour grâce à votre interface "échéances et règlements". En un clin d'oeil, visualisez les transactions de vos clients et leurs statuts.
  142.                         <br/><br/>
  143.                         Recherchez et filtrez les différents paiments réalisés par vos clients !
  144.                         <br/><br/>
  145.                         Pour ne pas perdre de vue vos objectifs et controler votre business, nous avons intégré une interface de suivi de chiffre d'affaire.
  146.                     </div>
  147.                 </div>
  148.             </div>
  149.             <div class="text-widget visible-xs">
  150.                 Restez à jour grâce à votre interface "échéances et règlements". En un clin d'oeil, visualisez les transactions de vos clients et leurs statuts.
  151.                 <br/><br/>
  152.                 Recherchez et filtrez les différents paiments réalisés par vos membres !
  153.                 <br/><br/>
  154.                 Pour ne pas perdre de vue vos objectifs et controler votre business, nous avons intégré une interface de suivi de chiffre d'affaire.
  155.             </div>
  156.             <a href="{{ path('signup') }}" class="button_theme btnlg with-auto-margin visible-xs">
  157.                 Créer mon compte
  158.             </a>
  159.             <div class="item-content item-bg-brown unl-padding">
  160.                 <div class="item-column">
  161.                     <H3 class="item-cast item-brown">
  162.                         Gestion des impayés
  163.                     </H3>
  164.                     <div class="text-widget hidden-xs">
  165.                         Relancez vos membres en 1 clique, grâce à notre système de relance automatisé.
  166.                         <br/><br/>
  167.                         Plus qu’un simple système vous pouvez modifier la cadence des relances. Vous êtes averti par e-mail lors d'un paiement.
  168.                     </div>
  169.                 </div>
  170.                 <div class="item-column align">
  171.                     <div class="cell-widget bg-FFF0C8 svg-flex-md-end">
  172.                         <img src="{{ asset('/images/pages/comptabilities/sport-adhesion-relance-cleint.svg') }}" class="item-img-screen fix width-90-p height-auto-f"/>
  173.                     </div>
  174.                 </div>
  175.             </div>
  176.             <div class="text-widget visible-xs">
  177.                 Relancez vos membres en 1 clique, grâce à notre système de relance automatisé.
  178.                 <br/><br/>
  179.                 Plus qu’un simple système vous pouvez modifier la cadence des relances. Vous êtes averti par e-mail lors d'un paiement.
  180.             </div>
  181.         </section>
  182.         
  183.         <section>
  184.             <div class="row-fluid">
  185.                 <H2 class="with-margin-top-60">
  186.                     Gérez vos terrains
  187.                 </H2>
  188.                 <div class="hHook">
  189.                     Gérez vos terrains avec une interface simple et ergonomique
  190.                 </div>
  191.             </div>
  192.             <div id="grounds">
  193.                 <div class="cell-widget item-lg">
  194.                     <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 with-padding-30 padding-mob-15">
  195.                         <H3 class="item-title">
  196.                             Automatisez<br/>les réservations de cours
  197.                         </H3>
  198.                         <div class="item-text hidden-xs">
  199.                             Avec votre logiciel de gestion de structure sportive, vos clients peuvent effectuer en ligne leur inscription à un cours ou faire une réservation de salle, terrain ou autres espaces correspondants à votre structure.
  200.                             <br/><br/>
  201.                             Visionnez votre planning de la semaine en un clin d’oeil. Un système de réservation souple et complet capable de s'adapter à n'importe quel type de fonctionnement.  
  202.                         </div>                           
  203.                     </div>
  204.                     <div class="item-note">
  205.                         <div class="note">
  206.                             4,6 / 5
  207.                             <br/>
  208.                             selon nos utilisateurs
  209.                         </div>
  210.                         <div class="stars">
  211.                             <img src="{{ asset('/images/icons/stars.svg') }}" height="20" />
  212.                         </div>
  213.                     </div>
  214.                     <img src="{{ asset('/images/preview/app/grounds.png') }}" alt="gestion sportive Terrain de sport" width="auto" height="370" class="right pic-grounds">
  215.                     <div class="item-iddle">
  216.                         <a href="{{ path('signup') }}" class="button_theme btnlg with-margin-top-20">
  217.                             Essayez gratuitement
  218.                         </a>
  219.                     </div>
  220.                 </div>
  221.                 <div class="item-text visible-xs">
  222.                     Avec votre logiciel de gestion de club de sport, vos clients peuvent effectuer en ligne leur inscription ou annuler une réservation.
  223.                     <br/><br/>
  224.                     Visionnez votre planning de la semaine en un clin d’oeil. Un système de réservation souple et complet capable de s'adapter à n'importe quel type de fonctionnement. 
  225.                 </div>
  226.             </div>
  227.         </section>
  228.     </div>
  229.         
  230.     <section class="row-fluid">
  231.         <div class="item-explain">
  232.             <div class="usefull-width">
  233.                 <div class="title">
  234.                     Inclus également
  235.                 </div>
  236.                 <div class="d-flex align-flex with-margin-top-60 marginT-pad-30 marginT-mob-30">
  237.                     <div class="d-flex">
  238.                         <div class="item-column">
  239.                             <div class="item-included">
  240.                                 <i class="fas fa-solid fa-check"></i> Gestion des groupes
  241.                             </div>
  242.                             <div class="item-included">
  243.                                 <i class="fas fa-solid fa-check"></i> Gestion des stages
  244.                             </div>
  245.                             <div class="item-included">
  246.                                 <i class="fas fa-solid fa-check"></i> Gestion crénneaux libres
  247.                             </div>
  248.                             <div class="item-included">
  249.                                 <i class="fas fa-solid fa-check"></i> Vacances scolaires par zone
  250.                             </div>
  251.                             <div class="item-included">
  252.                                 <i class="fas fa-solid fa-check"></i> Info Personne à mobilité réduite
  253.                             </div>
  254.                         </div>
  255.                         <div class="item-column">
  256.                             <div class="item-included">
  257.                                 <i class="fas fa-solid fa-check"></i> Equipements terrains
  258.                             </div>
  259.                             <div class="item-included">
  260.                                 <i class="fas fa-solid fa-check"></i> Gestion horaires
  261.                             </div>
  262.                             <div class="item-included">
  263.                                 <i class="fas fa-solid fa-check"></i> Visuel jour et semaine
  264.                             </div>
  265.                             <div class="item-included">
  266.                                 <i class="fas fa-solid fa-check"></i> Multi-écran
  267.                             </div>
  268.                             <div class="item-included">
  269.                                 <i class="fas fa-solid fa-check"></i> Ecran présentation salle
  270.                             </div>
  271.                         </div>
  272.                     </div>
  273.                 </div>
  274.                 <div class="d-flex align-flex with-padding-bottom-30">
  275.                     <a href="{{ path('signup') }}" class="button_blue btnLg with-auto-margin with-margin-top-30">
  276.                         Créer mon compte
  277.                     </a>
  278.                 </div>
  279.             </div>
  280.         </div>
  281.     </section>
  282.     <div class="usefull-width unl-padding">
  283.         <section class="row-fluid">
  284.             <div class="width-max with-margin-top-40" style="padding:0 7.5px;">
  285.                 <H2>
  286.                     5 Raisons de choisir Sport adhesion
  287.                 </H2>
  288.                 <div class="carroussel with-margin-top-30">
  289.                     <div class="item-crsl">
  290.                         {% if deals is not empty %}
  291.                             {% for deal in deals %}
  292.                                 <div class="crlCntH">
  293.                                     <div class="crlBoxHome blueBoxW">
  294.                                         <div class="picBoxCrl" style="background-image:url('{{ asset('images/pages/home/' ~ deal.getImage) }}');"></div>
  295.                                         <div class="width-max">
  296.                                             {{ deal.getTitleFr }}
  297.                                         </div>
  298.                                     </div>
  299.                                 </div>
  300.                             {% endfor %}
  301.                         {% endif %}
  302.                     </div>
  303.                 </div>
  304.             </div>
  305.         </section>
  306.     </div>
  307.     <div class="usefull-width">
  308.         <section>
  309.             <div class="row-fluid">
  310.                 <H2>
  311.                     Questions fréquentes
  312.                 </H2>
  313.                 <div class="hHook">
  314.                     Les questions les plus demandées
  315.                 </div>
  316.                 <div class="item-faq">
  317.                     {% set i = 1 %}
  318.                     {% set read = '' %}
  319.                     {% if faq is not empty %}
  320.                         {% set max = faq|length / 2 %}
  321.                         {% for question in faq %}
  322.                             {% if i == 1 %}
  323.                                 {% set read = read ~ '<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12 unl-padding-mob">' %}
  324.                             {% endif %}
  325.                             {% set read = read ~ '<div class="title dimQuest">
  326.                                 <i class="fas fa-question-circle fa-lg"></i>
  327.                                 &nbsp;' ~ question.getQuestionFr ~ '
  328.                                 <div class="arrow">
  329.                                     <i class="fas fa-sort-down"></i>
  330.                                 </div>
  331.                                 <div class="answer">
  332.                                     ' ~ question.getReponseFr ~ '
  333.                                 </div>
  334.                             </div>' %}
  335.                             {% if i == max %}
  336.                                 {% set read = read ~ '</div>' %}
  337.                                 {% set i = 0 %}
  338.                             {% endif %}
  339.                             {% set i = i + 1 %}
  340.                         {% endfor %}
  341.                         {% if i != 1 %}
  342.                             {% set read = read ~ '</div>' %}
  343.                         {% endif %}
  344.                     {% endif %}
  345.                     {{ read|raw }}
  346.                 </div>
  347.             </div>
  348.         </section>
  349.         <section>
  350.             <div class="row-fluid">
  351.                 <div class="item-try-it unl-margin" style="font-weight:initial;">
  352.                     Le meilleur moyen de savoir, c’est d’essayer !
  353.                 </div>
  354.                 <a href="{{ path('signup') }}" class="button_theme btnlg with-auto-margin with-margin-top-20">
  355.                     Essayez gratuitement
  356.                 </a>
  357.             </div>
  358.         </section>
  359.         <div class="row-flex">
  360.             <div class="height-100 width-max"></div>
  361.         </div>
  362.         <ol class="breadcrumb unl-margin">
  363.             <li class="breadcrumb-item"><a href="{{ path('home') }}" alt="Les fonctionnalités de {{ website_name }}">Fonctionnalités</a></li>
  364.             <li class="breadcrumb-item active" aria-current="page">Logiciel sport gestion comptabilité</li>
  365.         </ol>
  366.     </div>
  367. {% endblock %}
  368. {% block javascriptFooter %}
  369. <script>
  370.     $(document).ready(function(){
  371.         if(width >= 1024){
  372.             var crsl = (parseFloat($('.item-crsl').parent().width()) / 4);
  373.             $('.crlCntH').css({'width':crsl,'max-width':crsl});
  374.         }
  375.         initCarroussel(width, '.item-crsl', 'crlCntH');
  376.         $(window).on('resize',function() {
  377.             width = $(window).width();
  378.             if(width >= 1024){
  379.                 $('.item-crsl').cycle('destroy');
  380.                 var crsl = (parseFloat($('.item-crsl').parent().width()) / 4);
  381.                 $('.crlCntH').css({'width':crsl,'max-width':crsl});
  382.             }
  383.             initCarroussel(width, '.item-crsl', 'crlCntH');
  384.         });
  385.     });
  386. </script>
  387. {% endblock %}