{% set theme_config = attribute(config.themes, config.system.pages.theme) %}
<!DOCTYPE html>
<html lang="{{ grav.language.getActive ?: theme_config.default_lang }}">
<head>
{% block head %}
    <meta charset="utf-8" />
    <title>{% if header.title %}{{ header.title|e('html') }} ~ {% endif %}{{ site.title|e('html') }}</title>

    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    {% include 'partials/metadata.html.twig' %}

    <link rel="icon" href="{{ url('theme://images/favicon.ico') }}" />
    <link rel="canonical" href="{{ page.url(true, true) }}" />

    {% block stylesheets %}
        {% do assets.addCss('theme://css/app.css?q=1027') %}
    {% endblock %}
    <link rel="stylesheet" type="text/css" href="{{url('theme://css/slick.css')}}"/>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css" integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="anonymous">
    {{ assets.css() }}
    <script
			  src="{{url('theme://js/jq.js')}}"
		></script>



    {% block javascripts %}
        {% do assets.addJs('theme://js/app.js?q=099', 100) %}
        {% do assets.addJs('theme://js/lightbox.js', 99) %}
        {% do assets.addJs('theme://js/datavis.js?q=80', 99) %}
    {% endblock %}
    {{ assets.js() }}
    <script type="text/javascript" src="https://d3js.org/d3.v4.min.js"></script>
    
{% endblock head %}

</head>
<body id="top" class="{{ page.header.body_classes }}">
{%  set lang = grav.language.getActive %}
<div class="search_overlay row hide_s">
 {#  <div class="columns small-10 small-offset-1 searchbar">
  </div>
  <div class="columns small-10 small-offset-1 results">
  </div> #}
  {% embed 'partials/tntsearch.html.twig' with { limit: 20, snippet: 150, min: 1, search_type: 'auto', dropdown: true } %}{% endembed %}
  <div class="columns small-1"><a class="close_search"><i class="fa fa-times" aria-hidden="true"></i></a></div>
</div>
<div class="row">
  {% if page.slug != "home" %}
    <div class="container large-10 large-offset-1 medium-10 medium-offset-1 small-12 small-offset-0">
  {% else %}
    <div class="container large-12 large-offset-0 medium-12 medium-offset-0 small-12 small-offset-0">
  {% endif %}
    {% block body %}
        <div class="navigation row">
          {% include 'partials/navigation.html.twig' %}
        </div>
        <div class="row">
        {% block content %}{% endblock %}
        </div>
    {% endblock %}

    {% block footer %}
    {% if page.slug != "home" %}
    <div class="row">
      <div class="footer columns large-12">
        {% include 'partials/footer_coa.html.twig' %}
      </div>
    </div>
    {% endif %}
    <div class="row">
      <div class="footer columns large-10 large-offset-1">
        {% include 'partials/footer.html.twig' %}
      </div>

    </div>

    {% endblock %}


    {% block bottom %}
        {{ assets.js('bottom') }}

    {% endblock %}

  </div>
  {% block last %}
  <div class="columns small-12">
    <div class="row mention">
      <div class="columns small-10 small-offset-1">
        <div class="row">
          <div class="columns large-4 medium-4 small-12">
            <p>{{ pages.find("/home").header.info_tel }}<br/>
            {{ page.find("/home").header.info_addr }}<br/>
            {{ page.find("/home").header.info_addr_post }}</p>
          </div>
          <div class="columns large-4 medium-4 small-12">
            <p>
              {% if lang == "fr" %}
                <a href="{{ page.find('/le-mouvement').url}}">Le Mouvement</a><br>
                <a href="{{ page.find('/nos-campagnes').url}}">Nos campagnes</a><br>
                <a href="{{ page.find('/actualites').url}}">Actualités</a><br>
                <a href="{{ page.find('/home/mentions-legales-et-credits').url}}">Mentions légales et crédits</a>
              {% else %}
                <a href="{{ page.find('/le-mouvement').url}}">The movement</a><br>
                <a href="{{ page.find('/nos-campagnes').url}}">Our campaigns</a><br>
                <a href="{{ page.find('/actualites').url}}">News</a><br>
                <a href="{{ page.find('/home/mentions-legales-et-credits').url}}">Credits</a>
              {% endif %}
            </p>

          </div>
          <div class="columns large-4 medium-4 small-12 links">
            <div class="row">
              <div class="columns large-2 align-self-bottom">
                <a href="mailto:{{site.author.email}}">
                  <img src="{{ url('theme://images/contact_w.svg') }}" alt="">
                </a>
              </div>
              <div class="columns large-2 align-self-bottom">
                <a href="https://www.facebook.com/CampagneTournonslapage">
                  <img src="{{ url('theme://images/f_w.svg') }}" alt="">
                </a>
              </div>
              <div class="columns large-2 align-self-bottom">
                <a href="https://twitter.com/TournonsLaPage/">
                  <img src="{{ url('theme://images/t_w.svg') }}" alt="">
                </a>
              </div>
              <div class="columns large-2 align-self-bottom">
                <a href="https://www.linkedin.com/company/tournons-la-page">
                  <img src="{{ url('theme://images/in_w.svg') }}" alt="">
                </a>
              </div>
              <div class="columns large-2 align-self-bottom">
                <a href="https://www.youtube.com/channel/UCj5XBLG7pHdvuZaUEmV1HbQ">
                  <img src="{{ url('theme://images/you_w.svg') }}" alt="">
                </a>
              </div>
              <div class="row" style="margin-top:2rem">
                {% for item in page.find("/home").header.logo %}
                  <div class="column small-2">
                    <img src="{{page.find("/home").url}}/{{ item.name }}" alt="">
                  </div>
                {% endfor %}
              </div>
              
            </div>
          </div>
        </div>
      </div>

    </div>
  </div>

  {% endblock %}
</div>

<script>

$(".close_search").on("click", function(){
    $(".search_overlay").addClass("hide_s");
    $("body").removeClass("no-scroll");
});

$(".searchBar").on("click", function(){
    $(".search_overlay").removeClass("hide_s");
    $("body").addClass("no-scroll");
});

//add  + 
$(".menu .item a").each(function(){
   if( $(this).parent().find(".subitem").length > 0) {
      console.log($(this).find(".subitem"));
      let elem = " <a style='display:contents;font-weight:600;flex-flow:unset;' class='open_sesame'>&nbsp;+</a>";

      $(this).append(elem);
    }
});

/*$(".menu .item a").on("click",function(event){

 if( $(this).parent().find(".subitem").length > 0 ) {
      event.preventDefault();
      $(this).parent().find(".subitem").fadeToggle();
  }
});*/
$(".menu .item a").on("click",".open_sesame",function(event){
  console.log("open");
  event.preventDefault();
  $(this).parents().eq(1).find(".subitem").fadeToggle();
  $(this).toggleClass("rotate");
});
</script>


</body>
</html>
