{% extends 'base.html.twig' %}

{% block title %}Steve Krack{% endblock %}


    {% block stylesheets %}

    {# Favicons #}
    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('assets/img/logo/m.png')}}">
    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('assets/img/logo/m.png')}}">
    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('assets/img/logo/m.png')}}">
    <link rel="shortcut icon" type="image/x-icon" href="{{ asset('assets/img/logo/m.png')}}">
    <link rel="manifest" href="{{ asset('assets/img/favicons/manifest.json')}}">

    {# lib #}
    <!-- <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> -->
    <link href="{{ asset('assets/lib/loaders.css/loaders.min.css')}}" rel="stylesheet">
    <!-- <link
        href="https://fonts.googleapis.com/css?family=PT+Mono%7cPT+Serif:400,400i%7cEpitet:100,300,400,700,800,900"
        rel="stylesheet"> -->
    <!-- <link href="{{ asset('assets/lib/remodal/remodal.css')}}" rel="stylesheet">
    <link href="{{ asset('assets/lib/remodal/remodal-default-theme.css')}}" rel="stylesheet"> -->
    <link href="{{ asset('assets/lib/owl.carousel/owl.carousel.css')}}" rel="stylesheet">
    <link href="{{ asset('assets/lib/lightbox2/css/lightbox.css')}}" rel="stylesheet">
    <link href="{{ asset('assets/lib/semantic-ui-accordion/accordion.min.css')}}" rel="stylesheet">
    <link href="{{ asset('assets/lib/semantic-ui-transition/transition.min.css')}}" rel="stylesheet">




    {# CSS Global #}
    <link href="{{ asset('assets/css/theme.css') }}" rel="stylesheet" type="text/css" media="all" />

    {% endblock %}

{% block header %}

{% include 'App/headerSide.html.twig' %}

{% endblock %}

{% block body %}

{% include 'App/subHeader.html.twig' %}


<div class="tab-content">

  <div class="tab-pane fade" id="projects" role="tabpanel" aria-labelledby="projects">
    <div class="content-list" data-filter-list="content-list-body">
      <div class="row content-list-head">
        <div class="card-list-head d-flex justify-content-between mb-3" style="width:100%">
          <div class="d-flex align-items-center ">
            <form class="col-md-auto">
              <div class="input-group input-group-round">
                <div class="input-group-prepend" style='height:35px!important;'>
                  <span class="input-group-text" style="height:35px">
                    <i class="fas fa-search"></i>
                  </span>
                </div>
                <input type="search" class="form-control filter-list-input" placeholder="Filtre"
                  aria-label="Filter notes" style='height:35px!important;
    border: none;;'>
              </div>
            </form>

          </div>
          <div class="d-flex align-items-center">
            <a class='text-secondary wiggle' id="project_form" alt='Invite Graduates' data-toggle="modal"
              data-target="#project_form_modal" title="Create project" href=''>

              <i class="fal fa-plus-square h3 text-warning"></i>

            </a>
          </div>
        </div>
      </div>
      <div class="content-list-body row">

        {% for project in projects %}
        <div class="col-md-6 pt-3" data-toggle="tooltip" title="{{ project.label | capitalize }}">

          {# Item #}
          <a href="{{ path('projectEdit', { id: project.getId() }) }}" class="card border-0 mb-3 mb-md-0"
            style='box-shadow: 0 0 2rem 0 rgba(0,0,0,.05);'>
            <div class="card card-team">
              {# Image #}
              <div class="card-body overflow-hidden">
                <div class="dropdown card-options">
                  <img data-src="{{ asset('assets/img/projects/' ~ project.photo1) }}" class="img-dashboard lazy " />
                </div>
                <div class="card-title" data-filter-by="text">
                  <h4 class="font-weight-bold" data-filter-by="text">{{ project.label | title }}</h4>
                  <h6 data-filter-by="text">
                    {% if project.description|length > 70 %}
                    {% set introduction = project.description|slice(0, 70) %}
                    {% set introduction  = introduction ~ '...' %}
                    {% else %}
                    {% set introduction  = project.description %}
                    {% endif %}
                    {{ introduction | capitalize }}</h6>
                </div>
              </div>
            </div>

          </a> {# / .card #}

        </div>
        {% endfor %}
        <div class="modal fade" id="project_form_modal" tabindex="-1" role="dialog"
          aria-labelledby="project_form_modal">
          <div class="modal-dialog">
            <div class="modal-content bg-white">
              <div class="modal-header">
                <h3>Créer un projet</h3>

                <i class="fas fa-times" data-dismiss="modal"></i>
              </div>
              <div class="modal-body bg-light">
                <div class="form-group mb-0">
                  {{ form_start(projectForm)}}
                  <div class="row justify-content-center align-items-center">


                    <div class="col-md-6">

                      {{ form_row(projectForm.label)}}

                    </div>
                    <div class="col-md-6">

                      {{ form_row(projectForm.location)}}

                    </div>

                  </div>
                  <div class="row justify-content-center align-items-center">

                     <div class="col-md-6">

                      {{ form_row(projectForm.intro)}}

                    </div>
                    <div class="col-md-6">

                      {{ form_row(projectForm.url)}}

                    </div>


                  </div>

                  <div class="row justify-content-center align-items-center">


                    <div class="col-12">

                      {{ form_row(projectForm.description)}}

                    </div>


                  </div>



                  <div class="row justify-content-center align-items-center pt-4">


                    <div class="col-md-6">
                      <h3>Photos</h3>

                      {{ form_row(projectForm.photo1)}}

                    </div>

                    <div class="col-md-6">

                      {{ form_row(projectForm.photo2)}}

                    </div>

                  </div>
                  <div class="row justify-content-center align-items-center pt-4">


                    <div class="col-md-6">

                      {{ form_row(projectForm.photo3)}}

                    </div>
                    <div class="col-md-6">

                      {{ form_row(projectForm.photo4)}}

                    </div>

                  </div>
                  <div class="row justify-content-left align-items-center pt-4">


                    <div class="col-md-6">

                      {{ form_row(projectForm.photo5)}}

                    </div>
                    {# <div class="col-md-6">

                      {{ form_row(projectForm.photo6)}}

                    </div> #}

                  </div>

                  <div class="row justify-content-center align-items-center">


                    <div class='col-12 pt-3' id='addedPictures_list'>

                      {{ form_row(projectForm.addedPictures) }}


                    </div>

                  </div>

                </div>
                <div class="modal-footer bg-white">

                  <div class="row justify-content-left no-gutters">

                    <div class="col">


                      {{ form_row(projectForm.submit)}}
                      {{ form_end(projectForm)}}
                    </div>
                  </div>
                </div>

              </div>
            </div>
          </div>

        </div>
      </div>


    </div>
  </div>
  <div class="tab-pane fade active show" id="sales" role="tabpanel" aria-labelledby="sales">
  <div class="content-list" data-filter-list="content-list-body">
    <div class="row content-list-head">
      <div class="card-list-head d-flex justify-content-between mb-3" style="width:100%">
        <div class="d-flex align-items-center ">
          <form class="col-md-auto">
            <div class="input-group input-group-round">
              <div class="input-group-prepend" style='height:35px!important;'>
                <span class="input-group-text" style="height:35px">
                  <i class="fas fa-search"></i>
                </span>
              </div>
              <input type="search" class="form-control filter-list-input" placeholder="Filtre"
                aria-label="Filter notes" style='height:35px!important;
  border: none;;'>
            </div>
          </form>

        </div>
        <div class="d-flex align-items-center">
          <a class='text-secondary wiggle' id="sale_form" alt='Invite Graduates' data-toggle="modal"
            data-target="#sale_form_modal" title="Create sale" href=''>

            <i class="fal fa-plus-square h3 text-warning"></i>rrr

          </a>
        </div>
      </div>
    </div>
    <div class="content-list-body row">

      {% for sale in sales %}
      <div class="col-md-6 pt-3" data-toggle="tooltip" title="{{ sale.label | capitalize }}">

        {# Item #}
        <a href="{{ path('saleEdit', { id: sale.getId() }) }}" class="card border-0 mb-3 mb-md-0"
          style='box-shadow: 0 0 2rem 0 rgba(0,0,0,.05);'>
          <div class="card card-team">
            {# Image #}
            <div class="card-body overflow-hidden">
              <div class="dropdown card-options">
                <img data-src="{{ asset('assets/img/sales/' ~ sale.photo1) }}" class="img-dashboard lazy " />
              </div>
              <div class="card-title" data-filter-by="text">
                <h4 class="font-weight-bold" data-filter-by="text">{{ sale.label | title }}</h4>
                <h6 data-filter-by="text">
                  {% if sale.description|length > 70 %}
                  {% set introduction = sale.description|slice(0, 70) %}
                  {% set introduction  = introduction ~ '...' %}
                  {% else %}
                  {% set introduction  = sale.description %}
                  {% endif %}
                  {{ introduction | capitalize }}</h6>
              </div>
            </div>
          </div>

        </a> {# / .card #}

      </div>
      {% endfor %}
      <div class="modal fade" id="sale_form_modal" tabindex="-1" role="dialog"
        aria-labelledby="sale_form_modal">
        <div class="modal-dialog">
          <div class="modal-content bg-white">
            <div class="modal-header">
              <h3>Créer une propriété</h3>

              <i class="fas fa-times" data-dismiss="modal"></i>
            </div>
            <div class="modal-body bg-light">
              <div class="form-group mb-0">
                {{ form_start(saleForm)}}
                <div class="row justify-content-center align-items-center">


                  <div class="col-md-6">

                    {{ form_row(saleForm.label)}}

                  </div>
                  <div class="col-md-6">

                    {{ form_row(saleForm.url)}}

                  </div>

                </div>
                 <div class="row justify-content-center align-items-center">


                  <div class="col-md-6">

                    {{ form_row(saleForm.saleOrder)}}

                  </div>

                </div>

                <div class="row justify-content-center align-items-center">


                  <div class="col-12">

                    {{ form_row(saleForm.description)}}

                  </div>


                </div>



                <div class="row justify-content-center align-items-center pt-4">


                  <div class="col-md-6">
                    <h3>Photos</h3>

                    {{ form_row(saleForm.photo1)}}

                  </div>

                  <div class="col-md-6">

                    {{ form_row(saleForm.photo2)}}

                  </div>

                </div>
                <div class="row justify-content-center align-items-center pt-4">


                  <div class="col-md-6">

                    {{ form_row(saleForm.photo3)}}

                  </div>
                  <div class="col-md-6">

                    {{ form_row(saleForm.photo4)}}

                  </div>

                </div>
                <div class="row justify-content-left align-items-center pt-4">


                  <div class="col-md-6">

                    {{ form_row(saleForm.photo5)}}

                  </div>
                  {# <div class="col-md-6">

                    {{ form_row(saleForm.photo6)}}

                  </div> #}

                </div>

                <div class="row justify-content-center align-items-center">


                  <div class='col-12 pt-3' id='addedPictures_list'>

                    {{ form_row(saleForm.addedPictures) }}


                  </div>

                </div>

              </div>
              <div class="modal-footer bg-white">

                <div class="row justify-content-left no-gutters">

                  <div class="col">


                    {{ form_row(saleForm.submit)}}
                    {{ form_end(saleForm)}}
                  </div>
                </div>
              </div>

            </div>
          </div>
        </div>

      </div>
    </div>


  </div>
</div>
  {# <div class="tab-pane fade" id="about" role="tabpanel" aria-labelledby="about">
    <div class="content-list">
      {{ form_start(aboutEditForm)}}
      <div class="content-list-body row justify-content-center">

        
          <div class="col-md-6 pb-3">
            {{ form_row(aboutEditForm.picture)}}
            <img class="mt-3 lazy" data-src="{{ asset('assets/img/agency/' ~ about.picture ) }}" style="height:85px">
          </div>
           <div class="col-md-6 pb-3">
            {{ form_row(aboutEditForm.photo1)}}
            <img class="mt-3 lazy" data-src="{{ asset('assets/img/agency/' ~ about.photo1 ) }}" style="height:85px">
          </div>
          <div class="col-md-6 pb-3">
            {{ form_row(aboutEditForm.photo2)}}
            <img class="mt-3 lazy" data-src="{{ asset('assets/img/agency/' ~ about.photo2 ) }}" style="height:85px">
          </div>
          <div class="col-md-6 pb-3">
            {{ form_row(aboutEditForm.photo3)}}
            <img class="mt-3 lazy" data-src="{{ asset('assets/img/agency/' ~ about.photo3 ) }}" style="height:85px">
          </div>
          <div class="col-12">
          {{ form_row(aboutEditForm.paragraphe1)}}
          {{ form_row(aboutEditForm.paragraphe2)}}
          {{ form_row(aboutEditForm.paragraphe3)}}
          {{ form_row(aboutEditForm.paragraphe4)}}
          {{ form_row(aboutEditForm.paragraphe5)}}
          {{ form_row(aboutEditForm.paragraphe6)}}


          <div class="row justify-content-left no-gutters">
            {{ form_row(aboutEditForm.submit)}}
          </div>

        </div>

        {{ form_end(aboutEditForm)}}

        

      </div>




    </div>
  </div> #}

  {% endblock %}
  {% block footer %}
  {% endblock %}

      {% block javascripts %}



    {# Jquery #}
    <script src="https://code.jquery.com/jquery-3.4.1.js"
        integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU=" crossorigin="anonymous"></script>

    <script src="https://code.jquery.com/jquery-3.5.1.min.js"
        integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>



    <script src="https://kit.fontawesome.com/528623a9de.js" crossorigin="anonymous"></script>


    <script src="{{ asset('assets/js/popper.min.js')}}"></script>
    <script src="{{ asset('assets/js/bootstrap.js')}}"></script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD14GRtbNv-6U9nSRZcDZTAnLgCP57Il5w"
        type="text/javascript"></script>

    {# JS Lib #}
    <script src="{{ asset('assets/lib/loaders.css/loaders.css.js')}}"></script>
    <script src="{{ asset('assets/lib/remodal/remodal.js')}}"></script>
    <script src="{{ asset('assets/lib/owl.carousel/owl.carousel.js')}}"></script>
    <script src="{{ asset('assets/lib/lightbox2/js/lightbox.js')}}"></script>
    <script src="{{ asset('assets/lib/isotope-layout/isotope.pkgd.min.js')}}"></script>
    <script src="{{ asset('assets/lib/isotope-packery/packery-mode.pkgd.min.js')}}"></script>

    {# JS Plugins #}
    <script src="{{ asset('assets/js/list.min.js') }}"></script>
    <script src="{{ asset('assets/js/autosize.min.js') }}"></script>


    <script src="{{ asset('assets/js/stickyfill.min.js')}}"></script>
    <script src="{{ asset('assets/js/rellax.min.js')}}"></script>
    <script src="{{ asset('assets/js/progressbar.min.js')}}"></script>
    <script src="{{ asset('assets/js/imagesloaded.pkgd.js')}}"></script>
    <script src="{{ asset('assets/js/CustomEase.js')}}"></script>
    <script src="{{ asset('assets/js/DrawSVGPlugin.js')}}"></script>
    <script src="{{ asset('assets/js/fontawesome-all.js')}}"></script>
    <script src="{{ asset('assets/js/ScrollToPlugin.js')}}"></script>
    <script src="{{ asset('assets/js/TweenMax.js')}}"></script>
    <script src="{{ asset('assets/js/jquery.lazy.min.js')}}"></script>
    <script src="{{ asset('assets/js/jquery.lazy.plugins.js')}}"></script>

    <script src="{{ asset('assets/js/map.js')}}"></script>
    {# <script src="{{ asset('assets/js/map.min.js')}}"></script> #}
    <script src="{{ asset('assets/lib/semantic-ui-accordion/accordion.min.js')}}"></script>
    <script src="{{ asset('assets/lib/semantic-ui-transition/transition.min.js')}}"></script>


    {# JS global #}
    <script src="{{ asset('assets/js/theme.js')}}" async></script>





    {# <script>
        document.getElementById("client_form_logo").required = false;
    </script> #}

    <script src="{{ asset('assets/js/a2lix_sf_collection.min.js') }}"></script>

    <script type="text/javascript">
        a2lix_lib.sfCollection.init({
            collectionsSelector: 'form div[data-prototype]',
            manageRemoveEntry: true
        })
    </script>


    {% endblock %}