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

{% block title %}
  {{ parent() }}
  {{"homepage"|trans}}
{% endblock %}

{% block body %}

<h1 class="display-1">{{"baseLSTshs"|trans}}</h1>
<h1 class="display-4">{{"lexiqueScientifiqueTrans"|trans}}</h1>


<button type="button" class="btn btn-secondary btn-block mt-4 mb-4 p-2" data-toggle="modal" data-target="#search-modal">
  <i class="fas fa-search"></i> {{"rechercherMotsExpressions"|trans}}
</button>

<div class="row row-cols-2">
  <div class="col mb-4">
    <div class="card mt-3 h-100">
      <div class="row no-gutters">
        <div class="col-4 text-center">
          <img style="margin:10% 0 10% 0;width:80%;" src="{{asset('img/write.svg')}}"/>
        </div>
        <div class="col-8">
          <div class="card-body">
            <h5 class="card-title"> 
              <a href="{{path('lemma_all')}}" class="card-link">{{"lst_words"|trans|upper}}</a>
            </h5>
            <p class="card-text">{{"index_entries"|trans}}</p>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="col mb-4">
    <div class="card mt-3 h-100" >
      <div class="row no-gutters">
        <div class="col-4 text-center">
          <img style="margin:10% 0 10% 0;width:80%;" src="{{asset('img/talk.svg')}}"/>
        </div>
        <div class="col-8">
          <div class="card-body">
            <h5 class="card-title">
               <a href="{{path('expressions_all')}}" class="card-link">{{"expressions"|trans|upper}}</a>
            </h5>
            <p class="card-text">{{"index_expressions"|trans}}</p>
            <a href="{{path('expressions_routines')}}" class="card-link ml-4">- {{"voirPTypiques"|trans}}</a>
            <br/>
            <a href="{{path('expressions_collocations')}}" class="card-link ml-4">- {{"voirCLexicales"|trans}}</a>
            <br/>
            <a href="{{path('expressions_polylexicals')}}" class="card-link ml-4">- {{"voirLocutions"|trans}}</a>
            <br/>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="col mb-4">
    <div class="card mt-3 h-100" >
      <div class="row no-gutters">
        <div class="col-4 text-center">
          <img style="margin:10% 0 10% 0;width:80%;" src="{{asset('img/brain.svg')}}"/>
        </div>
        <div class="col-8">
          <div class="card-body">
            <h5 class="card-title">
              <a href="{{path('fonctions')}}" class="card-link">{{"fonctions"|trans|upper}}</a>
            </h5>
            <p class="card-text">{{"index_fonctions"|trans}}</p>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="col mb-4">
    <div class="card mt-3 h-100" >
      <div class="row no-gutters">
        <div class="col-4 text-center">
          <img style="margin:10% 0 10% 0;width:80%;" src="{{asset('img/translation.svg')}}"/>
        </div>
        <div class="col-8">
          <div class="card-body">
            <h5 class="card-title">{{"translations"|trans|upper}}</h5>
            <p class="card-text">{{"index_translations"|trans}}</p>
            {% for language in getLanguages() %}
            <a href="{{path('trad_language', {shortName: language.shortName})}}" class="card-link">{{language.name|trans}}</a>
            {% endfor %}
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="row row-cols-3 mt-4">

  <div class="col mb-4">
    <div class="card mt-3 h-100" >
      <div class="row no-gutters">
        <div class="col-4 text-center">
          <img style="margin:10% 0 10% 0;width:80%;" src="{{asset('img/network.svg')}}"/>
        </div>
        <div class="col-8">
          <div class="card-body">
            <h5 class="card-title">
              <a href="{{path('classification')}}" class="card-link">{{"semantic_classes"|trans}}</a>
            </h5>
            <p class="card-text">{{"index_classes"|trans}}</p>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="col mb-4">
    <div class="card mt-3 h-100" >
      <div class="row no-gutters">
        <div class="col-4 text-center">
          <img style="margin:10% 0 10% 0;width:80%;" src="{{asset('img/text.svg')}}"/>
        </div>
        <div class="col-8">
          <div class="card-body">
            <h5 class="card-title">
              <a href="{{path('article_all')}}" class="card-link">{{"annotated_texts"|trans}}</a>
            </h5>
            <p class="card-text">{{"index_texts"|trans}}</p>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="col mb-4">
    <div class="card mt-3 h-100" >
      <div class="row no-gutters">
        <div class="col-4 text-center">
          <img style="margin:10% 0 10% 0;width:80%;" src="{{asset('img/about.svg')}}"/>
        </div>
        <div class="col-8">
          <div class="card-body">
            <h5 class="card-title">
              <a href="{{path('about')}}" class="card-link">{{"about"|trans}}</a>
            </h5>
            <p class="card-text">{{"index_about"|trans}}</p>
           
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="row row-cols-3 mt-4">

  <div class="col m-auto">
    <div class="card m-auto h-100" >
      <div class="row no-gutters">
        <div class="col-4 text-center">
          <img style="margin:10% 0 10% 0;width:80%;" src="{{asset('img/chalkboard.svg')}}"/>
        </div>
        <div class="col-8">
          <div class="card-body">
             <h5 class="card-title">
               <p>  <i class="fas fa-chalkboard-teacher"></i>    <a href="https://lst-decouverte.demarre-shs.fr/" class="card-link">{{"lstDecouverte"|trans}}</a>
            </p>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="search-modal" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog modal-xl" role="document">
    <div class="modal-content">
      <div class="modal-body">
        <h1 class="display-4">{{"rechercherMotsExpressions"|trans}}</h1>
        <div class="input-group" >
          <div class="input-group-prepend">
            <span class="input-group-text" id="basic-addon1">
              <i class="fas fa-search"></i>
            </span>
          </div>
          <input placeholder="Rechercher dans les mots et expressions" class="form-control" type="text" id="search_everywhere" value=""/>
        </div>
        <ul id="search_results" class="list-group list-group-flush"></ul>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">{{"close"|trans}}</button>
      </div>
    </div>
  </div>
</div>

{%  endblock %}