<!DOCTYPE html>
<html lang="fr">
<!--  
====================================================
Homepage: {{ site.url }}
Credits: {{ site.url }}/disclosure
====================================================
-->
{% include head.html %}

<body  class="theme-base-0b">

{% include sidebar.html %}

    <!-- Wrap is the content to shift when toggling the sidebar. We wrap the
         content to avoid any CSS collisions with our real content. -->
    <div class="wrap">
      <div class="masthead">
        <div class="container">
          <h3 class="masthead-title">
            <a href="{{ site.baseurl }}/" title="Home">{{ site.title }}</a>
            <!-- <small>{{ site.tagline }}</small> -->
            <div class="headicons">
              {% if page.linktitle %}
              <small><a href="{{ site.url }}{{ page.linkurl }}" rel="me">{{ page.linktitle }}</a></small>
              {% else %}
              <small><a href="{{ site.url }}/cercles" rel="me" title="Textes">Cercles de reflexion <i class="iconm iconm-quill"></i></a></small>
              {% endif %}
            </div>           
          </h3>
        </div>
      </div>

      <div class="sidelogo">
      {% if page.illus %}
      <img src="{{ site.urlimg }}/{{ page.illus }}" />
      {% else %}
      <img src="{{ site.urlimg }}/crapaud_fou_sourire.jpg" />
      {% endif %}
      </div>
      <div class="container content">
        {{ content }}
        {% include footer.html %}
      </div>
    </div>

    <label for="sidebar-checkbox" class="sidebar-toggle"></label>

    <script>
      (function(document) {
        var toggle = document.querySelector('.sidebar-toggle');
        var sidebar = document.querySelector('#sidebar');
        var checkbox = document.querySelector('#sidebar-checkbox');

        document.addEventListener('click', function(e) {
          var target = e.target;

          if(!checkbox.checked ||
             sidebar.contains(target) ||
             (target === checkbox || target === toggle)) return;

          checkbox.checked = false;
        }, false);
      })(document);
    </script>
    {% include scripts.html %}
</body>
</html>
