{% extends 'base.html' %}
{% load i18n static %}

{% block header %}
    {% include 'frags/nav.html' %}
{% endblock %}

{% block content %}


<section class="wrapper wrapper--full wrapper--centered section banner">
  <figure class="banner__video">
    <video muted autoplay playsinline loop width="100%">
      <source src="{% static 'video/argel-video.webm' %}" type="video/webm">
      <source src="{% static 'video/argel-video.mp4' %}" type="video/mp4">
    </video>
  </figure>
  

  <div class="banner__block">
    <div class="banner__content">
      <h1 class="title">Association Royale des Géomètres-Experts de Liège</h1>
      <p>Si le géomètre-expert est le professionnel de référence dans l’établissement de limites entre parcelles cadastrales contigües, il joue également un rôle essentiel dans les phases d’études, de conception et d’exécution de divers projets de construction et de rénovation grâce à différents instruments ultra-technologiques.</p>

      <p>Dans cette vidéo, vous retrouverez quelques unes des facettes du métier passionnant de géomètre-expert.</p>

      <a class="btn btn--white" title="Découvrez-en plus sur ArgeLg" href="{% url 'about' %}">Qui sommes-nous&nbsp;?</a>
    </div>
    
  </div>

</section>

<section class="wrapper wrapper--centered">
  <ul class="boxes column column--spaced">
    <li class="boxes__el">

      <figure class="container--img boxes__img">
        <img src="{% static 'img/geoexpo.png' %}" alt="Logo de Géo-Expo">
      </figure>
      

      <div class="boxes__el--content">
        <p>Organisé par l’ARGELg depuis 2004, GeoExpo est le salon bisannuel incontournable des Géomètres-Experts en Belgique !</p>

        <a class="btn" title="Découvrez-en plus sur Géo-Expo" target="_blank" href="https://www.geoexpo.be">Consulter le site</a>
      </div>
    </li>

    <li class="boxes__el">
      <figure class="container--img boxes__img">
        <img src="{% static 'img/geoexpert.png' %}" alt="Logo de Géomètre-Expert">
      </figure>

      <div class="boxes__el--content">
        <p>L’UBGE asbl est l’association nationale défendant les intérêts de nombreux Géomètres-Experts dont les membres de l’ARGELg.</p>

        <a class="btn" title="Découvrez-en plus sur Géomètre-Expert" target="_blank" href="https://www.obge-bole.be">Consulter le site</a>
      </div>
    </li>

    <li class="boxes__el">
      <figure class="container--img boxes__img">
        <img src="{% static 'img/geoformation.png' %}" alt="Logo de Géo-Formation">
      </figure>
      

      <div class="boxes__el--content">
        <p>Créée par la tripartite ULiège, HEPL et ARGELg, la plateforme GeoFormation propose des formations de qualité reconnues par le Conseil Fédéral des Géomètres-Experts.</p>

        <a class="btn" title="Découvrez-en plus sur GeoFormation" target="_blank" href="https://geoformation.org">Consulter le site</a>
      </div>
    </li>
  </ul>
</section>

{% if news %}
<section class="bg-color">

  <div class="wrapper wrapper--full wrapper--centered">
    <h2 class="title">Le Géomètre-Expert</h2>

    <ul class="column column--spaced section">

      {% for article in news %}
      <li class="event">
        <a title="Consulter l'article {{ article.title }}" href="{% url 'single-new' slug=article.slug %}">
          <figure class="container--img event__img">
            <img src="{{ article.get_image_url }}" alt="Photo de l'article {{ article.title }}">
          </figure>

          <span class="event__date">{{ article.created|date:"d F Y" }}</span>
          <h3 class="subtitle text--color">{{ article.title }}</h3>

          <p>{{ article.summary|truncatechars:125 }}</p>
        </a>
        {% if article.summary|length > 250 %}
        <a class="link" href="{% url 'single-new' slug=article.slug %}">Lire plus +</a>
        {% endif %}
      </li>
      {% endfor %}

    </ul>

    <div class="align--center" >
      <a class="btn" title="Ouvrir l'agenda des activités" href="{% url 'news' %}">Voir tous les articles</a>
    </div>
    
      </div>
  </div>

</section>
{% endif %}


{% if seo %}
<section class="wrapper wrapper--centered section column column--spaced column--bottom">
  <figure class="container--img seo__img column--two">
    <img src="{{ seo.image.url }}" alt="Photo SEO">
  </figure>

  <div class="column--two">
    <h2 class="title">{{ seo.title }}</h2>

    <p class=".text--light-grey">{{ seo.content }}</p>
  </div>

</section>
{% endif %}

{% endblock %}

{% block footer %}
    {% include 'frags/footer.html' %}
{% endblock %}