{% extends '@AdminLTE/layout/cfgodd-layout.html.twig' %}

{% block page_title %}{% trans %}dashboard.title{% endtrans %}{% endblock %}


{% block page_content %}
<div class="container-fluid">
  <section>
    <div class="row">
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div class="align-self-center">
                <i class="fas fa-pencil-alt text-info fa-3x"></i>
              </div>
              <div class="text-end">
                <h3>{{odds}}</h3>
                <a href="{{ path('app_goals') }}"><p class="mb-0">ODD</p></a>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div class="align-self-center">
                <i class="far fa-comment-alt text-warning fa-3x"></i>
              </div>
              <div class="text-end">
                <h3>{{cibles}}</h3>
                <a href="{{ path('app_targets') }}"><p class="mb-0">Cibles</p></a>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div class="align-self-center">
                <i class="fas fa-chart-line text-success fa-3x"></i>
              </div>
              <div class="text-end">
                <h3>{{indicateurs}}</h3>
                <a href="{{ path('app_indicators') }}"><p class="mb-0">Indicateurs</p></a>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div class="align-self-center">
                <i class="fas fa-map-marker-alt text-danger fa-3x"></i>
              </div>
              <div class="text-end">
                <h3>{{indicateurscommunaux}}</h3>
                <a href="{{ path('app_indicators_renseignables') }}"><p class="mb-0">Indicateurs communaux</p></a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div class="text-end">
                <h3>{{aspirations}}</h3>
                <a href="{{ path('app_aspirations') }}"><p class="mb-0">Aspirations</p></a>
              </div>
              <div class="align-self-center">
                <i class="fas fa-rocket text-danger fa-3x"></i>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div>
                <h3 class="text-info">{{objectifs}}</h3>
                <a href="{{ path('app_objectifs') }}"><p class="mb-0">Objectifs</p></a>
              </div>
              <div class="align-self-center">
                <i class="far fa-life-ring text-info fa-3x"></i>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div>
                <h3 class="text-warning">{{domaines}}</h3>
                <a href="{{ path('app_domaines') }}"><p class="mb-0">Domaines</p></a>
              </div>
              <div class="align-self-center">
                <i class="fas fa-chart-pie text-warning fa-3x"></i>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div>
                <h3 class="text-success">{{users}}</h3>
                <a href="{{ path('app_users') }}"><p class="mb-0">Utilisateurs</p></a>
              </div>
              <div class="align-self-center">
                <i class="far fa-user text-success fa-3x"></i>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div>
                <h3 class="text-info">{{admins}}</h3>
                <p class="mb-0">Administrateurs</p>
              </div>
              <div class="align-self-center">
                <i class="fas fa-book-open text-info fa-3x"></i>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div>
                <h3 class="text-warning">{{managers}}</h3>
                <p class="mb-0">Managers</p>
              </div>
              <div class="align-self-center">
                <i class="far fa-comments text-warning fa-3x"></i>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div>
                <h3 class="text-success">{{dpp}}</h3>
                <p class="mb-0">Validateurs</p>
              </div>
              <div class="align-self-center">
                <i class="fas fa-mug-hot text-success fa-3x"></i>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-xl-3 col-sm-6 col-12 mb-4">
        <div class="card">
          <div class="card-body">
            <div class="d-flex justify-content-between px-md-1">
              <div>
                <h3 class="text-danger">{{focaux}}</h3>
                <p class="mb-0">Points focaux</p>
              </div>
              <div class="align-self-center">
                <i class="fas fa-map-signs text-danger fa-3x"></i>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
</div>
{% endblock %}

{% block stylesheets %}
    <link rel="stylesheet" href="{{ asset('assets/dashboard/css/mdb.min.css') }}">
    <link rel="stylesheet" href="{{ asset('assets/dashboard/css/style.css') }}">
{% endblock %}